@simplysm/solid 13.0.0-beta.6 → 13.0.1

package/dist/components/form-control/state-preset/StatePreset.js

@@ -1,62 +1,43 @@
+import { template as _$template } from "solid-js/web";
+import { delegateEvents as _$delegateEvents } from "solid-js/web";
+import { setAttribute as _$setAttribute } from "solid-js/web";
+import { style as _$style } from "solid-js/web";
+import { className as _$className } from "solid-js/web";
+import { effect as _$effect } from "solid-js/web";
+import { use as _$use } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
+var _tmpl$ = /* @__PURE__ */ _$template(`<input type=text placeholder=\uC774\uB984...>`), _tmpl$2 = /* @__PURE__ */ _$template(`<div><button type=button title="\uD504\uB9AC\uC14B \uCD94\uAC00">`), _tmpl$3 = /* @__PURE__ */ _$template(`<span><button type=button></button><button type=button title="\uD604\uC7AC \uC0C1\uD0DC\uB85C \uB36E\uC5B4\uC4F0\uAE30"></button><button type=button title="\uD504\uB9AC\uC14B \uC0AD\uC81C">`);
 import { createSignal, For, Show, splitProps } from "solid-js";
 import { twMerge } from "tailwind-merge";
 import clsx from "clsx";
 import { IconDeviceFloppy, IconStar, IconX } from "@tabler/icons-solidjs";
 import { objClone, objEqual } from "@simplysm/core-common";
-import { usePersisted } from "../../../hooks/usePersisted";
-import { useNotification } from "../../feedback/notification/NotificationContext";
-import { Icon } from "../../display/Icon";
-import { textPlaceholder } from "../../../styles/tokens.styles";
+import { useSyncConfig } from "../../../hooks/useSyncConfig.js";
+import { useNotification } from "../../feedback/notification/NotificationContext.js";
+import { Icon } from "../../display/Icon.js";
+import { textPlaceholder } from "../../../styles/tokens.styles.js";
 const baseClass = clsx("inline-flex items-center gap-1.5", "flex-wrap");
-const chipClass = clsx(
-  "inline-flex items-center gap-1",
-  "rounded-full",
-  "bg-base-200 dark:bg-base-700",
-  "text-base-800 dark:text-base-200",
-  "cursor-default"
-);
+const chipClass = clsx("inline-flex items-center gap-1", "rounded-full", "bg-base-200 dark:bg-base-700", "text-base-800 dark:text-base-200", "cursor-default");
 const chipDefaultClass = "px-3 py-1";
 const chipSizeClasses = {
   sm: "px-2 py-0.5 text-sm",
   lg: "px-4 py-2"
 };
 const chipNameBtnClass = clsx("cursor-pointer", "hover:underline", "focus:outline-none");
-const iconBtnClass = clsx(
-  "inline-flex items-center justify-center",
-  "rounded-full",
-  "cursor-pointer",
-  "transition-colors",
-  "focus:outline-none",
-  "hover:bg-base-300 dark:hover:bg-base-600"
-);
+const iconBtnClass = clsx("inline-flex items-center justify-center", "rounded-full", "cursor-pointer", "transition-colors", "focus:outline-none", "hover:bg-base-300 dark:hover:bg-base-600");
 const iconBtnDefaultClass = "p-0.5";
 const iconBtnSizeClasses = {
   sm: "p-px",
   lg: "p-1"
 };
-const starBtnClass = clsx(
-  "inline-flex items-center justify-center",
-  "rounded-full",
-  "cursor-pointer",
-  "transition-colors",
-  "focus:outline-none",
-  "text-warning-500",
-  "hover:bg-warning-100 dark:hover:bg-warning-900/40"
-);
+const starBtnClass = clsx("inline-flex items-center justify-center", "rounded-full", "cursor-pointer", "transition-colors", "focus:outline-none", "text-warning-500", "hover:bg-warning-100 dark:hover:bg-warning-900/40");
 const starBtnDefaultClass = "p-1";
 const starBtnSizeClasses = {
   sm: "p-0.5",
   lg: "p-1.5"
 };
-const inputClass = clsx(
-  "rounded-full",
-  "bg-base-200 dark:bg-base-700",
-  "text-base-800 dark:text-base-200",
-  "border border-transparent",
-  "focus:ring-1 focus:ring-primary-400",
-  "focus:outline-none",
-  textPlaceholder
-);
+const inputClass = clsx("rounded-full", "bg-base-200 dark:bg-base-700", "text-base-800 dark:text-base-200", "border border-transparent", "focus:ring-1 focus:ring-primary-400", "focus:outline-none", textPlaceholder);
 const inputDefaultClass = "px-3 py-1 w-24";
 const inputSizeClasses = {
   sm: "px-2 py-0.5 w-20 text-sm",
@@ -66,7 +47,7 @@ const iconSize = "0.85em";
 function StatePresetInner(props) {
   const [local] = splitProps(props, ["presetKey", "value", "onValueChange", "size", "class", "style"]);
   const notification = useNotification();
-  const [presets, setPresets] = usePersisted(`state-preset.${local.presetKey}`, []);
+  const [presets, setPresets] = useSyncConfig(`state-preset.${local.presetKey}`, []);
   const [adding, setAdding] = createSignal(false);
   const [inputValue, setInputValue] = createSignal("");
   function handleStartAdd() {
@@ -104,7 +85,10 @@ function StatePresetInner(props) {
   function handleOverwrite(index) {
     const snapshot = [...presets()];
     const presetName = snapshot[index].name;
-    const updated = snapshot.map((p, i) => i === index ? { ...p, state: objClone(local.value) } : p);
+    const updated = snapshot.map((p, i) => i === index ? {
+      ...p,
+      state: objClone(local.value)
+    } : p);
     setPresets(updated);
     const notiId = notification.info("\uD504\uB9AC\uC14B \uB36E\uC5B4\uC4F0\uAE30", `"${presetName}" \uD504\uB9AC\uC14B\uC774 \uD604\uC7AC \uC0C1\uD0DC\uB85C \uC5C5\uB370\uC774\uD2B8\uB418\uC5C8\uC2B5\uB2C8\uB2E4.`, {
       action: {
@@ -145,50 +129,81 @@ function StatePresetInner(props) {
   const resolvedIconBtnClass = () => twMerge(iconBtnClass, local.size ? iconBtnSizeClasses[local.size] : iconBtnDefaultClass);
   const resolvedStarBtnClass = () => twMerge(starBtnClass, local.size ? starBtnSizeClasses[local.size] : starBtnDefaultClass);
   const resolvedInputClass = () => twMerge(inputClass, local.size ? inputSizeClasses[local.size] : inputDefaultClass);
-  return /* @__PURE__ */ React.createElement("div", { class: containerClass(), style: local.style }, /* @__PURE__ */ React.createElement("button", { type: "button", class: resolvedStarBtnClass(), onClick: handleStartAdd, title: "\uD504\uB9AC\uC14B \uCD94\uAC00" }, /* @__PURE__ */ React.createElement(Icon, { icon: IconStar, size: iconSize })), /* @__PURE__ */ React.createElement(For, { each: presets() }, (preset, index) => /* @__PURE__ */ React.createElement("span", { class: resolvedChipClass() }, /* @__PURE__ */ React.createElement(
-    "button",
-    {
-      type: "button",
-      class: chipNameBtnClass,
-      onClick: () => handleRestore(preset),
-      title: `"${preset.name}" \uD504\uB9AC\uC14B \uC801\uC6A9`
-    },
-    preset.name
-  ), /* @__PURE__ */ React.createElement(
-    "button",
-    {
-      type: "button",
-      class: resolvedIconBtnClass(),
-      onClick: () => handleOverwrite(index()),
-      title: "\uD604\uC7AC \uC0C1\uD0DC\uB85C \uB36E\uC5B4\uC4F0\uAE30"
-    },
-    /* @__PURE__ */ React.createElement(Icon, { icon: IconDeviceFloppy, size: iconSize })
-  ), /* @__PURE__ */ React.createElement(
-    "button",
-    {
-      type: "button",
-      class: resolvedIconBtnClass(),
-      onClick: () => handleDelete(index()),
-      title: "\uD504\uB9AC\uC14B \uC0AD\uC81C"
-    },
-    /* @__PURE__ */ React.createElement(Icon, { icon: IconX, size: iconSize })
-  ))), /* @__PURE__ */ React.createElement(Show, { when: adding() }, /* @__PURE__ */ React.createElement(
-    "input",
-    {
-      ref: (el) => {
-        requestAnimationFrame(() => el.focus());
+  return (() => {
+    var _el$ = _tmpl$2(), _el$2 = _el$.firstChild;
+    _el$2.$$click = handleStartAdd;
+    _$insert(_el$2, _$createComponent(Icon, {
+      icon: IconStar,
+      size: iconSize
+    }));
+    _$insert(_el$, _$createComponent(For, {
+      get each() {
+        return presets();
       },
-      type: "text",
-      class: resolvedInputClass(),
-      placeholder: "\uC774\uB984...",
-      value: inputValue(),
-      onInput: (e) => setInputValue(e.currentTarget.value),
-      onKeyDown: handleInputKeyDown,
-      onBlur: () => inputValue().trim() ? handleConfirmAdd() : handleCancelAdd()
-    }
-  )));
+      children: (preset, index) => (() => {
+        var _el$4 = _tmpl$3(), _el$5 = _el$4.firstChild, _el$6 = _el$5.nextSibling, _el$7 = _el$6.nextSibling;
+        _el$5.$$click = () => handleRestore(preset);
+        _$className(_el$5, chipNameBtnClass);
+        _$insert(_el$5, () => preset.name);
+        _el$6.$$click = () => handleOverwrite(index());
+        _$insert(_el$6, _$createComponent(Icon, {
+          icon: IconDeviceFloppy,
+          size: iconSize
+        }));
+        _el$7.$$click = () => handleDelete(index());
+        _$insert(_el$7, _$createComponent(Icon, {
+          icon: IconX,
+          size: iconSize
+        }));
+        _$effect((_p$) => {
+          var _v$4 = resolvedChipClass(), _v$5 = `"${preset.name}" \uD504\uB9AC\uC14B \uC801\uC6A9`, _v$6 = resolvedIconBtnClass(), _v$7 = resolvedIconBtnClass();
+          _v$4 !== _p$.e && _$className(_el$4, _p$.e = _v$4);
+          _v$5 !== _p$.t && _$setAttribute(_el$5, "title", _p$.t = _v$5);
+          _v$6 !== _p$.a && _$className(_el$6, _p$.a = _v$6);
+          _v$7 !== _p$.o && _$className(_el$7, _p$.o = _v$7);
+          return _p$;
+        }, {
+          e: void 0,
+          t: void 0,
+          a: void 0,
+          o: void 0
+        });
+        return _el$4;
+      })()
+    }), null);
+    _$insert(_el$, _$createComponent(Show, {
+      get when() {
+        return adding();
+      },
+      get children() {
+        var _el$3 = _tmpl$();
+        _el$3.addEventListener("blur", () => inputValue().trim() ? handleConfirmAdd() : handleCancelAdd());
+        _el$3.$$keydown = handleInputKeyDown;
+        _el$3.$$input = (e) => setInputValue(e.currentTarget.value);
+        _$use((el) => {
+          requestAnimationFrame(() => el.focus());
+        }, _el$3);
+        _$effect(() => _$className(_el$3, resolvedInputClass()));
+        _$effect(() => _el$3.value = inputValue());
+        return _el$3;
+      }
+    }), null);
+    _$effect((_p$) => {
+      var _v$ = containerClass(), _v$2 = local.style, _v$3 = resolvedStarBtnClass();
+      _v$ !== _p$.e && _$className(_el$, _p$.e = _v$);
+      _p$.t = _$style(_el$, _v$2, _p$.t);
+      _v$3 !== _p$.a && _$className(_el$2, _p$.a = _v$3);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0
+    });
+    return _el$;
+  })();
 }
 const StatePreset = StatePresetInner;
+_$delegateEvents(["click", "input", "keydown"]);
 export {
   StatePreset
 };

package/dist/components/form-control/state-preset/StatePreset.js.map

@@ -1,7 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/form-control/state-preset/StatePreset.tsx"],
-  "sourcesContent": ["import { createSignal, For, Show, splitProps } from \"solid-js\";\nimport type { JSX } from \"solid-js\";\nimport { twMerge } from \"tailwind-merge\";\nimport clsx from \"clsx\";\nimport { IconDeviceFloppy, IconStar, IconX } from \"@tabler/icons-solidjs\";\nimport { objClone, objEqual } from \"@simplysm/core-common\";\nimport { usePersisted } from \"../../../hooks/usePersisted\";\nimport { useNotification } from \"../../feedback/notification/NotificationContext\";\nimport { Icon } from \"../../display/Icon\";\nimport { textPlaceholder } from \"../../../styles/tokens.styles\";\nimport type { ComponentSize } from \"../../../styles/tokens.styles\";\n\n// \u2500\u2500 Types \u2500\u2500\n\ninterface StatePresetItem<T> {\n  name: string;\n  state: T;\n}\n\ntype StatePresetSize = ComponentSize;\n\nexport interface StatePresetProps<T> {\n  presetKey: string;\n  value: T;\n  onValueChange: (value: T) => void;\n  size?: StatePresetSize;\n  class?: string;\n  style?: JSX.CSSProperties;\n}\n\n// \u2500\u2500 Style constants \u2500\u2500\n\nconst baseClass = clsx(\"inline-flex items-center gap-1.5\", \"flex-wrap\");\n\nconst chipClass = clsx(\n  \"inline-flex items-center gap-1\",\n  \"rounded-full\",\n  \"bg-base-200 dark:bg-base-700\",\n  \"text-base-800 dark:text-base-200\",\n  \"cursor-default\",\n);\n\nconst chipDefaultClass = \"px-3 py-1\";\n\nconst chipSizeClasses: Record<StatePresetSize, string> = {\n  sm: \"px-2 py-0.5 text-sm\",\n  lg: \"px-4 py-2\",\n};\n\nconst chipNameBtnClass = clsx(\"cursor-pointer\", \"hover:underline\", \"focus:outline-none\");\n\nconst iconBtnClass = clsx(\n  \"inline-flex items-center justify-center\",\n  \"rounded-full\",\n  \"cursor-pointer\",\n  \"transition-colors\",\n  \"focus:outline-none\",\n  \"hover:bg-base-300 dark:hover:bg-base-600\",\n);\n\nconst iconBtnDefaultClass = \"p-0.5\";\n\nconst iconBtnSizeClasses: Record<StatePresetSize, string> = {\n  sm: \"p-px\",\n  lg: \"p-1\",\n};\n\nconst starBtnClass = clsx(\n  \"inline-flex items-center justify-center\",\n  \"rounded-full\",\n  \"cursor-pointer\",\n  \"transition-colors\",\n  \"focus:outline-none\",\n  \"text-warning-500\",\n  \"hover:bg-warning-100 dark:hover:bg-warning-900/40\",\n);\n\nconst starBtnDefaultClass = \"p-1\";\n\nconst starBtnSizeClasses: Record<StatePresetSize, string> = {\n  sm: \"p-0.5\",\n  lg: \"p-1.5\",\n};\n\nconst inputClass = clsx(\n  \"rounded-full\",\n  \"bg-base-200 dark:bg-base-700\",\n  \"text-base-800 dark:text-base-200\",\n  \"border border-transparent\",\n  \"focus:ring-1 focus:ring-primary-400\",\n  \"focus:outline-none\",\n  textPlaceholder,\n);\n\nconst inputDefaultClass = \"px-3 py-1 w-24\";\n\nconst inputSizeClasses: Record<StatePresetSize, string> = {\n  sm: \"px-2 py-0.5 w-20 text-sm\",\n  lg: \"px-4 py-2 w-32\",\n};\n\nconst iconSize = \"0.85em\";\n\n// \u2500\u2500 Component \u2500\u2500\n\nfunction StatePresetInner<T>(props: StatePresetProps<T>): JSX.Element {\n  const [local] = splitProps(props, [\"presetKey\", \"value\", \"onValueChange\", \"size\", \"class\", \"style\"]);\n\n  const notification = useNotification();\n\n  // presetKey\uB294 \uB9C8\uC6B4\uD2B8 \uC2DC \uD55C \uBC88\uB9CC \uC124\uC815\uB418\uB294 \uC2DD\uBCC4\uC790\uC774\uBBC0\uB85C \uC989\uC2DC \uD3C9\uAC00\uD558\uC5EC \uCEA1\uCC98\n  /* eslint-disable solid/reactivity */\n  const [presets, setPresets] = usePersisted<StatePresetItem<T>[]>(`state-preset.${local.presetKey}`, []);\n  /* eslint-enable solid/reactivity */\n  const [adding, setAdding] = createSignal(false);\n  const [inputValue, setInputValue] = createSignal(\"\");\n\n  // \u2500\u2500 Handlers \u2500\u2500\n\n  function handleStartAdd(): void {\n    setAdding(true);\n    setInputValue(\"\");\n  }\n\n  function handleCancelAdd(): void {\n    setAdding(false);\n    setInputValue(\"\");\n  }\n\n  function handleConfirmAdd(): void {\n    const name = inputValue().trim();\n    if (!name) {\n      handleCancelAdd();\n      return;\n    }\n\n    if (presets().some((p) => p.name === name)) {\n      notification.warning(\"\uC774\uB984 \uC911\uBCF5\", \"\uAC19\uC740 \uC774\uB984\uC758 \uD504\uB9AC\uC14B\uC774 \uC774\uBBF8 \uC874\uC7AC\uD569\uB2C8\uB2E4.\");\n      return;\n    }\n\n    const newPreset: StatePresetItem<T> = {\n      name,\n      state: objClone(local.value),\n    };\n    setPresets([...presets(), newPreset]);\n    notification.info(\"\uD504\uB9AC\uC14B \uC800\uC7A5\", `\"${name}\" \uD504\uB9AC\uC14B\uC774 \uC800\uC7A5\uB418\uC5C8\uC2B5\uB2C8\uB2E4.`);\n    setAdding(false);\n    setInputValue(\"\");\n  }\n\n  function handleRestore(preset: StatePresetItem<T>): void {\n    if (!objEqual(local.value, preset.state)) {\n      local.onValueChange(objClone(preset.state));\n    }\n  }\n\n  function handleOverwrite(index: number): void {\n    const snapshot = [...presets()];\n    const presetName = snapshot[index].name;\n\n    const updated = snapshot.map((p, i) => (i === index ? { ...p, state: objClone(local.value) } : p));\n    setPresets(updated);\n\n    const notiId = notification.info(\"\uD504\uB9AC\uC14B \uB36E\uC5B4\uC4F0\uAE30\", `\"${presetName}\" \uD504\uB9AC\uC14B\uC774 \uD604\uC7AC \uC0C1\uD0DC\uB85C \uC5C5\uB370\uC774\uD2B8\uB418\uC5C8\uC2B5\uB2C8\uB2E4.`, {\n      action: {\n        label: \"\uC2E4\uD589 \uCDE8\uC18C\",\n        onClick: () => {\n          setPresets(snapshot);\n          notification.remove(notiId);\n        },\n      },\n    });\n  }\n\n  function handleDelete(index: number): void {\n    const snapshot = [...presets()];\n    const presetName = snapshot[index].name;\n\n    const updated = snapshot.filter((_, i) => i !== index);\n    setPresets(updated);\n\n    const notiId = notification.info(\"\uD504\uB9AC\uC14B \uC0AD\uC81C\", `\"${presetName}\" \uD504\uB9AC\uC14B\uC774 \uC0AD\uC81C\uB418\uC5C8\uC2B5\uB2C8\uB2E4.`, {\n      action: {\n        label: \"\uC2E4\uD589 \uCDE8\uC18C\",\n        onClick: () => {\n          setPresets(snapshot);\n          notification.remove(notiId);\n        },\n      },\n    });\n  }\n\n  function handleInputKeyDown(e: KeyboardEvent): void {\n    if (e.key === \"Enter\") {\n      e.preventDefault();\n      handleConfirmAdd();\n    } else if (e.key === \"Escape\") {\n      e.preventDefault();\n      handleCancelAdd();\n    }\n  }\n\n  // \u2500\u2500 Render \u2500\u2500\n\n  const containerClass = () => twMerge(baseClass, local.class);\n\n  const resolvedChipClass = () => twMerge(chipClass, local.size ? chipSizeClasses[local.size] : chipDefaultClass);\n\n  const resolvedIconBtnClass = () =>\n    twMerge(iconBtnClass, local.size ? iconBtnSizeClasses[local.size] : iconBtnDefaultClass);\n\n  const resolvedStarBtnClass = () =>\n    twMerge(starBtnClass, local.size ? starBtnSizeClasses[local.size] : starBtnDefaultClass);\n\n  const resolvedInputClass = () => twMerge(inputClass, local.size ? inputSizeClasses[local.size] : inputDefaultClass);\n\n  return (\n    <div class={containerClass()} style={local.style}>\n      {/* Star button - add preset */}\n      <button type=\"button\" class={resolvedStarBtnClass()} onClick={handleStartAdd} title=\"\uD504\uB9AC\uC14B \uCD94\uAC00\">\n        <Icon icon={IconStar} size={iconSize} />\n      </button>\n\n      {/* Preset chips */}\n      <For each={presets()}>\n        {(preset, index) => (\n          <span class={resolvedChipClass()}>\n            <button\n              type=\"button\"\n              class={chipNameBtnClass}\n              onClick={() => handleRestore(preset)}\n              title={`\"${preset.name}\" \uD504\uB9AC\uC14B \uC801\uC6A9`}\n            >\n              {preset.name}\n            </button>\n            <button\n              type=\"button\"\n              class={resolvedIconBtnClass()}\n              onClick={() => handleOverwrite(index())}\n              title=\"\uD604\uC7AC \uC0C1\uD0DC\uB85C \uB36E\uC5B4\uC4F0\uAE30\"\n            >\n              <Icon icon={IconDeviceFloppy} size={iconSize} />\n            </button>\n            <button\n              type=\"button\"\n              class={resolvedIconBtnClass()}\n              onClick={() => handleDelete(index())}\n              title=\"\uD504\uB9AC\uC14B \uC0AD\uC81C\"\n            >\n              <Icon icon={IconX} size={iconSize} />\n            </button>\n          </span>\n        )}\n      </For>\n\n      {/* Inline input for naming a new preset */}\n      <Show when={adding()}>\n        <input\n          ref={(el) => {\n            // Autofocus when input appears\n            requestAnimationFrame(() => el.focus());\n          }}\n          type=\"text\"\n          class={resolvedInputClass()}\n          placeholder=\"\uC774\uB984...\"\n          value={inputValue()}\n          onInput={(e) => setInputValue(e.currentTarget.value)}\n          onKeyDown={handleInputKeyDown}\n          onBlur={() => (inputValue().trim() ? handleConfirmAdd() : handleCancelAdd())}\n        />\n      </Show>\n    </div>\n  );\n}\n\nexport const StatePreset = StatePresetInner as <T>(props: StatePresetProps<T>) => JSX.Element;\n"],
-  "mappings": "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",
-  "names": []
+  "mappings": "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",
+  "names": ["createSignal", "For", "Show", "splitProps", "twMerge", "clsx", "IconDeviceFloppy", "IconStar", "IconX", "objClone", "objEqual", "useSyncConfig", "useNotification", "Icon", "textPlaceholder", "baseClass", "chipClass", "chipDefaultClass", "chipSizeClasses", "sm", "lg", "chipNameBtnClass", "iconBtnClass", "iconBtnDefaultClass", "iconBtnSizeClasses", "starBtnClass", "starBtnDefaultClass", "starBtnSizeClasses", "inputClass", "inputDefaultClass", "inputSizeClasses", "iconSize", "StatePresetInner", "props", "local", "notification", "presets", "setPresets", "presetKey", "adding", "setAdding", "inputValue", "setInputValue", "handleStartAdd", "handleCancelAdd", "handleConfirmAdd", "name", "trim", "some", "p", "warning", "newPreset", "state", "value", "info", "handleRestore", "preset", "onValueChange", "handleOverwrite", "index", "snapshot", "presetName", "updated", "map", "i", "notiId", "action", "label", "onClick", "remove", "handleDelete", "filter", "_", "handleInputKeyDown", "e", "key", "preventDefault", "containerClass", "class", "resolvedChipClass", "size", "resolvedIconBtnClass", "resolvedStarBtnClass", "resolvedInputClass", "_el$", "_tmpl$2", "_el$2", "firstChild", "$$click", "_$insert", "_$createComponent", "icon", "each", "children", "_el$4", "_tmpl$3", "_el$5", "_el$6", "nextSibling", "_el$7", "_$className", "_$effect", "_p$", "_v$4", "_v$5", "_v$6", "_v$7", "t", "_$setAttribute", "a", "o", "undefined", "when", "_el$3", "_tmpl$", "addEventListener", "$$keydown", "$$input", "currentTarget", "_$use", "el", "requestAnimationFrame", "focus", "_v$", "_v$2", "style", "_v$3", "_$style", "StatePreset", "_$delegateEvents"]
 }

package/dist/components/layout/FormGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormGroup.d.ts","sourceRoot":"","sources":["../../../src/components/layout/FormGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,KAAK,eAAe,EAA+C,MAAM,UAAU,CAAC;AAIvG,MAAM,WAAW,cAAe,SAAQ,GAAG,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,kBAAmB,SAAQ,GAAG,CAAC,cAAc,CAAC,cAAc,CAAC;IAC5E,KAAK,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;CACrB;AASD,QAAA,MAAM,aAAa,EAAE,eAAe,CAAC,kBAAkB,CAgBtD,CAAC;AAEF,UAAU,kBAAmB,SAAQ,eAAe,CAAC,cAAc,CAAC;IAClE,IAAI,EAAE,OAAO,aAAa,CAAC;CAC5B;AAsBD,eAAO,MAAM,SAAS,EAAoB,kBAAkB,CAAC"}

package/dist/components/layout/FormGroup.js

@@ -1,7 +1,17 @@
+import { template as _$template } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
+import { className as _$className } from "solid-js/web";
+import { effect as _$effect } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
+import { spread as _$spread } from "solid-js/web";
+import { mergeProps as _$mergeProps } from "solid-js/web";
+var _tmpl$ = /* @__PURE__ */ _$template(`<label>`), _tmpl$2 = /* @__PURE__ */ _$template(`<div data-form-group-item>`), _tmpl$3 = /* @__PURE__ */ _$template(`<div data-form-group>`);
 import { Show, splitProps, createContext, useContext } from "solid-js";
 import clsx from "clsx";
 import { twMerge } from "tailwind-merge";
-const FormGroupContext = createContext({ inline: false });
+const FormGroupContext = createContext({
+  inline: false
+});
 const baseClass = clsx("inline-flex flex-col gap-2");
 const inlineClass = clsx("inline-flex flex-row flex-wrap items-center gap-2");
 const itemInlineClass = clsx("flex flex-row items-center");
@@ -9,22 +19,48 @@ const FormGroupItem = (props) => {
   const [local, rest] = splitProps(props, ["children", "class", "label"]);
   const ctx = useContext(FormGroupContext);
   const getClassName = () => twMerge(ctx.inline ? itemInlineClass : void 0, local.class);
-  return /* @__PURE__ */ React.createElement("div", { class: getClassName(), "data-form-group-item": true, ...rest }, /* @__PURE__ */ React.createElement(Show, { when: local.label }, /* @__PURE__ */ React.createElement("label", { class: ctx.inline ? clsx("whitespace-nowrap font-bold", "pr-2") : "mb-1 block font-bold" }, local.label)), local.children);
+  return (() => {
+    var _el$ = _tmpl$2();
+    _$spread(_el$, _$mergeProps({
+      get ["class"]() {
+        return getClassName();
+      }
+    }, rest), false, true);
+    _$insert(_el$, _$createComponent(Show, {
+      get when() {
+        return local.label;
+      },
+      get children() {
+        var _el$2 = _tmpl$();
+        _$insert(_el$2, () => local.label);
+        _$effect(() => _$className(_el$2, ctx.inline ? clsx("whitespace-nowrap font-bold", "pr-2") : "mb-1 block font-bold"));
+        return _el$2;
+      }
+    }), null);
+    _$insert(_el$, () => local.children, null);
+    return _el$;
+  })();
 };
 const FormGroupBase = (props) => {
   const [local, rest] = splitProps(props, ["children", "class", "inline"]);
   const getClassName = () => twMerge(local.inline ? inlineClass : baseClass, local.class);
-  return /* @__PURE__ */ React.createElement(
-    FormGroupContext.Provider,
-    {
-      value: {
-        get inline() {
-          return local.inline ?? false;
-        }
+  return _$createComponent(FormGroupContext.Provider, {
+    value: {
+      get inline() {
+        return local.inline ?? false;
       }
     },
-    /* @__PURE__ */ React.createElement("div", { "data-form-group": true, class: getClassName(), ...rest }, local.children)
-  );
+    get children() {
+      var _el$3 = _tmpl$3();
+      _$spread(_el$3, _$mergeProps({
+        get ["class"]() {
+          return getClassName();
+        }
+      }, rest), false, true);
+      _$insert(_el$3, () => local.children);
+      return _el$3;
+    }
+  });
 };
 const FormGroup = FormGroupBase;
 FormGroup.Item = FormGroupItem;

package/dist/components/layout/FormGroup.js.map

@@ -1,7 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../src/components/layout/FormGroup.tsx"],
-  "sourcesContent": ["import { type JSX, type ParentComponent, Show, splitProps, createContext, useContext } from \"solid-js\";\nimport clsx from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport interface FormGroupProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  inline?: boolean;\n}\n\nexport interface FormGroupItemProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  label?: JSX.Element;\n}\n\nconst FormGroupContext = createContext<{ inline: boolean }>({ inline: false });\n\nconst baseClass = clsx(\"inline-flex flex-col gap-2\");\nconst inlineClass = clsx(\"inline-flex flex-row flex-wrap items-center gap-2\");\n\nconst itemInlineClass = clsx(\"flex flex-row items-center\");\n\nconst FormGroupItem: ParentComponent<FormGroupItemProps> = (props) => {\n  const [local, rest] = splitProps(props, [\"children\", \"class\", \"label\"]);\n  const ctx = useContext(FormGroupContext);\n\n  const getClassName = () => twMerge(ctx.inline ? itemInlineClass : undefined, local.class);\n\n  return (\n    <div class={getClassName()} data-form-group-item {...rest}>\n      <Show when={local.label}>\n        <label class={ctx.inline ? clsx(\"whitespace-nowrap font-bold\", \"pr-2\") : \"mb-1 block font-bold\"}>\n          {local.label}\n        </label>\n      </Show>\n      {local.children}\n    </div>\n  );\n};\n\ninterface FormGroupComponent extends ParentComponent<FormGroupProps> {\n  Item: typeof FormGroupItem;\n}\n\nconst FormGroupBase: ParentComponent<FormGroupProps> = (props) => {\n  const [local, rest] = splitProps(props, [\"children\", \"class\", \"inline\"]);\n\n  const getClassName = () => twMerge(local.inline ? inlineClass : baseClass, local.class);\n\n  return (\n    <FormGroupContext.Provider\n      value={{\n        get inline() {\n          return local.inline ?? false;\n        },\n      }}\n    >\n      <div data-form-group class={getClassName()} {...rest}>\n        {local.children}\n      </div>\n    </FormGroupContext.Provider>\n  );\n};\n\nexport const FormGroup = FormGroupBase as FormGroupComponent;\nFormGroup.Item = FormGroupItem;\n"],
-  "mappings": "AAAA,SAAyC,MAAM,YAAY,eAAe,kBAAkB;AAC5F,OAAO,UAAU;AACjB,SAAS,eAAe;AAUxB,MAAM,mBAAmB,cAAmC,EAAE,QAAQ,MAAM,CAAC;AAE7E,MAAM,YAAY,KAAK,4BAA4B;AACnD,MAAM,cAAc,KAAK,mDAAmD;AAE5E,MAAM,kBAAkB,KAAK,4BAA4B;AAEzD,MAAM,gBAAqD,CAAC,UAAU;AACpE,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,OAAO,CAAC,YAAY,SAAS,OAAO,CAAC;AACtE,QAAM,MAAM,WAAW,gBAAgB;AAEvC,QAAM,eAAe,MAAM,QAAQ,IAAI,SAAS,kBAAkB,QAAW,MAAM,KAAK;AAExF,SACE,oCAAC,SAAI,OAAO,aAAa,GAAG,wBAAoB,MAAE,GAAG,QACnD,oCAAC,QAAK,MAAM,MAAM,SAChB,oCAAC,WAAM,OAAO,IAAI,SAAS,KAAK,+BAA+B,MAAM,IAAI,0BACtE,MAAM,KACT,CACF,GACC,MAAM,QACT;AAEJ;AAMA,MAAM,gBAAiD,CAAC,UAAU;AAChE,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,OAAO,CAAC,YAAY,SAAS,QAAQ,CAAC;AAEvE,QAAM,eAAe,MAAM,QAAQ,MAAM,SAAS,cAAc,WAAW,MAAM,KAAK;AAEtF,SACE;AAAA,IAAC,iBAAiB;AAAA,IAAjB;AAAA,MACC,OAAO;AAAA,QACL,IAAI,SAAS;AACX,iBAAO,MAAM,UAAU;AAAA,QACzB;AAAA,MACF;AAAA;AAAA,IAEA,oCAAC,SAAI,mBAAe,MAAC,OAAO,aAAa,GAAI,GAAG,QAC7C,MAAM,QACT;AAAA,EACF;AAEJ;AAEO,MAAM,YAAY;AACzB,UAAU,OAAO;",
-  "names": []
+  "mappings": ";;;;;;;;AAAA,SAAyCA,MAAMC,YAAYC,eAAeC,kBAAkB;AAC5F,OAAOC,UAAU;AACjB,SAASC,eAAe;AAUxB,MAAMC,mBAAmBJ,cAAmC;EAAEK,QAAQ;AAAM,CAAC;AAE7E,MAAMC,YAAYJ,KAAK,4BAA4B;AACnD,MAAMK,cAAcL,KAAK,mDAAmD;AAE5E,MAAMM,kBAAkBN,KAAK,4BAA4B;AAEzD,MAAMO,gBAAsDC,WAAU;AACpE,QAAM,CAACC,OAAOC,IAAI,IAAIb,WAAWW,OAAO,CAAC,YAAY,SAAS,OAAO,CAAC;AACtE,QAAMG,MAAMZ,WAAWG,gBAAgB;AAEvC,QAAMU,eAAeA,MAAMX,QAAQU,IAAIR,SAASG,kBAAkBO,QAAWJ,MAAMK,KAAK;AAExF,UAAA,MAAA;AAAA,QAAAC,OAAAC,QAAA;AAAAC,aAAAF,MAAAG,aAAA;MAAA,KAAA,OAAA,IAAA;AAAA,eACcN,aAAa;MAAC;IAAA,GAA2BF,IAAI,GAAA,OAAA,IAAA;AAAAS,aAAAJ,MAAAK,kBACtDxB,MAAI;MAAA,IAACyB,OAAI;AAAA,eAAEZ,MAAMa;MAAK;MAAA,IAAAC,WAAA;AAAA,YAAAC,QAAAC,OAAA;AAAAN,iBAAAK,OAAA,MAElBf,MAAMa,KAAK;AAAAI,iBAAA,MAAAC,YAAAH,OADAb,IAAIR,SAASH,KAAK,+BAA+B,MAAM,IAAI,sBAAsB,CAAA;AAAA,eAAAwB;MAAA;IAAA,CAAA,GAAA,IAAA;AAAAL,aAAAJ,MAAA,MAIhGN,MAAMc,UAAQ,IAAA;AAAA,WAAAR;EAAA,GAAA;AAGrB;AAMA,MAAMa,gBAAkDpB,WAAU;AAChE,QAAM,CAACC,OAAOC,IAAI,IAAIb,WAAWW,OAAO,CAAC,YAAY,SAAS,QAAQ,CAAC;AAEvE,QAAMI,eAAeA,MAAMX,QAAQQ,MAAMN,SAASE,cAAcD,WAAWK,MAAMK,KAAK;AAEtF,SAAAM,kBACGlB,iBAAiB2B,UAAQ;IACxBC,OAAO;MACL,IAAI3B,SAAS;AACX,eAAOM,MAAMN,UAAU;MACzB;IACF;IAAC,IAAAoB,WAAA;AAAA,UAAAQ,QAAAC,QAAA;AAAAf,eAAAc,OAAAb,aAAA;QAAA,KAAA,OAAA,IAAA;AAAA,iBAE2BN,aAAa;QAAC;MAAA,GAAMF,IAAI,GAAA,OAAA,IAAA;AAAAS,eAAAY,OAAA,MACjDtB,MAAMc,QAAQ;AAAA,aAAAQ;IAAA;EAAA,CAAA;AAIvB;AAEO,MAAME,YAAYL;AACzBK,UAAUC,OAAO3B;",
+  "names": ["Show", "splitProps", "createContext", "useContext", "clsx", "twMerge", "FormGroupContext", "inline", "baseClass", "inlineClass", "itemInlineClass", "FormGroupItem", "props", "local", "rest", "ctx", "getClassName", "undefined", "class", "_el$", "_tmpl$2", "_$spread", "_$mergeProps", "_$insert", "_$createComponent", "when", "label", "children", "_el$2", "_tmpl$", "_$effect", "_$className", "FormGroupBase", "Provider", "value", "_el$3", "_tmpl$3", "FormGroup", "Item"]
 }

package/dist/components/layout/FormTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormTable.d.ts","sourceRoot":"","sources":["../../../src/components/layout/FormTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,KAAK,eAAe,EAAc,MAAM,UAAU,CAAC;AAItE,MAAM,WAAW,cAAe,SAAQ,GAAG,CAAC,cAAc,CAAC,gBAAgB,CAAC;CAAG;AAgB/E,eAAO,MAAM,SAAS,EAAE,eAAe,CAAC,cAAc,CAQrD,CAAC"}

package/dist/components/layout/FormTable.js

@@ -1,3 +1,8 @@
+import { template as _$template } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
+import { spread as _$spread } from "solid-js/web";
+import { mergeProps as _$mergeProps } from "solid-js/web";
+var _tmpl$ = /* @__PURE__ */ _$template(`<table data-form-table>`);
 import { splitProps } from "solid-js";
 import clsx from "clsx";
 import { twMerge } from "tailwind-merge";
@@ -16,7 +21,16 @@ const baseClass = clsx(
 );
 const FormTable = (props) => {
   const [local, rest] = splitProps(props, ["children", "class"]);
-  return /* @__PURE__ */ React.createElement("table", { "data-form-table": true, class: twMerge(baseClass, local.class), ...rest }, local.children);
+  return (() => {
+    var _el$ = _tmpl$();
+    _$spread(_el$, _$mergeProps({
+      get ["class"]() {
+        return twMerge(baseClass, local.class);
+      }
+    }, rest), false, true);
+    _$insert(_el$, () => local.children);
+    return _el$;
+  })();
 };
 export {
   FormTable

package/dist/components/layout/FormTable.js.map

@@ -1,7 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../src/components/layout/FormTable.tsx"],
-  "sourcesContent": ["import { type JSX, type ParentComponent, splitProps } from \"solid-js\";\nimport clsx from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport interface FormTableProps extends JSX.HTMLAttributes<HTMLTableElement> {}\n\nconst baseClass = clsx(\n  \"border-separate border-spacing-0 border-0\",\n  // \uBAA8\uB4E0 \uC140: \uC218\uC9C1 \uC911\uC559, \uC624\uB978\uCABD/\uC544\uB798 \uD328\uB529\n  \"[&_td]:align-middle [&_th]:align-middle\",\n  \"[&_td]:pr-1.5 [&_th]:pr-1.5\",\n  \"[&_td]:pb-1 [&_th]:pb-1\",\n  // \uD589\uC758 \uB9C8\uC9C0\uB9C9 \uC140: \uC624\uB978\uCABD \uD328\uB529 \uC81C\uAC70\n  \"[&_tr>*:last-child]:pr-0\",\n  // \uB9C8\uC9C0\uB9C9 \uD589 \uC140: \uC544\uB798 \uD328\uB529 \uC81C\uAC70\n  \"[&_tr:last-child>*]:pb-0\",\n  // th: \uC624\uB978\uCABD \uC815\uB82C, \uCF58\uD150\uCE20 \uB108\uBE44, \uC904\uBC14\uAFC8 \uBC29\uC9C0\n  \"[&_th]:w-0 [&_th]:whitespace-nowrap [&_th]:pl-1 [&_th]:text-right\",\n);\n\nexport const FormTable: ParentComponent<FormTableProps> = (props) => {\n  const [local, rest] = splitProps(props, [\"children\", \"class\"]);\n\n  return (\n    <table data-form-table class={twMerge(baseClass, local.class)} {...rest}>\n      {local.children}\n    </table>\n  );\n};\n"],
-  "mappings": "AAAA,SAAyC,kBAAkB;AAC3D,OAAO,UAAU;AACjB,SAAS,eAAe;AAIxB,MAAM,YAAY;AAAA,EAChB;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AACF;AAEO,MAAM,YAA6C,CAAC,UAAU;AACnE,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,OAAO,CAAC,YAAY,OAAO,CAAC;AAE7D,SACE,oCAAC,WAAM,mBAAe,MAAC,OAAO,QAAQ,WAAW,MAAM,KAAK,GAAI,GAAG,QAChE,MAAM,QACT;AAEJ;",
-  "names": []
+  "mappings": ";;;;;AAAA,SAAyCA,kBAAkB;AAC3D,OAAOC,UAAU;AACjB,SAASC,eAAe;AAIxB,MAAMC,YAAYF;EAChB;;EAEA;EACA;EACA;;EAEA;;EAEA;;EAEA;AACF;AAEO,MAAMG,YAA8CC,WAAU;AACnE,QAAM,CAACC,OAAOC,IAAI,IAAIP,WAAWK,OAAO,CAAC,YAAY,OAAO,CAAC;AAE7D,UAAA,MAAA;AAAA,QAAAG,OAAAC,OAAA;AAAAC,aAAAF,MAAAG,aAAA;MAAA,KAAA,OAAA,IAAA;AAAA,eACgCT,QAAQC,WAAWG,MAAMM,KAAK;MAAC;IAAA,GAAML,IAAI,GAAA,OAAA,IAAA;AAAAM,aAAAL,MAAA,MACpEF,MAAMQ,QAAQ;AAAA,WAAAN;EAAA,GAAA;AAGrB;",
+  "names": ["splitProps", "clsx", "twMerge", "baseClass", "FormTable", "props", "local", "rest", "_el$", "_tmpl$", "_$spread", "_$mergeProps", "class", "_$insert", "children"]
 }

package/dist/components/layout/sidebar/Sidebar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/sidebar/Sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,KAAK,eAAe,EAA0B,MAAM,UAAU,CAAC;AAMlF,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,YAAY,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAChE,YAAY,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACvE,YAAY,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAuBvE,MAAM,WAAW,YAAa,SAAQ,GAAG,CAAC,cAAc,CAAC,WAAW,CAAC;IACnE,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,UAAU,gBAAiB,SAAQ,eAAe,CAAC,YAAY,CAAC;IAC9D,SAAS,EAAE,OAAO,gBAAgB,CAAC;IACnC,IAAI,EAAE,OAAO,WAAW,CAAC;IACzB,IAAI,EAAE,OAAO,WAAW,CAAC;CAC1B;AAuCD,eAAO,MAAM,OAAO,EAAkB,gBAAgB,CAAC"}

package/dist/components/layout/sidebar/Sidebar.js

@@ -1,34 +1,25 @@
+import { template as _$template } from "solid-js/web";
+import { insert as _$insert } from "solid-js/web";
+import { spread as _$spread } from "solid-js/web";
+import { mergeProps as _$mergeProps } from "solid-js/web";
+import { memo as _$memo } from "solid-js/web";
+var _tmpl$ = /* @__PURE__ */ _$template(`<aside>`);
 import { splitProps, createMemo } from "solid-js";
 import { createMediaQuery } from "@solid-primitives/media";
 import clsx from "clsx";
 import { twMerge } from "tailwind-merge";
-import { useSidebarContext, SM_MEDIA_QUERY } from "./SidebarContext";
-import { mergeStyles } from "../../../helpers/mergeStyles";
-import { SidebarContainer } from "./SidebarContainer";
-import { SidebarMenu } from "./SidebarMenu";
-import { SidebarUser } from "./SidebarUser";
-const baseClass = clsx(
-  "absolute",
-  "top-0",
-  "left-0",
-  "bottom-0",
-  "w-64",
-  "z-sidebar",
-  "flex",
-  "flex-col",
-  "bg-base-100",
-  "dark:bg-base-900",
-  "border-r",
-  "border-base-200",
-  "dark:border-base-700",
-  "transition-transform",
-  "duration-300",
-  "sm:duration-100"
-);
+import { useSidebarContext, SM_MEDIA_QUERY } from "./SidebarContext.js";
+import { mergeStyles } from "../../../helpers/mergeStyles.js";
+import { SidebarContainer } from "./SidebarContainer.js";
+import { SidebarMenu } from "./SidebarMenu.js";
+import { SidebarUser } from "./SidebarUser.js";
+const baseClass = clsx("absolute", "top-0", "left-0", "bottom-0", "w-64", "z-sidebar", "flex", "flex-col", "bg-base-100", "dark:bg-base-900", "border-r", "border-base-200", "dark:border-base-700", "transition-transform", "duration-300", "sm:duration-100");
 const mobileOpenClass = clsx("shadow-xl");
 const SidebarBase = (props) => {
   const [local, rest] = splitProps(props, ["children", "class", "style"]);
-  const { toggle } = useSidebarContext();
+  const {
+    toggle
+  } = useSidebarContext();
   const isDesktop = createMediaQuery(SM_MEDIA_QUERY);
   const isOpen = createMemo(() => {
     if (isDesktop()) {
@@ -40,18 +31,28 @@ const SidebarBase = (props) => {
     return isOpen() ? "translateX(0)" : "translateX(-100%)";
   };
   const getClassName = () => twMerge(baseClass, !isDesktop() && isOpen() && mobileOpenClass, local.class);
-  return /* @__PURE__ */ React.createElement(
-    "aside",
-    {
-      ...rest,
-      "data-sidebar": true,
-      class: getClassName(),
-      style: mergeStyles(local.style, { transform: getTransform() }),
-      "aria-hidden": !isOpen(),
-      inert: !isOpen() || void 0
-    },
-    local.children
-  );
+  return (() => {
+    var _el$ = _tmpl$();
+    _$spread(_el$, _$mergeProps(rest, {
+      "data-sidebar": "",
+      get ["class"]() {
+        return getClassName();
+      },
+      get style() {
+        return mergeStyles(local.style, {
+          transform: getTransform()
+        });
+      },
+      get ["aria-hidden"]() {
+        return !isOpen();
+      },
+      get inert() {
+        return !isOpen() || void 0;
+      }
+    }), false, true);
+    _$insert(_el$, () => local.children);
+    return _el$;
+  })();
 };
 const Sidebar = SidebarBase;
 Sidebar.Container = SidebarContainer;

package/dist/components/layout/sidebar/Sidebar.js.map

@@ -1,7 +1,6 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/layout/sidebar/Sidebar.tsx"],
-  "sourcesContent": ["import { type JSX, type ParentComponent, splitProps, createMemo } from \"solid-js\";\nimport { createMediaQuery } from \"@solid-primitives/media\";\nimport clsx from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\nimport { useSidebarContext, SM_MEDIA_QUERY } from \"./SidebarContext\";\nimport { mergeStyles } from \"../../../helpers/mergeStyles\";\nimport { SidebarContainer } from \"./SidebarContainer\";\nimport { SidebarMenu } from \"./SidebarMenu\";\nimport { SidebarUser } from \"./SidebarUser\";\n\nexport type { SidebarContainerProps } from \"./SidebarContainer\";\nexport type { SidebarMenuItem, SidebarMenuProps } from \"./SidebarMenu\";\nexport type { SidebarUserMenu, SidebarUserProps } from \"./SidebarUser\";\n\nconst baseClass = clsx(\n  \"absolute\",\n  \"top-0\",\n  \"left-0\",\n  \"bottom-0\",\n  \"w-64\",\n  \"z-sidebar\",\n  \"flex\",\n  \"flex-col\",\n  \"bg-base-100\",\n  \"dark:bg-base-900\",\n  \"border-r\",\n  \"border-base-200\",\n  \"dark:border-base-700\",\n  \"transition-transform\",\n  \"duration-300\",\n  \"sm:duration-100\",\n);\n\nconst mobileOpenClass = clsx(\"shadow-xl\");\n\nexport interface SidebarProps extends JSX.HTMLAttributes<HTMLElement> {\n  children: JSX.Element;\n}\n\n/**\n * \uC0AC\uC774\uB4DC\uBC14 \uBCF8\uCCB4 \uCEF4\uD3EC\uB10C\uD2B8\n *\n * @remarks\n * - SidebarContainer \uB0B4\uBD80\uC5D0\uC11C \uC0AC\uC6A9\uD574\uC57C \uD568 (`position: absolute`\uB85C \uCEE8\uD14C\uC774\uB108\uC5D0 \uC885\uC18D)\n * - Context\uC5D0\uC11C toggle \uC0C1\uD0DC\uB97C \uC77D\uC5B4 \uC5F4\uB9BC/\uB2EB\uD798 \uC560\uB2C8\uBA54\uC774\uC158 \uC801\uC6A9\n * - \uD1A0\uAE00 \uBC84\uD2BC \uBBF8\uD3EC\uD568 - useSidebarContext().setToggle\uB85C \uC678\uBD80\uC5D0\uC11C \uC81C\uC5B4\n *\n * @example\n * ```tsx\n * <Sidebar>\n *   <Sidebar.User menus={userMenus}>\n *     <span>\uC0AC\uC6A9\uC790</span>\n *   </Sidebar.User>\n *   <Sidebar.Menu menus={menuItems} />\n * </Sidebar>\n * ```\n */\ninterface SidebarComponent extends ParentComponent<SidebarProps> {\n  Container: typeof SidebarContainer;\n  Menu: typeof SidebarMenu;\n  User: typeof SidebarUser;\n}\n\nconst SidebarBase: ParentComponent<SidebarProps> = (props) => {\n  const [local, rest] = splitProps(props, [\"children\", \"class\", \"style\"]);\n\n  const { toggle } = useSidebarContext();\n\n  // Tailwind sm: breakpoint \uAC10\uC9C0\n  const isDesktop = createMediaQuery(SM_MEDIA_QUERY);\n\n  // \uC0AC\uC774\uB4DC\uBC14 \uC5F4\uB9BC \uC5EC\uBD80 \uACC4\uC0B0\n  const isOpen = createMemo(() => {\n    if (isDesktop()) {\n      return !toggle();\n    }\n    return toggle();\n  });\n\n  // transform \uACC4\uC0B0: \uB2EB\uD798 \uC2DC \uC67C\uCABD\uC73C\uB85C \uC228\uAE40\n  const getTransform = () => {\n    return isOpen() ? \"translateX(0)\" : \"translateX(-100%)\";\n  };\n\n  const getClassName = () => twMerge(baseClass, !isDesktop() && isOpen() && mobileOpenClass, local.class);\n\n  return (\n    <aside\n      {...rest}\n      data-sidebar\n      class={getClassName()}\n      style={mergeStyles(local.style, { transform: getTransform() })}\n      aria-hidden={!isOpen()}\n      inert={!isOpen() || undefined}\n    >\n      {local.children}\n    </aside>\n  );\n};\n\nexport const Sidebar = SidebarBase as SidebarComponent;\nSidebar.Container = SidebarContainer;\nSidebar.Menu = SidebarMenu;\nSidebar.User = SidebarUser;\n"],
-  "mappings": "AAAA,SAAyC,YAAY,kBAAkB;AACvE,SAAS,wBAAwB;AACjC,OAAO,UAAU;AACjB,SAAS,eAAe;AACxB,SAAS,mBAAmB,sBAAsB;AAClD,SAAS,mBAAmB;AAC5B,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAM5B,MAAM,YAAY;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,MAAM,kBAAkB,KAAK,WAAW;AA8BxC,MAAM,cAA6C,CAAC,UAAU;AAC5D,QAAM,CAAC,OAAO,IAAI,IAAI,WAAW,OAAO,CAAC,YAAY,SAAS,OAAO,CAAC;AAEtE,QAAM,EAAE,OAAO,IAAI,kBAAkB;AAGrC,QAAM,YAAY,iBAAiB,cAAc;AAGjD,QAAM,SAAS,WAAW,MAAM;AAC9B,QAAI,UAAU,GAAG;AACf,aAAO,CAAC,OAAO;AAAA,IACjB;AACA,WAAO,OAAO;AAAA,EAChB,CAAC;AAGD,QAAM,eAAe,MAAM;AACzB,WAAO,OAAO,IAAI,kBAAkB;AAAA,EACtC;AAEA,QAAM,eAAe,MAAM,QAAQ,WAAW,CAAC,UAAU,KAAK,OAAO,KAAK,iBAAiB,MAAM,KAAK;AAEtG,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,gBAAY;AAAA,MACZ,OAAO,aAAa;AAAA,MACpB,OAAO,YAAY,MAAM,OAAO,EAAE,WAAW,aAAa,EAAE,CAAC;AAAA,MAC7D,eAAa,CAAC,OAAO;AAAA,MACrB,OAAO,CAAC,OAAO,KAAK;AAAA;AAAA,IAEnB,MAAM;AAAA,EACT;AAEJ;AAEO,MAAM,UAAU;AACvB,QAAQ,YAAY;AACpB,QAAQ,OAAO;AACf,QAAQ,OAAO;",
-  "names": []
+  "mappings": ";;;;;;AAAA,SAAyCA,YAAYC,kBAAkB;AACvE,SAASC,wBAAwB;AACjC,OAAOC,UAAU;AACjB,SAASC,eAAe;AACxB,SAASC,mBAAmBC,sBAAsB;AAClD,SAASC,mBAAmB;AAC5B,SAASC,wBAAwB;AACjC,SAASC,mBAAmB;AAC5B,SAASC,mBAAmB;AAM5B,MAAMC,YAAYR,KAChB,YACA,SACA,UACA,YACA,QACA,aACA,QACA,YACA,eACA,oBACA,YACA,mBACA,wBACA,wBACA,gBACA,iBACF;AAEA,MAAMS,kBAAkBT,KAAK,WAAW;AA8BxC,MAAMU,cAA8CC,WAAU;AAC5D,QAAM,CAACC,OAAOC,IAAI,IAAIhB,WAAWc,OAAO,CAAC,YAAY,SAAS,OAAO,CAAC;AAEtE,QAAM;IAAEG;EAAO,IAAIZ,kBAAkB;AAGrC,QAAMa,YAAYhB,iBAAiBI,cAAc;AAGjD,QAAMa,SAASlB,WAAW,MAAM;AAC9B,QAAIiB,UAAU,GAAG;AACf,aAAO,CAACD,OAAO;IACjB;AACA,WAAOA,OAAO;EAChB,CAAC;AAGD,QAAMG,eAAeA,MAAM;AACzB,WAAOD,OAAO,IAAI,kBAAkB;EACtC;AAEA,QAAME,eAAeA,MAAMjB,QAAQO,WAAW,CAACO,UAAU,KAAKC,OAAO,KAAKP,iBAAiBG,MAAMO,KAAK;AAEtG,UAAA,MAAA;AAAA,QAAAC,OAAAC,OAAA;AAAAC,aAAAF,MAAAG,aAEQV,MAAI;MAAA,gBAAA;MAAA,KAAA,OAAA,IAAA;AAAA,eAEDK,aAAa;MAAC;MAAA,IACrBM,QAAK;AAAA,eAAEpB,YAAYQ,MAAMY,OAAO;UAAEC,WAAWR,aAAa;QAAE,CAAC;MAAC;MAAA,KAAA,aAAA,IAAA;AAAA,eACjD,CAACD,OAAO;MAAC;MAAA,IACtBU,QAAK;AAAA,eAAE,CAACV,OAAO,KAAKW;MAAS;IAAA,CAAA,GAAA,OAAA,IAAA;AAAAC,aAAAR,MAAA,MAE5BR,MAAMiB,QAAQ;AAAA,WAAAT;EAAA,GAAA;AAGrB;AAEO,MAAMU,UAAUpB;AACvBoB,QAAQC,YAAY1B;AACpByB,QAAQE,OAAO1B;AACfwB,QAAQG,OAAO1B;",
+  "names": ["splitProps", "createMemo", "createMediaQuery", "clsx", "twMerge", "useSidebarContext", "SM_MEDIA_QUERY", "mergeStyles", "SidebarContainer", "SidebarMenu", "SidebarUser", "baseClass", "mobileOpenClass", "SidebarBase", "props", "local", "rest", "toggle", "isDesktop", "isOpen", "getTransform", "getClassName", "class", "_el$", "_tmpl$", "_$spread", "_$mergeProps", "style", "transform", "inert", "undefined", "_$insert", "children", "Sidebar", "Container", "Menu", "User"]
 }

package/dist/{solid/src/components → components}/layout/sidebar/SidebarContainer.d.ts

@@ -10,7 +10,7 @@ export interface SidebarContainerProps extends JSX.HTMLAttributes<HTMLDivElement
  * - 부모 요소에 높이가 지정되어야 함 (`h-full` 사용)
  * - 콘텐츠 영역의 `overflow-auto`는 사용자가 직접 적용해야 함
  * - SidebarContext.Provider로 toggle 상태 공유
- * - usePersisted로 toggle 상태 localStorage 저장 (키: sidebar.toggle)
+ * - toggle 상태는 메모리에만 유지 (페이지 새로고침 시 초기화)
  * - 데스크탑(640px+)에서 padding-left + transition으로 콘텐츠 확장/축소
  * - 모바일(640px-)에서 backdrop 렌더링 및 클릭 시 닫기
  * - 페이지 이동 시 모바일에서 자동 닫기

package/dist/components/layout/sidebar/SidebarContainer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarContainer.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/sidebar/SidebarContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,KAAK,eAAe,EAA8C,MAAM,UAAU,CAAC;AAqBtG,MAAM,WAAW,qBAAsB,SAAQ,GAAG,CAAC,cAAc,CAAC,cAAc,CAAC;IAC/E,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,gBAAgB,EAAE,eAAe,CAAC,qBAAqB,CA4DnE,CAAC"}