@astryxdesign/core 0.2.0 → 0.3.0-canary.0b5a38e

package/dist/Markdown/Markdown.js

@@ -106,8 +106,8 @@ const cellAlignStyles = {
     k9WMMc: "x2b8uid",
     $$css: true
   },
-  right: {
-    k9WMMc: "x1hr2gdg",
+  end: {
+    k9WMMc: "xp4054r",
     $$css: true
   }
 };
@@ -783,7 +783,10 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
         }
         const Tag = `h${level}`;
         return /*#__PURE__*/_jsx(Tag, {
-          ...stylex.props(styles.headingBase, headingStyles[level], spacing, contentWidthValue != null ? dynamicStyles.proseWidth(contentWidthValue) : null, contentAlign !== 'start' ? dynamicStyles.proseAlign(ALIGN_MARGIN[contentAlign]) : null, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd),
+          ...mergeProps(themeProps('markdown-heading', {
+            density,
+            level
+          }), stylex.props(styles.headingBase, headingStyles[level], spacing, contentWidthValue != null ? dynamicStyles.proseWidth(contentWidthValue) : null, contentAlign !== 'start' ? dynamicStyles.proseAlign(ALIGN_MARGIN[contentAlign]) : null, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd)),
           children: headingChildren
         }, index);
       }
@@ -807,7 +810,9 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
         // element can still pass components={{paragraph: 'p'}}.
         return /*#__PURE__*/_jsx("div", {
           role: "paragraph",
-          ...stylex.props(spacing, contentWidthValue != null ? dynamicStyles.proseWidth(contentWidthValue) : null, contentAlign !== 'start' ? dynamicStyles.proseAlign(ALIGN_MARGIN[contentAlign]) : null, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd),
+          ...mergeProps(themeProps('markdown-paragraph', {
+            density
+          }), stylex.props(spacing, contentWidthValue != null ? dynamicStyles.proseWidth(contentWidthValue) : null, contentAlign !== 'start' ? dynamicStyles.proseAlign(ALIGN_MARGIN[contentAlign]) : null, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd)),
           children: paraChildren
         }, index);
       }
@@ -823,7 +828,9 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
           }, index);
         }
         return /*#__PURE__*/_jsx("div", {
-          ...stylex.props(spacing, styles.codeBlockWrapper, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd),
+          ...mergeProps(themeProps('markdown-codeblock', {
+            density
+          }), stylex.props(spacing, styles.codeBlockWrapper, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd)),
           children: /*#__PURE__*/_jsx(CodeBlock, {
             code: node.content,
             language: node.language,
@@ -842,6 +849,9 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
           }, index);
         }
         return /*#__PURE__*/_jsx(Blockquote, {
+          ...themeProps('markdown-blockquote', {
+            density
+          }),
           xstyle: [spacing, contentWidthValue != null ? dynamicStyles.proseWidth(contentWidthValue) : undefined, contentAlign !== 'start' ? dynamicStyles.proseAlign(ALIGN_MARGIN[contentAlign]) : undefined, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd],
           children: node.children.map((c, i) => renderBlock(c, i, node.children.length, density, headingLevelStart, onLinkClick, cursor, citationCtx, contentWidthValue, contentAlign, linkComponent, inlinePlugins, components, t))
         }, index);
@@ -861,7 +871,9 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
             key
           }) => key);
           return /*#__PURE__*/_jsx("div", {
-            ...stylex.props(spacing, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd),
+            ...mergeProps(themeProps('markdown-list', {
+              density
+            }), stylex.props(spacing, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd)),
             children: /*#__PURE__*/_jsx(CheckboxList, {
               label: t('@astryx.markdown.taskList'),
               isLabelHidden: true,
@@ -888,7 +900,9 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
           }, index);
         }
         return /*#__PURE__*/_jsx("div", {
-          ...stylex.props(spacing, contentWidthValue != null ? dynamicStyles.proseWidth(contentWidthValue) : null, contentAlign !== 'start' ? dynamicStyles.proseAlign(ALIGN_MARGIN[contentAlign]) : null, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd),
+          ...mergeProps(themeProps('markdown-list', {
+            density
+          }), stylex.props(spacing, contentWidthValue != null ? dynamicStyles.proseWidth(contentWidthValue) : null, contentAlign !== 'start' ? dynamicStyles.proseAlign(ALIGN_MARGIN[contentAlign]) : null, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd)),
           children: /*#__PURE__*/_jsx(List, {
             listStyle: node.ordered ? 'decimal' : 'disc',
             density: "compact",
@@ -926,7 +940,9 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
           tabIndex: 0,
           role: "group",
           "aria-label": t('@astryx.markdown.table'),
-          ...stylex.props(styles.tableWrapper, spacing, contentWidthValue != null ? dynamicStyles.blockWidth(contentWidthValue) : null, BLOCK_ALIGN_MARGIN[contentAlign] != null ? dynamicStyles.blockAlign(BLOCK_ALIGN_MARGIN[contentAlign]) : null, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd),
+          ...mergeProps(themeProps('markdown-table', {
+            density
+          }), stylex.props(styles.tableWrapper, spacing, contentWidthValue != null ? dynamicStyles.blockWidth(contentWidthValue) : null, BLOCK_ALIGN_MARGIN[contentAlign] != null ? dynamicStyles.blockAlign(BLOCK_ALIGN_MARGIN[contentAlign]) : null, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd)),
           children: /*#__PURE__*/_jsxs(Table, {
             dividers: "rows",
             textOverflow: "wrap",
@@ -935,7 +951,7 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
                 children: node.headers.map((h, i) => /*#__PURE__*/_jsx(TableHeaderCell
                 // eslint-disable-next-line @eslint-react/no-array-index-key -- markdown table columns are positional by definition
                 , {
-                  xstyle: [dynamicStyles.cellMinWidth(`${colMinWidths[i]}px`), node.alignments[i] === 'center' && cellAlignStyles.center, node.alignments[i] === 'right' && cellAlignStyles.right],
+                  xstyle: [dynamicStyles.cellMinWidth(`${colMinWidths[i]}px`), node.alignments[i] === 'center' && cellAlignStyles.center, node.alignments[i] === 'right' && cellAlignStyles.end],
                   children: h.children.map((c, j) => renderInline(c, j, onLinkClick, cursor, citationCtx, linkComponent, inlinePlugins, components))
                 }, i))
               })
@@ -944,7 +960,7 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
                 const cells = row.map((cell, j) => /*#__PURE__*/_jsx(TableCell
                 // eslint-disable-next-line @eslint-react/no-array-index-key -- markdown table cells are positional by row and column
                 , {
-                  xstyle: [node.alignments[j] === 'center' && cellAlignStyles.center, node.alignments[j] === 'right' && cellAlignStyles.right],
+                  xstyle: [node.alignments[j] === 'center' && cellAlignStyles.center, node.alignments[j] === 'right' && cellAlignStyles.end],
                   children: cell.children.map((c, k) => renderInline(c, k, onLinkClick, cursor, citationCtx, linkComponent, inlinePlugins, components))
                 }, j));
                 return /*#__PURE__*/_jsx(TableRow
@@ -964,7 +980,9 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
           return /*#__PURE__*/_jsx(HrComp, {}, index);
         }
         return /*#__PURE__*/_jsx("hr", {
-          ...stylex.props(styles.hr, spacing, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd)
+          ...mergeProps(themeProps('markdown-hr', {
+            density
+          }), stylex.props(styles.hr, spacing, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd))
         }, index);
       }
     case 'image':
@@ -972,7 +990,9 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
         const safeSrc = sanitizeUrl(node.src);
         if (safeSrc == null) {
           return /*#__PURE__*/_jsxs("div", {
-            ...stylex.props(spacing, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd),
+            ...mergeProps(themeProps('markdown-image', {
+              density
+            }), stylex.props(spacing, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd)),
             children: ["[", node.alt, "]"]
           }, index);
         }
@@ -984,7 +1004,9 @@ function renderBlock(node, index, blockCount, density, headingLevelStart, onLink
           }, index);
         }
         return /*#__PURE__*/_jsx("div", {
-          ...stylex.props(spacing, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd),
+          ...mergeProps(themeProps('markdown-image', {
+            density
+          }), stylex.props(spacing, isFirst && styles.noMarginBlockStart, isLast && styles.noMarginBlockEnd)),
           children: /*#__PURE__*/_jsx("img", {
             src: safeSrc,
             alt: node.alt,

package/dist/MetadataList/MetadataList.d.ts

@@ -1,6 +1,6 @@
 /**
  * @file MetadataList.tsx
- * @input Uses React, ReactNode, StyleXStyles, theme tokens, MetadataListContext
+ * @input Uses React, ReactNode, StyleXStyles, theme tokens, MetadataListContext, i18n (useTranslator)
  * @output Exports MetadataList component, MetadataListProps, MetadataListColumns types
  * @position Core implementation; consumed by index.ts, tested by MetadataList.test.tsx
  *
@@ -9,7 +9,7 @@
  * - /packages/core/src/MetadataList/MetadataList.test.tsx
  * - /packages/core/src/MetadataList/index.ts
  * - /apps/storybook/stories/MetadataList.stories.tsx
- * - /packages/cli/templates/blocks/components/MetadataList/ (showcase blocks)
+ * - /packages/cli/assets/templates/blocks/components/MetadataList/ (showcase blocks)
  */
 import { type ReactNode } from 'react';
 import { type MetadataListLabelConfig } from './MetadataListContext';

package/dist/MetadataList/MetadataList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MetadataList.d.ts","sourceRoot":"","sources":["../../src/MetadataList/MetadataList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAqC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAQzE,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE9D,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAC7C,SAAS,CAAC,cAAc,CAAC,EACzB,OAAO,CACR;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,uBAAuB,CAAC;IAChC;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;;;;;OASG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAuFD,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,OAAkB,EAClB,KAAK,EACL,aAAa,EACb,WAAwB,EACxB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,GACJ,EAAE,iBAAiB,+BAoGnB;yBAhHe,YAAY"}
+{"version":3,"file":"MetadataList.d.ts","sourceRoot":"","sources":["../../src/MetadataList/MetadataList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAqC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAQzE,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;AAE9D,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAC7C,SAAS,CAAC,cAAc,CAAC,EACzB,OAAO,CACR;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,uBAAuB,CAAC;IAChC;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;;;;;OASG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AA6FD,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,OAAkB,EAClB,KAAK,EACL,aAAa,EACb,WAAwB,EACxB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,GACJ,EAAE,iBAAiB,+BAsHnB;yBAlIe,YAAY"}

package/dist/MetadataList/MetadataList.js

@@ -4,7 +4,7 @@
 
 /**
  * @file MetadataList.tsx
- * @input Uses React, ReactNode, StyleXStyles, theme tokens, MetadataListContext
+ * @input Uses React, ReactNode, StyleXStyles, theme tokens, MetadataListContext, i18n (useTranslator)
  * @output Exports MetadataList component, MetadataListProps, MetadataListColumns types
  * @position Core implementation; consumed by index.ts, tested by MetadataList.test.tsx
  *
@@ -13,7 +13,7 @@
  * - /packages/core/src/MetadataList/MetadataList.test.tsx
  * - /packages/core/src/MetadataList/index.ts
  * - /apps/storybook/stories/MetadataList.stories.tsx
- * - /packages/cli/templates/blocks/components/MetadataList/ (showcase blocks)
+ * - /packages/cli/assets/templates/blocks/components/MetadataList/ (showcase blocks)
  */
 import { Children, useId, useMemo, useState } from 'react';
 import * as stylex from '@stylexjs/stylex';
@@ -22,6 +22,7 @@ import { spacingVars, colorVars, typeScaleVars, fontWeightVars } from "../theme/
 import { MetadataListContext } from "./MetadataListContext.js";
 import { mergeProps } from "../utils/index.js";
 import { themeProps } from "../utils/themeProps.js";
+import { useTranslator } from "../i18n/index.js";
 
 // =============================================================================
 // Types
@@ -76,6 +77,17 @@ const styles = {
   }
 };
 
+// A fixed numeric column count (and a custom label width) is only known at
+// runtime, so it comes from a dynamic style rather than a static rule.
+const dynamicStyles = {
+  gridTemplate: gridTemplateColumns => [{
+    kumcoG: gridTemplateColumns != null ? "xqketvx" : gridTemplateColumns,
+    $$css: true
+  }, {
+    "--x-gridTemplateColumns": gridTemplateColumns != null ? gridTemplateColumns : undefined
+  }]
+};
+
 // =============================================================================
 // Component
 // =============================================================================
@@ -119,6 +131,7 @@ export function MetadataList({
   const labelConfig = label ?? (isMultiColumn ? LABEL_TOP : LABEL_START);
   const [isShowAll, setIsShowAll] = useState(false);
   const contentId = useId();
+  const t = useTranslator();
   const contextValue = useMemo(() => ({
     labelConfig: orientation === 'horizontal' ? LABEL_TOP : labelConfig,
     orientation
@@ -153,12 +166,27 @@ export function MetadataList({
     return styles.gridMulti;
   };
 
-  // For numeric columns > 1 with side labels, use inline style for dynamic grid
-  const dynamicGridStyle = !isHorizontal && labelConfig.position === 'start' && typeof columns === 'number' && columns > 1 ? {
-    gridTemplateColumns: `repeat(${columns}, auto 1fr)`
-  } : !isHorizontal && labelConfig.position === 'start' && labelConfig.width != null ? {
-    gridTemplateColumns: `${typeof labelConfig.width === 'number' ? `${labelConfig.width}px` : labelConfig.width} 1fr`
-  } : undefined;
+  // The grid template for a fixed numeric column count, or for a custom label
+  // width. Both are runtime values, so they resolve to a dynamic style below.
+  // The track shape depends on the label position: stacked labels put a whole
+  // item in one cell, while side labels split each item into a label track and
+  // a value track.
+  const getGridTemplateColumns = () => {
+    if (isHorizontal) {
+      return null;
+    }
+    const isStacked = labelConfig.position === 'top';
+    if (typeof columns === 'number' && columns > 1) {
+      return isStacked ? `repeat(${columns}, 1fr)` : `repeat(${columns}, auto 1fr)`;
+    }
+    // A custom label width only applies to the label track of side labels.
+    if (!isStacked && labelConfig.width != null) {
+      const width = typeof labelConfig.width === 'number' ? `${labelConfig.width}px` : labelConfig.width;
+      return `${width} 1fr`;
+    }
+    return null;
+  };
+  const gridTemplateColumns = getGridTemplateColumns();
   return /*#__PURE__*/_jsx(MetadataListContext, {
     value: contextValue,
     children: /*#__PURE__*/_jsxs("div", {
@@ -170,9 +198,7 @@ export function MetadataList({
       }), stylex.props(styles.root, xstyle), className, style),
       children: [titleContent, /*#__PURE__*/_jsx("dl", {
         id: contentId,
-        ...mergeProps(stylex.props(styles.dl, getGridStyle()), {
-          style: dynamicGridStyle
-        }),
+        ...stylex.props(styles.dl, getGridStyle(), gridTemplateColumns != null && dynamicStyles.gridTemplate(gridTemplateColumns)),
         children: visibleChildren
       }), isExceedMax && /*#__PURE__*/_jsx("button", {
         type: "button",
@@ -182,7 +208,7 @@ export function MetadataList({
         ...{
           className: "xjyslct x15nmkw0 x1ypdohk xqwr325 xjm74w1 xw6l6zx x1e4wzip xjb2p0i x1yc453h xqcrz7y"
         },
-        children: isShowAll ? 'Show less' : 'Show more'
+        children: isShowAll ? t('@astryx.metadataList.showLess') : t('@astryx.metadataList.showMore')
       })]
     })
   });

package/dist/MetadataList/MetadataListItem.d.ts

@@ -9,7 +9,7 @@
  * - /packages/core/src/MetadataList/MetadataList.test.tsx
  * - /packages/core/src/MetadataList/index.ts
  * - /apps/storybook/stories/MetadataList.stories.tsx
- * - /packages/cli/templates/blocks/components/MetadataList/ (showcase blocks)
+ * - /packages/cli/assets/templates/blocks/components/MetadataList/ (showcase blocks)
  */
 import { type ReactNode } from 'react';
 import type { BaseProps } from '../BaseProps';

package/dist/MetadataList/MetadataListItem.js

@@ -13,7 +13,7 @@
  * - /packages/core/src/MetadataList/MetadataList.test.tsx
  * - /packages/core/src/MetadataList/index.ts
  * - /apps/storybook/stories/MetadataList.stories.tsx
- * - /packages/cli/templates/blocks/components/MetadataList/ (showcase blocks)
+ * - /packages/cli/assets/templates/blocks/components/MetadataList/ (showcase blocks)
  */
 import { use } from 'react';
 import * as stylex from '@stylexjs/stylex';

package/dist/MobileNav/MobileNav.d.ts

@@ -19,7 +19,7 @@
  *
  * SYNC: When modified, update these files to stay in sync:
  * - /packages/core/src/MobileNav/index.ts (exports if types change)
- * - /packages/cli/templates/blocks/components/MobileNav/ (showcase blocks)
+ * - /packages/cli/assets/templates/blocks/components/MobileNav/ (showcase blocks)
  */
 import { type ReactNode } from 'react';
 import type { BaseProps } from '../BaseProps';

package/dist/MobileNav/MobileNav.js

@@ -23,7 +23,7 @@
  *
  * SYNC: When modified, update these files to stay in sync:
  * - /packages/core/src/MobileNav/index.ts (exports if types change)
- * - /packages/cli/templates/blocks/components/MobileNav/ (showcase blocks)
+ * - /packages/cli/assets/templates/blocks/components/MobileNav/ (showcase blocks)
  */
 import { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';
 import * as stylex from '@stylexjs/stylex';
@@ -116,6 +116,10 @@ const styles = {
   drawerEndOpen: {
     k3aq6I: "xbryuvx",
     $$css: true
+  },
+  headerText: {
+    keTefX: "x11g1kdw",
+    $$css: true
   }
 };
 const _temp = {
@@ -297,14 +301,10 @@ export function MobileNav({
             className: "x78zum5 x6s0dn4 x1k15mir xf314gf x2lah0s x92x3c3 x1q0q8m5 xw8gpjh x13a6bvl"
           }
         }[!!!header << 0],
-        children: [typeof header === 'string' ? /*#__PURE__*/_jsx("span", {
-          ...{
-            className: "x11g1kdw"
-          },
-          children: /*#__PURE__*/_jsx(Heading, {
-            level: 2,
-            children: header
-          })
+        children: [typeof header === 'string' ? /*#__PURE__*/_jsx(Heading, {
+          level: 2,
+          xstyle: styles.headerText,
+          children: header
         }) : header ?? null, /*#__PURE__*/_jsx(Button, {
           variant: "ghost",
           label: t('@astryx.mobileNav.closeNavigation'),

package/dist/MoreMenu/MoreMenu.d.ts

@@ -11,7 +11,7 @@
  * - /packages/core/src/MoreMenu/MoreMenu.test.tsx
  * - /packages/core/src/MoreMenu/index.ts
  * - /apps/storybook/stories/MoreMenu.stories.tsx
- * - /packages/cli/templates/blocks/components/MoreMenu/ (showcase blocks)
+ * - /packages/cli/assets/templates/blocks/components/MoreMenu/ (showcase blocks)
  */
 import type { ReactNode } from 'react';
 import type { DropdownMenuOption } from '../DropdownMenu';

package/dist/MoreMenu/MoreMenu.js

@@ -15,9 +15,9 @@
  * - /packages/core/src/MoreMenu/MoreMenu.test.tsx
  * - /packages/core/src/MoreMenu/index.ts
  * - /apps/storybook/stories/MoreMenu.stories.tsx
- * - /packages/cli/templates/blocks/components/MoreMenu/ (showcase blocks)
+ * - /packages/cli/assets/templates/blocks/components/MoreMenu/ (showcase blocks)
  */
-import { getIcon } from "../Icon/globalIconRegistry.js";
+import { useIcon } from "../Icon/index.js";
 import { DropdownMenu } from "../DropdownMenu/DropdownMenu.js";
 import { useSize } from "../SizeContext/SizeContext.js";
 import { stableClassName } from "../naming.js";
@@ -56,7 +56,7 @@ export function MoreMenu({
   const t = useTranslator();
   const label = labelFromProps ?? t('@astryx.moreMenu.label');
   const size = useSize(sizeProp, 'md');
-  const moreIcon = getIcon('moreHorizontal');
+  const moreIcon = useIcon('moreHorizontal');
   return /*#__PURE__*/_jsx(DropdownMenu, {
     className: classNameProp ? `${stableClassName('more-menu')} ${classNameProp}` : stableClassName('more-menu'),
     xstyle: xstyle,

package/dist/MultiSelector/MultiSelector.d.ts

@@ -9,7 +9,7 @@
  * - /packages/core/src/MultiSelector/MultiSelector.test.tsx
  * - /packages/core/src/MultiSelector/index.ts
  * - /apps/storybook/stories/InputGroup.stories.tsx
- * - /packages/cli/templates/blocks/components/MultiSelector/ (showcase blocks)
+ * - /packages/cli/assets/templates/blocks/components/MultiSelector/ (showcase blocks)
  */
 import React, { type ReactNode } from 'react';
 import { type IconType } from '../Icon';
@@ -18,6 +18,7 @@ import type { MultiSelectorOptionType, MultiSelectorOptionData, MultiSelectorSta
 import type { BaseProps } from '../BaseProps';
 import type { SizeValue } from '../utils/types';
 export type MultiSelectorSize = 'sm' | 'md' | 'lg';
+export type MultiSelectorVariant = 'input' | 'ghost';
 export type MultiSelectorStatusType = 'warning' | 'error' | 'success';
 export type { MultiSelectorStatus };
 export interface MultiSelectorProps<T extends MultiSelectorOptionType = MultiSelectorOptionType> extends Omit<BaseProps, 'onChange' | 'defaultValue'> {
@@ -110,15 +111,23 @@ export interface MultiSelectorProps<T extends MultiSelectorOptionType = MultiSel
      * @default 'md'
      */
     size?: MultiSelectorSize;
+    /**
+     * Visual style of the selector trigger.
+     * - 'input': bordered input-style trigger for forms
+     * - 'ghost': borderless trigger matching ghost buttons, for toolbars
+     * @default 'input'
+     */
+    variant?: MultiSelectorVariant;
     /**
      * Status indicator for the selector.
      */
     status?: MultiSelectorStatus;
     /**
      * How the status message is placed relative to the input.
-     * - 'attached': message overlaps directly below the input (bordered treatment)
+     * - 'attached': message overlaps directly below the bordered input (input variant only)
      * - 'detached': message floats below as a separate element with spacing
-     * @default 'attached'
+     * - 'tooltip': message is exposed from the on-field status icon
+     * @default 'attached' for input selectors; 'detached' for ghost selectors
      */
     statusVariant?: FieldStatusVariant;
     /**
@@ -206,7 +215,7 @@ export interface MultiSelectorProps<T extends MultiSelectorOptionType = MultiSel
  * />
  * ```
  */
-export declare function MultiSelector<T extends MultiSelectorOptionType>({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, options, value, onChange, changeAction, isLoading, placeholder: placeholderFromProps, size: sizeProp, status, statusVariant, labelTooltip, startIcon, hasClear, hasSelectAll, selectAllLabel: selectAllLabelFromProps, hasSearch, searchPlaceholder: searchPlaceholderFromProps, triggerDisplay, maxBadges, renderOption, isDefaultOpen, 'data-testid': testId, htmlName, width, xstyle, className, style, }: MultiSelectorProps<T>): React.JSX.Element;
+export declare function MultiSelector<T extends MultiSelectorOptionType>({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, options, value, onChange, changeAction, isLoading, placeholder: placeholderFromProps, size: sizeProp, variant, status, statusVariant, labelTooltip, startIcon, hasClear, hasSelectAll, selectAllLabel: selectAllLabelFromProps, hasSearch, searchPlaceholder: searchPlaceholderFromProps, triggerDisplay, maxBadges, renderOption, isDefaultOpen, 'data-testid': testId, htmlName, width, xstyle, className, style, }: MultiSelectorProps<T>): React.JSX.Element;
 export declare namespace MultiSelector {
     var displayName: string;
 }

package/dist/MultiSelector/MultiSelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelector.d.ts","sourceRoot":"","sources":["../../src/MultiSelector/MultiSelector.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"MultiSelector.d.ts","sourceRoot":"","sources":["../../src/MultiSelector/MultiSelector.tsx"],"names":[],"mappings":"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"}