@astryxdesign/core 0.1.3 → 0.1.4-canary.01e5b29

package/dist/Typeahead/Typeahead.js

@@ -32,7 +32,7 @@ import { groupStyles } from "../InputGroup/groupStyles.js";
 import { useInputGroup } from "../InputGroup/InputGroupContext.js";
 import { getInputARIA, mergeProps, mergeRefs } from "../utils/index.js";
 import { themeProps } from "../utils/themeProps.js";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV, Fragment as _Fragment } from "react/jsx-dev-runtime";
 // =============================================================================
 // Styles
 // =============================================================================
@@ -267,8 +267,8 @@ export function Typeahead({
     ariaDescribedBy
   } = getInputARIA(inputLabelId, [description ? descriptionId : null, status?.message ? statusMessageId : null, showsDisabledMessage ? disabledMessageTooltip.describedBy : null], inputGroup);
   const sizeStyle = wrapperSizeStyles[size];
-  const typeaheadContent = /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsxs("div", {
+  const typeaheadContent = /*#__PURE__*/_jsxDEV(_Fragment, {
+    children: [/*#__PURE__*/_jsxDEV("div", {
       ref: mergeRefs(wrapperRef, disabledMessageTooltip.ref, inputGroup ? ref : undefined),
       "data-testid": testId,
       onClick: handleWrapperClick,
@@ -280,17 +280,17 @@ export function Typeahead({
       children: [startIcon && renderIconSlot(startIcon, {
         size: 'sm',
         color: 'secondary'
-      }), inputGroup && /*#__PURE__*/_jsx(VisuallyHidden, {
+      }), inputGroup && /*#__PURE__*/_jsxDEV(VisuallyHidden, {
         id: inputLabelId,
         children: label
-      }), showToken && /*#__PURE__*/_jsx(Token, {
+      }, void 0, false), showToken && /*#__PURE__*/_jsxDEV(Token, {
         ref: tokenRef,
         label: value.label,
         size: size,
         onClick: handleEnterEditMode,
         isDisabled: isDisabled,
         xstyle: styles.token
-      }), /*#__PURE__*/_jsx(BaseTypeahead, {
+      }, void 0, false), /*#__PURE__*/_jsxDEV(BaseTypeahead, {
         ref: inputRef,
         searchSource: searchSource,
         value: value,
@@ -313,20 +313,20 @@ export function Typeahead({
         onKeyDown: handleKeyDown,
         inputXStyle: showToken ? styles.inputHidden : undefined,
         size: size
-      }), hasClear && value && !isDisabled && /*#__PURE__*/_jsx(InputClearButton, {
+      }, void 0, false), hasClear && value && !isDisabled && /*#__PURE__*/_jsxDEV(InputClearButton, {
         label: "Clear selection",
         onClick: e => {
           e.stopPropagation();
           handleClear();
         },
         xstyle: [styles.clearButton, size === 'sm' && styles.clearButtonSm]
-      })]
-    }), showsDisabledMessage && disabledMessageTooltip.renderTooltip(disabledMessage)]
-  });
+      }, void 0, false)]
+    }, void 0, true), showsDisabledMessage && disabledMessageTooltip.renderTooltip(disabledMessage)]
+  }, void 0, true);
   if (inputGroup) {
     return typeaheadContent;
   }
-  return /*#__PURE__*/_jsx(Field, {
+  return /*#__PURE__*/_jsxDEV(Field, {
     ref: ref,
     label: label,
     isLabelHidden: isLabelHidden,
@@ -347,6 +347,6 @@ export function Typeahead({
     className: className,
     style: style,
     children: typeaheadContent
-  });
+  }, void 0, false);
 }
 Typeahead.displayName = 'Typeahead';

package/dist/Typeahead/TypeaheadItem.js

@@ -21,7 +21,7 @@ import { themeProps } from "../utils/themeProps.js";
 // =============================================================================
 // Types
 // =============================================================================
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; // =============================================================================
+import { Fragment as _Fragment, jsxDEV as _jsxDEV } from "react/jsx-dev-runtime"; // =============================================================================
 // Styles
 // =============================================================================
 // =============================================================================
@@ -61,11 +61,11 @@ export function TypeaheadItem({
 }) {
   // If item has a pre-rendered element, use it
   if (item.element) {
-    return /*#__PURE__*/_jsx(_Fragment, {
+    return /*#__PURE__*/_jsxDEV(_Fragment, {
       children: item.element
-    });
+    }, void 0, false);
   }
-  return /*#__PURE__*/_jsxs("div", {
+  return /*#__PURE__*/_jsxDEV("div", {
     ref: ref,
     ...mergeProps(themeProps('typeahead-item'), {
       0: {
@@ -75,22 +75,22 @@ export function TypeaheadItem({
         className: "x78zum5 x6s0dn4 x1txdalj x2lwn1j xbyyjgo"
       }
     }[!!isDisabled << 0]),
-    children: [icon, /*#__PURE__*/_jsxs("div", {
+    children: [icon, /*#__PURE__*/_jsxDEV("div", {
       ...{
         className: "x78zum5 xdt5ytf x98rzlu xeuugli"
       },
-      children: [/*#__PURE__*/_jsx("span", {
+      children: [/*#__PURE__*/_jsxDEV("span", {
         ...{
           className: "xcr08ib x1kq96og x1sodnla x1tgivj0 xb3r6kr xlyipyv xuxw1ft"
         },
         children: item.label
-      }), description && /*#__PURE__*/_jsx("span", {
+      }, void 0, false), description && /*#__PURE__*/_jsxDEV("span", {
         ...{
           className: "x141an7d x1ltkj2j xv1l7n4 xb3r6kr xlyipyv xuxw1ft"
         },
         children: description
-      })]
-    })]
-  });
+      }, void 0, false)]
+    }, void 0, true)]
+  }, void 0, true);
 }
 TypeaheadItem.displayName = 'TypeaheadItem';

package/dist/VStack/VStack.js

@@ -13,7 +13,7 @@
  */
 
 import { Stack } from "../Stack/Stack.js";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 /**
  * Vertical stack component for arranging items top-to-bottom.
  * Convenience wrapper around `Stack` with `direction="vertical"`.
@@ -34,12 +34,12 @@ export function VStack({
   vAlign,
   ...props
 }) {
-  return /*#__PURE__*/_jsx(Stack, {
+  return /*#__PURE__*/_jsxDEV(Stack, {
     ...props,
     direction: "vertical",
     hAlign: hAlign ?? align,
     vAlign: vAlign ?? justify,
     ref: ref
-  });
+  }, void 0, false);
 }
 VStack.displayName = 'VStack';

package/dist/astryx.css

@@ -23,6 +23,7 @@
   @property --x-maxWidth { syntax: "*"; inherits: false;}
   @property --x-minHeight { syntax: "*"; inherits: false;}
   @property --x-minWidth { syntax: "*"; inherits: false;}
+  @property --x-paddingInlineStart { syntax: "*"; inherits: false;}
   @property --x-right { syntax: "*"; inherits: false;}
   @property --x-top { syntax: "*"; inherits: false;}
   @property --x-transform { syntax: "*"; inherits: false;}
@@ -438,6 +439,7 @@
   @media (hover: hover){.x1jtjlen.x1jtjlen.x1jtjlen:where(.x1tspnpo:hover *):not(#\#):not(#\#){border-color:color-mix(in srgb,var(--color-border-emphasized),var(--color-tint-hover) 20%)}}
   @media (hover: hover){.x70talc.x70talc.x70talc:where(.xklqth5:hover *):not(#\#):not(#\#){border-color:color-mix(in srgb,var(--color-border-emphasized),var(--color-tint-hover) 20%)}}
   @media (hover: hover){.xmt8yqp.xmt8yqp.xmt8yqp:where(.x1tspnpo:hover *):not(#\#):not(#\#){border-color:var(--color-border)}}
+  @media (hover: hover){.x1ww4t2b.x1ww4t2b:hover:not(#\#):not(#\#){border-color:var(--color-border-emphasized)}}
   @media (hover: hover){.x4ohgrr.x4ohgrr:hover:not(#\#):not(#\#){text-decoration:underline}}
   .x67t5t6:not(#\#):not(#\#):not(#\#){-webkit-backdrop-filter:blur(12px)}
   .x1ua5tub:not(#\#):not(#\#):not(#\#){-webkit-box-orient:vertical}
@@ -701,6 +703,17 @@
   .xwsyq91:not(#\#):not(#\#):not(#\#){font-size:20px}
   .x1pvqxga:not(#\#):not(#\#):not(#\#){font-size:24px}
   .x1qlqyl8:not(#\#):not(#\#):not(#\#){font-size:inherit}
+  .xhs0kqb:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-2xl)}
+  .x16a80zy:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-2xs)}
+  .x10srzze:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-3xl)}
+  .x10p7juq:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-3xs)}
+  .xqcvi3d:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-4xl)}
+  .xxc45ev:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-4xs)}
+  .x1j29vfg:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-base)}
+  .xc7cgfe:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-lg)}
+  .x1eqnyfr:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-sm)}
+  .x1wqms48:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-xl)}
+  .x51wmvv:not(#\#):not(#\#):not(#\#){font-size:var(--font-size-xs)}
   .xho7bvi:not(#\#):not(#\#):not(#\#){font-size:var(--spacing-4)}
   .xjm74w1:not(#\#):not(#\#):not(#\#){font-size:var(--text-body-size)}
   .xp03k98:not(#\#):not(#\#):not(#\#){font-size:var(--text-code-size)}
@@ -835,6 +848,7 @@
   .x1mzt3pk:not(#\#):not(#\#):not(#\#){overflow-wrap:break-word}
   .x1h4wwuj:not(#\#):not(#\#):not(#\#){overflow-wrap:normal}
   .xyri2b:not(#\#):not(#\#):not(#\#){padding-inline-end:0}
+  .x12frdag:not(#\#):not(#\#):not(#\#){padding-inline-end:calc(var(--container-padding-inline-end) - var(--border-width))}
   .x64h4k7:not(#\#):not(#\#):not(#\#){padding-inline-end:var(--container-padding-inline-end)}
   .x1peupej:not(#\#):not(#\#):not(#\#){padding-inline-end:var(--layout-padding-inner-x,var(--spacing-4))}
   .xpc6k2p:not(#\#):not(#\#):not(#\#){padding-inline-end:var(--layout-padding-outer-x,var(--spacing-4))}
@@ -851,6 +865,7 @@
   .x1q91b2g:not(#\#):not(#\#):not(#\#){padding-inline-end:var(--spacing-8)}
   .x1c1uobl:not(#\#):not(#\#):not(#\#){padding-inline-start:0}
   .x1f43n9v:not(#\#):not(#\#):not(#\#){padding-inline-start:calc(16px + var(--spacing-1-5))}
+  .xs19ii7:not(#\#):not(#\#):not(#\#){padding-inline-start:calc(var(--container-padding-inline-start) - var(--border-width))}
   .x2a0j69:not(#\#):not(#\#):not(#\#){padding-inline-start:calc(var(--spacing-2) - var(--spacing-1) + 1px)}
   .x1c35znw:not(#\#):not(#\#):not(#\#){padding-inline-start:var(--container-padding-inline-start)}
   .xwjyata:not(#\#):not(#\#):not(#\#){padding-inline-start:var(--layout-padding-inner-x,var(--spacing-4))}
@@ -869,6 +884,7 @@
   .x31w388:not(#\#):not(#\#):not(#\#){padding-inline-start:var(--spacing-6)}
   .xchaq28:not(#\#):not(#\#):not(#\#){padding-inline-start:var(--spacing-7)}
   .x1j3hnjz:not(#\#):not(#\#):not(#\#){padding-inline-start:var(--spacing-8)}
+  .xnvo3vl:not(#\#):not(#\#):not(#\#){padding-inline-start:var(--x-paddingInlineStart)}
   .x67bb7w:not(#\#):not(#\#):not(#\#){pointer-events:auto}
   .x47corl:not(#\#):not(#\#):not(#\#){pointer-events:none}
   .x1tsffl5:not(#\#):not(#\#):not(#\#){position-anchor:--outline-active}
@@ -966,6 +982,7 @@
   .x12qzo2w:not(#\#):not(#\#):not(#\#){transition-property:background-image}
   .x1tv3a4w:not(#\#):not(#\#):not(#\#){transition-property:border-color,box-shadow,background-color}
   .x12zzom9:not(#\#):not(#\#):not(#\#){transition-property:border-color,box-shadow}
+  .xshfolx:not(#\#):not(#\#):not(#\#){transition-property:border-color}
   .x16mfhj0:not(#\#):not(#\#):not(#\#){transition-property:box-shadow,border-color}
   .x1vix5yk:not(#\#):not(#\#):not(#\#){transition-property:color,background-color,box-shadow}
   .x1mpt4pi:not(#\#):not(#\#):not(#\#){transition-property:color,text-decoration}
@@ -985,6 +1002,7 @@
   .x19991ni:not(#\#):not(#\#):not(#\#){transition-property:opacity}
   .x1xuz8iz:not(#\#):not(#\#):not(#\#){transition-property:top,height}
   .x18dpk69:not(#\#):not(#\#):not(#\#){transition-property:transform,background-color}
+  .xefglzl:not(#\#):not(#\#):not(#\#){transition-property:transform,color,background-color}
   .xh3q6i0:not(#\#):not(#\#):not(#\#){transition-property:transform,width,height}
   .x11xpdln:not(#\#):not(#\#):not(#\#){transition-property:transform}
   .xxrbq2n:not(#\#):not(#\#):not(#\#){transition-property:width}
@@ -1002,6 +1020,7 @@
   .xuxw1ft:not(#\#):not(#\#):not(#\#){white-space:nowrap}
   .x126k92a:not(#\#):not(#\#):not(#\#){white-space:pre-wrap}
   .x1sdyfia:not(#\#):not(#\#):not(#\#){white-space:pre}
+  .x1so62im:not(#\#):not(#\#):not(#\#){will-change:transform}
   .x1yn0g08:not(#\#):not(#\#):not(#\#){word-break:break-all}
   .x13faqbe:not(#\#):not(#\#):not(#\#){word-break:break-word}
   .x1lldw8n:not(#\#):not(#\#):not(#\#){word-break:normal}
@@ -1030,6 +1049,7 @@
   .xh2nty3:focus-visible:not(#\#):not(#\#):not(#\#){outline-offset:var(--spacing-0-5)}
   .xbt4iw:focus-within:not(#\#):not(#\#):not(#\#){pointer-events:auto}
   .x1mqgsch:is([data-astryx-scrolling]):not(#\#):not(#\#):not(#\#){scrollbar-width:none}
+  .xgtlewx:is([dir="rtl"] *):not(#\#):not(#\#):not(#\#){transform:scaleX(-1)}
   .x1df3fe5:is([dir="rtl"] *):not(#\#):not(#\#):not(#\#){transform:translateX(-100%)}
   .xttggg:is([dir="rtl"] *):not(#\#):not(#\#):not(#\#){transform:translateX(100%)}
   .x9cjr8z:popover-open:not(#\#):not(#\#):not(#\#){transform:translateY(0)}
@@ -1059,6 +1079,7 @@
   .x1wzlfcn:last-child:not(#\#):not(#\#):not(#\#){padding-inline-end:max(var(--container-padding-inline-end,var(--spacing-4)),var(--spacing-2))}
   .x1dnou9g:nth-child(even):not(#\#):not(#\#):not(#\#){background-color:var(--color-background-muted)}
   .x1uwx2nv:hover:not(#\#):not(#\#):not(#\#){background-color:var(--color-overlay-hover)}
+  .x1cqbx0l:hover:not(#\#):not(#\#):not(#\#){color:var(--color-icon-primary)}
   .x1c52tdz:focus:not(#\#):not(#\#):not(#\#){background-color:var(--color-overlay-hover)}
   .x1rsz1da:focus:not(#\#):not(#\#):not(#\#){clip-path:none}
   .xodanix:focus:not(#\#):not(#\#):not(#\#){inset-inline-start:var(--spacing-2)}
@@ -1322,6 +1343,7 @@
   .x18d9i69:not(#\#):not(#\#):not(#\#):not(#\#){padding-bottom:0}
   .x1j85h84:not(#\#):not(#\#):not(#\#):not(#\#){padding-bottom:1px}
   .x9jihrk:not(#\#):not(#\#):not(#\#):not(#\#){padding-bottom:calc(var(--_chat-composer-padding) + var(--_chat-composer-radius))}
+  .xbv1mwh:not(#\#):not(#\#):not(#\#):not(#\#){padding-bottom:calc(var(--container-padding-block-end) - var(--border-width))}
   .xxbfulo:not(#\#):not(#\#):not(#\#):not(#\#){padding-bottom:calc(var(--spacing-3) + var(--radius-chat))}
   .xvpcij2:not(#\#):not(#\#):not(#\#):not(#\#){padding-bottom:var(--_chat-composer-padding)}
   .xc1wllq:not(#\#):not(#\#):not(#\#):not(#\#){padding-bottom:var(--container-padding-block-end)}
@@ -1341,6 +1363,7 @@
   .xexx8yu:not(#\#):not(#\#):not(#\#):not(#\#){padding-top:0}
   .x1htvmrp:not(#\#):not(#\#):not(#\#):not(#\#){padding-top:calc(var(--_chat-composer-padding) + var(--_chat-composer-radius))}
   .x1enrzb7:not(#\#):not(#\#):not(#\#):not(#\#){padding-top:calc(var(--border-width) + var(--spacing-1))}
+  .x1nex4ik:not(#\#):not(#\#):not(#\#):not(#\#){padding-top:calc(var(--container-padding-block-start) - var(--border-width))}
   .x1ak3mig:not(#\#):not(#\#):not(#\#):not(#\#){padding-top:calc(var(--spacing-1-5) + var(--spacing-2))}
   .x2gtn7z:not(#\#):not(#\#):not(#\#):not(#\#){padding-top:var(--_chat-composer-padding)}
   .x14m0hsi:not(#\#):not(#\#):not(#\#):not(#\#){padding-top:var(--container-padding-block-start)}