npm - @a-type/ui - Versions diffs - 3.0.28 → 3.0.30 - Mend

@a-type/ui 3.0.28 → 3.0.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (51) hide show

package/dist/esm/components/button/Button.d.ts CHANGED Viewed

@@ -16,6 +16,9 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     disableDropdownTriggerIcon?: boolean;
 }
 export declare function ButtonRoot({ className, color, emphasis, size, toggled, toggleMode, align, visuallyDisabled, visuallyFocused, loading, children, disabled, asChild, disableIconMode, disableDropdownTriggerIcon, ref, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace ButtonRoot {
+    var displayName: string;
+}
 export declare const ButtonToggleIndicator: import("react").NamedExoticComponent<{
     value: boolean;
 }>;

package/dist/esm/components/button/Button.js CHANGED Viewed

@@ -14,7 +14,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Slot } from '@radix-ui/react-slot';
 import { clsx } from 'clsx';
 import { AnimatePresence, motion } from 'motion/react';
-import { Children, Fragment, memo, useCallback, useState, } from 'react';
+import { Children, Fragment, memo, useCallback, useDebugValue, useState, } from 'react';
 import { withClassName } from '../../hooks.js';
 import useMergedRef from '../../hooks/useMergedRef.js';
 import { DropdownMenuTriggerIcon } from '../dropdownMenu/DropdownMenu.js';
@@ -32,12 +32,13 @@ export function ButtonRoot(_a) {
     const childArray = childArrayWithoutFragments(children);
     const iconChildCount = childArray.filter(isIconChild).length;
     const hasLabelChild = childArray.length > iconChildCount;
+    useDebugValue(`Children introspection: Icons: ${iconChildCount}, Label: ${hasLabelChild}, Total: ${childArray.length}`);
     const isDropdownTriggerFromContext = useIsDropdownTrigger();
     const isDropdownTrigger = !disableDropdownTriggerIcon &&
         hasLabelChild &&
         isDropdownTriggerFromContext;
     const finalRef = useMergedRef(useAnnotateWithChildParts(), ref);
-    const buttonProps = Object.assign(Object.assign({ ref: finalRef }, props), { disabled: disabled || isLoading, 'data-disabled': visuallyDisabled, 'data-focus': visuallyFocused, 'data-size': size, 'data-loading': isLoading, 'data-has-label': hasLabelChild || undefined, 'data-has-icon': iconChildCount > 0 ? true : undefined, 'data-icon-count': iconChildCount > 0 ? iconChildCount : undefined, 'data-dropdown-trigger': isDropdownTrigger ? true : undefined, tabIndex: visuallyDisabled ? -1 : undefined, className: clsx(getButtonClassName({
+    const buttonProps = Object.assign(Object.assign({ ref: finalRef }, props), { disabled: disabled || isLoading, 'data-disabled': visuallyDisabled, 'data-focus': visuallyFocused, 'data-size': size, 'data-loading': isLoading, 'data-has-label': hasLabelChild, 'data-has-icon': iconChildCount > 0, 'data-icon-count': iconChildCount > 0 ? iconChildCount : undefined, 'data-dropdown-trigger': isDropdownTrigger ? true : undefined, tabIndex: visuallyDisabled ? -1 : undefined, className: clsx(getButtonClassName({
             color,
             emphasis,
             size,
@@ -59,6 +60,7 @@ export function ButtonRoot(_a) {
                     (toggleMode === 'indicator' ||
                         toggleMode === 'color-and-indicator') && (_jsx(ButtonToggleIndicator, { value: toggled })), children, isDropdownTrigger && (_jsx(IconLoadingProvider, { value: false, children: _jsx(DropdownMenuTriggerIcon, { asChild: true, children: _jsx(Icon, { name: "chevron" }) }) }))] })) }));
 }
+ButtonRoot.displayName = 'Button';
 export const ButtonToggleIndicator = memo(function ToggleIndicator({ value, }) {
     return (_jsx(Icon, { "aria-hidden": true, name: "check", className: "transition-width w-0 ml--1", style: {
             width: value ? '15px' : 0,
@@ -66,6 +68,7 @@ export const ButtonToggleIndicator = memo(function ToggleIndicator({ value, }) {
 });
 // allows custom icons to trigger icon button behavior
 export const ButtonIcon = withClassName('div', 'icon flex-shrink-0 flex');
+ButtonIcon.displayName = 'ButtonIcon';
 export const Button = Object.assign(ButtonRoot, {
     ToggleIndicator: ButtonToggleIndicator,
     Icon: ButtonIcon,
@@ -96,6 +99,7 @@ function applyPartAttributes(button) {
         icon: 0,
         label: 0,
     };
+    const iconNodes = [];
     button.childNodes.forEach((child) => {
         if (!(child instanceof HTMLElement || child instanceof SVGElement))
             return;
@@ -104,13 +108,17 @@ function applyPartAttributes(button) {
         if ((child instanceof HTMLElement || child instanceof SVGElement) &&
             child.classList.contains('icon')) {
             registry.icon++;
+            iconNodes.push(child);
         }
         else {
             registry.label++;
         }
     });
     if (button.textContent) {
-        registry.label++;
+        const iconText = iconNodes.map((n) => n.textContent).join('');
+        const labelText = button.textContent.replace(iconText, '').trim();
+        if (labelText.length > 0)
+            registry.label++;
     }
     button.setAttribute('data-has-icon', String(registry.icon > 0));
     button.setAttribute('data-has-label', String(registry.label > 0));
@@ -121,11 +129,13 @@ function isIconChild(child) {
         return false;
     if ('type' in child) {
         const type = child.type;
-        if (type === ButtonIcon)
-            return true;
-        if (type === Icon)
+        if (type === ButtonIcon ||
+            type === 'ButtonIcon' ||
+            type.displayName === 'ButtonIcon')
             return true;
-        if (typeof type === 'function' && type.displayName === 'Icon')
+        if (type === Icon ||
+            type === 'Icon' ||
+            type.displayName === 'Icon')
             return true;
     }
     return false;

package/dist/esm/components/button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,IAAI,EAAE,MAAM,MAAM,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACvD,OAAO,EAEN,QAAQ,EACR,QAAQ,EACR,IAAI,EAGJ,WAAW,EACX,QAAQ,GACR,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,YAAY,MAAM,6BAA6B,CAAC;AAEvD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AAC1E,OAAO,EAAE,oBAAoB,EAAE,MAAM,2CAA2C,CAAC;AACjF,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAC;AACpE,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAwBlD,MAAM,UAAU,UAAU,CAAC,EAkBb;QAlBa,EAC1B,SAAS,EACT,KAAK,EACL,QAAQ,GAAG,SAAS,EACpB,IAAI,EACJ,OAAO,EACP,UAAU,GAAG,qBAAqB,EAClC,KAAK,EACL,gBAAgB,EAChB,eAAe,EACf,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,eAAe,EACf,0BAA0B,EAC1B,GAAG,OAEU,EADV,KAAK,cAjBkB,yNAkB1B,CADQ;IAER,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC;IAEvC,MAAM,gBAAgB,GAAG,KAAK,CAAC;IAC/B,MAAM,eAAe,GAAG,KAAK,CAAC,IAAI,KAAK,QAAQ,IAAI,gBAAgB,CAAC;IACpE,MAAM,SAAS,GAAG,OAAO,IAAI,eAAe,CAAC;IAE7C,MAAM,UAAU,GAAG,0BAA0B,CAAC,QAAQ,CAAC,CAAC;IACxD,MAAM,cAAc,GAAG,UAAU,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,MAAM,CAAC;IAC7D,MAAM,aAAa,GAAG,UAAU,CAAC,MAAM,GAAG,cAAc,CAAC;IAEzD,MAAM,4BAA4B,GAAG,oBAAoB,EAAE,CAAC;IAC5D,MAAM,iBAAiB,GACtB,CAAC,0BAA0B;QAC3B,aAAa;QACb,4BAA4B,CAAC;IAE9B,MAAM,QAAQ,GAAG,YAAY,CAAC,yBAAyB,EAAE,EAAE,GAAG,CAAC,CAAC;IAEhE,MAAM,WAAW,iCAChB,GAAG,EAAE,QAAQ,IACV,KAAK,KACR,QAAQ,EAAE,QAAQ,IAAI,SAAS,EAC/B,eAAe,EAAE,gBAAgB,EACjC,YAAY,EAAE,eAAe,EAC7B,WAAW,EAAE,IAAI,EACjB,cAAc,EAAE,SAAS,EACzB,gBAAgB,EAAE,aAAa,~~IAAI~~,~~SAAS,EAC5C,~~eAAe,EAAE,cAAc,GAAG,CAAC,~~CAAC~~,~~CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACtD,~~iBAAiB,EAAE,cAAc,GAAG,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,EAClE,uBAAuB,EAAE,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAC7D,QAAQ,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,EAC3C,SAAS,EAAE,IAAI,CACd,kBAAkB,CAAC;YAClB,KAAK;YACL,QAAQ;YACR,IAAI;YACJ,UAAU,EACT,OAAO,KAAK,SAAS;gBACrB,CAAC,UAAU,KAAK,OAAO,IAAI,UAAU,KAAK,qBAAqB,CAAC;YACjE,KAAK;YACL,eAAe;SACf,CAAC,EACF,SAAS,CACT,GACD,CAAC;IACF,4BAA4B;IAC5B,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QAC3B,WAAW,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC;IACzC,CAAC;IAED,qDAAqD;IACrD,IAAI,OAAO,EAAE,CAAC;QACb,+CAA+C;QAC/C,OAAO,KAAC,IAAI,oBAAK,WAAW,cAAG,QAAQ,IAAQ,CAAC;IACjD,CAAC;IAED,OAAO,CACN,KAAC,mBAAmB,IAAC,KAAK,EAAE,SAAS,YACpC,MAAC,IAAI,oBAAK,WAAW,eACpB,KAAC,eAAe,cACd,SAAS,IAAI,CACb,KAAC,MAAM,CAAC,GAAG,IAEV,OAAO,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,EAC5C,OAAO,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,CAAC,EAAE,EACzC,IAAI,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,EACzC,SAAS,EAAE,IAAI,CACd,yDAAyD,EACzD,iCAAiC,CACjC,yCAGD,KAAC,OAAO,IAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,0BAA0B,GAAG,IAVtD,SAAS,CAWD,CACb,GACgB,EACjB,OAAO,KAAK,SAAS;oBACrB,CAAC,UAAU,KAAK,WAAW;wBAC1B,UAAU,KAAK,qBAAqB,CAAC,IAAI,CACzC,KAAC,qBAAqB,IAAC,KAAK,EAAE,OAAO,GAAI,CACzC,EACD,QAAQ,EACR,iBAAiB,IAAI,CACrB,KAAC,mBAAmB,IAAC,KAAK,EAAE,KAAK,YAChC,KAAC,uBAAuB,IAAC,OAAO,kBAC/B,KAAC,IAAI,IAAC,IAAI,EAAC,SAAS,GAAG,GACE,GACL,CACtB,KACK,GACc,CACtB,CAAC;AACH,CAAC;~~AAED~~,MAAM,CAAC,MAAM,qBAAqB,GAAG,IAAI,CAAC,SAAS,eAAe,CAAC,EAClE,KAAK,GAGL;IACA,OAAO,CACN,KAAC,IAAI,yBAEJ,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,4BAA4B,EACtC,KAAK,EAAE;YACN,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;SACzB,EACD,OAAO,EAAE,KAAK,GACb,CACF,CAAC;AACH,CAAC,CAAC,CAAC;AAEH,sDAAsD;AACtD,MAAM,CAAC,MAAM,UAAU,GAAG,aAAa,CAAC,KAAK,EAAE,yBAAyB,CAAC,CAAC;~~AAE1E~~,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,UAAU,EAAE;IAC/C,eAAe,EAAE,qBAAqB;IACtC,IAAI,EAAE,UAAU;CAChB,CAAC,CAAC;AAEH,SAAS,yBAAyB;IACjC,MAAM,gBAAgB,GAAG,QAAQ,CAAC,GAAG,EAAE;QACtC,IAAI,OAAO,MAAM,KAAK,WAAW;YAAE,OAAO,IAAK,CAAC;QAChD,OAAO,IAAI,gBAAgB,CAAC,CAAC,OAAO,EAAE,EAAE;YACvC,mBAAmB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,MAA2B,CAAC,CAAC;QAC7D,CAAC,CAAC,CAAC;IACJ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAEN,MAAM,GAAG,GAAG,WAAW,CACtB,CAAC,IAA8B,EAAE,EAAE;QAClC,IAAI,IAAI,IAAI,gBAAgB,EAAE,CAAC;YAC9B,gBAAgB,CAAC,UAAU,EAAE,CAAC;YAC9B,gBAAgB,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YACnE,mBAAmB,CAAC,IAAI,CAAC,CAAC;QAC3B,CAAC;aAAM,IAAI,gBAAgB,EAAE,CAAC;YAC7B,gBAAgB,CAAC,UAAU,EAAE,CAAC;QAC/B,CAAC;IACF,CAAC,EACD,CAAC,gBAAgB,CAAC,CAClB,CAAC;IAEF,OAAO,GAAG,CAAC;AACZ,CAAC;AAED,SAAS,mBAAmB,CAAC,MAAyB;IACrD,uDAAuD;IACvD,MAAM,QAAQ,GAAG;QAChB,IAAI,EAAE,CAAC;QACP,KAAK,EAAE,CAAC;KACR,CAAC;IACF,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;QACnC,IAAI,CAAC,CAAC,KAAK,YAAY,WAAW,IAAI,KAAK,YAAY,UAAU,CAAC;YAAE,OAAO;QAC3E,IAAI,KAAK,CAAC,KAAK,CAAC,OAAO,KAAK,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,KAAK,KAAK,GAAG;YAAE,OAAO,CAAC,uBAAuB;QAChG,IACC,CAAC,KAAK,YAAY,WAAW,IAAI,KAAK,YAAY,UAAU,CAAC;YAC7D,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC,EAC/B,CAAC;YACF,QAAQ,CAAC,IAAI,EAAE,CAAC;~~QACjB~~,CAAC;aAAM,CAAC;YACP,QAAQ,CAAC,KAAK,EAAE,CAAC;QAClB,CAAC;IACF,CAAC,CAAC,CAAC;IACH,IAAI,MAAM,CAAC,WAAW,EAAE,CAAC;QACxB,QAAQ,CAAC,KAAK,EAAE,CAAC;~~IAClB~~,CAAC;IACD,MAAM,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC;IAChE,MAAM,CAAC,YAAY,CAAC,gBAAgB,EAAE,MAAM,CAAC,QAAQ,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC;IAClE,MAAM,CAAC,YAAY,CAAC,iBAAiB,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC;AAC/D,CAAC;AAED,SAAS,WAAW,CAAC,KAAgB;IACpC,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,KAAK,IAAI;QAAE,OAAO,KAAK,CAAC;IAC9D,IAAI,MAAM,IAAI,KAAK,EAAE,CAAC;QACrB,MAAM,IAAI,~~GAAI~~,~~KAAa~~,CAAC,IAAI,CAAC;~~QACjC~~,~~IAAI~~,IAAI,KAAK,UAAU;~~YAAE~~,~~OAAO,~~IAAI,~~CAAC~~;~~QACrC~~,~~IAAI~~,~~IAAI~~,KAAK,~~IAAI~~;~~YAAE~~,OAAO,IAAI,CAAC;~~QAC/B~~,IAAI,~~OAAO~~,IAAI,KAAK,~~UAAU~~,~~IAAI~~,~~IAAI,~~CAAC,WAAW,KAAK,MAAM;~~YAAE~~,OAAO,IAAI,CAAC;~~IAC5E~~,CAAC;IACD,OAAO,KAAK,CAAC;AACd,CAAC;AAED,SAAS,0BAA0B,CAAC,QAAmB;IACtD,MAAM,QAAQ,GAAG,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAC5C,OAAO,QAAQ,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;QACjC,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,KAAK,IAAI,IAAI,MAAM,IAAI,KAAK,EAAE,CAAC;YACpE,IAAK,KAAa,CAAC,IAAI,KAAK,QAAQ,EAAE,CAAC;gBACtC,OAAO,0BAA0B,CAAE,KAAa,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;YAClE,CAAC;QACF,CAAC;QACD,OAAO,CAAC,KAAK,CAAC,CAAC;IAChB,CAAC,CAAC,CAAC;AACJ,CAAC"}
1	+ {"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/emojiPicker/EmojiPicker.d.ts CHANGED Viewed

@@ -14,8 +14,9 @@ export type SkinTone = ReturnType<typeof useSkinTone>[0];
 export declare const EmojiPickerSkinToneSelector: (props: BoxProps) => import("react/jsx-runtime").JSX.Element;
 export interface EmojiPickerProps extends Omit<EmojiPickerRootProps, 'emoji' | 'onEmojiSelect'> {
     onValueChange: (value: string, label: string) => void;
+    onClear?: () => void;
 }
-export declare const EmojiPicker: (({ onValueChange, ...props }: EmojiPickerProps) => import("react/jsx-runtime").JSX.Element) & {
+export declare const EmojiPicker: (({ onValueChange, onClear, ...props }: EmojiPickerProps) => import("react/jsx-runtime").JSX.Element) & {
     Root: import("react").FunctionComponent<Omit<EmojiPickerRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
     Search: import("react").FunctionComponent<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
     Viewport: ({ className, ...props }: EmojiPickerViewportProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/emojiPicker/EmojiPicker.js CHANGED Viewed

@@ -17,10 +17,11 @@ import { withClassName, withProps } from '../../hooks.js';
 import { useLocalStorage } from '../../hooks/useStorage.js';
 import { Box } from '../box/Box.js';
 import { Button } from '../button/Button.js';
+import { Icon } from '../icon/Icon.js';
 import { inputClassName } from '../input/Input.js';
 import { Spinner } from '../spinner/Spinner.js';
 export const EmojiPickerRoot = withClassName(Core.Root, 'layer-components:isolate layer-components:flex layer-components:flex-col layer-components:w-fit layer-components:h-368px layer-components:gap-sm');
-export const EmojiPickerSearch = withClassName(Core.Search, 'layer-components:z-10', inputClassName);
+export const EmojiPickerSearch = withClassName(Core.Search, 'layer-components:z-10 layer-components:min-w-80px', inputClassName);
 export const EmojiPickerViewport = (_a) => {
     var { className } = _a, props = __rest(_a, ["className"]);
     return (_jsx(Box, { className: "flex-1 min-h-0 overflow-hidden rounded-md bg-white", children: _jsx(Core.Viewport, Object.assign({ className: "layer-components:relative layer-components:outline-hidden" }, props)) }));
@@ -50,9 +51,9 @@ export const EmojiPickerSkinToneSelector = (props) => {
     return (_jsx(Box, Object.assign({ d: "row", gap: true }, props, { children: options.map((option) => (_jsx(Button, { emphasis: "ghost", toggled: option.skinTone === skinTone, toggleMode: "color", size: "small", "aria-label": `Skin tone ${option}`, className: "text-md p-xs", onClick: () => setSkinTone(option.skinTone), children: _jsx(Button.Icon, { children: option.emoji }) }, option.skinTone))) })));
 };
 const EmojiPickerPrefab = (_a) => {
-    var { onValueChange } = _a, props = __rest(_a, ["onValueChange"]);
+    var { onValueChange, onClear } = _a, props = __rest(_a, ["onValueChange", "onClear"]);
     const [skinTone] = useEmojiSkinTone();
-    return (_jsxs(EmojiPickerRoot, Object.assign({}, props, { onEmojiSelect: (emoji) => onValueChange(emoji.emoji, emoji.label), skinTone: skinTone, children: [_jsx(EmojiPickerSearch, {}), _jsxs(EmojiPickerViewport, { children: [_jsx(EmojiPickerList, {}), _jsx(EmojiPickerLoading, {}), _jsx(EmojiPickerEmpty, {})] }), _jsx(EmojiPickerSkinToneSelector, { className: "mr-auto" })] })));
+    return (_jsxs(EmojiPickerRoot, Object.assign({}, props, { onEmojiSelect: (emoji) => onValueChange(emoji.emoji, emoji.label), skinTone: skinTone, children: [_jsxs(Box, { col: true, gap: true, items: "start", full: "width", children: [_jsx(EmojiPickerSearch, {}), onClear && (_jsxs(Button, { emphasis: "ghost", size: "small", onClick: () => onClear(), children: [_jsx(Icon, { name: "x" }), "Clear selection"] }))] }), _jsxs(EmojiPickerViewport, { children: [_jsx(EmojiPickerList, {}), _jsx(EmojiPickerLoading, {}), _jsx(EmojiPickerEmpty, {})] }), _jsx(EmojiPickerSkinToneSelector, { className: "mr-auto" })] })));
 };
 export const EmojiPicker = Object.assign(EmojiPickerPrefab, {
     Root: EmojiPickerRoot,

package/dist/esm/components/emojiPicker/EmojiPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmojiPicker.js","sourceRoot":"","sources":["../../../../src/components/emojiPicker/EmojiPicker.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EACN,WAAW,IAAI,IAAI,EAMnB,WAAW,GACX,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,EAAE,GAAG,EAAY,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAEhD,MAAM,CAAC,MAAM,eAAe,GAAG,aAAa,CAC3C,IAAI,CAAC,IAAI,EACT,+DAA+D,CAC/D,CAAC;AACF,MAAM,CAAC,MAAM,iBAAiB,GAAG,aAAa,CAC7C,IAAI,CAAC,MAAM,EACX,~~yBAAyB~~,~~EACzB~~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~~AAMF~~,MAAM,iBAAiB,GAAG,CAAC,~~EAA6C~~,EAAE,EAAE;~~QAAjD~~,~~EAAE~~,aAAa,~~OAA8B~~,~~EAAzB~~,KAAK,~~cAAzB~~,~~iBAA2B~~,~~CAAF~~;~~IACnD~~,MAAM,CAAC,QAAQ,CAAC,GAAG,gBAAgB,EAAE,CAAC;IACtC,OAAO,CACN,MAAC,eAAe,oBACX,KAAK,IACT,aAAa,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,EACjE,QAAQ,EAAE,QAAQ,aAElB,KAAC,iBAAiB,KAAG,~~EACrB~~,MAAC,mBAAmB,eACnB,KAAC,eAAe,KAAG,EACnB,KAAC,kBAAkB,KAAG,EACtB,KAAC,gBAAgB,KAAG,IACC,EACtB,KAAC,2BAA2B,IAAC,SAAS,EAAC,SAAS,GAAG,KAClC,CAClB,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAAC,iBAAiB,EAAE;IAC3D,IAAI,EAAE,eAAe;IACrB,MAAM,EAAE,iBAAiB;IACzB,QAAQ,EAAE,mBAAmB;IAC7B,IAAI,EAAE,eAAe;IACrB,OAAO,EAAE,kBAAkB;IAC3B,KAAK,EAAE,gBAAgB;IACvB,cAAc,EAAE,yBAAyB;IACzC,GAAG,EAAE,cAAc;IACnB,KAAK,EAAE,gBAAgB;CACvB,CAAC,CAAC"}
1	+ {"version":3,"file":"EmojiPicker.js","sourceRoot":"","sources":["../../../../src/components/emojiPicker/EmojiPicker.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/emojiPicker/EmojiPicker.stories.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import type { StoryObj } from '@storybook/react';
 import { EmojiPicker } from './EmojiPicker.js';
 declare const meta: {
     title: string;
-    component: (({ onValueChange, ...props }: import("./EmojiPicker.js").EmojiPickerProps) => import("react/jsx-runtime").JSX.Element) & {
+    component: (({ onValueChange, onClear, ...props }: import("./EmojiPicker.js").EmojiPickerProps) => import("react/jsx-runtime").JSX.Element) & {
         Root: import("react").FunctionComponent<Omit<import("frimousse").EmojiPickerRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
         Search: import("react").FunctionComponent<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
         Viewport: ({ className, ...props }: import("frimousse").EmojiPickerViewportProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/forms/EmojiField.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+import { ButtonProps } from '../button/Button.js';
+export interface EmojiFieldProps extends ButtonProps {
+    name: string;
+    label?: string;
+    required?: string;
+}
+export declare function EmojiField({ name, label, className, required, id: providedId, ...rest }: EmojiFieldProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/forms/EmojiField.js ADDED Viewed

@@ -0,0 +1,35 @@
+// @unocss-include
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from 'clsx';
+import { useField } from 'formik';
+import { useIdOrGenerated } from '../../hooks/useIdOrGenerated.js';
+import { Box } from '../box/Box.js';
+import { Button } from '../button/Button.js';
+import { EmojiPicker } from '../emojiPicker/EmojiPicker.js';
+import { Icon } from '../icon/Icon.js';
+import { Popover } from '../popover/Popover.js';
+import { HorizontalFieldLabel } from './FieldLabel.js';
+export function EmojiField(_a) {
+    var { name, label, className, required, id: providedId } = _a, rest = __rest(_a, ["name", "label", "className", "required", "id"]);
+    const [props, _, tools] = useField({ name });
+    const id = useIdOrGenerated(providedId);
+    return (_jsxs(Box, { gap: "sm", className: className, children: [_jsxs(Popover, { children: [_jsx(Popover.Trigger, { asChild: true, children: _jsx(Button, Object.assign({ id: id, "aria-label": "Select emoji", size: "small", className: clsx('p-0 transition-color', className) }, rest, { children: _jsx(Button.Icon, { className: "text-[19px] w-touch h-touch flex items-center justify-center", children: props.value || _jsx(Icon, { name: "smile" }) }) })) }), _jsx(Popover.Content, { children: _jsx(EmojiPicker, { onValueChange: (v) => {
+                                tools.setValue(v);
+                            }, onClear: required
+                                ? undefined
+                                : () => {
+                                    tools.setValue('');
+                                }, id: id }) })] }), label && (_jsx(HorizontalFieldLabel, { htmlFor: id, children: label }))] }));
+}
+//# sourceMappingURL=EmojiField.js.map

package/dist/esm/components/forms/EmojiField.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"EmojiField.js","sourceRoot":"","sources":["../../../../src/components/forms/EmojiField.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAClC,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AACnE,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACpC,OAAO,EAAE,MAAM,EAAe,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAQvD,MAAM,UAAU,UAAU,CAAC,EAOT;QAPS,EAC1B,IAAI,EACJ,KAAK,EACL,SAAS,EACT,QAAQ,EACR,EAAE,EAAE,UAAU,OAEG,EADd,IAAI,cANmB,gDAO1B,CADO;IAEP,MAAM,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,CAAC,GAAG,QAAQ,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;IAC7C,MAAM,EAAE,GAAG,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,OAAO,CACN,MAAC,GAAG,IAAC,GAAG,EAAC,IAAI,EAAC,SAAS,EAAE,SAAS,aACjC,MAAC,OAAO,eACP,KAAC,OAAO,CAAC,OAAO,IAAC,OAAO,kBACvB,KAAC,MAAM,kBACN,EAAE,EAAE,EAAE,gBACK,cAAc,EACzB,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,IAAI,CAAC,sBAAsB,EAAE,SAAS,CAAC,IAC9C,IAAI,cAER,KAAC,MAAM,CAAC,IAAI,IAAC,SAAS,EAAC,8DAA8D,YACnF,KAAK,CAAC,KAAK,IAAI,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACxB,IACN,GACQ,EAClB,KAAC,OAAO,CAAC,OAAO,cACf,KAAC,WAAW,IACX,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE;gCACpB,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;4BACnB,CAAC,EACD,OAAO,EACN,QAAQ;gCACP,CAAC,CAAC,SAAS;gCACX,CAAC,CAAC,GAAG,EAAE;oCACL,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;gCACnB,CAAC,EAEL,EAAE,EAAE,EAAE,GACL,GACe,IACT,EACT,KAAK,IAAI,CACT,KAAC,oBAAoB,IAAC,OAAO,EAAE,EAAE,YAAG,KAAK,GAAwB,CACjE,IACI,CACN,CAAC;AACH,CAAC"}

package/dist/esm/components/forms/FormikForm.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
 import { FormikConfig, FormikValues } from 'formik';
 import { CheckboxField } from './CheckboxField.js';
+import { EmojiField } from './EmojiField.js';
 import { NumberStepperField } from './NumberStepperField.js';
 import { SubmitButton } from './SubmitButton.js';
 import { SwitchField } from './SwitchField.js';
@@ -21,4 +22,5 @@ export declare const FormikForm: typeof FormikFormRoot & {
     ToggleGroupField: (({ name, label, required, className, id, ...props }: import("./ToggleGroupField.js").ToggleGroupFieldProps) => import("react/jsx-runtime").JSX.Element) & {
         Item: import("react").FunctionComponent<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>>;
     };
+    EmojiField: typeof EmojiField;
 };

package/dist/esm/components/forms/FormikForm.js CHANGED Viewed

@@ -14,6 +14,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Formik } from 'formik';
 import { useCallback } from 'react';
 import { CheckboxField } from './CheckboxField.js';
+import { EmojiField } from './EmojiField.js';
 import { Form } from './Form.js';
 import { NumberStepperField } from './NumberStepperField.js';
 import { SubmitButton } from './SubmitButton.js';
@@ -45,5 +46,6 @@ export const FormikForm = Object.assign(FormikFormRoot, {
     CheckboxField,
     SwitchField,
     ToggleGroupField,
+    EmojiField,
 });
 //# sourceMappingURL=FormikForm.js.map

package/dist/esm/components/forms/FormikForm.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormikForm.js","sourceRoot":"","sources":["../../../../src/components/forms/FormikForm.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,EAA6C,MAAM,QAAQ,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAOzD,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAEpC,MAAM,UAAU,cAAc,CAA8B,EAKlC;QALkC,EAC3D,SAAS,EACT,QAAQ,EACR,QAAQ,OAEiB,EADtB,KAAK,cAJmD,qCAK3D,CADQ;IAER,MAAM,eAAe,GAAG,WAAW,CAClC,KAAK,EAAE,MAAc,EAAE,GAA0B,EAAE,EAAE;QACpD,IAAI,CAAC;YACJ,GAAG,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YACxB,OAAO,MAAM,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,MAAM,EAAE,GAAG,CAAC,CAAA,CAAC;QACtC,CAAC;gBAAS,CAAC;YACV,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC;IACF,CAAC,EACD,CAAC,QAAQ,CAAC,CACV,CAAC;IAEF,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE,CAAC;QACpC,OAAO,CACN,KAAC,MAAM,kBAAS,QAAQ,EAAE,eAAe,IAAM,KAAK,cAClD,CAAC,MAAM,EAAE,EAAE,CAAC,KAAC,IAAI,IAAC,SAAS,EAAE,SAAS,YAAG,QAAQ,CAAC,MAAM,CAAC,GAAQ,IAC1D,CACT,CAAC;IACH,CAAC;IAED,OAAO,CACN,KAAC,MAAM,kBAAS,QAAQ,EAAE,eAAe,IAAM,KAAK,cACnD,KAAC,IAAI,IAAC,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAQ,IACrC,CACT,CAAC;AACH,CAAC;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,cAAc,EAAE;IACvD,SAAS;IACT,aAAa;IACb,kBAAkB;IAClB,YAAY;IACZ,aAAa;IACb,WAAW;IACX,gBAAgB;~~CAChB~~,CAAC,CAAC"}
1	+ {"version":3,"file":"FormikForm.js","sourceRoot":"","sources":["../../../../src/components/forms/FormikForm.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,EAA6C,MAAM,QAAQ,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACpC,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAOzD,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAEpC,MAAM,UAAU,cAAc,CAA8B,EAKlC;QALkC,EAC3D,SAAS,EACT,QAAQ,EACR,QAAQ,OAEiB,EADtB,KAAK,cAJmD,qCAK3D,CADQ;IAER,MAAM,eAAe,GAAG,WAAW,CAClC,KAAK,EAAE,MAAc,EAAE,GAA0B,EAAE,EAAE;QACpD,IAAI,CAAC;YACJ,GAAG,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YACxB,OAAO,MAAM,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,MAAM,EAAE,GAAG,CAAC,CAAA,CAAC;QACtC,CAAC;gBAAS,CAAC;YACV,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC;IACF,CAAC,EACD,CAAC,QAAQ,CAAC,CACV,CAAC;IAEF,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE,CAAC;QACpC,OAAO,CACN,KAAC,MAAM,kBAAS,QAAQ,EAAE,eAAe,IAAM,KAAK,cAClD,CAAC,MAAM,EAAE,EAAE,CAAC,KAAC,IAAI,IAAC,SAAS,EAAE,SAAS,YAAG,QAAQ,CAAC,MAAM,CAAC,GAAQ,IAC1D,CACT,CAAC;IACH,CAAC;IAED,OAAO,CACN,KAAC,MAAM,kBAAS,QAAQ,EAAE,eAAe,IAAM,KAAK,cACnD,KAAC,IAAI,IAAC,SAAS,EAAE,SAAS,YAAG,QAAQ,GAAQ,IACrC,CACT,CAAC;AACH,CAAC;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,cAAc,EAAE;IACvD,SAAS;IACT,aAAa;IACb,kBAAkB;IAClB,YAAY;IACZ,aAAa;IACb,WAAW;IACX,gBAAgB;IAChB,UAAU;CACV,CAAC,CAAC"}

package/dist/esm/components/forms/FormikForm.stories.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
 import type { StoryObj } from '@storybook/react';
 import { CheckboxField } from './CheckboxField.js';
+import { EmojiField } from './EmojiField.js';
 import { FormikForm } from './FormikForm.js';
 import { NumberStepperField } from './NumberStepperField.js';
 import { SubmitButton } from './SubmitButton.js';
@@ -18,6 +19,7 @@ declare const meta: {
         ToggleGroupField: (({ name, label, required, className, id, ...props }: import("./ToggleGroupField.js").ToggleGroupFieldProps) => import("react/jsx-runtime").JSX.Element) & {
             Item: import("react").FunctionComponent<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>>;
         };
+        EmojiField: typeof EmojiField;
     };
     argTypes: {};
     parameters: {

package/dist/esm/components/forms/FormikForm.stories.js CHANGED Viewed

@@ -12,6 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { CheckboxField } from './CheckboxField.js';
+import { EmojiField } from './EmojiField.js';
 import { FormikForm } from './FormikForm.js';
 import { NumberStepperField } from './NumberStepperField.js';
 import { SubmitButton } from './SubmitButton.js';
@@ -42,7 +43,8 @@ export const Default = {
                 tos: false,
                 newsletter: false,
                 plan: 'basic',
-            } }, args, { children: [_jsx(TextField, { name: "email", type: "email", label: "Email" }), _jsx(TextField, { name: "password", type: "password", label: "Password" }), _jsx(NumberStepperField, { name: "age", label: "Age", min: 13, max: 100 }), _jsx(CheckboxField, { name: "tos", label: "I agree" }), _jsx(SwitchField, { name: "newsletter", label: "Subscribe to newsletter" }), _jsxs(ToggleGroupField, { type: "single", name: "plan", label: "Select your plan", required: true, children: [_jsx(ToggleGroupField.Item, { value: "basic", children: "Basic" }), _jsx(ToggleGroupField.Item, { value: "pro", children: "Pro" }), _jsx(ToggleGroupField.Item, { value: "enterprise", children: "Enterprise" })] }), _jsx(SubmitButton, { children: "Sign up" })] })));
+                emoji: '',
+            } }, args, { children: [_jsx(TextField, { name: "email", type: "email", label: "Email" }), _jsx(TextField, { name: "password", type: "password", label: "Password" }), _jsx(NumberStepperField, { name: "age", label: "Age", min: 13, max: 100 }), _jsx(CheckboxField, { name: "tos", label: "I agree" }), _jsx(SwitchField, { name: "newsletter", label: "Subscribe to newsletter" }), _jsxs(ToggleGroupField, { type: "single", name: "plan", label: "Select your plan", required: true, children: [_jsx(ToggleGroupField.Item, { value: "basic", children: "Basic" }), _jsx(ToggleGroupField.Item, { value: "pro", children: "Pro" }), _jsx(ToggleGroupField.Item, { value: "enterprise", children: "Enterprise" })] }), _jsx(EmojiField, { name: "emoji", label: "Favorite Emoji" }), _jsx(SubmitButton, { children: "Sign up" })] })));
     },
 };
 //# sourceMappingURL=FormikForm.stories.js.map

package/dist/esm/components/forms/FormikForm.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormikForm.stories.js","sourceRoot":"","sources":["../../../../src/components/forms/FormikForm.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,UAAU;IACrB,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CACiC,CAAC;AAEpC,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC7B,IAAI,EAAE;QACL,QAAQ,EAAE,CAAC,MAAM,EAAE,EAAE;YACpB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;QACxC,CAAC;KACD;IACD,MAAM,CAAC,EAA0B;YAA1B,EAAE,aAAa,OAAW,EAAN,IAAI,cAAxB,iBAA0B,CAAF;QAC9B,OAAO,CACN,MAAC,UAAU,kBACV,aAAa,EAAE;gBACd,KAAK,EAAE,EAAE;gBACT,QAAQ,EAAE,EAAE;gBACZ,GAAG,EAAE,EAAE;gBACP,GAAG,EAAE,KAAK;gBACV,UAAU,EAAE,KAAK;gBACjB,IAAI,EAAE,OAAO;~~aACb~~,IACG,IAAI,eAER,KAAC,SAAS,IAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,GAAG,EACrD,KAAC,SAAS,IAAC,IAAI,EAAC,UAAU,EAAC,IAAI,EAAC,UAAU,EAAC,KAAK,EAAC,UAAU,GAAG,EAC9D,KAAC,kBAAkB,IAAC,IAAI,EAAC,KAAK,EAAC,KAAK,EAAC,KAAK,EAAC,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,GAAI,EAChE,KAAC,aAAa,IAAC,IAAI,EAAC,KAAK,EAAC,KAAK,EAAC,SAAS,GAAG,EAC5C,KAAC,WAAW,IAAC,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,yBAAyB,GAAG,EACjE,MAAC,gBAAgB,IAChB,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,kBAAkB,EACxB,QAAQ,mBAER,KAAC,gBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,OAAO,sBAA8B,EAClE,KAAC,gBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,KAAK,oBAA4B,EAC9D,KAAC,gBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,YAAY,2BAEjB,IACN,EACnB,KAAC,YAAY,0BAAuB,KACxB,CACb,CAAC;IACH,CAAC;CACD,CAAC"}
1	+ {"version":3,"file":"FormikForm.stories.js","sourceRoot":"","sources":["../../../../src/components/forms/FormikForm.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,UAAU;IACrB,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CACiC,CAAC;AAEpC,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC7B,IAAI,EAAE;QACL,QAAQ,EAAE,CAAC,MAAM,EAAE,EAAE;YACpB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC;QACxC,CAAC;KACD;IACD,MAAM,CAAC,EAA0B;YAA1B,EAAE,aAAa,OAAW,EAAN,IAAI,cAAxB,iBAA0B,CAAF;QAC9B,OAAO,CACN,MAAC,UAAU,kBACV,aAAa,EAAE;gBACd,KAAK,EAAE,EAAE;gBACT,QAAQ,EAAE,EAAE;gBACZ,GAAG,EAAE,EAAE;gBACP,GAAG,EAAE,KAAK;gBACV,UAAU,EAAE,KAAK;gBACjB,IAAI,EAAE,OAAO;gBACb,KAAK,EAAE,EAAE;aACT,IACG,IAAI,eAER,KAAC,SAAS,IAAC,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,GAAG,EACrD,KAAC,SAAS,IAAC,IAAI,EAAC,UAAU,EAAC,IAAI,EAAC,UAAU,EAAC,KAAK,EAAC,UAAU,GAAG,EAC9D,KAAC,kBAAkB,IAAC,IAAI,EAAC,KAAK,EAAC,KAAK,EAAC,KAAK,EAAC,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,GAAI,EAChE,KAAC,aAAa,IAAC,IAAI,EAAC,KAAK,EAAC,KAAK,EAAC,SAAS,GAAG,EAC5C,KAAC,WAAW,IAAC,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,yBAAyB,GAAG,EACjE,MAAC,gBAAgB,IAChB,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,kBAAkB,EACxB,QAAQ,mBAER,KAAC,gBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,OAAO,sBAA8B,EAClE,KAAC,gBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,KAAK,oBAA4B,EAC9D,KAAC,gBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,YAAY,2BAEjB,IACN,EACnB,KAAC,UAAU,IAAC,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,gBAAgB,GAAG,EAClD,KAAC,YAAY,0BAAuB,KACxB,CACb,CAAC;IACH,CAAC;CACD,CAAC"}

package/dist/esm/components/slider/Slider.js CHANGED Viewed

@@ -14,10 +14,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as SliderPrimitive from '@radix-ui/react-slider';
 import clsx from 'clsx';
 import { withClassName } from '../../hooks.js';
-export const SliderRoot = withClassName(SliderPrimitive.Root, 'layer-components:relative layer-components:flex layer-components:items-center layer-components:select-none layer-components:touch-none layer-components:w-full layer-components:h-30px layer-components:translate-z-0');
-export const SliderTrack = withClassName(SliderPrimitive.Track, 'layer-components:bg-transparent layer-components:relative layer-components:grow layer-components:rounded-lg layer-components:h-9px layer-components:border layer-components:border-1 layer-components:border-solid layer-components:border-black');
-export const SliderRange = withClassName(SliderPrimitive.Range, 'layer-components:absolute layer-components:bg-main layer-components:rounded-lg layer-components:h-full');
-export const SliderThumb = withClassName(SliderPrimitive.Thumb, 'layer-components:block layer-components:cursor-pointer layer-components:w-5 layer-components:h-5 layer-components:bg-white layer-components:shadow-sm layer-components:rounded-lg layer-components:ring-2 layer-components:ring-black layer-components:touch-none layer-components:transition-all', 'layer-components:hover:shadow-md', 'layer-components:active:shadow-lg layer-components:active:ring-4 layer-components:active:ring-main-dark layer-components:active:ring-opacity-50 layer-components:active:bg-main-light', 'layer-components:focus-visible:shadow-lg layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-accent layer-components:focus-visible:ring-opacity-50 layer-components:focus-visible:outline-none layer-components:focus-visible:bg-main-light', 'layer-components:focus:outline-none', 'layer-components:disabled:opacity-50');
+export const SliderRoot = withClassName(SliderPrimitive.Root, 'layer-components:relative layer-components:flex layer-components:items-center layer-components:select-none layer-components:touch-none layer-components:w-full layer-components:h-30px layer-components:translate-z-0', 'layer-variants:[&[data-orientation=vertical]]:flex-col layer-variants:[&[data-orientation=vertical]]:h-full layer-variants:[&[data-orientation=vertical]]:w-30px');
+export const SliderTrack = withClassName(SliderPrimitive.Track, 'layer-components:bg-transparent layer-components:relative layer-components:grow layer-components:rounded-lg layer-components:h-9px layer-components:border layer-components:border-1 layer-components:border-solid layer-components:border-black layer-components:transition-colors', 'layer-variants:[&[data-orientation=vertical]]:w-9px layer-variants:[&[data-orientation=vertical]]:h-full layer-variants:[&[data-orientation=vertical]]:flex-1');
+export const SliderRange = withClassName(SliderPrimitive.Range, 'layer-components:absolute layer-components:bg-main layer-components:rounded-lg layer-components:h-full layer-components:transition-colors', 'layer-variants:[&[data-orientation=vertical]]:w-full layer-variants:[&[data-orientation=vertical]]:h-auto');
+export const SliderThumb = withClassName(SliderPrimitive.Thumb, 'layer-components:flex layer-components:items-center layer-components:justify-center layer-components:leading-none layer-components:cursor-pointer layer-components:w-5 layer-components:h-5 layer-components:bg-white layer-components:shadow-sm layer-components:rounded-lg layer-components:ring-2 layer-components:ring-black layer-components:touch-none layer-components:transition-all', 'layer-components:hover:shadow-md', 'layer-components:active:shadow-lg layer-components:active:ring-4 layer-components:active:ring-main-dark layer-components:active:ring-opacity-50 layer-components:active:bg-main-light', 'layer-components:focus-visible:shadow-lg layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-accent layer-components:focus-visible:ring-opacity-50 layer-components:focus-visible:outline-none layer-components:focus-visible:bg-main-light', 'layer-components:focus:outline-none', 'layer-components:disabled:opacity-50');
 export const Slider = Object.assign(function Slider(_a) {
     var { ref, label, color, className } = _a, props = __rest(_a, ["ref", "label", "color", "className"]);
     return (_jsxs(SliderRoot, Object.assign({ ref: ref, className: clsx(color && `palette-${color}`, className) }, props, { children: [_jsx(SliderTrack, { children: _jsx(SliderRange, { "data-color": color }) }), _jsx(SliderThumb, { "aria-label": label, "data-color": color })] })));

package/dist/esm/components/slider/Slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../../src/components/slider/Slider.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAC1D,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAG/C,MAAM,CAAC,MAAM,UAAU,GAAG,aAAa,CACtC,eAAe,CAAC,IAAI,EACpB,kGAAkG,~~CAClG~~,CAAC;AACF,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CACvC,eAAe,CAAC,KAAK,EACrB,~~4GAA4G~~,~~CAC5G~~,CAAC;AACF,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CACvC,eAAe,CAAC,KAAK,EACrB,~~uDAAuD~~,~~CACvD~~,CAAC;AACF,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CACvC,eAAe,CAAC,KAAK,EACrB,~~2HAA2H~~,~~EAC3H~~,oCAAoC,EACpC,yFAAyF,EACzF,0GAA0G,EAC1G,uCAAuC,EACvC,wCAAwC,CACxC,CAAC;AAOF,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAClC,SAAS,MAAM,CAAC,EAQf;QARe,EACf,GAAG,EACH,KAAK,EACL,KAAK,EACL,SAAS,OAIT,EAHG,KAAK,cALO,sCAMf,CADQ;IAIR,OAAO,CACN,MAAC,UAAU,kBACV,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,KAAK,IAAI,WAAW,KAAK,EAAE,EAAE,SAAS,CAAC,IACnD,KAAK,eAET,KAAC,WAAW,cACX,KAAC,WAAW,kBAAa,KAAK,GAAI,GACrB,EACd,KAAC,WAAW,kBAAa,KAAK,gBAAc,KAAK,GAAI,KACzC,CACb,CAAC;AACH,CAAC,EACD;IACC,IAAI,EAAE,UAAU;IAChB,KAAK,EAAE,WAAW;IAClB,KAAK,EAAE,WAAW;IAClB,KAAK,EAAE,WAAW;CAClB,CACD,CAAC"}
1	+ {"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../../src/components/slider/Slider.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAC1D,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAG/C,MAAM,CAAC,MAAM,UAAU,GAAG,aAAa,CACtC,eAAe,CAAC,IAAI,EACpB,kGAAkG,EAClG,wEAAwE,CACxE,CAAC;AACF,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CACvC,eAAe,CAAC,KAAK,EACrB,8HAA8H,EAC9H,qEAAqE,CACrE,CAAC;AACF,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CACvC,eAAe,CAAC,KAAK,EACrB,yEAAyE,EACzE,+DAA+D,CAC/D,CAAC;AACF,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CACvC,eAAe,CAAC,KAAK,EACrB,mKAAmK,EACnK,oCAAoC,EACpC,yFAAyF,EACzF,0GAA0G,EAC1G,uCAAuC,EACvC,wCAAwC,CACxC,CAAC;AAOF,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAClC,SAAS,MAAM,CAAC,EAQf;QARe,EACf,GAAG,EACH,KAAK,EACL,KAAK,EACL,SAAS,OAIT,EAHG,KAAK,cALO,sCAMf,CADQ;IAIR,OAAO,CACN,MAAC,UAAU,kBACV,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,KAAK,IAAI,WAAW,KAAK,EAAE,EAAE,SAAS,CAAC,IACnD,KAAK,eAET,KAAC,WAAW,cACX,KAAC,WAAW,kBAAa,KAAK,GAAI,GACrB,EACd,KAAC,WAAW,kBAAa,KAAK,gBAAc,KAAK,GAAI,KACzC,CACb,CAAC;AACH,CAAC,EACD;IACC,IAAI,EAAE,UAAU;IAChB,KAAK,EAAE,WAAW;IAClB,KAAK,EAAE,WAAW;IAClB,KAAK,EAAE,WAAW;CAClB,CACD,CAAC"}

package/dist/esm/components/slider/Slider.stories.d.ts CHANGED Viewed

@@ -20,3 +20,5 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<typeof Slider>;
 export declare const Default: Story;
+export declare const Vertical: Story;
+export declare const CustomStyles: Story;

package/dist/esm/components/slider/Slider.stories.js CHANGED Viewed

@@ -1,4 +1,7 @@
 // @unocss-include
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from 'clsx';
+import { useState } from 'react';
 import { Slider } from './Slider.js';
 const meta = {
     title: 'Components/Slider',
@@ -10,4 +13,29 @@ const meta = {
 };
 export default meta;
 export const Default = {};
+export const Vertical = {
+    args: {
+        orientation: 'vertical',
+        style: { height: '200px' },
+    },
+};
+export const CustomStyles = {
+    args: {
+        orientation: 'vertical',
+        style: { height: '200px' },
+        min: -2,
+        max: 2,
+        defaultValue: [0],
+    },
+    render: (args) => {
+        const [value, setValue] = useState([0]);
+        return (_jsxs(Slider.Root, Object.assign({ value: value, onValueChange: setValue }, args, { children: [_jsx(Slider.Track, { className: clsx({
+                        'bg-attention': value[0] === -2,
+                        'bg-attention-light': value[0] === -1,
+                        'bg-main': value[0] === 0,
+                        'bg-success-light': value[0] === 1,
+                        'bg-success': value[0] === 2,
+                    }) }), _jsx(Slider.Thumb, { className: "w-24px h-24px", children: _jsx("div", { className: "text-lg", children: ['😭', '😔', '😐', '😊', '😃'][value[0] + 2] }) })] })));
+    },
+};
 //# sourceMappingURL=Slider.stories.js.map

package/dist/esm/components/slider/Slider.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Slider.stories.js","sourceRoot":"","sources":["../../../../src/components/slider/Slider.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,MAAM;IACjB,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CAC6B,CAAC;AAEhC,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU,EAAE,CAAC"}
1	+ {"version":3,"file":"Slider.stories.js","sourceRoot":"","sources":["../../../../src/components/slider/Slider.stories.tsx"],"names":[],"mappings":";AACA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,MAAM;IACjB,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CAC6B,CAAC;AAEhC,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU,EAAE,CAAC;AAEjC,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC9B,IAAI,EAAE;QACL,WAAW,EAAE,UAAU;QACvB,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE;KAC1B;CACD,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAU;IAClC,IAAI,EAAE;QACL,WAAW,EAAE,UAAU;QACvB,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE;QAC1B,GAAG,EAAE,CAAC,CAAC;QACP,GAAG,EAAE,CAAC;QACN,YAAY,EAAE,CAAC,CAAC,CAAC;KACjB;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE;QAChB,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACxC,OAAO,CACN,MAAC,MAAM,CAAC,IAAI,kBAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,IAAM,IAAI,eAC3D,KAAC,MAAM,CAAC,KAAK,IACZ,SAAS,EAAE,IAAI,CAAC;wBACf,cAAc,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;wBAC/B,oBAAoB,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;wBACrC,SAAS,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;wBACzB,kBAAkB,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;wBAClC,YAAY,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;qBAC5B,CAAC,GACD,EACF,KAAC,MAAM,CAAC,KAAK,IAAC,SAAS,EAAC,eAAe,YACtC,cAAK,SAAS,EAAC,SAAS,YACtB,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GACxC,GACQ,KACF,CACd,CAAC;IACH,CAAC;CACD,CAAC"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@a-type/ui",
-  "version": "3.0.28",
+  "version": "3.0.30",
   "type": "module",
   "repository": {
     "url": "https://github.com/a-type/ui"

package/src/components/button/Button.tsx CHANGED Viewed

@@ -9,6 +9,7 @@ import {
 	ReactNode,
 	Ref,
 	useCallback,
+	useDebugValue,
 	useState,
 } from 'react';
 import { withClassName } from '../../hooks.js';
@@ -72,6 +73,10 @@ export function ButtonRoot({
 	const iconChildCount = childArray.filter(isIconChild).length;
 	const hasLabelChild = childArray.length > iconChildCount;
+	useDebugValue(
+		`Children introspection: Icons: ${iconChildCount}, Label: ${hasLabelChild}, Total: ${childArray.length}`,
+	);
 	const isDropdownTriggerFromContext = useIsDropdownTrigger();
 	const isDropdownTrigger =
 		!disableDropdownTriggerIcon &&
@@ -88,8 +93,8 @@ export function ButtonRoot({
 		'data-focus': visuallyFocused,
 		'data-size': size,
 		'data-loading': isLoading,
-		'data-has-label': hasLabelChild || undefined,
-		'data-has-icon': iconChildCount > 0 ? true : undefined,
+		'data-has-label': hasLabelChild,
+		'data-has-icon': iconChildCount > 0,
 		'data-icon-count': iconChildCount > 0 ? iconChildCount : undefined,
 		'data-dropdown-trigger': isDropdownTrigger ? true : undefined,
 		tabIndex: visuallyDisabled ? -1 : undefined,
@@ -155,6 +160,7 @@ export function ButtonRoot({
 		</IconLoadingProvider>
 	);
 }
+ButtonRoot.displayName = 'Button';
 export const ButtonToggleIndicator = memo(function ToggleIndicator({
 	value,
@@ -176,6 +182,7 @@ export const ButtonToggleIndicator = memo(function ToggleIndicator({
 // allows custom icons to trigger icon button behavior
 export const ButtonIcon = withClassName('div', 'icon flex-shrink-0 flex');
+ButtonIcon.displayName = 'ButtonIcon';
 export const Button = Object.assign(ButtonRoot, {
 	ToggleIndicator: ButtonToggleIndicator,
@@ -212,6 +219,7 @@ function applyPartAttributes(button: HTMLButtonElement) {
 		icon: 0,
 		label: 0,
 	};
+	const iconNodes: (HTMLElement | SVGElement)[] = [];
 	button.childNodes.forEach((child) => {
 		if (!(child instanceof HTMLElement || child instanceof SVGElement)) return;
 		if (child.style.display === 'none' || child.style.width === '0') return; // skip hidden elements
@@ -220,12 +228,15 @@ function applyPartAttributes(button: HTMLButtonElement) {
 			child.classList.contains('icon')
 		) {
 			registry.icon++;
+			iconNodes.push(child);
 		} else {
 			registry.label++;
 		}
 	});
 	if (button.textContent) {
-		registry.label++;
+		const iconText = iconNodes.map((n) => n.textContent).join('');
+		const labelText = button.textContent.replace(iconText, '').trim();
+		if (labelText.length > 0) registry.label++;
 	}
 	button.setAttribute('data-has-icon', String(registry.icon > 0));
 	button.setAttribute('data-has-label', String(registry.label > 0));
@@ -235,10 +246,19 @@ function applyPartAttributes(button: HTMLButtonElement) {
 function isIconChild(child: ReactNode): boolean {
 	if (typeof child !== 'object' || child === null) return false;
 	if ('type' in child) {
-		const type = (child as any).type;
-		if (type === ButtonIcon) return true;
-		if (type === Icon) return true;
-		if (typeof type === 'function' && type.displayName === 'Icon') return true;
+		const type = child.type;
+		if (
+			type === ButtonIcon ||
+			type === 'ButtonIcon' ||
+			(type as any).displayName === 'ButtonIcon'
+		)
+			return true;
+		if (
+			type === Icon ||
+			type === 'Icon' ||
+			(type as any).displayName === 'Icon'
+		)
+			return true;
 	}
 	return false;
 }

package/src/components/emojiPicker/EmojiPicker.tsx CHANGED Viewed

@@ -12,6 +12,7 @@ import { withClassName, withProps } from '../../hooks.js';
 import { useLocalStorage } from '../../hooks/useStorage.js';
 import { Box, BoxProps } from '../box/Box.js';
 import { Button } from '../button/Button.js';
+import { Icon } from '../icon/Icon.js';
 import { inputClassName } from '../input/Input.js';
 import { Spinner } from '../spinner/Spinner.js';
@@ -21,7 +22,7 @@ export const EmojiPickerRoot = withClassName(
 );
 export const EmojiPickerSearch = withClassName(
 	Core.Search,
-	'layer-components:(z-10)',
+	'layer-components:(z-10 min-w-80px)',
 	inputClassName,
 );
 export const EmojiPickerViewport = ({
@@ -137,8 +138,13 @@ export const EmojiPickerSkinToneSelector = (props: BoxProps) => {
 export interface EmojiPickerProps
 	extends Omit<EmojiPickerRootProps, 'emoji' | 'onEmojiSelect'> {
 	onValueChange: (value: string, label: string) => void;
+	onClear?: () => void;
 }
-const EmojiPickerPrefab = ({ onValueChange, ...props }: EmojiPickerProps) => {
+const EmojiPickerPrefab = ({
+	onValueChange,
+	onClear,
+	...props
+}: EmojiPickerProps) => {
 	const [skinTone] = useEmojiSkinTone();
 	return (
 		<EmojiPickerRoot
@@ -146,7 +152,15 @@ const EmojiPickerPrefab = ({ onValueChange, ...props }: EmojiPickerProps) => {
 			onEmojiSelect={(emoji) => onValueChange(emoji.emoji, emoji.label)}
 			skinTone={skinTone}
 		>
-			<EmojiPickerSearch />
+			<Box col gap items="start" full="width">
+				<EmojiPickerSearch />
+				{onClear && (
+					<Button emphasis="ghost" size="small" onClick={() => onClear()}>
+						<Icon name="x" />
+						Clear selection
+					</Button>
+				)}
+			</Box>
 			<EmojiPickerViewport>
 				<EmojiPickerList />
 				<EmojiPickerLoading />