.. role:: clio-optional
   :class: clio-flag clio-flag-optional

.. role:: clio-static
   :class: clio-flag clio-flag-static


##############################
HoopsCuttingPlaneEditorElement
##############################

.. js:class:: wvc.HoopsCuttingPlaneEditorElement

   A comprehensive editor component for modifying cutting plane properties.
   
   This component provides a full interface for editing all aspects of a cutting plane, including geometric properties (normal vector and distance), visual properties (colors and opacity), and real-time preview updates.
   
   Key features:
   
   
   - Coordinate inputs for plane normal vector (x, y, z) and distance (d)
   - Color pickers for face color and border color
   - Opacity slider for transparency control
   - Real-time updates with debounced service calls
   - Automatic synchronization with cutting plane changes
   - Conditional rendering based on cutting plane existence
   
   
   Index
   =====
   
   .. rubric:: Constructors
   
   
   .. rst-class:: api-xref-list
   
   
   * :js:func:`~wvc.HoopsCuttingPlaneEditorElement.constructor`
   
   .. rubric:: Properties
   
   
   .. rst-class:: api-xref-list
   
   
   * :js:data:`~wvc.HoopsCuttingPlaneEditorElement.styles`
   * :js:data:`~wvc.HoopsCuttingPlaneEditorElement.coordinateInputs`
   * :js:data:`~wvc.HoopsCuttingPlaneEditorElement.planeIndex`
   * :js:data:`~wvc.HoopsCuttingPlaneEditorElement.sectionIndex`
   * :js:data:`~wvc.HoopsCuttingPlaneEditorElement.service`
   
   .. rubric:: Methods
   
   
   .. rst-class:: api-xref-list
   
   
   * :js:meth:`~wvc.HoopsCuttingPlaneEditorElement.render`
   
   



.. rst-class:: kind-group kind-constructors

.. rubric:: Constructors
   :class: kind-group-title


.. js:method:: wvc.HoopsCuttingPlaneEditorElement.constructor

      .. rst-class:: sig-pretty-signature
      
         | HoopsCuttingPlaneEditorElement(): :js:class:`HoopsCuttingPlaneEditorElement <wvc.HoopsCuttingPlaneEditorElement>`
      
      Constructs a new HoopsCuttingPlaneEditorElement.
      
      Initializes the component with default property values and binds the invalidateEditor method for proper event handling context.
      
      **Returns**\ : :js:class:`HoopsCuttingPlaneEditorElement <wvc.HoopsCuttingPlaneEditorElement>`
      



.. rst-class:: kind-group kind-properties

.. rubric:: Properties
   :class: kind-group-title


.. js:data:: wvc.HoopsCuttingPlaneEditorElement.styles

      .. rst-class:: clio-flags
      
         :clio-static:`static`
      
      .. rst-class:: sig-pretty-signature
      
         | styles: *CSSResult*\ []
      
      Array of styles to apply to the element. The styles should be defined using the ? tag function, via constructible stylesheets, or imported from native CSS module scripts.
      
      Note on Content Security Policy:
      
      Element styles are implemented with ``<style>`` tags when the browser doesn't support adopted StyleSheets. To use such ``<style>`` tags with the style-src CSP directive, the style-src value must either include 'unsafe-inline' or ``nonce-<base64-value>`` with ``<base64-value>`` replaced be a server-generated nonce.
      
      To provide a nonce to use on generated ``<style>`` elements, set ``window.litNonce`` to a server-generated nonce in your page's HTML, before loading application code:
      
      .. code-block:: html
      
         <script>
           // Generated and unique per request:
           window.litNonce = 'a1b2c3d4';
         </script>
      



.. js:data:: wvc.HoopsCuttingPlaneEditorElement.coordinateInputs

      .. rst-class:: sig-pretty-signature
      
         | coordinateInputs: *HoopsCoordinateInputElement*\ []
      
      Query selector for all coordinate input elements within the editor. Used for batch operations like requesting updates when the plane changes.
      



.. js:data:: wvc.HoopsCuttingPlaneEditorElement.planeIndex

      .. rst-class:: sig-pretty-signature
      
         | planeIndex: *number*
      
      The index of the cutting plane within the specified cutting section. Used to identify the specific plane to be edited.
      



.. js:data:: wvc.HoopsCuttingPlaneEditorElement.sectionIndex

      .. rst-class:: sig-pretty-signature
      
         | sectionIndex: *number*
      
      The index of the cutting section containing the target cutting plane. Used to identify which section contains the plane to be edited.
      



.. js:data:: wvc.HoopsCuttingPlaneEditorElement.service

      .. rst-class:: clio-flags
      
         :clio-optional:`optional`
      
      .. rst-class:: sig-pretty-signature
      
         | service: :js:class:`ICuttingService <wvc.ICuttingService>`
      
      The cutting service instance that provides cutting plane operations. All editor operations are performed through this service interface. When undefined, the editor renders nothing.
      



.. rst-class:: kind-group kind-methods

.. rubric:: Methods
   :class: kind-group-title


.. js:method:: wvc.HoopsCuttingPlaneEditorElement.render

      .. rst-class:: sig-pretty-signature
      
         | render(): (*TemplateResult* | Unhandled type TypeOf)
      
      Renders the cutting plane editor component.
      
      Creates a comprehensive editing interface with:
      
      
      - Four coordinate inputs for plane normal vector (x, y, z) and distance (d)
      - Color pickers for border color and face color
      - Opacity slider for transparency control
      - Real-time value display for colors
      - Conditional enabling based on reference geometry existence
      
      The editor only renders if both a service and valid cutting plane exist. Normal vector inputs are constrained to [-1, 1] range, while distance is constrained by the model's bounding box size.
      
      **Returns**\ : (*TemplateResult* \| Unhandled type TypeOf)
      
      
         TemplateResult containing the editor interface, or nothing if no service/plane exists
      
      




