@flanksource/clicky-ui 0.2.2 → 0.2.3

package/dist/components/icon-menu-picker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon-menu-picker.d.ts","sourceRoot":"","sources":["../../src/components/icon-menu-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EASL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,MAAM,IAAI;IAC7C,KAAK,EAAE,CAAC,CAAC;IACT,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,MAAM,IAAI;IAClD,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC5B,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,gBAAgB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACtC,aAAa,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CACpC,CAAC;AA4MF,eAAO,MAAM,cAAc,EAAsC,CAAC,CAAC,SAAS,MAAM,EAChF,KAAK,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAA;CAAE,KAChE,GAAG,CAAC,OAAO,CAAC"}
+{"version":3,"file":"icon-menu-picker.d.ts","sourceRoot":"","sources":["../../src/components/icon-menu-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EASL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAQ,KAAK,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAI9D,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,MAAM,IAAI;IAC7C,KAAK,EAAE,CAAC,CAAC;IACT,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,MAAM,IAAI;IAClD,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC5B,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,gBAAgB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACtC,aAAa,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CACpC,CAAC;AAkMF,eAAO,MAAM,cAAc,EAAsC,CAAC,CAAC,SAAS,MAAM,EAChF,KAAK,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAA;CAAE,KAChE,GAAG,CAAC,OAAO,CAAC"}

package/dist/components/icon-menu-picker.js

@@ -1,8 +1,9 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef, useRef, useState, useImperativeHandle, useMemo, useCallback, useEffect } from "react";
 import { cn } from "../lib/utils.js";
 import { Icon } from "../data/Icon.js";
 import { Button } from "./button.js";
+import { UiCheck } from "../icons/components/UiCheck.js";
 function IconMenuPickerInner({
   value,
   onChange,
@@ -108,7 +109,7 @@ function IconMenuPickerInner({
     throw new Error(`IconMenuPicker: value "${value}" not found in options for ${ariaLabel}`);
   }
   return /* @__PURE__ */ jsxs("div", { ref: rootRef, className: cn("relative inline-flex", showLabel && "w-full", className), children: [
-    /* @__PURE__ */ jsxs(
+    /* @__PURE__ */ jsx(
       Button,
       {
         ref: triggerRef,
@@ -121,18 +122,8 @@ function IconMenuPickerInner({
         title: triggerTitle ?? `${ariaLabel}: ${selected.label}`,
         onClick: () => setOpen((current) => !current),
         onKeyDown: onTriggerKeyDown,
-        className: cn(
-          "text-muted-foreground hover:text-foreground",
-          showLabel && "w-full justify-start",
-          triggerClassName
-        ),
-        children: [
-          /* @__PURE__ */ jsx(Icon, { name: selected.icon, className: showLabel ? "shrink-0 text-foreground" : void 0 }),
-          showLabel && /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate text-left capitalize", children: selected.label }),
-            /* @__PURE__ */ jsx(Icon, { name: "ph:caret-up-down", className: "shrink-0 text-muted-foreground" })
-          ] })
-        ]
+        className: cn("text-muted-foreground hover:text-foreground", triggerClassName),
+        children: /* @__PURE__ */ jsx(Icon, { icon: selected.icon })
       }
     ),
     open && /* @__PURE__ */ jsxs(
@@ -171,9 +162,9 @@ function IconMenuPickerInner({
                   active && "text-foreground"
                 ),
                 children: [
-                  /* @__PURE__ */ jsx(Icon, { name: option.icon, className: "shrink-0 text-muted-foreground" }),
+                  /* @__PURE__ */ jsx(Icon, { icon: option.icon, className: "shrink-0 text-muted-foreground" }),
                   /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate capitalize", children: option.label }),
-                  active ? /* @__PURE__ */ jsx(Icon, { name: "ph:check", className: "shrink-0 text-foreground" }) : /* @__PURE__ */ jsx("span", { className: "inline-block size-4 shrink-0", "aria-hidden": true })
+                  active ? /* @__PURE__ */ jsx(Icon, { icon: UiCheck, className: "shrink-0 text-foreground" }) : /* @__PURE__ */ jsx("span", { className: "inline-block size-4 shrink-0", "aria-hidden": true })
                 ]
               },
               option.value

package/dist/components/icon-menu-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-menu-picker.js","sources":["../../src/components/icon-menu-picker.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent as ReactKeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { Button } from \"./button\";\n\nexport type IconMenuOption<T extends string> = {\n  value: T;\n  icon: string;\n  label: string;\n  description?: string;\n};\n\nexport type IconMenuPickerProps<T extends string> = {\n  value: T;\n  onChange: (next: T) => void;\n  options: IconMenuOption<T>[];\n  ariaLabel: string;\n  triggerTitle?: string | undefined;\n  footer?: ReactNode | undefined;\n  showLabel?: boolean | undefined;\n  className?: string | undefined;\n  triggerClassName?: string | undefined;\n  menuClassName?: string | undefined;\n};\n\nfunction IconMenuPickerInner<T extends string>(\n  {\n    value,\n    onChange,\n    options,\n    ariaLabel,\n    triggerTitle,\n    footer,\n    showLabel,\n    className,\n    triggerClassName,\n    menuClassName,\n  }: IconMenuPickerProps<T>,\n  ref: React.Ref<HTMLDivElement>,\n) {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n  const [open, setOpen] = useState(false);\n\n  useImperativeHandle(ref, () => rootRef.current as HTMLDivElement);\n\n  const activeIndex = useMemo(\n    () =>\n      Math.max(\n        0,\n        options.findIndex((option) => option.value === value),\n      ),\n    [options, value],\n  );\n\n  const close = useCallback((returnFocus: boolean) => {\n    setOpen(false);\n    if (returnFocus) triggerRef.current?.focus();\n  }, []);\n\n  const select = useCallback(\n    (next: T) => {\n      onChange(next);\n      close(true);\n    },\n    [close, onChange],\n  );\n\n  useEffect(() => {\n    if (!open) return;\n\n    const onPointerDown = (event: PointerEvent) => {\n      if (event.button !== 0) return;\n      if (!rootRef.current?.contains(event.target as Node)) {\n        close(false);\n      }\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        event.preventDefault();\n        close(true);\n      }\n    };\n\n    document.addEventListener(\"pointerdown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => {\n      document.removeEventListener(\"pointerdown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [close, open]);\n\n  useEffect(() => {\n    if (!open) return;\n    const node = itemRefs.current[activeIndex];\n    node?.focus();\n  }, [activeIndex, open]);\n\n  const focusItem = (index: number) => {\n    const wrapped = (index + options.length) % options.length;\n    itemRefs.current[wrapped]?.focus();\n  };\n\n  const onMenuKeyDown = (event: ReactKeyboardEvent<HTMLDivElement>) => {\n    const focusedIndex = itemRefs.current.findIndex((node) => node === document.activeElement);\n    if (event.key === \"ArrowDown\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) + 1);\n      return;\n    }\n    if (event.key === \"ArrowUp\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) - 1);\n      return;\n    }\n    if (event.key === \"Home\") {\n      event.preventDefault();\n      focusItem(0);\n      return;\n    }\n    if (event.key === \"End\") {\n      event.preventDefault();\n      focusItem(options.length - 1);\n      return;\n    }\n    if (event.key === \"Tab\") {\n      close(false);\n    }\n  };\n\n  const onTriggerKeyDown = (event: ReactKeyboardEvent<HTMLButtonElement>) => {\n    if (event.key === \"ArrowDown\" || event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen(true);\n    }\n  };\n\n  const selected = options[activeIndex];\n  if (!selected) {\n    throw new Error(`IconMenuPicker: value \"${value}\" not found in options for ${ariaLabel}`);\n  }\n\n  return (\n    <div ref={rootRef} className={cn(\"relative inline-flex\", showLabel && \"w-full\", className)}>\n      <Button\n        ref={triggerRef}\n        type=\"button\"\n        variant=\"ghost\"\n        size={showLabel ? \"default\" : \"icon\"}\n        aria-label={ariaLabel}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        title={triggerTitle ?? `${ariaLabel}: ${selected.label}`}\n        onClick={() => setOpen((current) => !current)}\n        onKeyDown={onTriggerKeyDown}\n        className={cn(\n          \"text-muted-foreground hover:text-foreground\",\n          showLabel && \"w-full justify-start\",\n          triggerClassName,\n        )}\n      >\n        <Icon name={selected.icon} className={showLabel ? \"shrink-0 text-foreground\" : undefined} />\n        {showLabel && (\n          <>\n            <span className=\"min-w-0 flex-1 truncate text-left capitalize\">{selected.label}</span>\n            <Icon name=\"ph:caret-up-down\" className=\"shrink-0 text-muted-foreground\" />\n          </>\n        )}\n      </Button>\n      {open && (\n        <div\n          role=\"menu\"\n          aria-label={ariaLabel}\n          onKeyDown={onMenuKeyDown}\n          className={cn(\n            \"absolute left-0 top-[calc(100%+0.375rem)] z-50 min-w-[12rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\",\n            menuClassName,\n          )}\n        >\n          {options.map((option, index) => {\n            const active = option.value === value;\n            return (\n              <button\n                key={option.value}\n                ref={(node) => {\n                  itemRefs.current[index] = node;\n                }}\n                type=\"button\"\n                role=\"menuitemradio\"\n                aria-checked={active}\n                tabIndex={active ? 0 : -1}\n                onClick={() => select(option.value)}\n                onKeyDown={(event) => {\n                  if (event.key === \"Enter\" || event.key === \" \") {\n                    event.preventDefault();\n                    select(option.value);\n                  }\n                }}\n                className={cn(\n                  \"flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm transition-colors\",\n                  \"hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none\",\n                  active && \"text-foreground\",\n                )}\n              >\n                <Icon name={option.icon} className=\"shrink-0 text-muted-foreground\" />\n                <span className=\"min-w-0 flex-1 truncate capitalize\">{option.label}</span>\n                {active ? (\n                  <Icon name=\"ph:check\" className=\"shrink-0 text-foreground\" />\n                ) : (\n                  <span className=\"inline-block size-4 shrink-0\" aria-hidden />\n                )}\n              </button>\n            );\n          })}\n          {footer ? (\n            <div className=\"mt-1 border-t border-border/60 px-2 py-1.5 text-[11px] text-muted-foreground\">\n              {footer}\n            </div>\n          ) : null}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const IconMenuPicker = forwardRef(IconMenuPickerInner) as <T extends string>(\n  props: IconMenuPickerProps<T> & { ref?: React.Ref<HTMLDivElement> },\n) => JSX.Element;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"icon-menu-picker.js","sources":["../../src/components/icon-menu-picker.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type KeyboardEvent as ReactKeyboardEvent,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiCheck } from \"../icons\";\nimport { Button } from \"./button\";\n\nexport type IconMenuOption<T extends string> = {\n  value: T;\n  icon: StaticIconComponent;\n  label: string;\n  description?: string;\n};\n\nexport type IconMenuPickerProps<T extends string> = {\n  value: T;\n  onChange: (next: T) => void;\n  options: IconMenuOption<T>[];\n  ariaLabel: string;\n  triggerTitle?: string | undefined;\n  footer?: ReactNode | undefined;\n  showLabel?: boolean | undefined;\n  className?: string | undefined;\n  triggerClassName?: string | undefined;\n  menuClassName?: string | undefined;\n};\n\nfunction IconMenuPickerInner<T extends string>(\n  {\n    value,\n    onChange,\n    options,\n    ariaLabel,\n    triggerTitle,\n    footer,\n    showLabel,\n    className,\n    triggerClassName,\n    menuClassName,\n  }: IconMenuPickerProps<T>,\n  ref: React.Ref<HTMLDivElement>,\n) {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n  const [open, setOpen] = useState(false);\n\n  useImperativeHandle(ref, () => rootRef.current as HTMLDivElement);\n\n  const activeIndex = useMemo(\n    () =>\n      Math.max(\n        0,\n        options.findIndex((option) => option.value === value),\n      ),\n    [options, value],\n  );\n\n  const close = useCallback((returnFocus: boolean) => {\n    setOpen(false);\n    if (returnFocus) triggerRef.current?.focus();\n  }, []);\n\n  const select = useCallback(\n    (next: T) => {\n      onChange(next);\n      close(true);\n    },\n    [close, onChange],\n  );\n\n  useEffect(() => {\n    if (!open) return;\n\n    const onPointerDown = (event: PointerEvent) => {\n      if (event.button !== 0) return;\n      if (!rootRef.current?.contains(event.target as Node)) {\n        close(false);\n      }\n    };\n\n    const onKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") {\n        event.preventDefault();\n        close(true);\n      }\n    };\n\n    document.addEventListener(\"pointerdown\", onPointerDown);\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => {\n      document.removeEventListener(\"pointerdown\", onPointerDown);\n      document.removeEventListener(\"keydown\", onKeyDown);\n    };\n  }, [close, open]);\n\n  useEffect(() => {\n    if (!open) return;\n    const node = itemRefs.current[activeIndex];\n    node?.focus();\n  }, [activeIndex, open]);\n\n  const focusItem = (index: number) => {\n    const wrapped = (index + options.length) % options.length;\n    itemRefs.current[wrapped]?.focus();\n  };\n\n  const onMenuKeyDown = (event: ReactKeyboardEvent<HTMLDivElement>) => {\n    const focusedIndex = itemRefs.current.findIndex((node) => node === document.activeElement);\n    if (event.key === \"ArrowDown\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) + 1);\n      return;\n    }\n    if (event.key === \"ArrowUp\") {\n      event.preventDefault();\n      focusItem((focusedIndex < 0 ? activeIndex : focusedIndex) - 1);\n      return;\n    }\n    if (event.key === \"Home\") {\n      event.preventDefault();\n      focusItem(0);\n      return;\n    }\n    if (event.key === \"End\") {\n      event.preventDefault();\n      focusItem(options.length - 1);\n      return;\n    }\n    if (event.key === \"Tab\") {\n      close(false);\n    }\n  };\n\n  const onTriggerKeyDown = (event: ReactKeyboardEvent<HTMLButtonElement>) => {\n    if (event.key === \"ArrowDown\" || event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen(true);\n    }\n  };\n\n  const selected = options[activeIndex];\n  if (!selected) {\n    throw new Error(`IconMenuPicker: value \"${value}\" not found in options for ${ariaLabel}`);\n  }\n\n  return (\n    <div ref={rootRef} className={cn(\"relative inline-flex\", showLabel && \"w-full\", className)}>\n      <Button\n        ref={triggerRef}\n        type=\"button\"\n        variant=\"ghost\"\n        size={showLabel ? \"default\" : \"icon\"}\n        aria-label={ariaLabel}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        title={triggerTitle ?? `${ariaLabel}: ${selected.label}`}\n        onClick={() => setOpen((current) => !current)}\n        onKeyDown={onTriggerKeyDown}\n        className={cn(\"text-muted-foreground hover:text-foreground\", triggerClassName)}\n      >\n        <Icon icon={selected.icon} />\n      </Button>\n      {open && (\n        <div\n          role=\"menu\"\n          aria-label={ariaLabel}\n          onKeyDown={onMenuKeyDown}\n          className={cn(\n            \"absolute left-0 top-[calc(100%+0.375rem)] z-50 min-w-[12rem] rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg shadow-black/5\",\n            menuClassName,\n          )}\n        >\n          {options.map((option, index) => {\n            const active = option.value === value;\n            return (\n              <button\n                key={option.value}\n                ref={(node) => {\n                  itemRefs.current[index] = node;\n                }}\n                type=\"button\"\n                role=\"menuitemradio\"\n                aria-checked={active}\n                tabIndex={active ? 0 : -1}\n                onClick={() => select(option.value)}\n                onKeyDown={(event) => {\n                  if (event.key === \"Enter\" || event.key === \" \") {\n                    event.preventDefault();\n                    select(option.value);\n                  }\n                }}\n                className={cn(\n                  \"flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm transition-colors\",\n                  \"hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none\",\n                  active && \"text-foreground\",\n                )}\n              >\n                <Icon icon={option.icon} className=\"shrink-0 text-muted-foreground\" />\n                <span className=\"min-w-0 flex-1 truncate capitalize\">{option.label}</span>\n                {active ? (\n                  <Icon icon={UiCheck} className=\"shrink-0 text-foreground\" />\n                ) : (\n                  <span className=\"inline-block size-4 shrink-0\" aria-hidden />\n                )}\n              </button>\n            );\n          })}\n          {footer ? (\n            <div className=\"mt-1 border-t border-border/60 px-2 py-1.5 text-[11px] text-muted-foreground\">\n              {footer}\n            </div>\n          ) : null}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport const IconMenuPicker = forwardRef(IconMenuPickerInner) as <T extends string>(\n  props: IconMenuPickerProps<T> & { ref?: React.Ref<HTMLDivElement> },\n) => JSX.Element;\n"],"names":[],"mappings":"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"}

package/dist/components/select.cjs

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const utils = require("../lib/utils.cjs");
+const Icon = require("../data/Icon.cjs");
+const UiChevronDown = require("../icons/components/UiChevronDown.cjs");
+const Select = react.forwardRef(
+  ({ className, options, placeholder, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative inline-flex w-full items-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "select",
+        {
+          ref,
+          className: utils.cn(
+            "h-control-h w-full appearance-none rounded-md border border-input bg-background px-control-px pr-8 text-sm text-foreground",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
+            "disabled:cursor-not-allowed disabled:opacity-50",
+            className
+          ),
+          ...props,
+          children: [
+            placeholder !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", disabled: true, children: placeholder }),
+            options ? options.map((opt) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: opt.value, disabled: opt.disabled, children: opt.label }, opt.value)) : children
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Icon.Icon,
+        {
+          icon: UiChevronDown.UiChevronDown,
+          className: "pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-xs text-muted-foreground"
+        }
+      )
+    ] });
+  }
+);
+Select.displayName = "Select";
+exports.Select = Select;
+//# sourceMappingURL=select.cjs.map

package/dist/components/select.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.cjs","sources":["../../src/components/select.tsx"],"sourcesContent":["import { forwardRef, type SelectHTMLAttributes } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiChevronDown } from \"../icons\";\n\nexport type SelectOption = { value: string; label: string; disabled?: boolean };\n\nexport type SelectProps = SelectHTMLAttributes<HTMLSelectElement> & {\n  options?: SelectOption[];\n  placeholder?: string;\n};\n\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n  ({ className, options, placeholder, children, ...props }, ref) => {\n    return (\n      <div className=\"relative inline-flex w-full items-center\">\n        <select\n          ref={ref}\n          className={cn(\n            \"h-control-h w-full appearance-none rounded-md border border-input bg-background px-control-px pr-8 text-sm text-foreground\",\n            \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1\",\n            \"disabled:cursor-not-allowed disabled:opacity-50\",\n            className,\n          )}\n          {...props}\n        >\n          {placeholder !== undefined && (\n            <option value=\"\" disabled>\n              {placeholder}\n            </option>\n          )}\n          {options\n            ? options.map((opt) => (\n                <option key={opt.value} value={opt.value} disabled={opt.disabled}>\n                  {opt.label}\n                </option>\n              ))\n            : children}\n        </select>\n        <Icon\n          icon={UiChevronDown}\n          className=\"pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-xs text-muted-foreground\"\n        />\n      </div>\n    );\n  },\n);\nSelect.displayName = \"Select\";\n"],"names":["forwardRef","jsxs","cn","jsx","Icon","UiChevronDown"],"mappings":";;;;;;;AAYO,MAAM,SAASA,MAAAA;AAAAA,EACpB,CAAC,EAAE,WAAW,SAAS,aAAa,UAAU,GAAG,MAAA,GAAS,QAAQ;AAChE,WACEC,2BAAAA,KAAC,OAAA,EAAI,WAAU,4CACb,UAAA;AAAA,MAAAA,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA,WAAWC,MAAAA;AAAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,UAED,GAAG;AAAA,UAEH,UAAA;AAAA,YAAA,gBAAgB,UACfC,+BAAC,UAAA,EAAO,OAAM,IAAG,UAAQ,MACtB,UAAA,YAAA,CACH;AAAA,YAED,UACG,QAAQ,IAAI,CAAC,QACXA,2BAAAA,IAAC,YAAuB,OAAO,IAAI,OAAO,UAAU,IAAI,UACrD,UAAA,IAAI,SADM,IAAI,KAEjB,CACD,IACD;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAENA,2BAAAA;AAAAA,QAACC,KAAAA;AAAAA,QAAA;AAAA,UACC,MAAMC,cAAAA;AAAAA,UACN,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ,GACF;AAAA,EAEJ;AACF;AACA,OAAO,cAAc;;"}

package/dist/components/select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/components/select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAI9D,MAAM,MAAM,YAAY,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAEhF,MAAM,MAAM,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAClE,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,MAAM;cAJP,YAAY,EAAE;kBACV,MAAM;qDAqCrB,CAAC"}
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/components/select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAK9D,MAAM,MAAM,YAAY,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAEhF,MAAM,MAAM,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAClE,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,MAAM;cAJP,YAAY,EAAE;kBACV,MAAM;qDAqCrB,CAAC"}

package/dist/components/select.js

@@ -2,6 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef } from "react";
 import { cn } from "../lib/utils.js";
 import { Icon } from "../data/Icon.js";
+import { UiChevronDown } from "../icons/components/UiChevronDown.js";
 const Select = forwardRef(
   ({ className, options, placeholder, children, ...props }, ref) => {
     return /* @__PURE__ */ jsxs("div", { className: "relative inline-flex w-full items-center", children: [
@@ -25,7 +26,7 @@ const Select = forwardRef(
       /* @__PURE__ */ jsx(
         Icon,
         {
-          name: "codicon:chevron-down",
+          icon: UiChevronDown,
           className: "pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-xs text-muted-foreground"
         }
       )

package/dist/components/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","sources":["../../src/components/select.tsx"],"sourcesContent":["import { forwardRef, type SelectHTMLAttributes } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\n\nexport type SelectOption = { value: string; label: string; disabled?: boolean };\n\nexport type SelectProps = SelectHTMLAttributes<HTMLSelectElement> & {\n  options?: SelectOption[];\n  placeholder?: string;\n};\n\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n  ({ className, options, placeholder, children, ...props }, ref) => {\n    return (\n      <div className=\"relative inline-flex w-full items-center\">\n        <select\n          ref={ref}\n          className={cn(\n            \"h-control-h w-full appearance-none rounded-md border border-input bg-background px-control-px pr-8 text-sm text-foreground\",\n            \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1\",\n            \"disabled:cursor-not-allowed disabled:opacity-50\",\n            className,\n          )}\n          {...props}\n        >\n          {placeholder !== undefined && (\n            <option value=\"\" disabled>\n              {placeholder}\n            </option>\n          )}\n          {options\n            ? options.map((opt) => (\n                <option key={opt.value} value={opt.value} disabled={opt.disabled}>\n                  {opt.label}\n                </option>\n              ))\n            : children}\n        </select>\n        <Icon\n          name=\"codicon:chevron-down\"\n          className=\"pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-xs text-muted-foreground\"\n        />\n      </div>\n    );\n  },\n);\nSelect.displayName = \"Select\";\n"],"names":[],"mappings":";;;;AAWO,MAAM,SAAS;AAAA,EACpB,CAAC,EAAE,WAAW,SAAS,aAAa,UAAU,GAAG,MAAA,GAAS,QAAQ;AAChE,WACE,qBAAC,OAAA,EAAI,WAAU,4CACb,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA,WAAW;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,UAED,GAAG;AAAA,UAEH,UAAA;AAAA,YAAA,gBAAgB,UACf,oBAAC,UAAA,EAAO,OAAM,IAAG,UAAQ,MACtB,UAAA,YAAA,CACH;AAAA,YAED,UACG,QAAQ,IAAI,CAAC,QACX,oBAAC,YAAuB,OAAO,IAAI,OAAO,UAAU,IAAI,UACrD,UAAA,IAAI,SADM,IAAI,KAEjB,CACD,IACD;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAEN;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ,GACF;AAAA,EAEJ;AACF;AACA,OAAO,cAAc;"}
+{"version":3,"file":"select.js","sources":["../../src/components/select.tsx"],"sourcesContent":["import { forwardRef, type SelectHTMLAttributes } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"../data/Icon\";\nimport { UiChevronDown } from \"../icons\";\n\nexport type SelectOption = { value: string; label: string; disabled?: boolean };\n\nexport type SelectProps = SelectHTMLAttributes<HTMLSelectElement> & {\n  options?: SelectOption[];\n  placeholder?: string;\n};\n\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(\n  ({ className, options, placeholder, children, ...props }, ref) => {\n    return (\n      <div className=\"relative inline-flex w-full items-center\">\n        <select\n          ref={ref}\n          className={cn(\n            \"h-control-h w-full appearance-none rounded-md border border-input bg-background px-control-px pr-8 text-sm text-foreground\",\n            \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1\",\n            \"disabled:cursor-not-allowed disabled:opacity-50\",\n            className,\n          )}\n          {...props}\n        >\n          {placeholder !== undefined && (\n            <option value=\"\" disabled>\n              {placeholder}\n            </option>\n          )}\n          {options\n            ? options.map((opt) => (\n                <option key={opt.value} value={opt.value} disabled={opt.disabled}>\n                  {opt.label}\n                </option>\n              ))\n            : children}\n        </select>\n        <Icon\n          icon={UiChevronDown}\n          className=\"pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-xs text-muted-foreground\"\n        />\n      </div>\n    );\n  },\n);\nSelect.displayName = \"Select\";\n"],"names":[],"mappings":";;;;;AAYO,MAAM,SAAS;AAAA,EACpB,CAAC,EAAE,WAAW,SAAS,aAAa,UAAU,GAAG,MAAA,GAAS,QAAQ;AAChE,WACE,qBAAC,OAAA,EAAI,WAAU,4CACb,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA,WAAW;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,UAED,GAAG;AAAA,UAEH,UAAA;AAAA,YAAA,gBAAgB,UACf,oBAAC,UAAA,EAAO,OAAM,IAAG,UAAQ,MACtB,UAAA,YAAA,CACH;AAAA,YAED,UACG,QAAQ,IAAI,CAAC,QACX,oBAAC,YAAuB,OAAO,IAAI,OAAO,UAAU,IAAI,UACrD,UAAA,IAAI,SADM,IAAI,KAEjB,CACD,IACD;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAEN;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ,GACF;AAAA,EAEJ;AACF;AACA,OAAO,cAAc;"}

package/dist/components/theme-switcher.cjs

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const Icon = require("../data/Icon.cjs");
+const iconMenuPicker = require("./icon-menu-picker.cjs");
+const useTheme = require("../hooks/use-theme.cjs");
+const UiSun = require("../icons/components/UiSun.cjs");
+const UiMoon = require("../icons/components/UiMoon.cjs");
+const UiDesktop = require("../icons/components/UiDesktop.cjs");
+const THEME_OPTIONS = [
+  { value: "light", icon: UiSun.UiSun, label: "light" },
+  { value: "dark", icon: UiMoon.UiMoon, label: "dark" },
+  { value: "system", icon: UiDesktop.UiDesktop, label: "system" }
+];
+const ThemeSwitcher = react.forwardRef(
+  ({ className, triggerClassName, menuClassName }, ref) => {
+    const { theme, setTheme, resolvedTheme } = useTheme.useTheme();
+    const footer = theme === "system" ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: resolvedTheme === "dark" ? UiMoon.UiMoon : UiSun.UiSun, width: 12, height: 12 }),
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+        "resolves to",
+        " ",
+        /* @__PURE__ */ jsxRuntime.jsx("span", { "data-testid": "resolved-theme", className: "font-medium text-foreground", children: resolvedTheme })
+      ] })
+    ] }) : null;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      iconMenuPicker.IconMenuPicker,
+      {
+        ref,
+        value: theme,
+        onChange: setTheme,
+        options: THEME_OPTIONS,
+        ariaLabel: "Theme",
+        footer,
+        className,
+        triggerClassName,
+        menuClassName
+      }
+    );
+  }
+);
+ThemeSwitcher.displayName = "ThemeSwitcher";
+exports.ThemeSwitcher = ThemeSwitcher;
+//# sourceMappingURL=theme-switcher.cjs.map

package/dist/components/theme-switcher.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-switcher.cjs","sources":["../../src/components/theme-switcher.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Icon } from \"../data/Icon\";\nimport { IconMenuPicker, type IconMenuOption } from \"./icon-menu-picker\";\nimport { useTheme, type Theme } from \"../hooks/use-theme\";\nimport { UiDesktop, UiMoon, UiSun } from \"../icons\";\n\nconst THEME_OPTIONS: IconMenuOption<Theme>[] = [\n  { value: \"light\", icon: UiSun, label: \"light\" },\n  { value: \"dark\", icon: UiMoon, label: \"dark\" },\n  { value: \"system\", icon: UiDesktop, label: \"system\" },\n];\n\nexport type ThemeSwitcherProps = {\n  /** Classes applied to the root wrapper. */\n  className?: string;\n  /** Classes applied to the icon trigger button. */\n  triggerClassName?: string;\n  /** Classes applied to the popup menu. */\n  menuClassName?: string;\n};\n\nexport const ThemeSwitcher = forwardRef<HTMLDivElement, ThemeSwitcherProps>(\n  ({ className, triggerClassName, menuClassName }, ref) => {\n    const { theme, setTheme, resolvedTheme } = useTheme();\n    const footer =\n      theme === \"system\" ? (\n        <span className=\"inline-flex items-center gap-1.5\">\n          <Icon icon={resolvedTheme === \"dark\" ? UiMoon : UiSun} width={12} height={12} />\n          <span>\n            resolves to{\" \"}\n            <span data-testid=\"resolved-theme\" className=\"font-medium text-foreground\">\n              {resolvedTheme}\n            </span>\n          </span>\n        </span>\n      ) : null;\n    return (\n      <IconMenuPicker<Theme>\n        ref={ref}\n        value={theme}\n        onChange={setTheme}\n        options={THEME_OPTIONS}\n        ariaLabel=\"Theme\"\n        footer={footer}\n        className={className}\n        triggerClassName={triggerClassName}\n        menuClassName={menuClassName}\n      />\n    );\n  },\n);\nThemeSwitcher.displayName = \"ThemeSwitcher\";\n"],"names":["UiSun","UiMoon","UiDesktop","forwardRef","useTheme","jsxs","jsx","Icon","IconMenuPicker"],"mappings":";;;;;;;;;;AAMA,MAAM,gBAAyC;AAAA,EAC7C,EAAE,OAAO,SAAS,MAAMA,MAAAA,OAAO,OAAO,QAAA;AAAA,EACtC,EAAE,OAAO,QAAQ,MAAMC,OAAAA,QAAQ,OAAO,OAAA;AAAA,EACtC,EAAE,OAAO,UAAU,MAAMC,UAAAA,WAAW,OAAO,SAAA;AAC7C;AAWO,MAAM,gBAAgBC,MAAAA;AAAAA,EAC3B,CAAC,EAAE,WAAW,kBAAkB,cAAA,GAAiB,QAAQ;AACvD,UAAM,EAAE,OAAO,UAAU,cAAA,IAAkBC,SAAAA,SAAA;AAC3C,UAAM,SACJ,UAAU,WACRC,2BAAAA,KAAC,QAAA,EAAK,WAAU,oCACd,UAAA;AAAA,MAAAC,2BAAAA,IAACC,KAAAA,MAAA,EAAK,MAAM,kBAAkB,SAASN,gBAASD,MAAAA,OAAO,OAAO,IAAI,QAAQ,GAAA,CAAI;AAAA,sCAC7E,QAAA,EAAK,UAAA;AAAA,QAAA;AAAA,QACQ;AAAA,uCACX,QAAA,EAAK,eAAY,kBAAiB,WAAU,+BAC1C,UAAA,cAAA,CACH;AAAA,MAAA,EAAA,CACF;AAAA,IAAA,EAAA,CACF,IACE;AACN,WACEM,2BAAAA;AAAAA,MAACE,eAAAA;AAAAA,MAAA;AAAA,QACC;AAAA,QACA,OAAO;AAAA,QACP,UAAU;AAAA,QACV,SAAS;AAAA,QACT,WAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AACA,cAAc,cAAc;;"}

package/dist/components/theme-switcher.d.ts

@@ -1,6 +1,9 @@
 export type ThemeSwitcherProps = {
+    /** Classes applied to the root wrapper. */
     className?: string;
+    /** Classes applied to the icon trigger button. */
     triggerClassName?: string;
+    /** Classes applied to the popup menu. */
     menuClassName?: string;
 };
 export declare const ThemeSwitcher: import('react').ForwardRefExoticComponent<ThemeSwitcherProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/theme-switcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme-switcher.d.ts","sourceRoot":"","sources":["../../src/components/theme-switcher.tsx"],"names":[],"mappings":"AAWA,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,aAAa,+GA6BzB,CAAC"}
+{"version":3,"file":"theme-switcher.d.ts","sourceRoot":"","sources":["../../src/components/theme-switcher.tsx"],"names":[],"mappings":"AAYA,MAAM,MAAM,kBAAkB,GAAG;IAC/B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kDAAkD;IAClD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yCAAyC;IACzC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,aAAa,+GA6BzB,CAAC"}

package/dist/components/theme-switcher.js

@@ -3,16 +3,19 @@ import { forwardRef } from "react";
 import { Icon } from "../data/Icon.js";
 import { IconMenuPicker } from "./icon-menu-picker.js";
 import { useTheme } from "../hooks/use-theme.js";
+import { UiSun } from "../icons/components/UiSun.js";
+import { UiMoon } from "../icons/components/UiMoon.js";
+import { UiDesktop } from "../icons/components/UiDesktop.js";
 const THEME_OPTIONS = [
-  { value: "light", icon: "ph:sun", label: "light" },
-  { value: "dark", icon: "ph:moon", label: "dark" },
-  { value: "system", icon: "ph:desktop", label: "system" }
+  { value: "light", icon: UiSun, label: "light" },
+  { value: "dark", icon: UiMoon, label: "dark" },
+  { value: "system", icon: UiDesktop, label: "system" }
 ];
 const ThemeSwitcher = forwardRef(
   ({ className, triggerClassName, menuClassName }, ref) => {
     const { theme, setTheme, resolvedTheme } = useTheme();
     const footer = theme === "system" ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
-      /* @__PURE__ */ jsx(Icon, { name: resolvedTheme === "dark" ? "ph:moon" : "ph:sun", width: 12, height: 12 }),
+      /* @__PURE__ */ jsx(Icon, { icon: resolvedTheme === "dark" ? UiMoon : UiSun, width: 12, height: 12 }),
       /* @__PURE__ */ jsxs("span", { children: [
         "resolves to",
         " ",

package/dist/components/theme-switcher.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme-switcher.js","sources":["../../src/components/theme-switcher.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Icon } from \"../data/Icon\";\nimport { IconMenuPicker, type IconMenuOption } from \"./icon-menu-picker\";\nimport { useTheme, type Theme } from \"../hooks/use-theme\";\n\nconst THEME_OPTIONS: IconMenuOption<Theme>[] = [\n  { value: \"light\", icon: \"ph:sun\", label: \"light\" },\n  { value: \"dark\", icon: \"ph:moon\", label: \"dark\" },\n  { value: \"system\", icon: \"ph:desktop\", label: \"system\" },\n];\n\nexport type ThemeSwitcherProps = {\n  className?: string;\n  triggerClassName?: string;\n  menuClassName?: string;\n};\n\nexport const ThemeSwitcher = forwardRef<HTMLDivElement, ThemeSwitcherProps>(\n  ({ className, triggerClassName, menuClassName }, ref) => {\n    const { theme, setTheme, resolvedTheme } = useTheme();\n    const footer =\n      theme === \"system\" ? (\n        <span className=\"inline-flex items-center gap-1.5\">\n          <Icon name={resolvedTheme === \"dark\" ? \"ph:moon\" : \"ph:sun\"} width={12} height={12} />\n          <span>\n            resolves to{\" \"}\n            <span data-testid=\"resolved-theme\" className=\"font-medium text-foreground\">\n              {resolvedTheme}\n            </span>\n          </span>\n        </span>\n      ) : null;\n    return (\n      <IconMenuPicker<Theme>\n        ref={ref}\n        value={theme}\n        onChange={setTheme}\n        options={THEME_OPTIONS}\n        ariaLabel=\"Theme\"\n        footer={footer}\n        className={className}\n        triggerClassName={triggerClassName}\n        menuClassName={menuClassName}\n      />\n    );\n  },\n);\nThemeSwitcher.displayName = \"ThemeSwitcher\";\n"],"names":[],"mappings":";;;;;AAKA,MAAM,gBAAyC;AAAA,EAC7C,EAAE,OAAO,SAAS,MAAM,UAAU,OAAO,QAAA;AAAA,EACzC,EAAE,OAAO,QAAQ,MAAM,WAAW,OAAO,OAAA;AAAA,EACzC,EAAE,OAAO,UAAU,MAAM,cAAc,OAAO,SAAA;AAChD;AAQO,MAAM,gBAAgB;AAAA,EAC3B,CAAC,EAAE,WAAW,kBAAkB,cAAA,GAAiB,QAAQ;AACvD,UAAM,EAAE,OAAO,UAAU,cAAA,IAAkB,SAAA;AAC3C,UAAM,SACJ,UAAU,WACR,qBAAC,QAAA,EAAK,WAAU,oCACd,UAAA;AAAA,MAAA,oBAAC,MAAA,EAAK,MAAM,kBAAkB,SAAS,YAAY,UAAU,OAAO,IAAI,QAAQ,GAAA,CAAI;AAAA,2BACnF,QAAA,EAAK,UAAA;AAAA,QAAA;AAAA,QACQ;AAAA,4BACX,QAAA,EAAK,eAAY,kBAAiB,WAAU,+BAC1C,UAAA,cAAA,CACH;AAAA,MAAA,EAAA,CACF;AAAA,IAAA,EAAA,CACF,IACE;AACN,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,OAAO;AAAA,QACP,UAAU;AAAA,QACV,SAAS;AAAA,QACT,WAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AACA,cAAc,cAAc;"}
+{"version":3,"file":"theme-switcher.js","sources":["../../src/components/theme-switcher.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Icon } from \"../data/Icon\";\nimport { IconMenuPicker, type IconMenuOption } from \"./icon-menu-picker\";\nimport { useTheme, type Theme } from \"../hooks/use-theme\";\nimport { UiDesktop, UiMoon, UiSun } from \"../icons\";\n\nconst THEME_OPTIONS: IconMenuOption<Theme>[] = [\n  { value: \"light\", icon: UiSun, label: \"light\" },\n  { value: \"dark\", icon: UiMoon, label: \"dark\" },\n  { value: \"system\", icon: UiDesktop, label: \"system\" },\n];\n\nexport type ThemeSwitcherProps = {\n  /** Classes applied to the root wrapper. */\n  className?: string;\n  /** Classes applied to the icon trigger button. */\n  triggerClassName?: string;\n  /** Classes applied to the popup menu. */\n  menuClassName?: string;\n};\n\nexport const ThemeSwitcher = forwardRef<HTMLDivElement, ThemeSwitcherProps>(\n  ({ className, triggerClassName, menuClassName }, ref) => {\n    const { theme, setTheme, resolvedTheme } = useTheme();\n    const footer =\n      theme === \"system\" ? (\n        <span className=\"inline-flex items-center gap-1.5\">\n          <Icon icon={resolvedTheme === \"dark\" ? UiMoon : UiSun} width={12} height={12} />\n          <span>\n            resolves to{\" \"}\n            <span data-testid=\"resolved-theme\" className=\"font-medium text-foreground\">\n              {resolvedTheme}\n            </span>\n          </span>\n        </span>\n      ) : null;\n    return (\n      <IconMenuPicker<Theme>\n        ref={ref}\n        value={theme}\n        onChange={setTheme}\n        options={THEME_OPTIONS}\n        ariaLabel=\"Theme\"\n        footer={footer}\n        className={className}\n        triggerClassName={triggerClassName}\n        menuClassName={menuClassName}\n      />\n    );\n  },\n);\nThemeSwitcher.displayName = \"ThemeSwitcher\";\n"],"names":[],"mappings":";;;;;;;;AAMA,MAAM,gBAAyC;AAAA,EAC7C,EAAE,OAAO,SAAS,MAAM,OAAO,OAAO,QAAA;AAAA,EACtC,EAAE,OAAO,QAAQ,MAAM,QAAQ,OAAO,OAAA;AAAA,EACtC,EAAE,OAAO,UAAU,MAAM,WAAW,OAAO,SAAA;AAC7C;AAWO,MAAM,gBAAgB;AAAA,EAC3B,CAAC,EAAE,WAAW,kBAAkB,cAAA,GAAiB,QAAQ;AACvD,UAAM,EAAE,OAAO,UAAU,cAAA,IAAkB,SAAA;AAC3C,UAAM,SACJ,UAAU,WACR,qBAAC,QAAA,EAAK,WAAU,oCACd,UAAA;AAAA,MAAA,oBAAC,MAAA,EAAK,MAAM,kBAAkB,SAAS,SAAS,OAAO,OAAO,IAAI,QAAQ,GAAA,CAAI;AAAA,2BAC7E,QAAA,EAAK,UAAA;AAAA,QAAA;AAAA,QACQ;AAAA,4BACX,QAAA,EAAK,eAAY,kBAAiB,WAAU,+BAC1C,UAAA,cAAA,CACH;AAAA,MAAA,EAAA,CACF;AAAA,IAAA,EAAA,CACF,IACE;AACN,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,OAAO;AAAA,QACP,UAAU;AAAA,QACV,SAAS;AAAA,QACT,WAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AACA,cAAc,cAAc;"}

package/dist/components.cjs

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const button = require("./components/button.cjs");
+const DateField = require("./components/DateField.cjs");
+const DatePicker = require("./components/DatePicker.cjs");
+const DateTimePicker = require("./components/DateTimePicker.cjs");
+const TimeRange = require("./components/TimeRange.cjs");
+const RangeSlider = require("./components/RangeSlider.cjs");
+const FilterBar = require("./components/FilterBar.cjs");
+const MultiSelect = require("./components/MultiSelect.cjs");
+const select = require("./components/select.cjs");
+const themeSwitcher = require("./components/theme-switcher.cjs");
+const densitySwitcher = require("./components/density-switcher.cjs");
+const iconMenuPicker = require("./components/icon-menu-picker.cjs");
+const SplitPane = require("./layout/SplitPane.cjs");
+const Section = require("./layout/Section.cjs");
+const DropdownMenu = require("./overlay/DropdownMenu.cjs");
+const HoverCard = require("./overlay/HoverCard.cjs");
+const Modal = require("./overlay/Modal.cjs");
+exports.Button = button.Button;
+exports.buttonVariants = button.buttonVariants;
+exports.DateField = DateField.DateField;
+exports.DatePicker = DatePicker.DatePicker;
+exports.DateTimePicker = DateTimePicker.DateTimePicker;
+exports.TimeRange = TimeRange.TimeRange;
+exports.RangeSlider = RangeSlider.RangeSlider;
+exports.FilterBar = FilterBar.FilterBar;
+exports.MultiSelect = MultiSelect.MultiSelect;
+exports.Select = select.Select;
+exports.ThemeSwitcher = themeSwitcher.ThemeSwitcher;
+exports.DensitySwitcher = densitySwitcher.DensitySwitcher;
+exports.IconMenuPicker = iconMenuPicker.IconMenuPicker;
+exports.SplitPane = SplitPane.SplitPane;
+exports.DetailEmptyState = Section.DetailEmptyState;
+exports.Section = Section.Section;
+exports.DropdownMenu = DropdownMenu.DropdownMenu;
+exports.HoverCard = HoverCard.HoverCard;
+exports.Modal = Modal.Modal;
+//# sourceMappingURL=components.cjs.map

package/dist/components.cjs.map

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

package/dist/components.d.ts

@@ -1,6 +1,8 @@
 export { Button, buttonVariants, type ButtonProps } from './components/button';
+export { DateField, type DateFieldMode, type DateFieldProps } from './components/DateField';
 export { DatePicker, type DatePickerProps } from './components/DatePicker';
 export { DateTimePicker, type DateTimePickerProps } from './components/DateTimePicker';
+export { TimeRange, type TimeRangeKind, type TimeRangePreset, type TimeRangePresetGroup, type TimeRangeProps, } from './components/TimeRange';
 export { RangeSlider, type RangeSliderProps, type RangeSliderValue, } from './components/RangeSlider';
 export { FilterBar, type FilterBarBooleanFilter, type FilterBarEnumFilter, type FilterBarFilter, type FilterBarLookupFilter, type FilterBarLookupInputType, type FilterBarLookupMultiFilter, type FilterBarLookupOption, type FilterBarMultiFilter, type FilterBarMultiFilterMode, type FilterBarNestedMultiFilter, type FilterBarNestedMultiGroup, type FilterBarNumberFilter, type FilterBarNumberValue, type FilterBarProps, type FilterBarRangePreset, type FilterBarRangeProps, type FilterBarSearchProps, type FilterBarSelectMultiFilter, type FilterBarTextFilter, } from './components/FilterBar';
 export { MultiSelect, type MultiSelectOption, type MultiSelectProps, } from './components/MultiSelect';
@@ -10,6 +12,7 @@ export { DensitySwitcher, type DensitySwitcherProps } from './components/density
 export { IconMenuPicker, type IconMenuPickerProps, type IconMenuOption, } from './components/icon-menu-picker';
 export { SplitPane, type SplitPaneProps } from './layout/SplitPane';
 export { Section, DetailEmptyState, type SectionProps, type DetailEmptyStateProps, } from './layout/Section';
+export { DropdownMenu, type DropdownMenuProps, type DropdownMenuItem, } from './overlay/DropdownMenu';
 export { HoverCard, type HoverCardProps, type HoverCardPlacement } from './overlay/HoverCard';
 export { Modal, type ModalProps, type ModalSize } from './overlay/Modal';
 //# sourceMappingURL=components.d.ts.map

package/dist/components.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../src/components.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAC/E,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AACvF,OAAO,EACL,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,GACtB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,SAAS,EACT,KAAK,sBAAsB,EAC3B,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,qBAAqB,EAC1B,KAAK,wBAAwB,EAC7B,KAAK,0BAA0B,EAC/B,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,wBAAwB,EAC7B,KAAK,0BAA0B,EAC/B,KAAK,yBAAyB,EAC9B,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,oBAAoB,EACzB,KAAK,mBAAmB,EACxB,KAAK,oBAAoB,EACzB,KAAK,0BAA0B,EAC/B,KAAK,mBAAmB,GACzB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,WAAW,EACX,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,GACtB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAClF,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACrF,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AAC3F,OAAO,EACL,cAAc,EACd,KAAK,mBAAmB,EACxB,KAAK,cAAc,GACpB,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpE,OAAO,EACL,OAAO,EACP,gBAAgB,EAChB,KAAK,YAAY,EACjB,KAAK,qBAAqB,GAC3B,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,KAAK,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAC9F,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../src/components.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAC/E,OAAO,EAAE,SAAS,EAAE,KAAK,aAAa,EAAE,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAC5F,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AACvF,OAAO,EACL,SAAS,EACT,KAAK,aAAa,EAClB,KAAK,eAAe,EACpB,KAAK,oBAAoB,EACzB,KAAK,cAAc,GACpB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,GACtB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,SAAS,EACT,KAAK,sBAAsB,EAC3B,KAAK,mBAAmB,EACxB,KAAK,eAAe,EACpB,KAAK,qBAAqB,EAC1B,KAAK,wBAAwB,EAC7B,KAAK,0BAA0B,EAC/B,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,wBAAwB,EAC7B,KAAK,0BAA0B,EAC/B,KAAK,yBAAyB,EAC9B,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,oBAAoB,EACzB,KAAK,mBAAmB,EACxB,KAAK,oBAAoB,EACzB,KAAK,0BAA0B,EAC/B,KAAK,mBAAmB,GACzB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,WAAW,EACX,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,GACtB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAClF,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACrF,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AAC3F,OAAO,EACL,cAAc,EACd,KAAK,mBAAmB,EACxB,KAAK,cAAc,GACpB,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpE,OAAO,EACL,OAAO,EACP,gBAAgB,EAChB,KAAK,YAAY,EACjB,KAAK,qBAAqB,GAC3B,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,GACtB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,KAAK,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAC9F,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,iBAAiB,CAAC"}

package/dist/components.js

@@ -1,6 +1,8 @@
 import { Button, buttonVariants } from "./components/button.js";
+import { DateField } from "./components/DateField.js";
 import { DatePicker } from "./components/DatePicker.js";
 import { DateTimePicker } from "./components/DateTimePicker.js";
+import { TimeRange } from "./components/TimeRange.js";
 import { RangeSlider } from "./components/RangeSlider.js";
 import { FilterBar } from "./components/FilterBar.js";
 import { MultiSelect } from "./components/MultiSelect.js";
@@ -10,14 +12,17 @@ import { DensitySwitcher } from "./components/density-switcher.js";
 import { IconMenuPicker } from "./components/icon-menu-picker.js";
 import { SplitPane } from "./layout/SplitPane.js";
 import { DetailEmptyState, Section } from "./layout/Section.js";
+import { DropdownMenu } from "./overlay/DropdownMenu.js";
 import { HoverCard } from "./overlay/HoverCard.js";
 import { Modal } from "./overlay/Modal.js";
 export {
   Button,
+  DateField,
   DatePicker,
   DateTimePicker,
   DensitySwitcher,
   DetailEmptyState,
+  DropdownMenu,
   FilterBar,
   HoverCard,
   IconMenuPicker,
@@ -28,6 +33,7 @@ export {
   Select,
   SplitPane,
   ThemeSwitcher,
+  TimeRange,
   buttonVariants
 };
 //# sourceMappingURL=components.js.map

package/dist/components.js.map

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

package/dist/data/AnsiHtml.cjs

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const ANSI_COLORS = {
+  "30": "color:#1e1e1e",
+  "31": "color:#cd3131",
+  "32": "color:#0dbc79",
+  "33": "color:#e5e510",
+  "34": "color:#2472c8",
+  "35": "color:#bc3fbc",
+  "36": "color:#11a8cd",
+  "37": "color:#e5e5e5",
+  "90": "color:#666",
+  "91": "color:#f14c4c",
+  "92": "color:#23d18b",
+  "93": "color:#f5f543",
+  "94": "color:#3b8eea",
+  "95": "color:#d670d6",
+  "96": "color:#29b8db",
+  "97": "color:#fff",
+  "1": "font-weight:bold",
+  "2": "opacity:0.7",
+  "3": "font-style:italic",
+  "4": "text-decoration:underline"
+};
+function parseAnsi(raw) {
+  const spans = [];
+  const re = /\x1b\[([0-9;]*)m/g;
+  let last = 0;
+  let styles = [];
+  let match;
+  while ((match = re.exec(raw)) !== null) {
+    if (match.index > last) {
+      spans.push({ text: raw.slice(last, match.index), style: styles.join(";") });
+    }
+    const codes = (match[1] ?? "").split(";").filter(Boolean);
+    for (const code of codes) {
+      if (code === "0" || code === "") {
+        styles = [];
+      } else {
+        const rule = ANSI_COLORS[code];
+        if (rule) styles.push(rule);
+      }
+    }
+    last = match.index + match[0].length;
+  }
+  if (last < raw.length) {
+    spans.push({ text: raw.slice(last), style: styles.join(";") });
+  }
+  return spans;
+}
+function spanToStyle(style) {
+  const out = {};
+  for (const rule of style.split(";")) {
+    const [k, v] = rule.split(":");
+    if (!k || !v) continue;
+    const key = k.replace(/-([a-z])/g, (_, c) => c.toUpperCase());
+    out[key] = v;
+  }
+  return out;
+}
+function AnsiHtml({ text, className, as = "pre" }) {
+  const spans = parseAnsi(text);
+  const children = spans.map(
+    (s, i) => s.style ? /* @__PURE__ */ jsxRuntime.jsx("span", { style: spanToStyle(s.style), children: s.text }, i) : /* @__PURE__ */ jsxRuntime.jsx("span", { children: s.text }, i)
+  );
+  if (as === "span") return /* @__PURE__ */ jsxRuntime.jsx("span", { className, children });
+  return /* @__PURE__ */ jsxRuntime.jsx("pre", { className, children });
+}
+exports.AnsiHtml = AnsiHtml;
+//# sourceMappingURL=AnsiHtml.cjs.map

package/dist/data/AnsiHtml.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnsiHtml.cjs","sources":["../../src/data/AnsiHtml.tsx"],"sourcesContent":["const ANSI_COLORS: Record<string, string> = {\n  \"30\": \"color:#1e1e1e\",\n  \"31\": \"color:#cd3131\",\n  \"32\": \"color:#0dbc79\",\n  \"33\": \"color:#e5e510\",\n  \"34\": \"color:#2472c8\",\n  \"35\": \"color:#bc3fbc\",\n  \"36\": \"color:#11a8cd\",\n  \"37\": \"color:#e5e5e5\",\n  \"90\": \"color:#666\",\n  \"91\": \"color:#f14c4c\",\n  \"92\": \"color:#23d18b\",\n  \"93\": \"color:#f5f543\",\n  \"94\": \"color:#3b8eea\",\n  \"95\": \"color:#d670d6\",\n  \"96\": \"color:#29b8db\",\n  \"97\": \"color:#fff\",\n  \"1\": \"font-weight:bold\",\n  \"2\": \"opacity:0.7\",\n  \"3\": \"font-style:italic\",\n  \"4\": \"text-decoration:underline\",\n};\n\ntype Span = { text: string; style: string };\n\nfunction parseAnsi(raw: string): Span[] {\n  const spans: Span[] = [];\n  // eslint-disable-next-line no-control-regex\n  const re = /\\x1b\\[([0-9;]*)m/g;\n  let last = 0;\n  let styles: string[] = [];\n  let match: RegExpExecArray | null;\n\n  while ((match = re.exec(raw)) !== null) {\n    if (match.index > last) {\n      spans.push({ text: raw.slice(last, match.index), style: styles.join(\";\") });\n    }\n    const codes = (match[1] ?? \"\").split(\";\").filter(Boolean);\n    for (const code of codes) {\n      if (code === \"0\" || code === \"\") {\n        styles = [];\n      } else {\n        const rule = ANSI_COLORS[code];\n        if (rule) styles.push(rule);\n      }\n    }\n    last = match.index + match[0].length;\n  }\n\n  if (last < raw.length) {\n    spans.push({ text: raw.slice(last), style: styles.join(\";\") });\n  }\n\n  return spans;\n}\n\nfunction spanToStyle(style: string): React.CSSProperties {\n  const out: Record<string, string> = {};\n  for (const rule of style.split(\";\")) {\n    const [k, v] = rule.split(\":\");\n    if (!k || !v) continue;\n    const key = k.replace(/-([a-z])/g, (_, c: string) => c.toUpperCase());\n    out[key] = v;\n  }\n  return out as React.CSSProperties;\n}\n\nexport type AnsiHtmlProps = {\n  /** Text containing ANSI SGR escape sequences. */\n  text: string;\n  /** Classes applied to the rendered element. */\n  className?: string;\n  /** Element to render: `pre` for blocks or `span` for inline log cells. */\n  as?: \"pre\" | \"span\";\n};\n\nexport function AnsiHtml({ text, className, as = \"pre\" }: AnsiHtmlProps) {\n  const spans = parseAnsi(text);\n  const children = spans.map((s, i) =>\n    s.style ? (\n      <span key={i} style={spanToStyle(s.style)}>\n        {s.text}\n      </span>\n    ) : (\n      <span key={i}>{s.text}</span>\n    ),\n  );\n  if (as === \"span\") return <span className={className}>{children}</span>;\n  return <pre className={className}>{children}</pre>;\n}\n"],"names":["jsx"],"mappings":";;;AAAA,MAAM,cAAsC;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AACP;AAIA,SAAS,UAAU,KAAqB;AACtC,QAAM,QAAgB,CAAA;AAEtB,QAAM,KAAK;AACX,MAAI,OAAO;AACX,MAAI,SAAmB,CAAA;AACvB,MAAI;AAEJ,UAAQ,QAAQ,GAAG,KAAK,GAAG,OAAO,MAAM;AACtC,QAAI,MAAM,QAAQ,MAAM;AACtB,YAAM,KAAK,EAAE,MAAM,IAAI,MAAM,MAAM,MAAM,KAAK,GAAG,OAAO,OAAO,KAAK,GAAG,GAAG;AAAA,IAC5E;AACA,UAAM,SAAS,MAAM,CAAC,KAAK,IAAI,MAAM,GAAG,EAAE,OAAO,OAAO;AACxD,eAAW,QAAQ,OAAO;AACxB,UAAI,SAAS,OAAO,SAAS,IAAI;AAC/B,iBAAS,CAAA;AAAA,MACX,OAAO;AACL,cAAM,OAAO,YAAY,IAAI;AAC7B,YAAI,KAAM,QAAO,KAAK,IAAI;AAAA,MAC5B;AAAA,IACF;AACA,WAAO,MAAM,QAAQ,MAAM,CAAC,EAAE;AAAA,EAChC;AAEA,MAAI,OAAO,IAAI,QAAQ;AACrB,UAAM,KAAK,EAAE,MAAM,IAAI,MAAM,IAAI,GAAG,OAAO,OAAO,KAAK,GAAG,EAAA,CAAG;AAAA,EAC/D;AAEA,SAAO;AACT;AAEA,SAAS,YAAY,OAAoC;AACvD,QAAM,MAA8B,CAAA;AACpC,aAAW,QAAQ,MAAM,MAAM,GAAG,GAAG;AACnC,UAAM,CAAC,GAAG,CAAC,IAAI,KAAK,MAAM,GAAG;AAC7B,QAAI,CAAC,KAAK,CAAC,EAAG;AACd,UAAM,MAAM,EAAE,QAAQ,aAAa,CAAC,GAAG,MAAc,EAAE,aAAa;AACpE,QAAI,GAAG,IAAI;AAAA,EACb;AACA,SAAO;AACT;AAWO,SAAS,SAAS,EAAE,MAAM,WAAW,KAAK,SAAwB;AACvE,QAAM,QAAQ,UAAU,IAAI;AAC5B,QAAM,WAAW,MAAM;AAAA,IAAI,CAAC,GAAG,MAC7B,EAAE,QACAA,2BAAAA,IAAC,QAAA,EAAa,OAAO,YAAY,EAAE,KAAK,GACrC,UAAA,EAAE,QADM,CAEX,mCAEC,QAAA,EAAc,UAAA,EAAE,QAAN,CAAW;AAAA,EAAA;AAG1B,MAAI,OAAO,OAAQ,QAAOA,2BAAAA,IAAC,QAAA,EAAK,WAAuB,UAAS;AAChE,SAAOA,2BAAAA,IAAC,OAAA,EAAI,WAAuB,SAAA,CAAS;AAC9C;;"}

package/dist/data/AnsiHtml.d.ts

@@ -1,6 +1,9 @@
 export type AnsiHtmlProps = {
+    /** Text containing ANSI SGR escape sequences. */
     text: string;
+    /** Classes applied to the rendered element. */
     className?: string;
+    /** Element to render: `pre` for blocks or `span` for inline log cells. */
     as?: "pre" | "span";
 };
 export declare function AnsiHtml({ text, className, as }: AnsiHtmlProps): import("react/jsx-runtime").JSX.Element;

package/dist/data/AnsiHtml.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AnsiHtml.d.ts","sourceRoot":"","sources":["../../src/data/AnsiHtml.tsx"],"names":[],"mappings":"AAmEA,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;CACrB,CAAC;AAEF,wBAAgB,QAAQ,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAU,EAAE,EAAE,aAAa,2CAatE"}
+{"version":3,"file":"AnsiHtml.d.ts","sourceRoot":"","sources":["../../src/data/AnsiHtml.tsx"],"names":[],"mappings":"AAmEA,MAAM,MAAM,aAAa,GAAG;IAC1B,iDAAiD;IACjD,IAAI,EAAE,MAAM,CAAC;IACb,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0EAA0E;IAC1E,EAAE,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;CACrB,CAAC;AAEF,wBAAgB,QAAQ,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAU,EAAE,EAAE,aAAa,2CAatE"}

package/dist/data/AnsiHtml.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnsiHtml.js","sources":["../../src/data/AnsiHtml.tsx"],"sourcesContent":["const ANSI_COLORS: Record<string, string> = {\n  \"30\": \"color:#1e1e1e\",\n  \"31\": \"color:#cd3131\",\n  \"32\": \"color:#0dbc79\",\n  \"33\": \"color:#e5e510\",\n  \"34\": \"color:#2472c8\",\n  \"35\": \"color:#bc3fbc\",\n  \"36\": \"color:#11a8cd\",\n  \"37\": \"color:#e5e5e5\",\n  \"90\": \"color:#666\",\n  \"91\": \"color:#f14c4c\",\n  \"92\": \"color:#23d18b\",\n  \"93\": \"color:#f5f543\",\n  \"94\": \"color:#3b8eea\",\n  \"95\": \"color:#d670d6\",\n  \"96\": \"color:#29b8db\",\n  \"97\": \"color:#fff\",\n  \"1\": \"font-weight:bold\",\n  \"2\": \"opacity:0.7\",\n  \"3\": \"font-style:italic\",\n  \"4\": \"text-decoration:underline\",\n};\n\ntype Span = { text: string; style: string };\n\nfunction parseAnsi(raw: string): Span[] {\n  const spans: Span[] = [];\n  // eslint-disable-next-line no-control-regex\n  const re = /\\x1b\\[([0-9;]*)m/g;\n  let last = 0;\n  let styles: string[] = [];\n  let match: RegExpExecArray | null;\n\n  while ((match = re.exec(raw)) !== null) {\n    if (match.index > last) {\n      spans.push({ text: raw.slice(last, match.index), style: styles.join(\";\") });\n    }\n    const codes = (match[1] ?? \"\").split(\";\").filter(Boolean);\n    for (const code of codes) {\n      if (code === \"0\" || code === \"\") {\n        styles = [];\n      } else {\n        const rule = ANSI_COLORS[code];\n        if (rule) styles.push(rule);\n      }\n    }\n    last = match.index + match[0].length;\n  }\n\n  if (last < raw.length) {\n    spans.push({ text: raw.slice(last), style: styles.join(\";\") });\n  }\n\n  return spans;\n}\n\nfunction spanToStyle(style: string): React.CSSProperties {\n  const out: Record<string, string> = {};\n  for (const rule of style.split(\";\")) {\n    const [k, v] = rule.split(\":\");\n    if (!k || !v) continue;\n    const key = k.replace(/-([a-z])/g, (_, c: string) => c.toUpperCase());\n    out[key] = v;\n  }\n  return out as React.CSSProperties;\n}\n\nexport type AnsiHtmlProps = {\n  text: string;\n  className?: string;\n  as?: \"pre\" | \"span\";\n};\n\nexport function AnsiHtml({ text, className, as = \"pre\" }: AnsiHtmlProps) {\n  const spans = parseAnsi(text);\n  const children = spans.map((s, i) =>\n    s.style ? (\n      <span key={i} style={spanToStyle(s.style)}>\n        {s.text}\n      </span>\n    ) : (\n      <span key={i}>{s.text}</span>\n    ),\n  );\n  if (as === \"span\") return <span className={className}>{children}</span>;\n  return <pre className={className}>{children}</pre>;\n}\n"],"names":[],"mappings":";AAAA,MAAM,cAAsC;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AACP;AAIA,SAAS,UAAU,KAAqB;AACtC,QAAM,QAAgB,CAAA;AAEtB,QAAM,KAAK;AACX,MAAI,OAAO;AACX,MAAI,SAAmB,CAAA;AACvB,MAAI;AAEJ,UAAQ,QAAQ,GAAG,KAAK,GAAG,OAAO,MAAM;AACtC,QAAI,MAAM,QAAQ,MAAM;AACtB,YAAM,KAAK,EAAE,MAAM,IAAI,MAAM,MAAM,MAAM,KAAK,GAAG,OAAO,OAAO,KAAK,GAAG,GAAG;AAAA,IAC5E;AACA,UAAM,SAAS,MAAM,CAAC,KAAK,IAAI,MAAM,GAAG,EAAE,OAAO,OAAO;AACxD,eAAW,QAAQ,OAAO;AACxB,UAAI,SAAS,OAAO,SAAS,IAAI;AAC/B,iBAAS,CAAA;AAAA,MACX,OAAO;AACL,cAAM,OAAO,YAAY,IAAI;AAC7B,YAAI,KAAM,QAAO,KAAK,IAAI;AAAA,MAC5B;AAAA,IACF;AACA,WAAO,MAAM,QAAQ,MAAM,CAAC,EAAE;AAAA,EAChC;AAEA,MAAI,OAAO,IAAI,QAAQ;AACrB,UAAM,KAAK,EAAE,MAAM,IAAI,MAAM,IAAI,GAAG,OAAO,OAAO,KAAK,GAAG,EAAA,CAAG;AAAA,EAC/D;AAEA,SAAO;AACT;AAEA,SAAS,YAAY,OAAoC;AACvD,QAAM,MAA8B,CAAA;AACpC,aAAW,QAAQ,MAAM,MAAM,GAAG,GAAG;AACnC,UAAM,CAAC,GAAG,CAAC,IAAI,KAAK,MAAM,GAAG;AAC7B,QAAI,CAAC,KAAK,CAAC,EAAG;AACd,UAAM,MAAM,EAAE,QAAQ,aAAa,CAAC,GAAG,MAAc,EAAE,aAAa;AACpE,QAAI,GAAG,IAAI;AAAA,EACb;AACA,SAAO;AACT;AAQO,SAAS,SAAS,EAAE,MAAM,WAAW,KAAK,SAAwB;AACvE,QAAM,QAAQ,UAAU,IAAI;AAC5B,QAAM,WAAW,MAAM;AAAA,IAAI,CAAC,GAAG,MAC7B,EAAE,QACA,oBAAC,QAAA,EAAa,OAAO,YAAY,EAAE,KAAK,GACrC,UAAA,EAAE,QADM,CAEX,wBAEC,QAAA,EAAc,UAAA,EAAE,QAAN,CAAW;AAAA,EAAA;AAG1B,MAAI,OAAO,OAAQ,QAAO,oBAAC,QAAA,EAAK,WAAuB,UAAS;AAChE,SAAO,oBAAC,OAAA,EAAI,WAAuB,SAAA,CAAS;AAC9C;"}
+{"version":3,"file":"AnsiHtml.js","sources":["../../src/data/AnsiHtml.tsx"],"sourcesContent":["const ANSI_COLORS: Record<string, string> = {\n  \"30\": \"color:#1e1e1e\",\n  \"31\": \"color:#cd3131\",\n  \"32\": \"color:#0dbc79\",\n  \"33\": \"color:#e5e510\",\n  \"34\": \"color:#2472c8\",\n  \"35\": \"color:#bc3fbc\",\n  \"36\": \"color:#11a8cd\",\n  \"37\": \"color:#e5e5e5\",\n  \"90\": \"color:#666\",\n  \"91\": \"color:#f14c4c\",\n  \"92\": \"color:#23d18b\",\n  \"93\": \"color:#f5f543\",\n  \"94\": \"color:#3b8eea\",\n  \"95\": \"color:#d670d6\",\n  \"96\": \"color:#29b8db\",\n  \"97\": \"color:#fff\",\n  \"1\": \"font-weight:bold\",\n  \"2\": \"opacity:0.7\",\n  \"3\": \"font-style:italic\",\n  \"4\": \"text-decoration:underline\",\n};\n\ntype Span = { text: string; style: string };\n\nfunction parseAnsi(raw: string): Span[] {\n  const spans: Span[] = [];\n  // eslint-disable-next-line no-control-regex\n  const re = /\\x1b\\[([0-9;]*)m/g;\n  let last = 0;\n  let styles: string[] = [];\n  let match: RegExpExecArray | null;\n\n  while ((match = re.exec(raw)) !== null) {\n    if (match.index > last) {\n      spans.push({ text: raw.slice(last, match.index), style: styles.join(\";\") });\n    }\n    const codes = (match[1] ?? \"\").split(\";\").filter(Boolean);\n    for (const code of codes) {\n      if (code === \"0\" || code === \"\") {\n        styles = [];\n      } else {\n        const rule = ANSI_COLORS[code];\n        if (rule) styles.push(rule);\n      }\n    }\n    last = match.index + match[0].length;\n  }\n\n  if (last < raw.length) {\n    spans.push({ text: raw.slice(last), style: styles.join(\";\") });\n  }\n\n  return spans;\n}\n\nfunction spanToStyle(style: string): React.CSSProperties {\n  const out: Record<string, string> = {};\n  for (const rule of style.split(\";\")) {\n    const [k, v] = rule.split(\":\");\n    if (!k || !v) continue;\n    const key = k.replace(/-([a-z])/g, (_, c: string) => c.toUpperCase());\n    out[key] = v;\n  }\n  return out as React.CSSProperties;\n}\n\nexport type AnsiHtmlProps = {\n  /** Text containing ANSI SGR escape sequences. */\n  text: string;\n  /** Classes applied to the rendered element. */\n  className?: string;\n  /** Element to render: `pre` for blocks or `span` for inline log cells. */\n  as?: \"pre\" | \"span\";\n};\n\nexport function AnsiHtml({ text, className, as = \"pre\" }: AnsiHtmlProps) {\n  const spans = parseAnsi(text);\n  const children = spans.map((s, i) =>\n    s.style ? (\n      <span key={i} style={spanToStyle(s.style)}>\n        {s.text}\n      </span>\n    ) : (\n      <span key={i}>{s.text}</span>\n    ),\n  );\n  if (as === \"span\") return <span className={className}>{children}</span>;\n  return <pre className={className}>{children}</pre>;\n}\n"],"names":[],"mappings":";AAAA,MAAM,cAAsC;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AACP;AAIA,SAAS,UAAU,KAAqB;AACtC,QAAM,QAAgB,CAAA;AAEtB,QAAM,KAAK;AACX,MAAI,OAAO;AACX,MAAI,SAAmB,CAAA;AACvB,MAAI;AAEJ,UAAQ,QAAQ,GAAG,KAAK,GAAG,OAAO,MAAM;AACtC,QAAI,MAAM,QAAQ,MAAM;AACtB,YAAM,KAAK,EAAE,MAAM,IAAI,MAAM,MAAM,MAAM,KAAK,GAAG,OAAO,OAAO,KAAK,GAAG,GAAG;AAAA,IAC5E;AACA,UAAM,SAAS,MAAM,CAAC,KAAK,IAAI,MAAM,GAAG,EAAE,OAAO,OAAO;AACxD,eAAW,QAAQ,OAAO;AACxB,UAAI,SAAS,OAAO,SAAS,IAAI;AAC/B,iBAAS,CAAA;AAAA,MACX,OAAO;AACL,cAAM,OAAO,YAAY,IAAI;AAC7B,YAAI,KAAM,QAAO,KAAK,IAAI;AAAA,MAC5B;AAAA,IACF;AACA,WAAO,MAAM,QAAQ,MAAM,CAAC,EAAE;AAAA,EAChC;AAEA,MAAI,OAAO,IAAI,QAAQ;AACrB,UAAM,KAAK,EAAE,MAAM,IAAI,MAAM,IAAI,GAAG,OAAO,OAAO,KAAK,GAAG,EAAA,CAAG;AAAA,EAC/D;AAEA,SAAO;AACT;AAEA,SAAS,YAAY,OAAoC;AACvD,QAAM,MAA8B,CAAA;AACpC,aAAW,QAAQ,MAAM,MAAM,GAAG,GAAG;AACnC,UAAM,CAAC,GAAG,CAAC,IAAI,KAAK,MAAM,GAAG;AAC7B,QAAI,CAAC,KAAK,CAAC,EAAG;AACd,UAAM,MAAM,EAAE,QAAQ,aAAa,CAAC,GAAG,MAAc,EAAE,aAAa;AACpE,QAAI,GAAG,IAAI;AAAA,EACb;AACA,SAAO;AACT;AAWO,SAAS,SAAS,EAAE,MAAM,WAAW,KAAK,SAAwB;AACvE,QAAM,QAAQ,UAAU,IAAI;AAC5B,QAAM,WAAW,MAAM;AAAA,IAAI,CAAC,GAAG,MAC7B,EAAE,QACA,oBAAC,QAAA,EAAa,OAAO,YAAY,EAAE,KAAK,GACrC,UAAA,EAAE,QADM,CAEX,wBAEC,QAAA,EAAc,UAAA,EAAE,QAAN,CAAW;AAAA,EAAA;AAG1B,MAAI,OAAO,OAAQ,QAAO,oBAAC,QAAA,EAAK,WAAuB,UAAS;AAChE,SAAO,oBAAC,OAAA,EAAI,WAAuB,SAAA,CAAS;AAC9C;"}