@adaptive-ds/solid-ui 0.11.0

package/dist/input/check/CheckMultiple.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckMultiple.d.ts","sourceRoot":"","sources":["../../../lib/input/check/CheckMultiple.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAChE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AAC1D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAChE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AACpD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAA;AAEpE,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,MAAM,CAClD,SAAQ,SAAS,EACf,oBAAoB,EACpB,YAAY,EACZ,iBAAiB,EACjB,eAAe;IAEjB,WAAW,EAAE,YAAY,CAAC,CAAC,EAAE,CAAC,CAAA;IAC9B,UAAU,EAAE,MAAM,CAAC,EAAE,CAAA;IACrB,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,MAAM,CAAA;IAEhC,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,wBAAgB,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,CAAC,EAAE,kBAAkB,CAAC,CAAC,CAAC,kCAwBhF"}

package/dist/input/check/CheckMultiple.js

@@ -0,0 +1,138 @@
+import { template, insert, createComponent, effect, setAttribute, className } from "solid-js/web";
+import { mdiCheckboxMarkedCircle, mdiCheckboxBlankCircleOutline } from "@mdi/js";
+import { For } from "solid-js";
+import { buttonVariant } from "../../interactive/button/buttonCva.js";
+import { ButtonIcon } from "../../interactive/button/ButtonIcon.js";
+import { classesGridCols3xl } from "../../static/container/classesGridCols.js";
+import { classArr } from "../../utils/classArr.js";
+import { classMerge } from "../../utils/classMerge.js";
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+function CheckMultiple(p) {
+  return (() => {
+    var _el$ = _tmpl$();
+    insert(_el$, createComponent(OptionList, {
+      get valueSignal() {
+        return p.valueSignal;
+      },
+      get getOptions() {
+        return p.getOptions;
+      },
+      get valueText() {
+        return p.valueText;
+      },
+      get variant() {
+        return p.variant;
+      },
+      get optionClass() {
+        return p.optionClass;
+      },
+      get innerClass() {
+        return p.innerClass;
+      }
+    }));
+    effect((_p$) => {
+      var _v$ = p.id, _v$2 = classArr(
+        "group border border-input",
+        "px-2 py-2",
+        "ring-offset-background",
+        "rounded-md",
+        "focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
+        "flex flex-col justify-center gap-1",
+        // layout
+        p.class
+      );
+      _v$ !== _p$.e && setAttribute(_el$, "id", _p$.e = _v$);
+      _v$2 !== _p$.t && className(_el$, _p$.t = _v$2);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0
+    });
+    return _el$;
+  })();
+}
+function OptionList(p) {
+  return (() => {
+    var _el$2 = _tmpl$();
+    insert(_el$2, createComponent(For, {
+      get each() {
+        return p.getOptions();
+      },
+      children: (option) => createComponent(CheckOption, {
+        option,
+        get valueSignal() {
+          return p.valueSignal;
+        },
+        get valueText() {
+          return p.valueText;
+        },
+        get optionClass() {
+          return p.optionClass;
+        },
+        get variant() {
+          return p.variant;
+        },
+        get disabled() {
+          return p.disabled;
+        }
+      })
+    }));
+    effect(() => className(_el$2, innerClass(p.getOptions().length, p.innerClass)));
+    return _el$2;
+  })();
+}
+function CheckOption(p) {
+  const label = () => p.valueText ? p.valueText(p.option) : p.option;
+  const isSelected = () => p.valueSignal.get().includes(p.option);
+  return createComponent(ButtonIcon, {
+    role: "option",
+    get ["aria-selected"]() {
+      return isSelected();
+    },
+    get icon() {
+      return isSelected() ? mdiCheckboxMarkedCircle : mdiCheckboxBlankCircleOutline;
+    },
+    onClick: () => toggleOption(p),
+    get variant() {
+      return p.variant ?? buttonVariant.filled;
+    },
+    get ["class"]() {
+      return classMerge("justify-start text-left", p.optionClass);
+    },
+    get disabled() {
+      return p.disabled;
+    },
+    get children() {
+      return label();
+    }
+  });
+}
+function innerClass(optionAmount, innerClass2) {
+  if (innerClass2) return innerClass2;
+  if (optionAmount <= 0) return "";
+  const base = "gap-x-2 gap-y-1";
+  if (optionAmount <= 5) return classArr("grid grid-cols-1", base);
+  if (optionAmount <= 9) return classArr("grid grid-cols-2", base);
+  return classArr(classesGridCols3xl, base);
+}
+function toggleOption(p) {
+  const hasOption = p.valueSignal.get().includes(p.option);
+  if (hasOption) {
+    optionRemove(p);
+  } else {
+    optionAdd(p);
+  }
+}
+function optionRemove(p) {
+  const newValues = p.valueSignal.get().filter((v) => v !== p.option);
+  p.valueSignal.set(newValues);
+}
+function optionAdd(p) {
+  const newValues = [...p.valueSignal.get(), p.option];
+  newValues.sort((a, b) => a.localeCompare(b));
+  p.valueSignal.set(newValues);
+}
+export {
+  CheckMultiple
+};
+//# sourceMappingURL=CheckMultiple.js.map

package/dist/input/check/CheckMultiple.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckMultiple.js","sources":["../../../lib/input/check/CheckMultiple.tsx"],"sourcesContent":["import { mdiCheckboxBlankCircleOutline, mdiCheckboxMarkedCircle } from \"@mdi/js\"\nimport { For } from \"solid-js\"\nimport { buttonVariant } from \"~ui/interactive/button/buttonCva\"\nimport { ButtonIcon } from \"~ui/interactive/button/ButtonIcon\"\nimport { classesGridCols3xl } from \"~ui/static/container/classesGridCols\"\nimport { classArr } from \"~ui/utils/classArr\"\nimport { classMerge } from \"~ui/utils/classMerge\"\nimport type { SignalObject } from \"~ui/utils/createSignalObject\"\nimport type { MayHaveButtonVariant } from \"~ui/utils/MayHaveButtonVariant\"\nimport type { MayHaveClass } from \"~ui/utils/MayHaveClass\"\nimport type { MayHaveDisabled } from \"~ui/utils/MayHaveDisabled\"\nimport type { MayHaveId } from \"~ui/utils/MayHaveId\"\nimport type { MayHaveInnerClass } from \"~ui/utils/MayHaveInnerClass\"\n\nexport interface CheckMultipleProps<T extends string>\n  extends MayHaveId,\n    MayHaveButtonVariant,\n    MayHaveClass,\n    MayHaveInnerClass,\n    MayHaveDisabled {\n  // state\n  valueSignal: SignalObject<T[]>\n  getOptions: () => T[]\n  valueText?: (value: T) => string\n  // styling\n  optionClass?: string\n}\n\nexport function CheckMultiple<T extends string = string>(p: CheckMultipleProps<T>) {\n  return (\n    <div\n      id={p.id}\n      class={classArr(\n        \"group border border-input\",\n        \"px-2 py-2\",\n        \"ring-offset-background\",\n        \"rounded-md\",\n        \"focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2\",\n        \"flex flex-col justify-center gap-1\", // layout\n        p.class,\n      )}\n    >\n      <OptionList\n        valueSignal={p.valueSignal}\n        getOptions={p.getOptions}\n        valueText={p.valueText}\n        variant={p.variant}\n        optionClass={p.optionClass}\n        innerClass={p.innerClass}\n      />\n    </div>\n  )\n}\n\ninterface OptionListProps<T extends string> extends MayHaveButtonVariant, MayHaveDisabled, MayHaveInnerClass {\n  valueSignal: SignalObject<T[]>\n  getOptions: () => T[]\n  valueText?: (value: T) => string\n  optionClass?: string\n}\n\nfunction OptionList<T extends string>(p: OptionListProps<T>) {\n  return (\n    <div class={innerClass(p.getOptions().length, p.innerClass)}>\n      <For each={p.getOptions()}>\n        {(option) => (\n          <CheckOption\n            option={option}\n            valueSignal={p.valueSignal}\n            valueText={p.valueText}\n            optionClass={p.optionClass}\n            variant={p.variant}\n            disabled={p.disabled}\n          />\n        )}\n      </For>\n    </div>\n  )\n}\n\ninterface CheckOptionProps<T extends string> extends MayHaveButtonVariant, MayHaveDisabled {\n  option: T\n  valueSignal: SignalObject<T[]>\n  valueText?: (value: T) => string\n  optionClass?: string\n}\n\nfunction CheckOption<T extends string>(p: CheckOptionProps<T>) {\n  const label = () => (p.valueText ? p.valueText(p.option) : p.option)\n  const isSelected = () => p.valueSignal.get().includes(p.option)\n\n  return (\n    <ButtonIcon\n      role=\"option\"\n      aria-selected={isSelected()}\n      icon={isSelected() ? mdiCheckboxMarkedCircle : mdiCheckboxBlankCircleOutline}\n      // iconRight={isSelected() ? mdiCheckboxMarkedCircle : mdiCheckboxBlankCircleOutline}\n      onClick={() => toggleOption(p)}\n      variant={p.variant ?? buttonVariant.filled}\n      class={classMerge(\"justify-start text-left\", p.optionClass)}\n      disabled={p.disabled}\n    >\n      {label()}\n    </ButtonIcon>\n  )\n}\n\nfunction innerClass(optionAmount: number, innerClass?: string): string {\n  if (innerClass) return innerClass\n  if (optionAmount <= 0) return \"\"\n  const base = \"gap-x-2 gap-y-1\"\n  if (optionAmount <= 5) return classArr(\"grid grid-cols-1\", base)\n  if (optionAmount <= 9) return classArr(\"grid grid-cols-2\", base)\n  return classArr(classesGridCols3xl, base)\n}\n\nfunction toggleOption<T extends string>(p: CheckOptionProps<T>) {\n  const hasOption = p.valueSignal.get().includes(p.option)\n  if (hasOption) {\n    optionRemove(p)\n  } else {\n    optionAdd(p)\n  }\n}\n\nfunction optionRemove<T extends string>(p: CheckOptionProps<T>) {\n  const newValues = p.valueSignal.get().filter((v) => v !== p.option)\n  p.valueSignal.set(newValues)\n}\n\nfunction optionAdd<T extends string>(p: CheckOptionProps<T>) {\n  const newValues = [...p.valueSignal.get(), p.option]\n  newValues.sort((a, b) => a.localeCompare(b))\n  p.valueSignal.set(newValues)\n}\n"],"names":["CheckMultiple","p","_el$","_tmpl$","_$insert","_$createComponent","OptionList","valueSignal","getOptions","valueText","variant","optionClass","innerClass","_$effect","_p$","_v$","id","_v$2","classArr","class","e","_$setAttribute","t","_$className","undefined","_el$2","For","each","children","option","CheckOption","disabled","length","label","isSelected","get","includes","ButtonIcon","role","icon","mdiCheckboxMarkedCircle","mdiCheckboxBlankCircleOutline","onClick","toggleOption","buttonVariant","filled","classMerge","optionAmount","base","classesGridCols3xl","hasOption","optionRemove","optionAdd","newValues","filter","v","set","sort","a","b","localeCompare"],"mappings":";;;;;;;;;AA4BO,SAASA,cAAyCC,GAA0B;AACjF,UAAA,MAAA;AAAA,QAAAC,OAAAC,OAAAA;AAAAC,WAAAF,MAAAG,gBAaKC,YAAU;AAAA,MAAA,IACTC,cAAW;AAAA,eAAEN,EAAEM;AAAAA,MAAW;AAAA,MAAA,IAC1BC,aAAU;AAAA,eAAEP,EAAEO;AAAAA,MAAU;AAAA,MAAA,IACxBC,YAAS;AAAA,eAAER,EAAEQ;AAAAA,MAAS;AAAA,MAAA,IACtBC,UAAO;AAAA,eAAET,EAAES;AAAAA,MAAO;AAAA,MAAA,IAClBC,cAAW;AAAA,eAAEV,EAAEU;AAAAA,MAAW;AAAA,MAAA,IAC1BC,aAAU;AAAA,eAAEX,EAAEW;AAAAA,MAAU;AAAA,IAAA,CAAA,CAAA;AAAAC,WAAAC,CAAAA,QAAA;AAAA,UAAAC,MAjBtBd,EAAEe,IAAEC,OACDC;AAAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA;AAAA,QACAjB,EAAEkB;AAAAA,MAAAA;AACHJ,cAAAD,IAAAM,KAAAC,aAAAnB,MAAA,MAAAY,IAAAM,IAAAL,GAAA;AAAAE,eAAAH,IAAAQ,KAAAC,UAAArB,MAAAY,IAAAQ,IAAAL,IAAA;AAAA,aAAAH;AAAAA,IAAA,GAAA;AAAA,MAAAM,GAAAI;AAAAA,MAAAF,GAAAE;AAAAA,IAAAA,CAAA;AAAA,WAAAtB;AAAAA,EAAA,GAAA;AAYP;AASA,SAASI,WAA6BL,GAAuB;AAC3D,UAAA,MAAA;AAAA,QAAAwB,QAAAtB,OAAAA;AAAAC,WAAAqB,OAAApB,gBAEKqB,KAAG;AAAA,MAAA,IAACC,OAAI;AAAA,eAAE1B,EAAEO,WAAAA;AAAAA,MAAY;AAAA,MAAAoB,UACrBC,CAAAA,WAAMxB,gBACLyB,aAAW;AAAA,QACVD;AAAAA,QAAc,IACdtB,cAAW;AAAA,iBAAEN,EAAEM;AAAAA,QAAW;AAAA,QAAA,IAC1BE,YAAS;AAAA,iBAAER,EAAEQ;AAAAA,QAAS;AAAA,QAAA,IACtBE,cAAW;AAAA,iBAAEV,EAAEU;AAAAA,QAAW;AAAA,QAAA,IAC1BD,UAAO;AAAA,iBAAET,EAAES;AAAAA,QAAO;AAAA,QAAA,IAClBqB,WAAQ;AAAA,iBAAE9B,EAAE8B;AAAAA,QAAQ;AAAA,MAAA,CAAA;AAAA,IAAA,CAEvB,CAAA;AAAAlB,iBAAAU,UAAAE,OAXOb,WAAWX,EAAEO,WAAAA,EAAawB,QAAQ/B,EAAEW,UAAU,CAAC,CAAA;AAAA,WAAAa;AAAAA,EAAA,GAAA;AAe/D;AASA,SAASK,YAA8B7B,GAAwB;AAC7D,QAAMgC,QAAQA,MAAOhC,EAAEQ,YAAYR,EAAEQ,UAAUR,EAAE4B,MAAM,IAAI5B,EAAE4B;AAC7D,QAAMK,aAAaA,MAAMjC,EAAEM,YAAY4B,MAAMC,SAASnC,EAAE4B,MAAM;AAE9D,SAAAxB,gBACGgC,YAAU;AAAA,IACTC,MAAI;AAAA,IAAA,KAAA,eAAA,IAAA;AAAA,aACWJ,WAAAA;AAAAA,IAAY;AAAA,IAAA,IAC3BK,OAAI;AAAA,aAAEL,WAAAA,IAAeM,0BAA0BC;AAAAA,IAA6B;AAAA,IAE5EC,SAASA,MAAMC,aAAa1C,CAAC;AAAA,IAAC,IAC9BS,UAAO;AAAA,aAAET,EAAES,WAAWkC,cAAcC;AAAAA,IAAM;AAAA,IAAA,KAAA,OAAA,IAAA;AAAA,aACnCC,WAAW,2BAA2B7C,EAAEU,WAAW;AAAA,IAAC;AAAA,IAAA,IAC3DoB,WAAQ;AAAA,aAAE9B,EAAE8B;AAAAA,IAAQ;AAAA,IAAA,IAAAH,WAAA;AAAA,aAEnBK,MAAAA;AAAAA,IAAO;AAAA,EAAA,CAAA;AAGd;AAEA,SAASrB,WAAWmC,cAAsBnC,aAA6B;AACrE,MAAIA,YAAY,QAAOA;AACvB,MAAImC,gBAAgB,EAAG,QAAO;AAC9B,QAAMC,OAAO;AACb,MAAID,gBAAgB,EAAG,QAAO7B,SAAS,oBAAoB8B,IAAI;AAC/D,MAAID,gBAAgB,EAAG,QAAO7B,SAAS,oBAAoB8B,IAAI;AAC/D,SAAO9B,SAAS+B,oBAAoBD,IAAI;AAC1C;AAEA,SAASL,aAA+B1C,GAAwB;AAC9D,QAAMiD,YAAYjD,EAAEM,YAAY4B,MAAMC,SAASnC,EAAE4B,MAAM;AACvD,MAAIqB,WAAW;AACbC,iBAAalD,CAAC;AAAA,EAChB,OAAO;AACLmD,cAAUnD,CAAC;AAAA,EACb;AACF;AAEA,SAASkD,aAA+BlD,GAAwB;AAC9D,QAAMoD,YAAYpD,EAAEM,YAAY4B,IAAAA,EAAMmB,OAAQC,CAAAA,MAAMA,MAAMtD,EAAE4B,MAAM;AAClE5B,IAAEM,YAAYiD,IAAIH,SAAS;AAC7B;AAEA,SAASD,UAA4BnD,GAAwB;AAC3D,QAAMoD,YAAY,CAAC,GAAGpD,EAAEM,YAAY4B,IAAAA,GAAOlC,EAAE4B,MAAM;AACnDwB,YAAUI,KAAK,CAACC,GAAGC,MAAMD,EAAEE,cAAcD,CAAC,CAAC;AAC3C1D,IAAEM,YAAYiD,IAAIH,SAAS;AAC7B;"}

package/dist/input/check/CheckSingle.d.ts

@@ -0,0 +1,15 @@
+import { SignalObject } from '../../utils/createSignalObject';
+import { MayHaveButtonVariant } from '../../utils/MayHaveButtonVariant';
+import { MayHaveClass } from '../../utils/MayHaveClass';
+import { MayHaveDisabled } from '../../utils/MayHaveDisabled';
+import { MayHaveId } from '../../utils/MayHaveId';
+import { MayHaveInnerClass } from '../../utils/MayHaveInnerClass';
+export interface CheckSingleProps<T extends string> extends MayHaveId, MayHaveButtonVariant, MayHaveClass, MayHaveInnerClass, MayHaveDisabled {
+    valueSignal: SignalObject<T>;
+    getOptions: () => T[];
+    valueText?: (value: T) => string;
+    disallowDeselection?: boolean;
+    optionClass?: string;
+}
+export declare function CheckSingle<T extends string = string>(p: CheckSingleProps<T>): import("solid-js").JSX.Element;
+//# sourceMappingURL=CheckSingle.d.ts.map

package/dist/input/check/CheckSingle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckSingle.d.ts","sourceRoot":"","sources":["../../../lib/input/check/CheckSingle.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAChE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAA;AAC1E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AAC1D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAChE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AACpD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAA;AAEpE,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,MAAM,CAChD,SAAQ,SAAS,EACf,oBAAoB,EACpB,YAAY,EACZ,iBAAiB,EACjB,eAAe;IAEjB,WAAW,EAAE,YAAY,CAAC,CAAC,CAAC,CAAA;IAC5B,UAAU,EAAE,MAAM,CAAC,EAAE,CAAA;IACrB,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,MAAM,CAAA;IAEhC,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAE7B,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,wBAAgB,WAAW,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,kCAyB5E"}

package/dist/input/check/CheckSingle.js

@@ -0,0 +1,135 @@
+import { template, insert, createComponent, effect, setAttribute, className } from "solid-js/web";
+import { mdiCheckboxMarkedCircle, mdiCheckboxBlankCircleOutline } from "@mdi/js";
+import { For } from "solid-js";
+import { buttonVariant } from "../../interactive/button/buttonCva.js";
+import { ButtonIcon } from "../../interactive/button/ButtonIcon.js";
+import { classesGridCols3xl } from "../../static/container/classesGridCols.js";
+import { classArr } from "../../utils/classArr.js";
+import { classMerge } from "../../utils/classMerge.js";
+var _tmpl$ = /* @__PURE__ */ template(`<div>`);
+function CheckSingle(p) {
+  return (() => {
+    var _el$ = _tmpl$();
+    insert(_el$, createComponent(OptionList, {
+      get valueSignal() {
+        return p.valueSignal;
+      },
+      get getOptions() {
+        return p.getOptions;
+      },
+      get valueText() {
+        return p.valueText;
+      },
+      get variant() {
+        return p.variant;
+      },
+      get disallowDeselection() {
+        return p.disallowDeselection;
+      },
+      get optionClass() {
+        return p.optionClass;
+      },
+      get innerClass() {
+        return p.innerClass;
+      }
+    }));
+    effect((_p$) => {
+      var _v$ = p.id, _v$2 = classMerge(
+        "group border border-input",
+        "px-2 py-2",
+        "ring-offset-background",
+        "rounded-md",
+        "focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
+        "flex flex-col justify-center gap-1",
+        // layout
+        p.class
+      );
+      _v$ !== _p$.e && setAttribute(_el$, "id", _p$.e = _v$);
+      _v$2 !== _p$.t && className(_el$, _p$.t = _v$2);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0
+    });
+    return _el$;
+  })();
+}
+function OptionList(p) {
+  return (() => {
+    var _el$2 = _tmpl$();
+    insert(_el$2, createComponent(For, {
+      get each() {
+        return p.getOptions();
+      },
+      children: (option) => createComponent(CheckOption, {
+        option,
+        get valueSignal() {
+          return p.valueSignal;
+        },
+        get valueText() {
+          return p.valueText;
+        },
+        get optionClass() {
+          return p.optionClass;
+        },
+        get variant() {
+          return p.variant;
+        },
+        get disallowDeselection() {
+          return p.disallowDeselection;
+        },
+        get disabled() {
+          return p.disabled;
+        }
+      })
+    }));
+    effect(() => className(_el$2, innerClass(p.getOptions().length, p.innerClass)));
+    return _el$2;
+  })();
+}
+function innerClass(optionAmount, innerClass2) {
+  if (innerClass2) return innerClass2;
+  if (optionAmount <= 0) return "";
+  const base = "gap-x-2 gap-y-1";
+  if (optionAmount === 1) return classArr("grid grid-cols-1", base);
+  if (optionAmount === 2) return classArr("grid grid-cols-2", base);
+  return classArr(classesGridCols3xl, base);
+}
+function CheckOption(p) {
+  const label = () => p.valueText ? p.valueText(p.option) : p.option;
+  const isSelected = () => p.valueSignal.get() === p.option;
+  return createComponent(ButtonIcon, {
+    role: "option",
+    get ["aria-selected"]() {
+      return isSelected();
+    },
+    get icon() {
+      return isSelected() ? mdiCheckboxMarkedCircle : mdiCheckboxBlankCircleOutline;
+    },
+    onClick: () => toggleOption(p, p.disallowDeselection),
+    get variant() {
+      return p.variant ?? buttonVariant.filled;
+    },
+    get ["class"]() {
+      return classMerge("justify-start text-left", p.optionClass);
+    },
+    get disabled() {
+      return p.disabled;
+    },
+    get children() {
+      return label();
+    }
+  });
+}
+function toggleOption(p, disallowDeselection) {
+  const isSelected = p.valueSignal.get() === p.option;
+  if (isSelected && !disallowDeselection) {
+    p.valueSignal.set("");
+  } else {
+    p.valueSignal.set(p.option);
+  }
+}
+export {
+  CheckSingle
+};
+//# sourceMappingURL=CheckSingle.js.map

package/dist/input/check/CheckSingle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckSingle.js","sources":["../../../lib/input/check/CheckSingle.tsx"],"sourcesContent":["import { mdiCheckboxBlankCircleOutline, mdiCheckboxMarkedCircle } from \"@mdi/js\"\nimport { For } from \"solid-js\"\nimport { buttonVariant } from \"~ui/interactive/button/buttonCva\"\nimport { ButtonIcon } from \"~ui/interactive/button/ButtonIcon\"\nimport { classesGridCols3xl } from \"~ui/static/container/classesGridCols\"\nimport { classArr } from \"~ui/utils/classArr\"\nimport { classMerge } from \"~ui/utils/classMerge\"\nimport type { SignalObject } from \"~ui/utils/createSignalObject\"\nimport type { MayHaveButtonVariant } from \"~ui/utils/MayHaveButtonVariant\"\nimport type { MayHaveClass } from \"~ui/utils/MayHaveClass\"\nimport type { MayHaveDisabled } from \"~ui/utils/MayHaveDisabled\"\nimport type { MayHaveId } from \"~ui/utils/MayHaveId\"\nimport type { MayHaveInnerClass } from \"~ui/utils/MayHaveInnerClass\"\n\nexport interface CheckSingleProps<T extends string>\n  extends MayHaveId,\n    MayHaveButtonVariant,\n    MayHaveClass,\n    MayHaveInnerClass,\n    MayHaveDisabled {\n  // state\n  valueSignal: SignalObject<T>\n  getOptions: () => T[]\n  valueText?: (value: T) => string\n  // behavior\n  disallowDeselection?: boolean\n  // styling\n  optionClass?: string\n}\n\nexport function CheckSingle<T extends string = string>(p: CheckSingleProps<T>) {\n  return (\n    <div\n      id={p.id}\n      class={classMerge(\n        \"group border border-input\",\n        \"px-2 py-2\",\n        \"ring-offset-background\",\n        \"rounded-md\",\n        \"focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2\",\n        \"flex flex-col justify-center gap-1\", // layout\n        p.class,\n      )}\n    >\n      <OptionList\n        valueSignal={p.valueSignal}\n        getOptions={p.getOptions}\n        valueText={p.valueText}\n        variant={p.variant}\n        disallowDeselection={p.disallowDeselection}\n        optionClass={p.optionClass}\n        innerClass={p.innerClass}\n      />\n    </div>\n  )\n}\n\ninterface OptionListProps<T extends string> extends MayHaveButtonVariant, MayHaveDisabled, MayHaveInnerClass {\n  valueSignal: SignalObject<T>\n  getOptions: () => T[]\n  valueText?: (value: T) => string\n\n  disallowDeselection?: boolean\n  optionClass?: string\n}\n\nfunction OptionList<T extends string>(p: OptionListProps<T>) {\n  return (\n    <div class={innerClass(p.getOptions().length, p.innerClass)}>\n      <For each={p.getOptions()}>\n        {(option) => (\n          <CheckOption\n            option={option}\n            valueSignal={p.valueSignal}\n            valueText={p.valueText}\n            optionClass={p.optionClass}\n            variant={p.variant}\n            disallowDeselection={p.disallowDeselection}\n            disabled={p.disabled}\n          />\n        )}\n      </For>\n    </div>\n  )\n}\n\nfunction innerClass(optionAmount: number, innerClass?: string): string {\n  if (innerClass) return innerClass\n  if (optionAmount <= 0) return \"\"\n  const base = \"gap-x-2 gap-y-1\"\n  if (optionAmount === 1) return classArr(\"grid grid-cols-1\", base)\n  if (optionAmount === 2) return classArr(\"grid grid-cols-2\", base)\n  return classArr(classesGridCols3xl, base)\n}\n\ninterface CheckOptionProps<T extends string> extends MayHaveButtonVariant, MayHaveDisabled {\n  option: T\n  valueSignal: SignalObject<T>\n  valueText?: (value: T) => string\n  disallowDeselection?: boolean\n  optionClass?: string\n}\n\nfunction CheckOption<T extends string>(p: CheckOptionProps<T>) {\n  const label = () => (p.valueText ? p.valueText(p.option) : p.option)\n  const isSelected = () => p.valueSignal.get() === p.option\n\n  return (\n    <ButtonIcon\n      role=\"option\"\n      aria-selected={isSelected()}\n      icon={isSelected() ? mdiCheckboxMarkedCircle : mdiCheckboxBlankCircleOutline}\n      // iconRight={isSelected() ? mdiCheckboxMarkedCircle : mdiCheckboxBlankCircleOutline}\n      onClick={() => toggleOption(p, p.disallowDeselection)}\n      variant={p.variant ?? buttonVariant.filled}\n      class={classMerge(\"justify-start text-left\", p.optionClass)}\n      disabled={p.disabled}\n    >\n      {label()}\n    </ButtonIcon>\n  )\n}\n\nfunction toggleOption<T extends string>(p: CheckOptionProps<T>, disallowDeselection?: boolean) {\n  const isSelected = p.valueSignal.get() === p.option\n  if (isSelected && !disallowDeselection) {\n    p.valueSignal.set(\"\" as T)\n  } else {\n    p.valueSignal.set(p.option)\n  }\n}\n"],"names":["CheckSingle","p","_el$","_tmpl$","_$insert","_$createComponent","OptionList","valueSignal","getOptions","valueText","variant","disallowDeselection","optionClass","innerClass","_$effect","_p$","_v$","id","_v$2","classMerge","class","e","_$setAttribute","t","_$className","undefined","_el$2","For","each","children","option","CheckOption","disabled","length","optionAmount","base","classArr","classesGridCols3xl","label","isSelected","get","ButtonIcon","role","icon","mdiCheckboxMarkedCircle","mdiCheckboxBlankCircleOutline","onClick","toggleOption","buttonVariant","filled","set"],"mappings":"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"}

package/dist/input/check/Checkbox.d.ts

@@ -0,0 +1,12 @@
+import { ComponentProps } from 'solid-js';
+import { MayHaveChildren } from '../../utils/MayHaveChildren';
+import { MayHaveClass } from '../../utils/MayHaveClass';
+import { MayHaveDisabled } from '../../utils/MayHaveDisabled';
+interface CheckboxProps extends MayHaveClass, MayHaveChildren, MayHaveDisabled, ComponentProps<"checkbox"> {
+    id?: string;
+    checked: boolean;
+    onChange: (checked: boolean) => void;
+}
+export declare function Checkbox(p: CheckboxProps): import("solid-js").JSX.Element;
+export {};
+//# sourceMappingURL=Checkbox.d.ts.map

package/dist/input/check/Checkbox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../lib/input/check/Checkbox.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,KAAK,cAAc,EAAE,MAAM,UAAU,CAAA;AAG1D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAChE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AAC1D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAGhE,UAAU,aAAc,SAAQ,YAAY,EAAE,eAAe,EAAE,eAAe,EAAE,cAAc,CAAC,UAAU,CAAC;IACxG,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,OAAO,EAAE,OAAO,CAAA;IAChB,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;CACrC;AAED,wBAAgB,QAAQ,CAAC,CAAC,EAAE,aAAa,kCAwDxC"}

package/dist/input/check/Checkbox.js

@@ -0,0 +1,89 @@
+import { delegateEvents, template, spread, mergeProps, memo, insert, createComponent, effect, className, setAttribute } from "solid-js/web";
+import { mdiCheckboxMarked, mdiCheckboxBlankOutline } from "@mdi/js";
+import { splitProps } from "solid-js";
+import { classesDisabledDirectly } from "../../classes/classesDisabledDirectly.js";
+import { Icon } from "../../static/icon/Icon.js";
+import { classMerge } from "../../utils/classMerge.js";
+var _tmpl$ = /* @__PURE__ */ template(`<div><input type=checkbox class="sr-only invisible"><div role=checkbox tabindex=0></div><label>`);
+function Checkbox(p) {
+  const [s, rest] = splitProps(p, ["id", "checked", "onChange", "disabled", "class", "children"]);
+  const handleToggle = () => {
+    if (s.disabled) return;
+    s.onChange(!s.checked);
+  };
+  return (() => {
+    var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.nextSibling;
+    _el$2.addEventListener("change", (e) => s.onChange(e.currentTarget.checked));
+    spread(_el$2, mergeProps({
+      get id() {
+        return s.id;
+      },
+      get checked() {
+        return s.checked;
+      },
+      get disabled() {
+        return s.disabled;
+      },
+      get ["aria-describedby"]() {
+        return memo(() => !!s.id)() ? `${s.id}-error` : void 0;
+      }
+    }, rest), false, false);
+    _el$3.$$keydown = (e) => {
+      if (e.key === " " || e.key === "Enter") {
+        e.preventDefault();
+        handleToggle();
+      }
+    };
+    _el$3.$$click = handleToggle;
+    insert(_el$3, createComponent(Icon, {
+      get path() {
+        return s.checked ? mdiCheckboxMarked : mdiCheckboxBlankOutline;
+      },
+      "class": "size-6 text-current"
+    }));
+    _el$4.$$click = (e) => {
+      e.preventDefault();
+      handleToggle();
+    };
+    insert(_el$4, () => s.children);
+    effect((_p$) => {
+      var _v$ = classMerge("flex items-start gap-1", s.class), _v$2 = classMerge(
+        "size-6",
+        // sizing + interaction
+        "cursor-pointer",
+        // cursor
+        "flex items-center justify-center",
+        // layout children
+        s.disabled && classesDisabledDirectly
+        // disabled state
+      ), _v$3 = s.checked, _v$4 = s.id ? `${s.id}-label` : void 0, _v$5 = s.id ? `${s.id}-label` : void 0, _v$6 = s.id, _v$7 = classMerge(
+        "cursor-pointer",
+        // interaction
+        s.disabled && classesDisabledDirectly
+        // disabled state
+      );
+      _v$ !== _p$.e && className(_el$, _p$.e = _v$);
+      _v$2 !== _p$.t && className(_el$3, _p$.t = _v$2);
+      _v$3 !== _p$.a && setAttribute(_el$3, "aria-checked", _p$.a = _v$3);
+      _v$4 !== _p$.o && setAttribute(_el$3, "aria-labelledby", _p$.o = _v$4);
+      _v$5 !== _p$.i && setAttribute(_el$4, "id", _p$.i = _v$5);
+      _v$6 !== _p$.n && setAttribute(_el$4, "for", _p$.n = _v$6);
+      _v$7 !== _p$.s && className(_el$4, _p$.s = _v$7);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0,
+      i: void 0,
+      n: void 0,
+      s: void 0
+    });
+    return _el$;
+  })();
+}
+delegateEvents(["click", "keydown"]);
+export {
+  Checkbox
+};
+//# sourceMappingURL=Checkbox.js.map

package/dist/input/check/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sources":["../../../lib/input/check/Checkbox.tsx"],"sourcesContent":["import { mdiCheckboxBlankOutline, mdiCheckboxMarked } from \"@mdi/js\"\nimport { splitProps, type ComponentProps } from \"solid-js\"\nimport { classesDisabledDirectly } from \"~ui/classes/classesDisabledDirectly\"\nimport { Icon } from \"~ui/static/icon/Icon\"\nimport type { MayHaveChildren } from \"~ui/utils/MayHaveChildren\"\nimport type { MayHaveClass } from \"~ui/utils/MayHaveClass\"\nimport type { MayHaveDisabled } from \"~ui/utils/MayHaveDisabled\"\nimport { classMerge } from \"~ui/utils/classMerge\"\n\ninterface CheckboxProps extends MayHaveClass, MayHaveChildren, MayHaveDisabled, ComponentProps<\"checkbox\"> {\n  id?: string\n  checked: boolean\n  onChange: (checked: boolean) => void\n}\n\nexport function Checkbox(p: CheckboxProps) {\n  const [s, rest] = splitProps(p, [\"id\", \"checked\", \"onChange\", \"disabled\", \"class\", \"children\"])\n  const handleToggle = () => {\n    if (s.disabled) return\n    s.onChange(!s.checked)\n  }\n\n  return (\n    <div class={classMerge(\"flex items-start gap-1\", s.class)}>\n      <input\n        id={s.id}\n        type=\"checkbox\"\n        checked={s.checked}\n        onChange={(e) => s.onChange(e.currentTarget.checked)}\n        class=\"sr-only invisible\"\n        disabled={s.disabled}\n        aria-describedby={s.id ? `${s.id}-error` : undefined}\n        {...rest}\n      />\n      <div\n        onClick={handleToggle}\n        class={classMerge(\n          \"size-6\", // sizing + interaction\n          \"cursor-pointer\", // cursor\n          \"flex items-center justify-center\", // layout children\n          s.disabled && classesDisabledDirectly, // disabled state\n        )}\n        role=\"checkbox\"\n        aria-checked={s.checked}\n        aria-labelledby={s.id ? `${s.id}-label` : undefined}\n        tabindex={0}\n        onKeyDown={(e) => {\n          if (e.key === \" \" || e.key === \"Enter\") {\n            e.preventDefault()\n            handleToggle()\n          }\n        }}\n      >\n        <Icon path={s.checked ? mdiCheckboxMarked : mdiCheckboxBlankOutline} class=\"size-6 text-current\" />\n      </div>\n      <label\n        id={s.id ? `${s.id}-label` : undefined}\n        for={s.id}\n        class={classMerge(\n          \"cursor-pointer\", // interaction\n          s.disabled && classesDisabledDirectly, // disabled state\n        )}\n        onClick={(e) => {\n          e.preventDefault()\n          handleToggle()\n        }}\n      >\n        {s.children}\n      </label>\n    </div>\n  )\n}\n"],"names":["Checkbox","p","s","rest","splitProps","handleToggle","disabled","onChange","checked","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_el$4","addEventListener","e","currentTarget","_$spread","_$mergeProps","id","_$memo","undefined","$$keydown","key","preventDefault","$$click","_$insert","_$createComponent","Icon","path","mdiCheckboxMarked","mdiCheckboxBlankOutline","children","_$effect","_p$","_v$","classMerge","class","_v$2","classesDisabledDirectly","_v$3","_v$4","_v$5","_v$6","_v$7","_$className","t","a","_$setAttribute","o","i","n","_$delegateEvents"],"mappings":"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"}

package/dist/input/fieldset/Fieldset.d.ts

@@ -0,0 +1,10 @@
+import { Component, JSXElement } from 'solid-js';
+import { MayHaveChildren } from '../../utils/MayHaveChildren';
+import { MayHaveSubtitle } from '../../utils/MayHaveSubtitle';
+import { MayHaveTitle } from '../../utils/MayHaveTitle';
+export interface FieldsetProps extends MayHaveChildren, MayHaveTitle, MayHaveSubtitle {
+    class?: string;
+    titleChildren?: JSXElement;
+}
+export declare const Fieldset: Component<FieldsetProps>;
+//# sourceMappingURL=Fieldset.d.ts.map

package/dist/input/fieldset/Fieldset.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Fieldset.d.ts","sourceRoot":"","sources":["../../../lib/input/fieldset/Fieldset.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAGrD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAChE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAA;AAChE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AAG1D,MAAM,WAAW,aAAc,SAAQ,eAAe,EAAE,YAAY,EAAE,eAAe;IACnF,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,aAAa,CAAC,EAAE,UAAU,CAAA;CAC3B;AAED,eAAO,MAAM,QAAQ,EAAE,SAAS,CAAC,aAAa,CAS7C,CAAA"}

package/dist/input/fieldset/Fieldset.js

@@ -0,0 +1,24 @@
+import { template, spread, mergeProps, insert, effect, className } from "solid-js/web";
+import { splitProps } from "solid-js";
+import { classMerge } from "../../utils/classMerge.js";
+import { classesFieldset } from "./classesFieldset.js";
+var _tmpl$ = /* @__PURE__ */ template(`<fieldset><legend>`);
+const Fieldset = (p) => {
+  const [s, rest] = splitProps(p, ["children", "title", "titleClass", "titleChildren", "subtitleClass", "class"]);
+  return (() => {
+    var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
+    spread(_el$, mergeProps({
+      get ["class"]() {
+        return classMerge(classesFieldset, s.class);
+      }
+    }, rest), false, true);
+    insert(_el$2, () => s.titleChildren ?? s.title);
+    insert(_el$, () => s.children, null);
+    effect(() => className(_el$2, classMerge("px-1", s.titleClass)));
+    return _el$;
+  })();
+};
+export {
+  Fieldset
+};
+//# sourceMappingURL=Fieldset.js.map

package/dist/input/fieldset/Fieldset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Fieldset.js","sources":["../../../lib/input/fieldset/Fieldset.tsx"],"sourcesContent":["import type { Component, JSXElement } from \"solid-js\"\nimport { splitProps } from \"solid-js\"\nimport { classMerge } from \"~ui/utils/classMerge\"\nimport type { MayHaveChildren } from \"~ui/utils/MayHaveChildren\"\nimport type { MayHaveSubtitle } from \"~ui/utils/MayHaveSubtitle\"\nimport type { MayHaveTitle } from \"~ui/utils/MayHaveTitle\"\nimport { classesFieldset } from \"./classesFieldset\"\n\nexport interface FieldsetProps extends MayHaveChildren, MayHaveTitle, MayHaveSubtitle {\n  class?: string\n  titleChildren?: JSXElement\n}\n\nexport const Fieldset: Component<FieldsetProps> = (p) => {\n  const [s, rest] = splitProps(p, [\"children\", \"title\", \"titleClass\", \"titleChildren\", \"subtitleClass\", \"class\"])\n\n  return (\n    <fieldset class={classMerge(classesFieldset, s.class)} {...rest}>\n      <legend class={classMerge(\"px-1\", s.titleClass)}>{s.titleChildren ?? s.title}</legend>\n      {s.children}\n    </fieldset>\n  )\n}\n"],"names":["Fieldset","p","s","rest","splitProps","_el$","_tmpl$","_el$2","firstChild","_$spread","_$mergeProps","classMerge","classesFieldset","class","_$insert","titleChildren","title","children","_$effect","_$className","titleClass"],"mappings":";;;;;AAaO,MAAMA,WAAsCC,CAAAA,MAAM;AACvD,QAAM,CAACC,GAAGC,IAAI,IAAIC,WAAWH,GAAG,CAAC,YAAY,SAAS,cAAc,iBAAiB,iBAAiB,OAAO,CAAC;AAE9G,UAAA,MAAA;AAAA,QAAAI,OAAAC,OAAAA,GAAAC,QAAAF,KAAAG;AAAAC,WAAAJ,MAAAK,WAAA;AAAA,MAAA,KAAA,OAAA,IAAA;AAAA,eACmBC,WAAWC,iBAAiBV,EAAEW,KAAK;AAAA,MAAC;AAAA,IAAA,GAAMV,IAAI,GAAA,OAAA,IAAA;AAAAW,WAAAP,OAAA,MACXL,EAAEa,iBAAiBb,EAAEc,KAAK;AAAAF,WAAAT,MAAA,MAC3EH,EAAEe,UAAQ,IAAA;AAAAC,WAAA,MAAAC,UAAAZ,OADII,WAAW,QAAQT,EAAEkB,UAAU,CAAC,CAAA;AAAA,WAAAf;AAAAA,EAAA,GAAA;AAIrD;"}

package/dist/input/fieldset/classesFieldset.d.ts

@@ -0,0 +1,2 @@
+export declare const classesFieldset = "rounded-lg border border-solid border-gray-300 dark:border-gray-700 p-3";
+//# sourceMappingURL=classesFieldset.d.ts.map

package/dist/input/fieldset/classesFieldset.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"classesFieldset.d.ts","sourceRoot":"","sources":["../../../lib/input/fieldset/classesFieldset.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,4EAA4E,CAAA"}

package/dist/input/fieldset/classesFieldset.js

@@ -0,0 +1,5 @@
+const classesFieldset = "rounded-lg border border-solid border-gray-300 dark:border-gray-700 p-3";
+export {
+  classesFieldset
+};
+//# sourceMappingURL=classesFieldset.js.map

package/dist/input/fieldset/classesFieldset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"classesFieldset.js","sources":["../../../lib/input/fieldset/classesFieldset.ts"],"sourcesContent":["export const classesFieldset = \"rounded-lg border border-solid border-gray-300 dark:border-gray-700 p-3\"\n"],"names":[],"mappings":"AAAO,MAAM,kBAAkB;"}

package/dist/input/form/formMode.d.ts

@@ -0,0 +1,14 @@
+export type FormMode = keyof typeof formMode;
+export declare const formMode: {
+    readonly view: "view";
+    readonly add: "add";
+    readonly edit: "edit";
+    readonly remove: "remove";
+};
+export declare function getFormModeTitle(mode: FormMode, subject: string): string;
+export declare function getFormModeButtonTitle(mode: FormMode, subject: string): string;
+export interface HasFormMode {
+    mode: FormMode;
+}
+export declare function formModeIsReadOnly(mode: FormMode): boolean;
+//# sourceMappingURL=formMode.d.ts.map

package/dist/input/form/formMode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"formMode.d.ts","sourceRoot":"","sources":["../../../lib/input/form/formMode.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,QAAQ,CAAA;AAE5C,eAAO,MAAM,QAAQ;;;;;CAKX,CAAA;AAEV,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAWxE;AAED,wBAAgB,sBAAsB,CAAC,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAK9E;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,QAAQ,CAAA;CACf;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,QAAQ,GAAG,OAAO,CAE1D"}

package/dist/input/form/formMode.js

@@ -0,0 +1,35 @@
+import { ttt } from "../../i18n/ttt.js";
+const formMode = {
+  view: "view",
+  add: "add",
+  edit: "edit",
+  remove: "remove"
+};
+function getFormModeTitle(mode, subject) {
+  switch (mode) {
+    case formMode.view:
+      return ttt("View") + " " + subject;
+    case formMode.add:
+      return ttt("Add") + " " + subject;
+    case formMode.edit:
+      return ttt("Edit") + " " + subject;
+    case formMode.remove:
+      return ttt("Remove") + " " + subject;
+  }
+}
+function getFormModeButtonTitle(mode, subject) {
+  if (mode === formMode.edit) {
+    return ttt("Save") + " " + subject;
+  }
+  return getFormModeTitle(mode, subject);
+}
+function formModeIsReadOnly(mode) {
+  return mode === formMode.view || mode === formMode.remove;
+}
+export {
+  formMode,
+  formModeIsReadOnly,
+  getFormModeButtonTitle,
+  getFormModeTitle
+};
+//# sourceMappingURL=formMode.js.map

package/dist/input/form/formMode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"formMode.js","sources":["../../../lib/input/form/formMode.ts"],"sourcesContent":["import { ttt } from \"~ui/i18n/ttt\"\n\nexport type FormMode = keyof typeof formMode\n\nexport const formMode = {\n  view: \"view\",\n  add: \"add\",\n  edit: \"edit\",\n  remove: \"remove\",\n} as const\n\nexport function getFormModeTitle(mode: FormMode, subject: string): string {\n  switch (mode) {\n    case formMode.view:\n      return ttt(\"View\") + \" \" + subject\n    case formMode.add:\n      return ttt(\"Add\") + \" \" + subject\n    case formMode.edit:\n      return ttt(\"Edit\") + \" \" + subject\n    case formMode.remove:\n      return ttt(\"Remove\") + \" \" + subject\n  }\n}\n\nexport function getFormModeButtonTitle(mode: FormMode, subject: string): string {\n  if (mode === formMode.edit) {\n    return ttt(\"Save\") + \" \" + subject\n  }\n  return getFormModeTitle(mode, subject)\n}\n\nexport interface HasFormMode {\n  mode: FormMode\n}\n\nexport function formModeIsReadOnly(mode: FormMode): boolean {\n  return mode === formMode.view || mode === formMode.remove\n}\n"],"names":[],"mappings":";AAIO,MAAM,WAAW;AAAA,EACtB,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,QAAQ;AACV;AAEO,SAAS,iBAAiB,MAAgB,SAAyB;AACxE,UAAQ,MAAA;AAAA,IACN,KAAK,SAAS;AACZ,aAAO,IAAI,MAAM,IAAI,MAAM;AAAA,IAC7B,KAAK,SAAS;AACZ,aAAO,IAAI,KAAK,IAAI,MAAM;AAAA,IAC5B,KAAK,SAAS;AACZ,aAAO,IAAI,MAAM,IAAI,MAAM;AAAA,IAC7B,KAAK,SAAS;AACZ,aAAO,IAAI,QAAQ,IAAI,MAAM;AAAA,EAAA;AAEnC;AAEO,SAAS,uBAAuB,MAAgB,SAAyB;AAC9E,MAAI,SAAS,SAAS,MAAM;AAC1B,WAAO,IAAI,MAAM,IAAI,MAAM;AAAA,EAC7B;AACA,SAAO,iBAAiB,MAAM,OAAO;AACvC;AAMO,SAAS,mBAAmB,MAAyB;AAC1D,SAAO,SAAS,SAAS,QAAQ,SAAS,SAAS;AACrD;"}

package/dist/input/form/formModeIcon.d.ts

@@ -0,0 +1,7 @@
+export declare const formModeIcon: {
+    readonly view: string;
+    readonly add: string;
+    readonly edit: string;
+    readonly remove: string;
+};
+//# sourceMappingURL=formModeIcon.d.ts.map

package/dist/input/form/formModeIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"formModeIcon.d.ts","sourceRoot":"","sources":["../../../lib/input/form/formModeIcon.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY;;;;;CAKoB,CAAA"}

package/dist/input/form/formModeIcon.js

@@ -0,0 +1,12 @@
+import { mdiTrashCan, mdiSquareEditOutline, mdiPlus, mdiCardTextOutline } from "@mdi/js";
+import { formMode } from "./formMode.js";
+const formModeIcon = {
+  [formMode.view]: mdiCardTextOutline,
+  [formMode.add]: mdiPlus,
+  [formMode.edit]: mdiSquareEditOutline,
+  [formMode.remove]: mdiTrashCan
+};
+export {
+  formModeIcon
+};
+//# sourceMappingURL=formModeIcon.js.map

package/dist/input/form/formModeIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"formModeIcon.js","sources":["../../../lib/input/form/formModeIcon.ts"],"sourcesContent":["import { mdiCardTextOutline, mdiPlus, mdiSquareEditOutline, mdiTrashCan } from \"@mdi/js\"\nimport { formMode, type FormMode } from \"~ui/input/form/formMode\"\n\nexport const formModeIcon = {\n  [formMode.view]: mdiCardTextOutline,\n  [formMode.add]: mdiPlus,\n  [formMode.edit]: mdiSquareEditOutline,\n  [formMode.remove]: mdiTrashCan,\n} as const satisfies Record<FormMode, string>\n"],"names":[],"mappings":";;AAGO,MAAM,eAAe;AAAA,EAC1B,CAAC,SAAS,IAAI,GAAG;AAAA,EACjB,CAAC,SAAS,GAAG,GAAG;AAAA,EAChB,CAAC,SAAS,IAAI,GAAG;AAAA,EACjB,CAAC,SAAS,MAAM,GAAG;AACrB;"}

package/dist/input/form/formModeMutate.d.ts

@@ -0,0 +1,9 @@
+export type FormModeMutate = keyof typeof formModeMutate;
+export declare const formModeMutate: {
+    readonly edit: "edit";
+    readonly remove: "remove";
+};
+export interface HasFormModeMutate {
+    mode: FormModeMutate;
+}
+//# sourceMappingURL=formModeMutate.d.ts.map

package/dist/input/form/formModeMutate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"formModeMutate.d.ts","sourceRoot":"","sources":["../../../lib/input/form/formModeMutate.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,cAAc,CAAA;AAExD,eAAO,MAAM,cAAc;;;CAGjB,CAAA;AAEV,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,cAAc,CAAA;CACrB"}

package/dist/input/form/formModeMutate.js

@@ -0,0 +1,8 @@
+const formModeMutate = {
+  edit: "edit",
+  remove: "remove"
+};
+export {
+  formModeMutate
+};
+//# sourceMappingURL=formModeMutate.js.map