@a-type/ui 5.0.22 → 6.0.1

package/dist/arbor/arbor.js

@@ -0,0 +1,291 @@
+import { css, definePreset } from '@arbor-css/core';
+import { compileSingleColor, presetArbor, } from '@arbor-css/core/preset-arbor';
+import { $userColorHue, $userColorSaturation } from './props.js';
+const defaultColors = {
+    ranges: {
+        lemon: {
+            hue: 86,
+        },
+        leek: {
+            hue: 165.88,
+        },
+        tomato: {
+            hue: 10.51,
+        },
+        blueberry: {
+            hue: 248.14,
+        },
+        eggplant: {
+            hue: 280.21,
+        },
+        attention: {
+            hue: 30,
+        },
+        success: {
+            hue: 140,
+        },
+        user: {
+            hue: 0,
+        },
+    },
+    mainColor: 'lemon',
+};
+export function presetAtype(config) {
+    var _a, _b, _c;
+    const base = presetArbor(Object.assign(Object.assign({}, config), { color: Object.assign(Object.assign({ globalSaturation: 0.5 }, config === null || config === void 0 ? void 0 : config.color), { ranges: Object.assign(Object.assign({}, defaultColors.ranges), (_a = config === null || config === void 0 ? void 0 : config.color) === null || _a === void 0 ? void 0 : _a.ranges), mainColor: (config === null || config === void 0 ? void 0 : config.mainColor) ||
+                ((_b = config === null || config === void 0 ? void 0 : config.color) === null || _b === void 0 ? void 0 : _b.mainColor) ||
+                defaultColors.mainColor }), typography: Object.assign({ defaultFontSize: '16px', minFontSize: '12px', minWeight: 200, maxWeight: 600, weightStep: 100, baseWeight: 400, lineHeightStep: 0.125, minLineHeight: 1 }, config === null || config === void 0 ? void 0 : config.typography), spacing: Object.assign({ baseSize: '8px' }, config === null || config === void 0 ? void 0 : config.spacing), shape: Object.assign({ roundness: 1 }, config === null || config === void 0 ? void 0 : config.shape), shadow: Object.assign({ defaultColor: 'rgba(0, 0, 0, 0.05)' }, config === null || config === void 0 ? void 0 : config.shadow) }));
+    const preset = definePreset({
+        name: 'a-type',
+        extends: [base],
+        baseMode: ($) => ({
+            color: {
+                accent: $.mode.color.palette.leek,
+            },
+            action: {
+                roundness: (config === null || config === void 0 ? void 0 : config.roundActions) === false ? undefined : 99,
+                light: {
+                    bg: $.mode.color.main.light,
+                    fg: $.mode.global.trueHeavyColor,
+                    border: css `
+						${$.mode.action.light.borderWidth} ${$.mode.action.light
+                        .borderStyle} ${$.mode.action.light.borderColor}
+					`,
+                    borderColor: $.mixins.fg.ref,
+                    borderStyle: 'solid',
+                    borderWidth: '1px',
+                },
+                primary: {
+                    borderColor: $.mixins.fg.ref,
+                },
+                secondary: {
+                    borderColor: $.mixins.fg.ref,
+                },
+            },
+            control: {
+                roundness: (config === null || config === void 0 ? void 0 : config.roundControls) ? 1.5 : undefined,
+                padding: {
+                    block: $.mode.spacing.sm,
+                },
+            },
+            surface: {
+                roundness: 1,
+            },
+            user: {
+                hue: 0,
+                saturation: 1,
+            },
+            primitive: {
+                color: {
+                    user: compileSingleColor({
+                        hue: $.mode.user.hue,
+                        saturation: $.mode.user.saturation,
+                    }, $.mode.global),
+                },
+            },
+        }),
+        modeSchema: {
+            color: {
+                accent: base.modeSchema.color.main,
+            },
+            user: {
+                hue: {
+                    purpose: 'other',
+                    description: 'A user-input hue value',
+                },
+                saturation: {
+                    purpose: 'scalar',
+                    description: 'A user-input saturation value between 0 and 1',
+                },
+            },
+            action: {
+                light: base.modeSchema.action.primary,
+            },
+        },
+        mixins: (create, $) => {
+            return {
+                actionLight: create('action-light', {
+                    definition: (css) => css `
+						${base.mixins.bg.apply({ '--color': $.mode.action.light.bg })}
+						${base.mixins.fg.apply({ '--color': $.mode.action.light.fg })}
+						${base.mixins.borderColor.apply({
+                        '--color': $.mode.action.light.borderColor,
+                    })}
+						border-width: ${$.mode.action.light.borderWidth};
+						border-style: ${$.mode.action.light.borderStyle};
+						border-radius: ${$.mode.action.radius};
+						padding: ${$.mode.action.padding.$root};
+					`,
+                }),
+                hover: create('hover', {
+                    definition: (css) => css `
+						&:hover {
+							${base.mixins.bgHeavier.apply({ '--step': 1 })}
+							${base.mixins.ring.apply({
+                        '--ring': base.functions.ring.compute({
+                            '--color': $.mixins.bg.ref,
+                            '--size': '4px',
+                        }),
+                    })}
+
+							&[data-emphasis="primary"] {
+								${base.mixins.bgLighter.apply({ '--step': 1 })}
+							}
+						}
+					`,
+                }),
+                focus: create('focus', {
+                    definition: (css) => css `
+						&:focus {
+							outline: none;
+						}
+						&:focus-visible,
+						&[data-focus-visible='true'] {
+							${base.mixins.bgLighter.apply({ '--step': 1 })}
+							${base.mixins.ring.apply({
+                        '--ring': base.functions.ring.compute({
+                            '--color': $.mode.color.main.heavy,
+                            '--size': '2px',
+                        }),
+                    })}
+
+							&[data-emphasis="primary"] {
+								${base.mixins.bgLighter.apply({ '--step': 2 })}
+							}
+						}
+					`,
+                }),
+                active: create('active', {
+                    definition: (css) => css `
+						&:active {
+							${base.mixins.bgHeavier.apply({ '--step': 2 })}
+
+							&[data-emphasis="primary"] {
+								${base.mixins.bgLighter.apply({ '--step': 2 })}
+							}
+						}
+					`,
+                }),
+                disabled: create('disabled', {
+                    definition: (css) => css `
+						&&:disabled,
+						&&[data-disabled='true'] {
+							cursor: default;
+							box-shadow: none;
+							${base.mixins.bgDesaturated.apply({ '--step': 8 })}
+							${base.mixins.fgFaded.apply({
+                        '--opacity': 0.65,
+                        '--source': $.mode.color.neutral.ink,
+                    })}
+						}
+					`,
+                }),
+            };
+        },
+        functions: (create, $) => ({
+            focusRing: create('focus-ring', {
+                parameters: [
+                    {
+                        name: '--width',
+                        fallback: '2px',
+                    },
+                ],
+                definition: (css, width) => css `0 0 0 ${width} ${$.mode.color.main.heavy}`,
+            }),
+        }),
+    });
+    preset.bundleMode('accent', {
+        color: {
+            main: preset.$.mode.color.accent,
+        },
+    });
+    preset.bundleMode('success', {
+        color: {
+            main: preset.$.mode.color.palette.success,
+        },
+    });
+    preset.bundleMode('attention', {
+        color: {
+            main: preset.$.mode.color.palette.attention,
+        },
+    });
+    preset.bundleMode('neutral', {
+        color: {
+            main: preset.$.mode.color.neutral,
+        },
+    });
+    preset.bundleMode('user', {
+        user: {
+            hue: `var(${$userColorHue}, 200)`,
+            saturation: `var(${$userColorSaturation}, 1)`,
+        },
+        color: {
+            main: preset.$.mode.color.palette.user,
+        },
+    });
+    const allColorNames = new Set([
+        ...Object.keys(defaultColors.ranges),
+        ...(((_c = config === null || config === void 0 ? void 0 : config.color) === null || _c === void 0 ? void 0 : _c.ranges)
+            ? Object.keys(config.color.ranges)
+            : []),
+    ]);
+    for (const colorName of allColorNames) {
+        preset.bundleMode(colorName, {
+            color: {
+                main: preset.$.mode.color.palette[colorName],
+                // avoid assigning leek to both main and accent
+                accent: colorName === 'leek' ? preset.$.mode.color.palette.lemon : undefined,
+            },
+        });
+    }
+    // density and size
+    preset.bundleMode('dense', {
+        global: {
+            spacing: {
+                density: 1.25,
+            },
+            typography: {
+                size: 0.825,
+            },
+        },
+    });
+    preset.bundleMode('denser', {
+        global: {
+            spacing: {
+                density: 1.5,
+            },
+            typography: {
+                minFontSize: '10px',
+                size: 0.75,
+            },
+        },
+    });
+    preset.bundleMode('density-reset', {
+        global: {
+            spacing: {
+                density: 1,
+            },
+        },
+    });
+    preset.bundleMode('heading', {
+        global: {
+            typography: {
+                size: 1.5,
+            },
+        },
+    });
+    preset.bundleMode('hero', {
+        global: {
+            typography: {
+                size: 3,
+                fontSizeScaleBase: 1.5,
+            },
+            spacing: {
+                density: 0.5,
+            },
+        },
+    });
+    return preset;
+}
+export default presetAtype;
+//# sourceMappingURL=arbor.js.map

package/dist/arbor/arbor.js.map

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

package/dist/arbor/props.d.ts

@@ -0,0 +1,2 @@
+export declare const $userColorHue = "--\uD83D\uDD8C\uFE0F-hue";
+export declare const $userColorSaturation = "--\uD83D\uDD8C\uFE0F-saturation";

package/dist/arbor/props.js

@@ -0,0 +1,3 @@
+export const $userColorHue = '--🖌️-hue';
+export const $userColorSaturation = '--🖌️-saturation';
+//# sourceMappingURL=props.js.map

package/dist/arbor/props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.js","sourceRoot":"","sources":["../../src/arbor/props.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,aAAa,GAAG,WAAW,CAAC;AACzC,MAAM,CAAC,MAAM,oBAAoB,GAAG,kBAAkB,CAAC"}

package/dist/behaviors/iconOnly.d.ts

@@ -0,0 +1,50 @@
+/**
+ * Encapsulates tools for achieving an "icon only" automatic behavior for controls and other
+ * components which support icons alongside text.
+ *
+ * Often in designs, we want to modify the padding or shape of a component when it is only
+ * housing a single icon.
+ *
+ * We also want to audit the labeling of icon-only elements when used by developers to ensure
+ * they are providing an accessible aria-label for screen readers.
+ */
+import { UseRenderComponentProps } from '@base-ui/react';
+import { ReactNode } from 'react';
+/**
+ * Assigns data attributes to an element outside React's render flow
+ * based on whether we detect icon or label content within the element.
+ * This hook does NOT re-render your component when it updates detected
+ * content - use CSS selectors on the data attributes to apply styling
+ * customizations instead.
+ *
+ * Attributes applied:
+ * - `data-icon-only`: "true" if at least one child element is detected as an icon and no text content is detected, otherwise "false"
+ * - `data-has-icon`: "true" if at least one child element is detected as an icon, otherwise "false"
+ * - `data-has-label`: "true" if any text content is detected, otherwise "false"
+ * - `data-icon-count`: the number of child elements detected as icons
+ *
+ */
+export declare function useIconOnlyDataAttributes(
+/**
+ * Pass the component's children to preload icon attributes before initial render, too.
+ * This is not as foolproof as the post-render DOM inspection but is important for avoiding
+ * flashes of inconsistency in the majority of use cases.
+ */
+children: ReactNode | undefined): {
+    ref: React.Ref<HTMLElement>;
+    props: any;
+    info: {
+        hasIconOnly: boolean;
+        hasIcon: boolean;
+        hasLabel: boolean;
+        iconCount: number;
+    };
+};
+export interface IconWrapperProps extends UseRenderComponentProps<'div'> {
+}
+/**
+ * A reusable sub-component which tags arbitrary content as an "icon" for the purposes of `useIconOnlyDataAttributes`.
+ * Attach it to your main component's sub-component set so that users can supply custom content which
+ * behaves as an icon and triggers the appropriate "icon only" styles when necessary.
+ */
+export declare const IconWrapper: import("react").ForwardRefExoticComponent<Omit<IconWrapperProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/behaviors/iconOnly.js

@@ -0,0 +1,179 @@
+/**
+ * Encapsulates tools for achieving an "icon only" automatic behavior for controls and other
+ * components which support icons alongside text.
+ *
+ * Often in designs, we want to modify the padding or shape of a component when it is only
+ * housing a single icon.
+ *
+ * We also want to audit the labeling of icon-only elements when used by developers to ensure
+ * they are providing an accessible aria-label for screen readers.
+ */
+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 { useRender } from '@base-ui/react';
+import { clsx } from 'clsx';
+import { Children, forwardRef, Fragment, useCallback, useLayoutEffect, useRef, } from 'react';
+import { Icon } from '../components/icon/Icon.js';
+import useMergedRef from '../hooks/useMergedRef.js';
+import cls from './iconOnly.module.css';
+/**
+ * Assigns data attributes to an element outside React's render flow
+ * based on whether we detect icon or label content within the element.
+ * This hook does NOT re-render your component when it updates detected
+ * content - use CSS selectors on the data attributes to apply styling
+ * customizations instead.
+ *
+ * Attributes applied:
+ * - `data-icon-only`: "true" if at least one child element is detected as an icon and no text content is detected, otherwise "false"
+ * - `data-has-icon`: "true" if at least one child element is detected as an icon, otherwise "false"
+ * - `data-has-label`: "true" if any text content is detected, otherwise "false"
+ * - `data-icon-count`: the number of child elements detected as icons
+ *
+ */
+export function useIconOnlyDataAttributes(
+/**
+ * Pass the component's children to preload icon attributes before initial render, too.
+ * This is not as foolproof as the post-render DOM inspection but is important for avoiding
+ * flashes of inconsistency in the majority of use cases.
+ */
+children) {
+    const nodeRef = useRef(null);
+    const ref = useCallback((node) => {
+        if (node) {
+            applyPartAttributesAndAuditLabelUsage(node);
+        }
+    }, []);
+    useLayoutEffect(() => {
+        const node = nodeRef.current;
+        if (node) {
+            const mutationObserver = new MutationObserver((entries) => {
+                applyPartAttributesAndAuditLabelUsage(entries[0].target);
+            });
+            mutationObserver.observe(node, { childList: true, subtree: true });
+            return () => mutationObserver.disconnect();
+        }
+    }, []);
+    const preloadedDataAttributes = getPreloadedIconOnlyDataAttributes(children);
+    const finalRef = useMergedRef(nodeRef, ref);
+    return {
+        ref: finalRef,
+        props: preloadedDataAttributes,
+        info: {
+            hasIconOnly: preloadedDataAttributes['data-icon-only'] === 'true',
+            hasIcon: preloadedDataAttributes['data-has-icon'] === 'true',
+            hasLabel: preloadedDataAttributes['data-has-label'] === 'true',
+            iconCount: Number(preloadedDataAttributes['data-icon-count']),
+        },
+    };
+}
+function applyPartAttributesAndAuditLabelUsage(rootElement) {
+    // each child node that's not an icon counts as a label
+    const registry = {
+        icon: 0,
+        label: 0,
+    };
+    rootElement.childNodes.forEach((child) => {
+        if (!(child instanceof HTMLElement || child instanceof SVGElement)) {
+            return;
+        }
+        if (child.style.display === 'none' || child.style.width === '0') {
+            // skip hidden elements
+            return;
+        }
+        if (child instanceof HTMLElement || child instanceof SVGElement) {
+            // best effort heuristic to detect icons we use:
+            // - our Flow Icon and the IconWrapper component below both data-icon=true, most reliable
+            // - AntD's Icon component has a class of "anticon" (potentially breakable)
+            // - General heuristic "icon" class
+            if (child.dataset.icon === 'true' ||
+                child.classList.contains('anticon') ||
+                child.classList.contains('icon')) {
+                registry.icon++;
+            }
+        }
+    });
+    if (rootElement.textContent) {
+        registry.label++;
+    }
+    rootElement.setAttribute('data-has-icon', String(registry.icon > 0));
+    rootElement.setAttribute('data-has-label', String(registry.label > 0));
+    rootElement.setAttribute('data-icon-count', String(registry.icon));
+    rootElement.setAttribute('data-icon-only', String(registry.icon > 0 && registry.label === 0));
+    // audit usage of icon-only and log a warning if aria-label is not provided
+    const hasAccessibleLabel = rootElement.getAttribute('aria-label') ||
+        rootElement.getAttribute('aria-labelledby');
+    if (registry.icon > 0 && registry.label === 0 && !hasAccessibleLabel) {
+        console.warn('An element with icon-only content is missing an aria-label for screen readers. Please add an aria-label to this element to ensure it is accessible.', rootElement);
+    }
+}
+/**
+ * Does a best-effort attempt to determine icon-only status of a component by inspecting
+ * React children. This is less robust than the post-render inspection of the DOM done later,
+ * but can help avoid flashes of inconsistent styling in nearly all cases.
+ */
+function getPreloadedIconOnlyDataAttributes(children) {
+    const childrenUnwrapped = unwrapChildFragments(children);
+    const icons = childrenUnwrapped.filter(isIconReactChild);
+    const hasIcon = icons.length > 0;
+    // assume non-icons are labels - we don't need a label count, so there's not much point in
+    // trying to be clever here anyways.
+    const hasLabel = childrenUnwrapped.length > icons.length;
+    return {
+        'data-has-icon': String(hasIcon),
+        'data-has-label': String(hasLabel),
+        'data-icon-count': String(icons.length),
+        'data-icon-only': String(hasIcon && !hasLabel),
+    };
+}
+function isIconReactChild(node) {
+    var _a;
+    if (typeof node !== 'object' || node === null) {
+        return false;
+    }
+    if ('type' in node) {
+        const type = node.type;
+        return (type === IconWrapper ||
+            type === Icon ||
+            ((_a = node.props) === null || _a === void 0 ? void 0 : _a['data-icon']));
+    }
+    return false;
+}
+/**
+ * A reusable sub-component which tags arbitrary content as an "icon" for the purposes of `useIconOnlyDataAttributes`.
+ * Attach it to your main component's sub-component set so that users can supply custom content which
+ * behaves as an icon and triggers the appropriate "icon only" styles when necessary.
+ */
+export const IconWrapper = forwardRef(function IconWrapper(_a, ref) {
+    var { className, render } = _a, props = __rest(_a, ["className", "render"]);
+    return useRender({
+        defaultTagName: 'div',
+        render,
+        ref,
+        props: Object.assign({ 'data-icon': true, className: clsx(cls.iconWrapper, className) }, props),
+    });
+});
+function unwrapChildFragments(children) {
+    const unwrapped = [];
+    Children.forEach(children, (child) => {
+        if (child &&
+            typeof child === 'object' &&
+            'type' in child &&
+            child.type === Fragment) {
+            unwrapped.push(...unwrapChildFragments(child.props.children));
+        }
+        else {
+            unwrapped.push(child);
+        }
+    });
+    return unwrapped;
+}
+//# sourceMappingURL=iconOnly.js.map

package/dist/behaviors/iconOnly.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"iconOnly.js","sourceRoot":"","sources":["../../src/behaviors/iconOnly.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;;;;;;;;;;;;AAEH,OAAO,EAAE,SAAS,EAA2B,MAAM,gBAAgB,CAAC;AACpE,OAAO,EAAE,IAAI,EAAE,MAAM,MAAM,CAAC;AAC5B,OAAO,EACN,QAAQ,EACR,UAAU,EACV,QAAQ,EAER,WAAW,EACX,eAAe,EACf,MAAM,GACN,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAClD,OAAO,YAAY,MAAM,0BAA0B,CAAC;AACpD,OAAO,GAAG,MAAM,uBAAuB,CAAC;AAExC;;;;;;;;;;;;;GAaG;AACH,MAAM,UAAU,yBAAyB;AACxC;;;;GAIG;AACH,QAA+B;IAW/B,MAAM,OAAO,GAAG,MAAM,CAAqB,IAAI,CAAC,CAAC;IACjD,MAAM,GAAG,GAAG,WAAW,CAAC,CAAC,IAAwB,EAAE,EAAE;QACpD,IAAI,IAAI,EAAE,CAAC;YACV,qCAAqC,CAAC,IAAI,CAAC,CAAC;QAC7C,CAAC;IACF,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,eAAe,CAAC,GAAG,EAAE;QACpB,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC;QAC7B,IAAI,IAAI,EAAE,CAAC;YACV,MAAM,gBAAgB,GAAG,IAAI,gBAAgB,CAAC,CAAC,OAAO,EAAE,EAAE;gBACzD,qCAAqC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,MAAqB,CAAC,CAAC;YACzE,CAAC,CAAC,CAAC;YACH,gBAAgB,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;YACnE,OAAO,GAAG,EAAE,CAAC,gBAAgB,CAAC,UAAU,EAAE,CAAC;QAC5C,CAAC;IACF,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,uBAAuB,GAAG,kCAAkC,CAAC,QAAQ,CAAC,CAAC;IAE7E,MAAM,QAAQ,GAAG,YAAY,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC;IAC5C,OAAO;QACN,GAAG,EAAE,QAAQ;QACb,KAAK,EAAE,uBAAuB;QAC9B,IAAI,EAAE;YACL,WAAW,EAAE,uBAAuB,CAAC,gBAAgB,CAAC,KAAK,MAAM;YACjE,OAAO,EAAE,uBAAuB,CAAC,eAAe,CAAC,KAAK,MAAM;YAC5D,QAAQ,EAAE,uBAAuB,CAAC,gBAAgB,CAAC,KAAK,MAAM;YAC9D,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC,iBAAiB,CAAC,CAAC;SAC7D;KACD,CAAC;AACH,CAAC;AAED,SAAS,qCAAqC,CAAC,WAAwB;IACtE,uDAAuD;IACvD,MAAM,QAAQ,GAAG;QAChB,IAAI,EAAE,CAAC;QACP,KAAK,EAAE,CAAC;KACR,CAAC;IACF,WAAW,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;QACxC,IAAI,CAAC,CAAC,KAAK,YAAY,WAAW,IAAI,KAAK,YAAY,UAAU,CAAC,EAAE,CAAC;YACpE,OAAO;QACR,CAAC;QACD,IAAI,KAAK,CAAC,KAAK,CAAC,OAAO,KAAK,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,KAAK,KAAK,GAAG,EAAE,CAAC;YACjE,uBAAuB;YACvB,OAAO;QACR,CAAC;QACD,IAAI,KAAK,YAAY,WAAW,IAAI,KAAK,YAAY,UAAU,EAAE,CAAC;YACjE,gDAAgD;YAChD,yFAAyF;YACzF,2EAA2E;YAC3E,mCAAmC;YACnC,IACC,KAAK,CAAC,OAAO,CAAC,IAAI,KAAK,MAAM;gBAC7B,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC;gBACnC,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,CAAC,EAC/B,CAAC;gBACF,QAAQ,CAAC,IAAI,EAAE,CAAC;YACjB,CAAC;QACF,CAAC;IACF,CAAC,CAAC,CAAC;IACH,IAAI,WAAW,CAAC,WAAW,EAAE,CAAC;QAC7B,QAAQ,CAAC,KAAK,EAAE,CAAC;IAClB,CAAC;IACD,WAAW,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC;IACrE,WAAW,CAAC,YAAY,CAAC,gBAAgB,EAAE,MAAM,CAAC,QAAQ,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC;IACvE,WAAW,CAAC,YAAY,CAAC,iBAAiB,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC;IACnE,WAAW,CAAC,YAAY,CACvB,gBAAgB,EAChB,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,CAAC,IAAI,QAAQ,CAAC,KAAK,KAAK,CAAC,CAAC,CACjD,CAAC;IAEF,2EAA2E;IAC3E,MAAM,kBAAkB,GACvB,WAAW,CAAC,YAAY,CAAC,YAAY,CAAC;QACtC,WAAW,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAC;IAC7C,IAAI,QAAQ,CAAC,IAAI,GAAG,CAAC,IAAI,QAAQ,CAAC,KAAK,KAAK,CAAC,IAAI,CAAC,kBAAkB,EAAE,CAAC;QACtE,OAAO,CAAC,IAAI,CACX,qJAAqJ,EACrJ,WAAW,CACX,CAAC;IACH,CAAC;AACF,CAAC;AAED;;;;GAIG;AACH,SAAS,kCAAkC,CAAC,QAAmB;IAC9D,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,QAAQ,CAAC,CAAC;IACzD,MAAM,KAAK,GAAG,iBAAiB,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC;IACzD,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;IACjC,0FAA0F;IAC1F,oCAAoC;IACpC,MAAM,QAAQ,GAAG,iBAAiB,CAAC,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;IACzD,OAAO;QACN,eAAe,EAAE,MAAM,CAAC,OAAO,CAAC;QAChC,gBAAgB,EAAE,MAAM,CAAC,QAAQ,CAAC;QAClC,iBAAiB,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC;QACvC,gBAAgB,EAAE,MAAM,CAAC,OAAO,IAAI,CAAC,QAAQ,CAAC;KAC9C,CAAC;AACH,CAAC;AAED,SAAS,gBAAgB,CAAC,IAAe;;IACxC,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,IAAI,EAAE,CAAC;QAC/C,OAAO,KAAK,CAAC;IACd,CAAC;IACD,IAAI,MAAM,IAAI,IAAI,EAAE,CAAC;QACpB,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QACvB,OAAO,CACN,IAAI,KAAK,WAAW;YACpB,IAAI,KAAK,IAAI;aACb,MAAC,IAAI,CAAC,KAAa,0CAAG,WAAW,CAAC,CAAA,CAClC,CAAC;IACH,CAAC;IAED,OAAO,KAAK,CAAC;AACd,CAAC;AAGD;;;;GAIG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CACpC,SAAS,WAAW,CAAC,EAA+B,EAAE,GAAG;QAApC,EAAE,SAAS,EAAE,MAAM,OAAY,EAAP,KAAK,cAA7B,uBAA+B,CAAF;IACjD,OAAO,SAAS,CAAC;QAChB,cAAc,EAAE,KAAK;QACrB,MAAM;QACN,GAAG;QACH,KAAK,kBACJ,WAAW,EAAE,IAAI,EACjB,SAAS,EAAE,IAAI,CAAC,GAAG,CAAC,WAAW,EAAE,SAAS,CAAC,IACxC,KAAK,CACR;KACD,CAAC,CAAC;AACJ,CAAC,CACD,CAAC;AAEF,SAAS,oBAAoB,CAAC,QAAmB;IAChD,MAAM,SAAS,GAAgB,EAAE,CAAC;IAClC,QAAQ,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;QACpC,IACC,KAAK;YACL,OAAO,KAAK,KAAK,QAAQ;YACzB,MAAM,IAAI,KAAK;YACf,KAAK,CAAC,IAAI,KAAK,QAAQ,EACtB,CAAC;YACF,SAAS,CAAC,IAAI,CAAC,GAAG,oBAAoB,CAAE,KAAK,CAAC,KAAa,CAAC,QAAQ,CAAC,CAAC,CAAC;QACxE,CAAC;aAAM,CAAC;YACP,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC;IACF,CAAC,CAAC,CAAC;IACH,OAAO,SAAS,CAAC;AAClB,CAAC"}

package/dist/behaviors/iconOnly.module.css

@@ -0,0 +1,4 @@
+.iconWrapper {
+	display: inline-block;
+	flex-shrink: 0;
+}

package/dist/colorMode.js

@@ -0,0 +1,78 @@
+import { useSyncExternalStore } from 'react';
+export function setColorMode(mode) {
+    if (typeof window === 'undefined')
+        return;
+    if (mode === 'system') {
+        window.localStorage.removeItem('colorMode');
+    }
+    else {
+        window.localStorage.setItem('colorMode', mode);
+    }
+    window.dispatchEvent(new Event('colorModeChanged'));
+}
+const updateMode = () => {
+    if (typeof window === 'undefined')
+        return;
+    const mode = window.localStorage.getItem('colorMode');
+    document.documentElement.classList.remove('override-light', 'override-dark');
+    if (mode) {
+        document.documentElement.classList.add('override-' + mode);
+    }
+    // determine final mode, even if it's system
+    const finalMode = mode ||
+        (window.matchMedia('(prefers-color-scheme: dark)').matches
+            ? 'dark'
+            : 'light');
+    // set the status bar color in pwas
+    const iosStatusBarColor = document.querySelector('meta[name=apple-mobile-web-app-status-bar-style]');
+    const androidStatusBarColor = document.querySelector('meta[name=theme-color]');
+    const root = document.body;
+    const cssVar = 'background-color';
+    const color = getComputedStyle(root).getPropertyValue(cssVar);
+    if (finalMode === 'dark') {
+        iosStatusBarColor === null || iosStatusBarColor === void 0 ? void 0 : iosStatusBarColor.setAttribute('content', 'black');
+        androidStatusBarColor === null || androidStatusBarColor === void 0 ? void 0 : androidStatusBarColor.setAttribute('content', color);
+    }
+    if (finalMode === 'light') {
+        iosStatusBarColor === null || iosStatusBarColor === void 0 ? void 0 : iosStatusBarColor.setAttribute('content', 'white');
+        androidStatusBarColor === null || androidStatusBarColor === void 0 ? void 0 : androidStatusBarColor.setAttribute('content', color);
+    }
+};
+updateMode();
+// listen for changes and apply an override-mode to the html
+if (typeof window !== 'undefined') {
+    window.addEventListener('colorModeChanged', updateMode);
+}
+export function getColorMode() {
+    if (typeof window === 'undefined')
+        return 'system';
+    return window.localStorage.getItem('colorMode') || 'system';
+}
+export function getResolvedColorMode() {
+    const mode = getColorMode();
+    if (mode === 'system') {
+        return window.matchMedia('(prefers-color-scheme: dark)').matches
+            ? 'dark'
+            : 'light';
+    }
+    return mode;
+}
+export function subscribeToColorModeChange(callback) {
+    if (typeof window === 'undefined')
+        return () => { };
+    const update = () => callback(getColorMode());
+    window.addEventListener('colorModeChanged', update);
+    return () => {
+        window.removeEventListener('colorModeChanged', update);
+    };
+}
+if (typeof window !== 'undefined') {
+    window.setColorMode = setColorMode;
+}
+export function useColorMode() {
+    return useSyncExternalStore(subscribeToColorModeChange, getColorMode, () => 'system');
+}
+export function useResolvedColorMode() {
+    return useSyncExternalStore(subscribeToColorModeChange, getResolvedColorMode, () => 'light');
+}
+//# sourceMappingURL=colorMode.js.map

package/dist/colorMode.js.map

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