entangle-ui 0.3.0 → 0.5.0

package/dist/esm/components/editor/PropertyInspector/PropertyRow.js

@@ -1,136 +1,33 @@
+"use client";
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useCallback } from 'react';
-import styled from '@emotion/styled';
+import { assignInlineVars } from '../../../node_modules/@vanilla-extract/dynamic/dist/vanilla-extract-dynamic.esm.js';
+import { cx } from '../../../utils/cx.js';
 import { Tooltip } from '../../primitives/Tooltip/Tooltip.js';
-import { processCss } from '../../../utils/styledUtils.js';
 import { usePropertyPanelContext } from './PropertyPanel.js';
+import { modifiedDot, controlRatioVar, splitRatioVar, fullWidthLabel, fullWidthControl, rowLabel, rowControl, resetButton, RESET_BUTTON_CLASS, rowRoot } from './PropertyRow.css.js';
 
 const ROW_SIZE_MAP = {
     sm: {
         minHeight: 22,
-        paddingVKey: 'xs',
-        paddingHKey: 'sm',
-        fontKey: 'md',
+        fontSize: 'var(--etui-font-size-md)',
         resetIconSize: 10,
     },
     md: {
         minHeight: 26,
-        paddingVKey: 'xs',
-        paddingHKey: 'md',
-        fontKey: 'md',
+        fontSize: 'var(--etui-font-size-md)',
         resetIconSize: 12,
     },
     lg: {
         minHeight: 30,
-        paddingVKey: 'sm',
-        paddingHKey: 'lg',
-        fontKey: 'lg',
+        fontSize: 'var(--etui-font-size-lg)',
         resetIconSize: 14,
     },
 };
 // --- Reset icon ---
 const ResetIcon = ({ size }) => (jsxs("svg", { width: size, height: size, viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: [jsx("path", { d: "M2 4.5h6.5a2 2 0 0 1 0 4H6", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), jsx("path", { d: "M4 2.5L2 4.5L4 6.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }));
-// --- Styled ---
-const RESET_BUTTON_CLASS = 'property-row-reset';
-const StyledRowRoot = styled.div `
-  display: ${props => props.$visible ? (props.$fullWidth ? 'flex' : 'flex') : 'none'};
-  flex-direction: ${props => (props.$fullWidth ? 'column' : 'row')};
-  align-items: ${props => (props.$fullWidth ? 'stretch' : 'center')};
-  position: relative;
-  min-height: ${props => ROW_SIZE_MAP[props.$size].minHeight}px;
-  padding: 2px 8px;
-  opacity: ${props => (props.$disabled ? 0.5 : 1)};
-  pointer-events: ${props => (props.$disabled ? 'none' : 'auto')};
-  transition: background ${props => props.theme.transitions.fast};
-
-  &:hover {
-    background: ${props => props.theme.colors.surface.hover};
-  }
-
-  &:hover .${RESET_BUTTON_CLASS} {
-    opacity: 1;
-  }
-
-  ${props => processCss(props.$css, props.theme)}
-`;
-const StyledRowLabel = styled.div `
-  flex: 0 0 ${props => props.$splitRatio}%;
-  box-sizing: border-box;
-  min-width: 0;
-  display: flex;
-  align-items: center;
-  font-size: ${props => props.theme.typography.fontSize[ROW_SIZE_MAP[props.$size].fontKey]}px;
-  color: ${props => props.theme.colors.text.secondary};
-  font-weight: ${props => props.$modified
-    ? props.theme.typography.fontWeight.medium
-    : props.theme.typography.fontWeight.normal};
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  user-select: none;
-  padding-right: ${props => props.theme.spacing.md}px;
-`;
-const StyledFullWidthLabel = styled.div `
-  display: flex;
-  align-items: center;
-  font-size: ${props => props.theme.typography.fontSize[ROW_SIZE_MAP[props.$size].fontKey]}px;
-  color: ${props => props.theme.colors.text.secondary};
-  font-weight: ${props => props.$modified
-    ? props.theme.typography.fontWeight.medium
-    : props.theme.typography.fontWeight.normal};
-  margin-bottom: ${props => props.theme.spacing.xs}px;
-  user-select: none;
-`;
-const StyledModifiedDot = styled.span `
-  width: 4px;
-  height: 4px;
-  border-radius: 50%;
-  background: ${props => props.theme.colors.accent.primary};
-  margin-right: ${props => props.theme.spacing.xs}px;
-  flex-shrink: 0;
-`;
-const StyledRowControl = styled.div `
-  flex: 0 0 ${props => props.$splitRatio}%;
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  min-width: 0;
-  padding-right: ${props => props.theme.spacing.xs}px;
-`;
-const StyledFullWidthControl = styled.div `
-  display: flex;
-  align-items: stretch;
-  width: 100%;
-  flex: 1 1 auto;
-  min-width: 0;
-  padding-right: ${props => props.theme.spacing.xs}px;
-`;
-const StyledResetButton = styled.span `
-  position: absolute;
-  right: ${props => props.theme.spacing.xs}px;
-  top: 50%;
-  transform: translateY(-50%);
-  opacity: 0;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 16px;
-  height: 16px;
-  border-radius: ${props => props.theme.borderRadius.sm}px;
-  color: ${props => props.theme.colors.text.muted};
-  transition:
-    opacity ${props => props.theme.transitions.fast},
-    color ${props => props.theme.transitions.fast},
-    background ${props => props.theme.transitions.fast};
-
-  &:hover {
-    color: ${props => props.theme.colors.text.primary};
-    background: ${props => props.theme.colors.surface.active};
-  }
-`;
 // --- Component ---
-const PropertyRow = ({ label, tooltip, children, fullWidth = false, splitRatio = [40, 60], modified = false, disabled = false, visible = true, size: sizeProp, action, onLabelContextMenu, onReset, css, className, style, testId, ref, ...rest }) => {
+const PropertyRow = ({ label, tooltip, children, fullWidth = false, splitRatio = [40, 60], modified = false, disabled = false, visible = true, size: sizeProp, action, onLabelContextMenu, onReset, className, style, testId, ref, ...rest }) => {
     const panelCtx = usePropertyPanelContext();
     const size = sizeProp ?? panelCtx?.size ?? 'md';
     const sizeConfig = ROW_SIZE_MAP[size];
@@ -138,10 +35,33 @@ const PropertyRow = ({ label, tooltip, children, fullWidth = false, splitRatio =
         e.stopPropagation();
         onReset?.();
     }, [onReset]);
-    const modifiedDot = modified ? (jsx(StyledModifiedDot, { "aria-label": "Modified", "data-testid": "modified-dot" })) : null;
+    const modifiedDotEl = modified ? (jsx("span", { className: modifiedDot, "aria-label": "Modified", "data-testid": "modified-dot" })) : null;
     const labelText = jsx("span", { children: label });
-    const labelElement = tooltip ? (jsx(Tooltip, { title: tooltip, children: jsxs("span", { style: { display: 'contents' }, children: [modifiedDot, labelText] }) })) : (jsxs(Fragment, { children: [modifiedDot, labelText] }));
-    return (jsxs(StyledRowRoot, { ref: ref, "$disabled": disabled, "$visible": visible, "$fullWidth": fullWidth, "$size": size, "$css": css, className: className, style: style, "data-testid": testId, ...rest, children: [fullWidth ? (jsxs(Fragment, { children: [jsx(StyledFullWidthLabel, { "$modified": modified, "$size": size, onContextMenu: onLabelContextMenu, children: labelElement }), jsx(StyledFullWidthControl, { children: children })] })) : (jsxs(Fragment, { children: [jsx(StyledRowLabel, { "$splitRatio": splitRatio[0], "$modified": modified, "$size": size, onContextMenu: onLabelContextMenu, children: labelElement }), jsx(StyledRowControl, { "$splitRatio": splitRatio[1], children: children })] })), action, onReset && (jsx(StyledResetButton, { className: RESET_BUTTON_CLASS, role: "button", tabIndex: 0, "aria-label": "Reset to default", onClick: handleResetClick, onKeyDown: (e) => {
+    const labelElement = tooltip ? (jsx(Tooltip, { title: tooltip, children: jsxs("span", { style: { display: 'contents' }, children: [modifiedDotEl, labelText] }) })) : (jsxs(Fragment, { children: [modifiedDotEl, labelText] }));
+    const inlineVars = assignInlineVars({
+        [splitRatioVar]: `${splitRatio[0]}%`,
+        [controlRatioVar]: `${splitRatio[1]}%`,
+    });
+    return (jsxs("div", { ref: ref, className: cx(rowRoot, className), style: {
+            ...style,
+            ...inlineVars,
+            display: visible ? 'flex' : 'none',
+            flexDirection: fullWidth ? 'column' : 'row',
+            alignItems: fullWidth ? 'stretch' : 'center',
+            minHeight: `${sizeConfig.minHeight}px`,
+            opacity: disabled ? 0.5 : 1,
+            pointerEvents: disabled ? 'none' : 'auto',
+        }, "data-testid": testId, ...rest, children: [fullWidth ? (jsxs(Fragment, { children: [jsx("div", { className: fullWidthLabel, onContextMenu: onLabelContextMenu, style: {
+                            fontSize: sizeConfig.fontSize,
+                            fontWeight: modified
+                                ? 'var(--etui-font-weight-medium)'
+                                : 'var(--etui-font-weight-normal)',
+                        }, children: labelElement }), jsx("div", { className: fullWidthControl, children: children })] })) : (jsxs(Fragment, { children: [jsx("div", { className: rowLabel, onContextMenu: onLabelContextMenu, style: {
+                            fontSize: sizeConfig.fontSize,
+                            fontWeight: modified
+                                ? 'var(--etui-font-weight-medium)'
+                                : 'var(--etui-font-weight-normal)',
+                        }, children: labelElement }), jsx("div", { className: rowControl, children: children })] })), action, onReset && (jsx("span", { className: cx(RESET_BUTTON_CLASS, resetButton), role: "button", tabIndex: 0, "aria-label": "Reset to default", onClick: handleResetClick, onKeyDown: (e) => {
                     if (e.key === 'Enter' || e.key === ' ') {
                         e.preventDefault();
                         onReset();

package/dist/esm/components/editor/PropertyInspector/PropertyRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"PropertyRow.js","sources":["../../../../../../src/components/editor/PropertyInspector/PropertyRow.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx","_Fragment"],"mappings":"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"}
+{"version":3,"file":"PropertyRow.js","sources":["../../../../../../src/components/editor/PropertyInspector/PropertyRow.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;AAgCA;AACE;AACE;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACD;;AAGH;AAEA;AAyBA;AAEO;AAoBL;;AAEA;AAEA;;;AAIE;;AAYF;AAEA;;;;AAiBC;AAED;AAKM;AACA;;;;AAIA;;;;;AAcM;AACE;AACA;;;AAcF;AACE;AACA;;AAmBJ;;AAEE;;AAEJ;AAQV;AAEA;;"}

package/dist/esm/components/editor/PropertyInspector/PropertySection.css.js

@@ -0,0 +1,15 @@
+import './../../../assets/src/components/editor/PropertyInspector/PropertySection.css.ts.vanilla-DJBtY_xk.css';
+import { c as createRuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js';
+
+var actionsArea = 'PropertySection_actionsArea__1xiu0w6d';
+var chevron = 'PropertySection_chevron__1xiu0w69';
+var chevronExpanded = 'PropertySection_chevronExpanded__1xiu0w6a';
+var contentInner = 'PropertySection_contentInner__1xiu0w6h';
+var contentWrapper = createRuntimeFn({defaultClassName:'PropertySection_contentWrapper__1xiu0w6e',variantClassNames:{expanded:{true:'PropertySection_contentWrapper_expanded_true__1xiu0w6f',false:'PropertySection_contentWrapper_expanded_false__1xiu0w6g'}},defaultVariants:{expanded:false},compoundVariants:[]});
+var iconArea = 'PropertySection_iconArea__1xiu0w6b';
+var sectionLabel = 'PropertySection_sectionLabel__1xiu0w6c';
+var sectionRoot = 'PropertySection_sectionRoot__1xiu0w60';
+var sectionTrigger = createRuntimeFn({defaultClassName:'PropertySection_sectionTrigger__1xiu0w61',variantClassNames:{size:{sm:'PropertySection_sectionTrigger_size_sm__1xiu0w62',md:'PropertySection_sectionTrigger_size_md__1xiu0w63',lg:'PropertySection_sectionTrigger_size_lg__1xiu0w64'},disabled:{true:'PropertySection_sectionTrigger_disabled_true__1xiu0w65',false:'PropertySection_sectionTrigger_disabled_false__1xiu0w66'},expanded:{true:'PropertySection_sectionTrigger_expanded_true__1xiu0w67',false:'PropertySection_sectionTrigger_expanded_false__1xiu0w68'}},defaultVariants:{size:'md',disabled:false,expanded:false},compoundVariants:[]});
+
+export { actionsArea, chevron, chevronExpanded, contentInner, contentWrapper, iconArea, sectionLabel, sectionRoot, sectionTrigger };
+//# sourceMappingURL=PropertySection.css.js.map

package/dist/esm/components/editor/PropertyInspector/PropertySection.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PropertySection.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;"}

package/dist/esm/components/editor/PropertyInspector/PropertySection.js

@@ -1,111 +1,19 @@
+"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useId, useState, useCallback } from 'react';
-import styled from '@emotion/styled';
+import { cx } from '../../../utils/cx.js';
 import { usePropertyPanelContext } from './PropertyPanel.js';
+import { chevronExpanded, chevron, iconArea, sectionLabel, actionsArea, sectionTrigger, contentInner, contentWrapper, sectionRoot } from './PropertySection.css.js';
 
 const TRIGGER_SIZE_MAP = {
-    sm: { height: 24, paddingKey: 'sm', fontKey: 'md', chevronSize: 10 },
-    md: { height: 28, paddingKey: 'md', fontKey: 'md', chevronSize: 12 },
-    lg: { height: 32, paddingKey: 'lg', fontKey: 'lg', chevronSize: 14 },
+    sm: { chevronSize: 10 },
+    md: { chevronSize: 12 },
+    lg: { chevronSize: 14 },
 };
 // --- Chevron icon ---
 const ChevronRightIcon = ({ size }) => (jsx("svg", { width: size, height: size, viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: jsx("path", { d: "M4.5 3L7.5 6L4.5 9", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }));
-// --- Styled ---
-const StyledSectionRoot = styled.div `
-  display: flex;
-  flex-direction: column;
-  background: ${props => props.theme.colors.background.secondary};
-  border: 1px solid ${props => props.theme.colors.border.default};
-  border-radius: ${props => props.theme.borderRadius.md}px;
-  overflow: hidden;
-
-  & + & {
-    margin-top: ${props => props.theme.spacing.sm}px;
-  }
-`;
-const StyledSectionTrigger = styled.button `
-  /* Reset */
-  margin: 0;
-  border: none;
-  font-family: inherit;
-  outline: none;
-  user-select: none;
-  width: 100%;
-  text-align: left;
-
-  /* Layout */
-  display: flex;
-  align-items: center;
-  gap: ${props => props.theme.spacing.sm}px;
-
-  /* Sizing */
-  height: ${props => TRIGGER_SIZE_MAP[props.$size].height}px;
-  padding: 0
-    ${props => props.theme.spacing[TRIGGER_SIZE_MAP[props.$size].paddingKey]}px;
-  font-size: ${props => props.theme.typography.fontSize[TRIGGER_SIZE_MAP[props.$size].fontKey]}px;
-  font-weight: ${props => props.theme.typography.fontWeight.medium};
-
-  /* Colors */
-  background: ${props => props.theme.colors.surface.default};
-  color: ${props => props.theme.colors.text.primary};
-  border-bottom: ${props => props.$expanded
-    ? `1px solid ${props.theme.colors.border.default}`
-    : 'none'};
-  cursor: ${props => (props.$disabled ? 'not-allowed' : 'pointer')};
-  opacity: ${props => (props.$disabled ? 0.5 : 1)};
-  transition: background ${props => props.theme.transitions.fast};
-
-  &:hover:not(:disabled) {
-    background: ${props => props.theme.colors.surface.hover};
-  }
-
-  &:focus-visible {
-    box-shadow: ${props => props.theme.shadows.focus};
-    z-index: 1;
-  }
-`;
-const StyledChevron = styled.span `
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-  transition: transform ${props => props.theme.transitions.fast};
-  transform: rotate(${props => (props.$expanded ? '90deg' : '0deg')});
-  color: ${props => props.theme.colors.text.muted};
-
-  svg {
-    width: ${props => props.$size}px;
-    height: ${props => props.$size}px;
-  }
-`;
-const StyledIconArea = styled.span `
-  display: flex;
-  align-items: center;
-  flex-shrink: 0;
-`;
-const StyledSectionLabel = styled.span `
-  flex: 1;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-`;
-const StyledActionsArea = styled.span `
-  display: flex;
-  align-items: center;
-  margin-left: auto;
-  gap: ${props => props.theme.spacing.xs}px;
-`;
-const StyledContentWrapper = styled.div `
-  display: grid;
-  grid-template-rows: ${props => (props.$expanded ? '1fr' : '0fr')};
-  transition: grid-template-rows ${props => props.theme.transitions.normal};
-`;
-const StyledContentInner = styled.div `
-  overflow: hidden;
-  min-height: 0;
-`;
 // --- Component ---
-const PropertySection = ({ title, icon, actions, expanded: expandedProp, defaultExpanded = true, onExpandedChange, keepMounted = false, disabled = false, size: sizeProp, indicator, onContextMenu, children, className, style, css, testId, ref, ...rest }) => {
+const PropertySection = ({ title, icon, actions, expanded: expandedProp, defaultExpanded = true, onExpandedChange, keepMounted = false, disabled = false, size: sizeProp, indicator, onContextMenu, children, className, style, testId, ref, ...rest }) => {
     const autoId = useId();
     const triggerId = `property-section-${autoId}-trigger`;
     const contentId = `property-section-${autoId}-content`;
@@ -128,7 +36,14 @@ const PropertySection = ({ title, icon, actions, expanded: expandedProp, default
         e.stopPropagation();
     }, []);
     const showIndicator = indicator !== null;
-    return (jsxs(StyledSectionRoot, { ref: ref, className: className, style: style, "data-testid": testId, ...rest, children: [jsxs(StyledSectionTrigger, { type: "button", id: triggerId, "aria-expanded": resolvedExpanded, "aria-controls": contentId, "aria-disabled": disabled || undefined, disabled: disabled, onClick: handleToggle, onContextMenu: onContextMenu, "$size": size, "$disabled": disabled, "$expanded": resolvedExpanded, "$css": css, children: [showIndicator && (jsx(StyledChevron, { "$expanded": resolvedExpanded, "$size": sizeConfig.chevronSize, children: indicator ?? jsx(ChevronRightIcon, { size: sizeConfig.chevronSize }) })), icon && jsx(StyledIconArea, { children: icon }), jsx(StyledSectionLabel, { children: title }), actions && (jsx(StyledActionsArea, { onClick: handleActionsClick, children: actions }))] }), (resolvedExpanded || keepMounted) && (jsx(StyledContentWrapper, { "$expanded": resolvedExpanded, role: "region", id: contentId, "aria-labelledby": triggerId, hidden: !resolvedExpanded || undefined, children: jsx(StyledContentInner, { children: children }) }))] }));
+    return (jsxs("div", { ref: ref, className: cx(sectionRoot, className), style: style, "data-testid": testId, ...rest, children: [jsxs("button", { type: "button", id: triggerId, "aria-expanded": resolvedExpanded, "aria-controls": contentId, "aria-disabled": disabled || undefined, disabled: disabled, onClick: handleToggle, onContextMenu: onContextMenu, className: sectionTrigger({
+                    size,
+                    disabled,
+                    expanded: resolvedExpanded,
+                }), children: [showIndicator && (jsx("span", { className: cx(chevron, resolvedExpanded && chevronExpanded), style: {
+                            width: `${sizeConfig.chevronSize}px`,
+                            height: `${sizeConfig.chevronSize}px`,
+                        }, children: indicator ?? jsx(ChevronRightIcon, { size: sizeConfig.chevronSize }) })), icon && jsx("span", { className: iconArea, children: icon }), jsx("span", { className: sectionLabel, children: title }), actions && (jsx("span", { className: actionsArea, onClick: handleActionsClick, children: actions }))] }), (resolvedExpanded || keepMounted) && (jsx("div", { className: contentWrapper({ expanded: resolvedExpanded }), role: "region", id: contentId, "aria-labelledby": triggerId, hidden: !resolvedExpanded || undefined, children: jsx("div", { className: contentInner, children: children }) }))] }));
 };
 PropertySection.displayName = 'PropertySection';
 

package/dist/esm/components/editor/PropertyInspector/PropertySection.js.map

@@ -1 +1 @@
-{"version":3,"file":"PropertySection.js","sources":["../../../../../../src/components/editor/PropertyInspector/PropertySection.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"PropertySection.js","sources":["../../../../../../src/components/editor/PropertyInspector/PropertySection.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;AA2BA;AACE;AACA;AACA;;AAGF;AAEA;AAkBA;AAEO;AAoBL;AACA;AACA;AAEA;;AAEA;;AAGA;;AAGA;AACE;;AAEA;;;;AAMA;;AAGF;;;AAIA;;;;AAsBQ;AACD;AAMK;AACA;;AA4Bd;AAEA;;"}

package/dist/esm/components/editor/PropertyInspector/usePropertyUndo.js

@@ -1,3 +1,4 @@
+"use client";
 import { useReducer, useCallback } from 'react';
 
 function undoReducer(state, action) {

package/dist/esm/components/editor/PropertyInspector/usePropertyUndo.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePropertyUndo.js","sources":["../../../../../../src/components/editor/PropertyInspector/usePropertyUndo.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}
+{"version":3,"file":"usePropertyUndo.js","sources":["../../../../../../src/components/editor/PropertyInspector/usePropertyUndo.ts"],"sourcesContent":[null],"names":[],"mappings":";;;AAsBA;AAIE;;AAEI;;;;;AAKE;AACA;;;;AAIF;AAAkC;AAClC;;;;;;;AASA;AAAkC;AAClC;;;;;;AAQF;;AAEA;AACE;;AAEN;AAEA;AAEA;;;AAGG;AACG;AAGJ;;AAGE;AACA;AACD;AAED;AAEI;AACE;;;AAGD;AACH;AAIF;AACE;AAAkC;AAClC;AAGA;AACA;AACF;AAEA;AACE;AAAkC;AAClC;AAGA;AACA;AACF;AAEA;AACE;;;;;;AAOA;AACA;;;;AAIJ;;"}

package/dist/esm/components/editor/ViewportGizmo/ViewportGizmo.css.js

@@ -0,0 +1,10 @@
+import './../../../assets/src/components/editor/ViewportGizmo/ViewportGizmo.css.ts.vanilla-CEs2H-Iv.css';
+import { c as createRuntimeFn } from '../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js';
+
+var ariaLiveRegionStyle = 'ViewportGizmo_ariaLiveRegionStyle__awfy0ia';
+var gizmoCanvasStyle = createRuntimeFn({defaultClassName:'ViewportGizmo_gizmoCanvasStyle__awfy0i7',variantClassNames:{disabled:{true:'ViewportGizmo_gizmoCanvasStyle_disabled_true__awfy0i8',false:'ViewportGizmo_gizmoCanvasStyle_disabled_false__awfy0i9'}},defaultVariants:{disabled:false},compoundVariants:[]});
+var gizmoDiameterVar = 'var(--gizmoDiameterVar__awfy0i0)';
+var gizmoWrapperRecipe = createRuntimeFn({defaultClassName:'ViewportGizmo_gizmoWrapperRecipe__awfy0i1',variantClassNames:{background:{transparent:'ViewportGizmo_gizmoWrapperRecipe_background_transparent__awfy0i2',subtle:'ViewportGizmo_gizmoWrapperRecipe_background_subtle__awfy0i3',solid:'ViewportGizmo_gizmoWrapperRecipe_background_solid__awfy0i4'},disabled:{true:'ViewportGizmo_gizmoWrapperRecipe_disabled_true__awfy0i5',false:'ViewportGizmo_gizmoWrapperRecipe_disabled_false__awfy0i6'}},defaultVariants:{background:'subtle',disabled:false},compoundVariants:[]});
+
+export { ariaLiveRegionStyle, gizmoCanvasStyle, gizmoDiameterVar, gizmoWrapperRecipe };
+//# sourceMappingURL=ViewportGizmo.css.js.map

package/dist/esm/components/editor/ViewportGizmo/ViewportGizmo.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewportGizmo.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}

package/dist/esm/components/editor/ViewportGizmo/ViewportGizmo.js

@@ -0,0 +1,90 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useRef, useMemo } from 'react';
+import { assignInlineVars } from '../../../node_modules/@vanilla-extract/dynamic/dist/vanilla-extract-dynamic.esm.js';
+import { cx } from '../../../utils/cx.js';
+import { AXIS_COLORS, useGizmoRenderer } from './useGizmoRenderer.js';
+import { useGizmoInteraction } from './useGizmoInteraction.js';
+import { gizmoCanvasStyle, ariaLiveRegionStyle, gizmoDiameterVar, gizmoWrapperRecipe } from './ViewportGizmo.css.js';
+
+const DEFAULT_LABELS = { x: 'X', y: 'Y', z: 'Z' };
+const DEFAULT_VISIBLE = { x: true, y: true, z: true };
+const ViewportGizmo = ({ orientation, upAxis = 'y-up', axisColorPreset = 'blender', axisConfig, showLabels = true, showNegativeAxes = true, showOrbitRing = true, showOriginHandle = true, background = 'subtle', interactionMode = 'full', orbitSpeed = 1, constrainPitch = true, onOrbit, onOrbitEnd, onSnapToView, onAxisClick, onOriginClick, diameter = 120, size = 'md', disabled = false, className, testId, id, style, ...rest }) => {
+    const canvasRef = useRef(null);
+    // Resolve axis colors from preset or custom config
+    const axisColors = useMemo(() => {
+        if (axisColorPreset === 'custom' && axisConfig) {
+            return {
+                x: axisConfig[0].color ?? '#E63946',
+                y: axisConfig[1].color ?? '#6AA84F',
+                z: axisConfig[2].color ?? '#4A86C8',
+            };
+        }
+        return { ...AXIS_COLORS };
+    }, [axisColorPreset, axisConfig]);
+    const axisLabels = useMemo(() => {
+        if (axisConfig) {
+            return {
+                x: axisConfig[0].label ?? 'X',
+                y: axisConfig[1].label ?? 'Y',
+                z: axisConfig[2].label ?? 'Z',
+            };
+        }
+        return DEFAULT_LABELS;
+    }, [axisConfig]);
+    const axisVisible = useMemo(() => {
+        if (axisConfig) {
+            return {
+                x: axisConfig[0].visible ?? true,
+                y: axisConfig[1].visible ?? true,
+                z: axisConfig[2].visible ?? true,
+            };
+        }
+        return DEFAULT_VISIBLE;
+    }, [axisConfig]);
+    // Interaction
+    const interaction = useGizmoInteraction({
+        orientation,
+        canvasRef,
+        diameter,
+        upAxis,
+        interactionMode,
+        orbitSpeed,
+        constrainPitch,
+        disabled,
+        onOrbit,
+        onOrbitEnd,
+        onSnapToView,
+        onAxisClick,
+        onOriginClick,
+    });
+    // Renderer
+    useGizmoRenderer({
+        canvasRef,
+        orientation,
+        diameter,
+        upAxis,
+        size,
+        axisColors,
+        axisLabels,
+        axisVisible,
+        showLabels,
+        showNegativeAxes,
+        showOrbitRing,
+        showOriginHandle,
+        background,
+        disabled,
+        isDragging: interaction.isDragging,
+        hoveredRegion: interaction.hoveredRegion,
+    });
+    // ARIA
+    const ariaDescription = `3D orientation gizmo, yaw: ${Math.round(orientation.yaw)}deg, pitch: ${Math.round(orientation.pitch)}deg`;
+    return (jsxs("div", { className: cx(gizmoWrapperRecipe({ background, disabled }), className), style: {
+            ...style,
+            ...assignInlineVars({ [gizmoDiameterVar]: `${diameter}px` }),
+        }, "data-testid": testId, id: id, ...rest, children: [jsx("canvas", { ref: canvasRef, className: gizmoCanvasStyle({ disabled }), role: "application", "aria-label": "Viewport orientation gizmo", "aria-roledescription": ariaDescription, tabIndex: disabled ? -1 : 0, onPointerDown: interaction.handlers.onPointerDown, onPointerMove: interaction.handlers.onPointerMove, onPointerUp: interaction.handlers.onPointerUp, onKeyDown: interaction.handlers.onKeyDown }), jsx("div", { className: ariaLiveRegionStyle, "aria-live": "polite", role: "status", children: ariaDescription })] }));
+};
+ViewportGizmo.displayName = 'ViewportGizmo';
+
+export { ViewportGizmo };
+//# sourceMappingURL=ViewportGizmo.js.map

package/dist/esm/components/editor/ViewportGizmo/ViewportGizmo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ViewportGizmo.js","sources":["../../../../../../src/components/editor/ViewportGizmo/ViewportGizmo.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;AAeA;AACA;AAEO;AA2BL;;AAGA;AACE;;;;;;;AAOA;AACF;AAEA;;;;;;;;AAQE;AACF;AAEA;;;;;;;;AAQE;AACF;;;;;;;;;;;;;;;;AAiBC;;AAGD;;;;;;;;;;;;;;;;;AAiBC;;;AAKD;AAIM;;AAED;AAsBP;AAEA;;"}