@safestrong/ppa-component-library 1.6.4 → 1.6.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -28,6 +28,7 @@ type SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {
28
28
  label?: string;
29
29
  labelHtml?: string;
30
30
  placeholder?: string;
31
+ stateaction?: (param: any) => void;
31
32
  outerclass?: string;
32
33
  options?: {
33
34
  label: string;
package/dist/index.d.ts CHANGED
@@ -28,6 +28,7 @@ type SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {
28
28
  label?: string;
29
29
  labelHtml?: string;
30
30
  placeholder?: string;
31
+ stateaction?: (param: any) => void;
31
32
  outerclass?: string;
32
33
  options?: {
33
34
  label: string;
package/dist/index.js CHANGED
@@ -117,15 +117,15 @@ var IconButton = (props) => {
117
117
  return /* @__PURE__ */ import_react.default.createElement(
118
118
  "button",
119
119
  __spreadProps(__spreadValues({}, props), {
120
- className: `${props.className} ${props.title ? "max-w-[content] px-[0.8rem]" : ""} icon__button`
120
+ className: `${props.className} ${props.label ? "max-w-[content] px-[0.8rem]" : ""} icon__button`
121
121
  }),
122
122
  props.icon && /* @__PURE__ */ import_react.default.createElement(import_react_fontawesome.FontAwesomeIcon, { icon: props.icon }),
123
- props.title && /* @__PURE__ */ import_react.default.createElement("span", { className: "inline-block ml-[0.8rem] text-[1rem]" }, props.title)
123
+ props.label && /* @__PURE__ */ import_react.default.createElement("span", { className: "inline-block ml-[0.8rem] text-[1rem]" }, props.label)
124
124
  );
125
125
  };
126
126
  var IconButtonGroup = ({ list: list2 }) => {
127
127
  function getBtnClass(idx) {
128
- return `icon__button !rounded-[0] border-[0] ${idx !== 0 ? "border-l border-l-[var(--color-border)]" : ""}`;
128
+ return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${idx !== 0 ? "border-l border-l-[var(--color-border)]" : ""}`;
129
129
  }
130
130
  return /* @__PURE__ */ import_react.default.createElement("div", { className: "icon__button_group" }, list2.map((props, idx) => /* @__PURE__ */ import_react.default.createElement("button", __spreadValues({ key: idx, className: getBtnClass(idx) }, props), props.icon && /* @__PURE__ */ import_react.default.createElement(import_react_fontawesome.FontAwesomeIcon, { icon: props.icon }))));
131
131
  };
@@ -148,10 +148,10 @@ function TextInput(_a) {
148
148
  "icon",
149
149
  "outerclass"
150
150
  ]);
151
- return /* @__PURE__ */ import_react2.default.createElement("div", { className: `group ${outerclass} w-full` }, label && /* @__PURE__ */ import_react2.default.createElement("label", { htmlFor: labelFor, className: "text-input__label" }, label), /* @__PURE__ */ import_react2.default.createElement("div", { className: "text-input__wrapper overflow-hidden" }, icon && /* @__PURE__ */ import_react2.default.createElement(import_react_fontawesome2.FontAwesomeIcon, { icon, className: input__icon }), /* @__PURE__ */ import_react2.default.createElement(
151
+ return /* @__PURE__ */ import_react2.default.createElement("div", { className: `group ${outerclass} w-full` }, label && /* @__PURE__ */ import_react2.default.createElement("label", { htmlFor: labelFor, className: "text-input__label" }, label), /* @__PURE__ */ import_react2.default.createElement("div", { className: `text-input__wrapper overflow-hidden ${attr.className}` }, icon && /* @__PURE__ */ import_react2.default.createElement(import_react_fontawesome2.FontAwesomeIcon, { icon, className: input__icon }), /* @__PURE__ */ import_react2.default.createElement(
152
152
  "input",
153
153
  __spreadProps(__spreadValues({}, attr), {
154
- className: `text-input w-full ${attr.className} ${icon && "!pl-[0.3rem]"}`
154
+ className: `text-input w-full ${icon && "!pl-[0.3rem]"}`
155
155
  })
156
156
  )));
157
157
  }
@@ -183,7 +183,6 @@ function SingleSelect(attr) {
183
183
  label: "",
184
184
  value: ""
185
185
  });
186
- const inputKeyword = (0, import_react4.useDeferredValue)(keyword);
187
186
  function selectItem({ label, value }, e) {
188
187
  const triggerManual = attrInput.onChange;
189
188
  if (triggerManual) {
@@ -192,6 +191,10 @@ function SingleSelect(attr) {
192
191
  });
193
192
  }
194
193
  setSelected({ label, value });
194
+ if (attr.stateaction) {
195
+ if (stringOptions) attr.stateaction(value);
196
+ if (options) attr.stateaction({ label, value });
197
+ }
195
198
  setKeyword("");
196
199
  setTimeout(() => {
197
200
  e.target.blur();
@@ -213,9 +216,9 @@ function SingleSelect(attr) {
213
216
  }, [options, stringOptions]);
214
217
  const filteredOptions = (0, import_react4.useMemo)(() => {
215
218
  return availableOptions.filter(
216
- ({ label, value }) => label.toLowerCase().includes(inputKeyword.toLowerCase()) || value.toLowerCase().includes(inputKeyword.toLowerCase())
219
+ ({ label, value }) => label.toLowerCase().includes(keyword.toLowerCase()) || value.toLowerCase().includes(keyword.toLowerCase())
217
220
  );
218
- }, [inputKeyword, availableOptions]);
221
+ }, [keyword, availableOptions]);
219
222
  (0, import_react4.useEffect)(() => {
220
223
  attrInput.value && autoUpdateValue(attrInput.value);
221
224
  }, [attrInput.value]);
@@ -349,7 +352,7 @@ var Inline = ({
349
352
  import_react_fontawesome5.FontAwesomeIcon,
350
353
  {
351
354
  icon: getIcon(type),
352
- className: "text-[1.2rem]",
355
+ className: "text-[1.3rem]",
353
356
  style: { color: getColor(type) }
354
357
  }
355
358
  ),
@@ -409,7 +412,6 @@ function MultiSelect(_a) {
409
412
  ]);
410
413
  const { options = [], stringOptions = [] } = attr;
411
414
  const [keyword, setKeyword] = (0, import_react10.useState)("");
412
- const inputKeyword = (0, import_react10.useDeferredValue)(keyword);
413
415
  const availableOptions = (0, import_react10.useMemo)(() => {
414
416
  const isDefaultOption = options && options.length > 0;
415
417
  if (!isDefaultOption)
@@ -418,7 +420,7 @@ function MultiSelect(_a) {
418
420
  }, [options, stringOptions]);
419
421
  function getFiltered() {
420
422
  return availableOptions.filter(
421
- ({ label: label2, value }) => label2.toLowerCase().includes(inputKeyword.toLowerCase()) || value.toLowerCase().includes(inputKeyword.toLowerCase())
423
+ ({ label: label2, value }) => label2.toLowerCase().includes(keyword.toLowerCase()) || value.toLowerCase().includes(keyword.toLowerCase())
422
424
  );
423
425
  }
424
426
  function selectItem({ label: label2, value }) {
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["export { default as Button } from \"./components/Button\";\nexport { default as TextInput } from \"./components/TextInput\";\nexport { default as Slider } from \"./components/Slider\";\nexport { default as SingleSelect } from \"./components/SingleSelect\";\nexport { default as Tooltip } from \"./components/Tooltip\";\nexport { default as NavTabClient } from \"./components/NavTabClient\";\nexport { default as Card } from \"./components/Card\";\nexport { default as Toast } from \"./components/Toast\";\nexport { default as Expandable } from \"./components/Expandable\";\nexport { default as MultiSelect } from \"./components/MultiSelect\";\nexport { default as ThemeToggle } from \"./components/ThemeToggle\";\nexport { default as Dashboard } from \"./components/Dashboard\";\nexport { default as Badge } from \"./components/Badge\";\nexport { default as Skeleton } from \"./components/Skeleton\";\nexport { default as Navigation } from \"./components/Navigation\";\nexport { default as Confirmation } from \"./components/Confirmation\";\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n icon?: IconProp;\n label?: string;\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\n isLoading?: boolean;\n};\n\nexport default function Button({\n label,\n icon,\n isLoading,\n btnType,\n className,\n ...rest\n}: Readonly<Button>) {\n const buttonIcon = isLoading ? faCircleNotch : icon;\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\n return (\n <button\n {...rest}\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\n btnType == \"secondary\" && \"btn__secondary\"\n } btn__primary`}\n >\n {buttonIcon && icon && (\n <FontAwesomeIcon\n icon={buttonIcon}\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\n isLoading && \"animate-spin\"\n }`}\n />\n )}\n {isLoading ? loadingLabel : label}\n </button>\n );\n}\n\nconst IconButton = (props: Readonly<Button>) => {\n return (\n <button\n {...props}\n className={`${props.className} ${\n props.title ? \"max-w-[content] px-[0.8rem]\" : \"\"\n } icon__button`}\n >\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\n {props.title && (\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\n {props.title}\n </span>\n )}\n </button>\n );\n};\n\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\n function getBtnClass(idx: number) {\n return `icon__button !rounded-[0] border-[0] ${\n idx !== 0 ? \"border-l border-l-[var(--color-border)]\" : \"\"\n }`;\n }\n return (\n <div className=\"icon__button_group\">\n {list.map((props, idx) => (\n <button key={idx} className={getBtnClass(idx)} {...props}>\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\n </button>\n ))}\n </div>\n );\n};\n\nButton.IconButton = IconButton;\nButton.IconButtonGroup = IconButtonGroup;\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nconst input__icon =\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)]\";\n\nexport default function TextInput({\n label,\n labelFor,\n icon,\n outerclass,\n ...attr\n}: Readonly<\n React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelFor?: string;\n icon?: IconProp;\n outerclass?: string;\n }\n>) {\n return (\n <div className={`group ${outerclass} w-full`}>\n {label && (\n <label htmlFor={labelFor} className=\"text-input__label\">\n {label}\n </label>\n )}\n <div className=\"text-input__wrapper overflow-hidden\">\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\n <input\n {...attr}\n className={`text-input w-full ${attr.className} ${\n icon && \"!pl-[0.3rem]\"\n }`}\n />\n </div>\n </div>\n );\n}\n","import React from \"react\";\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\nexport default function Slider(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <div className=\"slider__wrapper group\">\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[0.7rem] translate-x-[0.2px]\"\n />\n </label>\n </div>\n </div>\n );\n}\n\nconst input = \"peer ... w-[3rem] h-[1.6rem] opacity-[0] cursor-pointer\";\n","\"use client\";\nimport React, { useDeferredValue, useEffect, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\n\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelHtml?: string;\n placeholder?: string;\n outerclass?: string;\n options?: {\n label: string;\n value: string;\n }[];\n stringOptions?: string[];\n};\n\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\n const { options = [], stringOptions = [], ...attrInput } = attr;\n const [keyword, setKeyword] = useState(\"\");\n const [selected, setSelected] = useState<{ label: string; value: any }>({\n label: \"\",\n value: \"\",\n });\n const inputKeyword = useDeferredValue(keyword);\n\n function selectItem(\n { label, value }: { label: string; value: any },\n e: React.MouseEvent<HTMLButtonElement>\n ) {\n const triggerManual = attrInput.onChange;\n if (triggerManual) {\n triggerManual?.({\n target: { value, name: attrInput.name },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n setSelected({ label, value });\n setKeyword(\"\");\n setTimeout(() => {\n (e.target as HTMLButtonElement).blur();\n }, 250);\n }\n\n function autoUpdateValue(updatedValue: string) {\n if (updatedValue) {\n const filtered = availableOptions.find(\n ({ value }) => value == updatedValue\n );\n if (filtered) setSelected(filtered);\n }\n }\n\n const availableOptions = useMemo(() => {\n let defaultOptions = options && options.length > 0;\n if (!defaultOptions)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n const filteredOptions = useMemo(() => {\n return availableOptions.filter(\n ({ label, value }) =>\n label.toLowerCase().includes(inputKeyword.toLowerCase()) ||\n value.toLowerCase().includes(inputKeyword.toLowerCase())\n );\n }, [inputKeyword, availableOptions]);\n\n useEffect(() => {\n attrInput.value && autoUpdateValue(attrInput.value as string);\n }, [attrInput.value]);\n\n return (\n <div className={`w-full group ${attr.outerclass}`}>\n {attrInput.label && (\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\n {attrInput.label}\n </label>\n )}\n <div className={`${attrInput.className} text-input__wrapper relative`}>\n <input\n {...attrInput}\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\n value={attrInput.value ?? selected.value}\n type=\"hidden\"\n />\n <input\n value={keyword}\n type=\"search\"\n onChange={(e) => setKeyword(e.target.value)}\n className={`${attrInput.name}-keyword ${input} ${\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\n }`}\n placeholder={selected.value ? selected.label : attrInput.placeholder}\n />\n <div className=\"select-item__wrapper\">\n {filteredOptions.length == 0 && keyword != \"\" && (\n <button disabled className=\"select-item text-[var(--color-danger)]\">\n Tidak ada Item\n </button>\n )}\n {filteredOptions.map(({ label, value }) => (\n <button\n type=\"button\"\n onClick={(e) => selectItem({ label, value }, e)}\n key={value}\n className=\"select-item\"\n >\n {label}\n {selected.value == value && (\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[var(--color-primary)]\"\n />\n )}\n </button>\n ))}\n </div>\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\n </div>\n </div>\n );\n}\n\nSingleSelect.autoFill = autoFillInput;\n\nfunction autoFillInput(\n value: string,\n elName: string,\n list: { label: string; value: string }[]\n) {\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\n inp.value = `${value}`;\n const filtered = list.find((item) => item.value == value);\n const el = document.querySelector(`.${elName}-keyword`);\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\n}\n\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\nconst input = \"text-input peer ... w-full\";\n","import React from \"react\";\n\ntype Tooltip = {\n children: React.ReactNode;\n text: string;\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\n};\n\nexport default function Tooltip({\n children,\n text,\n position = \"top\",\n}: Readonly<Tooltip>) {\n function getAccent() {\n const mapping = {\n top,\n bottom,\n left,\n right,\n };\n return mapping[position];\n }\n return (\n <div className=\"relative\">\n <div className=\"peer\">{children}</div>\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\n </div>\n );\n}\n\nconst top =\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\nconst bottom =\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\nconst right =\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\nconst left =\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\n","import React from \"react\";\n\ntype Option = {\n label: string;\n value: string;\n};\n\nexport default function NavTabClient({\n items,\n state,\n}: Readonly<{\n items: Option[];\n state: {\n active: string;\n setActive: (val: string) => void;\n };\n}>) {\n return (\n <nav className=\"navtab__wrapper\">\n {items.map(({ label, value }) => (\n <button\n key={value}\n className={`navtab__item ${\n state.active == value\n ? \"navtab__item__active\"\n : \"hover:bg-[var(--color-border)]/50\"\n }`}\n onClick={() => state.setActive(value)}\n >\n {label}\n </button>\n ))}\n </nav>\n );\n}\n","import React from \"react\";\n\ntype Card = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport default function Card({ children, className }: Readonly<Card>) {\n return <div className={`card ${className}`}>{children}</div>;\n}\n\nconst Footer = ({\n className,\n children,\n}: {\n className?: string;\n children?: React.ReactNode;\n}) => {\n return (\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\n {children}\n </div>\n );\n};\n\nCard.Footer = Footer;\n","import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport {\n faCheckCircle,\n faInfoCircle,\n faQuestionCircle,\n faXmarkCircle,\n} from \"@fortawesome/free-solid-svg-icons\";\n\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\ntype Toast = {\n title: string;\n className?: string;\n description: string;\n type: ToastType;\n};\n\nexport default function Toast({\n title,\n description,\n type = \"info\",\n className,\n}: Readonly<Toast>) {\n return (\n <div className={`toast__wrapper group ${className}`}>\n <div className=\"toast__body\">\n <div style={{ background: getColor(type) }} className={bullet}></div>\n <div>\n <p className=\"toast__title\">{title}</p>\n <p className=\"toast__description\">{description}</p>\n </div>\n <div className={`toast__icon toast__icon__${type}`}></div>\n </div>\n <p\n className=\"toast__bar toast-bar-animate\"\n style={{ background: getColor(type) }}\n ></p>\n </div>\n );\n}\n\nconst Inline = ({\n className,\n text,\n type,\n}: {\n className?: string;\n text: string;\n type: ToastType;\n}) => {\n return (\n <div\n className={`toast__inline ${className}`}\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\n >\n <FontAwesomeIcon\n icon={getIcon(type)}\n className=\"text-[1.2rem]\"\n style={{ color: getColor(type) }}\n />\n <p>{text}</p>\n </div>\n );\n};\n\nToast.Inline = Inline;\n\nfunction getColor(type: string) {\n return `var(--color-${type})`;\n}\n\nfunction getIcon(type: string) {\n const mapping = {\n warning: faQuestionCircle,\n info: faInfoCircle,\n danger: faXmarkCircle,\n success: faCheckCircle,\n };\n //@ts-expect-error call object using array index\n return mapping[type];\n}\n\nconst bullet =\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\n","import React from \"react\";\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\ntype Expandable = {\n children: React.ReactNode;\n title: string;\n className?: string;\n isOpen?: boolean;\n};\n\nexport default function Expandable({\n children,\n title,\n className,\n isOpen,\n}: Readonly<Expandable>) {\n const name = title.replace(\" \", \"\");\n return (\n <div className={`expandable ${className}`}>\n <input\n id={name}\n type=\"checkbox\"\n defaultChecked={isOpen}\n className=\"opacity-[0] peer absolute top-0 ex-title\"\n />\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\n <label htmlFor={name} className=\"expandable__title\">\n {title}\n </label>\n <div className=\"expandable__body\">\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\n </div>\n </div>\n );\n}\n","import React, { useCallback, useDeferredValue, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Option = {\n value: string;\n label: string;\n};\n\ntype MultiSelect = {\n label?: string;\n labelHtml?: string;\n outerclass?: string;\n options?: Option[];\n stringOptions?: string[];\n state: { value: Option[]; select: (newVal: Option[]) => void };\n};\n\nexport default function MultiSelect({\n state,\n label,\n labelHtml,\n ...attr\n}: Readonly<MultiSelect>) {\n const { options = [], stringOptions = [] } = attr;\n const [keyword, setKeyword] = useState(\"\");\n const inputKeyword = useDeferredValue(keyword);\n\n const availableOptions = useMemo(() => {\n const isDefaultOption = options && options.length > 0;\n if (!isDefaultOption)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n function getFiltered() {\n return availableOptions.filter(\n ({ label, value }) =>\n label.toLowerCase().includes(inputKeyword.toLowerCase()) ||\n value.toLowerCase().includes(inputKeyword.toLowerCase())\n );\n }\n\n function selectItem({ label, value }: { label: string; value: string }) {\n //@ts-expect-error: avoid check\n state.select((prev) => {\n const isItemExist = prev.find((item: any) => item.value == value);\n if (isItemExist) {\n return prev.filter((item: any) => item.value != value);\n }\n return [...prev, { label, value }];\n });\n }\n\n function isItemExist(value: string) {\n return state.value.find((item: any) => item.value == value);\n }\n\n const selectUnSelectAll = useCallback(() => {\n const isAllSelected = state.value.length == availableOptions.length;\n state.select(isAllSelected ? [] : availableOptions);\n }, [state.value]);\n\n return (\n <div className={`group w-full ${attr.outerclass}`}>\n {label && (\n <label className=\"text-input__label\" htmlFor={labelHtml}>\n {label}\n </label>\n )}\n <div className=\"text-input__wrapper relative\">\n <input\n value={keyword}\n type=\"search\"\n placeholder={`${state.value.length} Dipilih`}\n className={`${input} ${\n state.value.length > 0 &&\n \"placeholder:text-[var(--color-text-primary)]\"\n }`}\n onChange={(e) => setKeyword(e.target.value)}\n />\n <div className=\"select-item__wrapper select-multiple__wrapper\">\n {getFiltered().length == 0 && keyword != \"\" && (\n <button disabled className=\"select-item text-[var(--color-danger)]\">\n Tidak ada Item\n </button>\n )}\n {getFiltered().map(({ label, value }) => (\n <button\n type=\"button\"\n onClick={() => selectItem({ label, value })}\n key={value}\n className=\"select-item\"\n >\n {label}\n {isItemExist(value) && (\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[var(--color-primary)]\"\n />\n )}\n </button>\n ))}\n </div>\n <button\n type=\"button\"\n className=\"cursor-pointer\"\n onClick={selectUnSelectAll}\n >\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\n </button>\n </div>\n </div>\n );\n}\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\nconst input = \"text-input peer ... w-full\";\n","\"use client\";\nimport React from \"react\";\n\nexport default function ThemeToggle(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <label\n htmlFor={`${attr.id || \"theme-toggle\"}`}\n className=\"slider__wrapper slider-theme slider-theme-light\"\n >\n <input\n id=\"theme-toggle\"\n {...attr}\n type=\"checkbox\"\n className=\"peer ... w-[2rem] opacity-[0] cursor-pointer\"\n />\n <span className=\"slider-theme__bullet\"></span>\n </label>\n </div>\n );\n}\n","import React, { useState } from \"react\";\nimport MultiSelect from \"./MultiSelect\";\nimport SingleSelect from \"./SingleSelect\";\n\nconst list = [\n { label: \"Option 1\", value: \"option1\" },\n { label: \"Option 2\", value: \"option2\" },\n { label: \"Option 3\", value: \"option3\" },\n];\nconst stringList = [\"option1\", \"option2\", \"option3\"];\n\nexport default function Dashboard() {\n const [selectedItem, setSelectedItem] = useState<\n { label: string; value: string }[]\n >([]);\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\n\n function updateState(item: string) {\n const filtered = list.find(({ value }) => value == item);\n filtered && setSel(filtered);\n }\n\n return (\n <div className=\"flex items-center gap-[1rem]\">\n <MultiSelect\n label=\"Multi Select\"\n stringOptions={stringList}\n state={{ value: selectedItem, select: setSelectedItem }}\n />\n <SingleSelect\n label=\"Single Select\"\n name=\"newinput\"\n stringOptions={stringList}\n placeholder=\"-- Pilih Status --\"\n value={sel.value}\n />\n </div>\n );\n}\n","import React from \"react\";\nexport default function Badge({\n text,\n type,\n className,\n}: {\n text: string;\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\n className?: string;\n}) {\n return (\n <div className=\"badge__wrapper\">\n <span\n style={{\n background: `var(--color-${type})`,\n }}\n className={`badge ${className}`}\n >\n {text}\n </span>\n </div>\n );\n}\n","import React from \"react\";\nexport default function Skeleton({ className }: { className?: string }) {\n return (\n <div className={`${className} skeleton`}>\n <span className=\"skeleton__item skeleton-slide\"></span>\n </div>\n );\n}\n","import React from \"react\";\n\nexport default function Navigation() {\n return <nav></nav>;\n}\n\nconst URLNavigation = (props: {\n list: { label: string; href: string }[];\n activeUrl: string;\n outerclass?: string;\n CustomComponent?: React.ElementType;\n}) => {\n const Component = props.CustomComponent || \"a\";\n function getAnchorClass(href: string) {\n return href === props.activeUrl\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\n }\n\n return (\n <nav className={`nav__wrapper ${props.outerclass}`}>\n {props.list.map((prop) => (\n <Component\n key={prop.href}\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\n {...prop}\n >\n {prop.label}\n </Component>\n ))}\n </nav>\n );\n};\n\nNavigation.URL = URLNavigation;\n\nconst base__anchor =\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\n","import React from \"react\";\n\nexport default function Confirmation({\n type = \"warning\",\n text,\n title,\n secondaryAction,\n secondaryLabel = \"Tidak\",\n mainAction,\n mainLabel = \"Ya\",\n}: {\n mainAction: () => void;\n secondaryAction?: () => void;\n mainLabel?: string;\n secondaryLabel?: string;\n title: string;\n text: string;\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\n}) {\n return (\n <div className=\"confirmation__outer\">\n <div className=\"confirmation__card\">\n <div className={wrapper}>\n <div className={`baloon__${type} baloon`}></div>\n <div>\n <h3 className=\"font-semibold\">{title}</h3>\n <p className={confirmation__text}>{text}</p>\n </div>\n </div>\n <div className=\"confirmation__footer\">\n {secondaryAction && (\n <button\n onClick={secondaryAction}\n type=\"button\"\n className=\"cursor-pointer\"\n style={{ color: `var(--color-${type})` }}\n >\n {secondaryLabel}\n </button>\n )}\n <button\n onClick={() => {\n mainAction();\n secondaryAction && secondaryAction();\n }}\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\n style={{\n background: `var(--color-${type})`,\n border: `1px solid var(--color-${type})`,\n }}\n >\n {mainLabel}\n </button>\n </div>\n </div>\n </div>\n );\n}\n\nconst wrapper =\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\nconst confirmation__text =\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\n"],"mappings":"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","names":["React","list","import_react","import_react_fontawesome","React","import_react","import_free_solid_svg_icons","import_react_fontawesome","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","React","input","input__icon","list","import_react","React","import_react","React","import_react","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","React","import_react","import_free_solid_svg_icons","import_react_fontawesome","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","label","isItemExist","React","input","input__icon","import_react","React","import_react","React","import_react","React","import_react","React","import_react","React","import_react","React"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["export { default as Button } from \"./components/Button\";\nexport { default as TextInput } from \"./components/TextInput\";\nexport { default as Slider } from \"./components/Slider\";\nexport { default as SingleSelect } from \"./components/SingleSelect\";\nexport { default as Tooltip } from \"./components/Tooltip\";\nexport { default as NavTabClient } from \"./components/NavTabClient\";\nexport { default as Card } from \"./components/Card\";\nexport { default as Toast } from \"./components/Toast\";\nexport { default as Expandable } from \"./components/Expandable\";\nexport { default as MultiSelect } from \"./components/MultiSelect\";\nexport { default as ThemeToggle } from \"./components/ThemeToggle\";\nexport { default as Dashboard } from \"./components/Dashboard\";\nexport { default as Badge } from \"./components/Badge\";\nexport { default as Skeleton } from \"./components/Skeleton\";\nexport { default as Navigation } from \"./components/Navigation\";\nexport { default as Confirmation } from \"./components/Confirmation\";\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n icon?: IconProp;\n label?: string;\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\n isLoading?: boolean;\n};\n\nexport default function Button({\n label,\n icon,\n isLoading,\n btnType,\n className,\n ...rest\n}: Readonly<Button>) {\n const buttonIcon = isLoading ? faCircleNotch : icon;\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\n return (\n <button\n {...rest}\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\n btnType == \"secondary\" && \"btn__secondary\"\n } btn__primary`}\n >\n {buttonIcon && icon && (\n <FontAwesomeIcon\n icon={buttonIcon}\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\n isLoading && \"animate-spin\"\n }`}\n />\n )}\n {isLoading ? loadingLabel : label}\n </button>\n );\n}\n\nconst IconButton = (props: Readonly<Button>) => {\n return (\n <button\n {...props}\n className={`${props.className} ${\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\n } icon__button`}\n >\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\n {props.label && (\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\n {props.label}\n </span>\n )}\n </button>\n );\n};\n\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\n function getBtnClass(idx: number) {\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${\n idx !== 0 ? \"border-l border-l-[var(--color-border)]\" : \"\"\n }`;\n }\n return (\n <div className=\"icon__button_group\">\n {list.map((props, idx) => (\n <button key={idx} className={getBtnClass(idx)} {...props}>\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\n </button>\n ))}\n </div>\n );\n};\n\nButton.IconButton = IconButton;\nButton.IconButtonGroup = IconButtonGroup;\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nconst input__icon =\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)]\";\n\nexport default function TextInput({\n label,\n labelFor,\n icon,\n outerclass,\n ...attr\n}: Readonly<\n React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelFor?: string;\n icon?: IconProp;\n outerclass?: string;\n }\n>) {\n return (\n <div className={`group ${outerclass} w-full`}>\n {label && (\n <label htmlFor={labelFor} className=\"text-input__label\">\n {label}\n </label>\n )}\n <div className={`text-input__wrapper overflow-hidden ${attr.className}`}>\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\n <input\n {...attr}\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"}`}\n />\n </div>\n </div>\n );\n}\n","import React from \"react\";\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\nexport default function Slider(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <div className=\"slider__wrapper group\">\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[0.7rem] translate-x-[0.2px]\"\n />\n </label>\n </div>\n </div>\n );\n}\n\nconst input = \"peer ... w-[3rem] h-[1.6rem] opacity-[0] cursor-pointer\";\n","\"use client\";\nimport React, { useDeferredValue, useEffect, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\n\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelHtml?: string;\n placeholder?: string;\n stateaction?: (param: any) => void;\n outerclass?: string;\n options?: {\n label: string;\n value: string;\n }[];\n stringOptions?: string[];\n};\n\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\n const { options = [], stringOptions = [], ...attrInput } = attr;\n const [keyword, setKeyword] = useState(\"\");\n const [selected, setSelected] = useState<{ label: string; value: any }>({\n label: \"\",\n value: \"\",\n });\n // const inputKeyword = useDeferredValue(keyword);\n\n function selectItem(\n { label, value }: { label: string; value: any },\n e: React.MouseEvent<HTMLButtonElement>\n ) {\n const triggerManual = attrInput.onChange;\n if (triggerManual) {\n triggerManual?.({\n target: { value, name: attrInput.name },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n setSelected({ label, value });\n if (attr.stateaction) {\n if (stringOptions) attr.stateaction(value);\n if (options) attr.stateaction({ label, value });\n }\n setKeyword(\"\");\n setTimeout(() => {\n (e.target as HTMLButtonElement).blur();\n }, 250);\n }\n\n function autoUpdateValue(updatedValue: string) {\n if (updatedValue) {\n const filtered = availableOptions.find(\n ({ value }) => value == updatedValue\n );\n if (filtered) setSelected(filtered);\n }\n }\n\n const availableOptions = useMemo(() => {\n let defaultOptions = options && options.length > 0;\n if (!defaultOptions)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n const filteredOptions = useMemo(() => {\n return availableOptions.filter(\n ({ label, value }) =>\n label.toLowerCase().includes(keyword.toLowerCase()) ||\n value.toLowerCase().includes(keyword.toLowerCase())\n );\n }, [keyword, availableOptions]);\n\n useEffect(() => {\n attrInput.value && autoUpdateValue(attrInput.value as string);\n }, [attrInput.value]);\n\n return (\n <div className={`w-full group ${attr.outerclass}`}>\n {attrInput.label && (\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\n {attrInput.label}\n </label>\n )}\n <div className={`${attrInput.className} text-input__wrapper relative`}>\n <input\n {...attrInput}\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\n value={attrInput.value ?? selected.value}\n type=\"hidden\"\n />\n <input\n value={keyword}\n type=\"search\"\n onChange={(e) => setKeyword(e.target.value)}\n className={`${attrInput.name}-keyword ${input} ${\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\n }`}\n placeholder={selected.value ? selected.label : attrInput.placeholder}\n />\n <div className=\"select-item__wrapper\">\n {filteredOptions.length == 0 && keyword != \"\" && (\n <button disabled className=\"select-item text-[var(--color-danger)]\">\n Tidak ada Item\n </button>\n )}\n {filteredOptions.map(({ label, value }) => (\n <button\n type=\"button\"\n onClick={(e) => selectItem({ label, value }, e)}\n key={value}\n className=\"select-item\"\n >\n {label}\n {selected.value == value && (\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[var(--color-primary)]\"\n />\n )}\n </button>\n ))}\n </div>\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\n </div>\n </div>\n );\n}\n\nSingleSelect.autoFill = autoFillInput;\n\nfunction autoFillInput(\n value: string,\n elName: string,\n list: { label: string; value: string }[]\n) {\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\n inp.value = `${value}`;\n const filtered = list.find((item) => item.value == value);\n const el = document.querySelector(`.${elName}-keyword`);\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\n}\n\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\nconst input = \"text-input peer ... w-full\";\n","import React from \"react\";\n\ntype Tooltip = {\n children: React.ReactNode;\n text: string;\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\n};\n\nexport default function Tooltip({\n children,\n text,\n position = \"top\",\n}: Readonly<Tooltip>) {\n function getAccent() {\n const mapping = {\n top,\n bottom,\n left,\n right,\n };\n return mapping[position];\n }\n return (\n <div className=\"relative\">\n <div className=\"peer\">{children}</div>\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\n </div>\n );\n}\n\nconst top =\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\nconst bottom =\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\nconst right =\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\nconst left =\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\n","import React from \"react\";\n\ntype Option = {\n label: string;\n value: string;\n};\n\nexport default function NavTabClient({\n items,\n state,\n}: Readonly<{\n items: Option[];\n state: {\n active: string;\n setActive: (val: string) => void;\n };\n}>) {\n return (\n <nav className=\"navtab__wrapper\">\n {items.map(({ label, value }) => (\n <button\n key={value}\n className={`navtab__item ${\n state.active == value\n ? \"navtab__item__active\"\n : \"hover:bg-[var(--color-border)]/50\"\n }`}\n onClick={() => state.setActive(value)}\n >\n {label}\n </button>\n ))}\n </nav>\n );\n}\n","import React from \"react\";\n\ntype Card = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport default function Card({ children, className }: Readonly<Card>) {\n return <div className={`card ${className}`}>{children}</div>;\n}\n\nconst Footer = ({\n className,\n children,\n}: {\n className?: string;\n children?: React.ReactNode;\n}) => {\n return (\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\n {children}\n </div>\n );\n};\n\nCard.Footer = Footer;\n","import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport {\n faCheckCircle,\n faInfoCircle,\n faQuestionCircle,\n faXmarkCircle,\n} from \"@fortawesome/free-solid-svg-icons\";\n\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\ntype Toast = {\n title: string;\n className?: string;\n description: string;\n type: ToastType;\n};\n\nexport default function Toast({\n title,\n description,\n type = \"info\",\n className,\n}: Readonly<Toast>) {\n return (\n <div className={`toast__wrapper group ${className}`}>\n <div className=\"toast__body\">\n <div style={{ background: getColor(type) }} className={bullet}></div>\n <div>\n <p className=\"toast__title\">{title}</p>\n <p className=\"toast__description\">{description}</p>\n </div>\n <div className={`toast__icon toast__icon__${type}`}></div>\n </div>\n <p\n className=\"toast__bar toast-bar-animate\"\n style={{ background: getColor(type) }}\n ></p>\n </div>\n );\n}\n\nconst Inline = ({\n className,\n text,\n type,\n}: {\n className?: string;\n text: string;\n type: ToastType;\n}) => {\n return (\n <div\n className={`toast__inline ${className}`}\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\n >\n <FontAwesomeIcon\n icon={getIcon(type)}\n className=\"text-[1.3rem]\"\n style={{ color: getColor(type) }}\n />\n <p>{text}</p>\n </div>\n );\n};\n\nToast.Inline = Inline;\n\nfunction getColor(type: string) {\n return `var(--color-${type})`;\n}\n\nfunction getIcon(type: string) {\n const mapping = {\n warning: faQuestionCircle,\n info: faInfoCircle,\n danger: faXmarkCircle,\n success: faCheckCircle,\n };\n //@ts-expect-error call object using array index\n return mapping[type];\n}\n\nconst bullet =\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\n","import React from \"react\";\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\ntype Expandable = {\n children: React.ReactNode;\n title: string;\n className?: string;\n isOpen?: boolean;\n};\n\nexport default function Expandable({\n children,\n title,\n className,\n isOpen,\n}: Readonly<Expandable>) {\n const name = title.replace(\" \", \"\");\n return (\n <div className={`expandable ${className}`}>\n <input\n id={name}\n type=\"checkbox\"\n defaultChecked={isOpen}\n className=\"opacity-[0] peer absolute top-0 ex-title\"\n />\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\n <label htmlFor={name} className=\"expandable__title\">\n {title}\n </label>\n <div className=\"expandable__body\">\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\n </div>\n </div>\n );\n}\n","import React, { useCallback, useDeferredValue, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Option = {\n value: string;\n label: string;\n};\n\ntype MultiSelect = {\n label?: string;\n labelHtml?: string;\n outerclass?: string;\n options?: Option[];\n stringOptions?: string[];\n state: { value: Option[]; select: (newVal: Option[]) => void };\n};\n\nexport default function MultiSelect({\n state,\n label,\n labelHtml,\n ...attr\n}: Readonly<MultiSelect>) {\n const { options = [], stringOptions = [] } = attr;\n const [keyword, setKeyword] = useState(\"\");\n\n const availableOptions = useMemo(() => {\n const isDefaultOption = options && options.length > 0;\n if (!isDefaultOption)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n function getFiltered() {\n return availableOptions.filter(\n ({ label, value }) =>\n label.toLowerCase().includes(keyword.toLowerCase()) ||\n value.toLowerCase().includes(keyword.toLowerCase())\n );\n }\n\n function selectItem({ label, value }: { label: string; value: string }) {\n //@ts-expect-error: avoid check\n state.select((prev) => {\n const isItemExist = prev.find((item: any) => item.value == value);\n if (isItemExist) {\n return prev.filter((item: any) => item.value != value);\n }\n return [...prev, { label, value }];\n });\n }\n\n function isItemExist(value: string) {\n return state.value.find((item: any) => item.value == value);\n }\n\n const selectUnSelectAll = useCallback(() => {\n const isAllSelected = state.value.length == availableOptions.length;\n state.select(isAllSelected ? [] : availableOptions);\n }, [state.value]);\n\n return (\n <div className={`group w-full ${attr.outerclass}`}>\n {label && (\n <label className=\"text-input__label\" htmlFor={labelHtml}>\n {label}\n </label>\n )}\n <div className=\"text-input__wrapper relative\">\n <input\n value={keyword}\n type=\"search\"\n placeholder={`${state.value.length} Dipilih`}\n className={`${input} ${\n state.value.length > 0 &&\n \"placeholder:text-[var(--color-text-primary)]\"\n }`}\n onChange={(e) => setKeyword(e.target.value)}\n />\n <div className=\"select-item__wrapper select-multiple__wrapper\">\n {getFiltered().length == 0 && keyword != \"\" && (\n <button disabled className=\"select-item text-[var(--color-danger)]\">\n Tidak ada Item\n </button>\n )}\n {getFiltered().map(({ label, value }) => (\n <button\n type=\"button\"\n onClick={() => selectItem({ label, value })}\n key={value}\n className=\"select-item\"\n >\n {label}\n {isItemExist(value) && (\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[var(--color-primary)]\"\n />\n )}\n </button>\n ))}\n </div>\n <button\n type=\"button\"\n className=\"cursor-pointer\"\n onClick={selectUnSelectAll}\n >\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\n </button>\n </div>\n </div>\n );\n}\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\nconst input = \"text-input peer ... w-full\";\n","\"use client\";\nimport React from \"react\";\n\nexport default function ThemeToggle(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <label\n htmlFor={`${attr.id || \"theme-toggle\"}`}\n className=\"slider__wrapper slider-theme slider-theme-light\"\n >\n <input\n id=\"theme-toggle\"\n {...attr}\n type=\"checkbox\"\n className=\"peer ... w-[2rem] opacity-[0] cursor-pointer\"\n />\n <span className=\"slider-theme__bullet\"></span>\n </label>\n </div>\n );\n}\n","import React, { useState } from \"react\";\nimport MultiSelect from \"./MultiSelect\";\nimport SingleSelect from \"./SingleSelect\";\n\nconst list = [\n { label: \"Option 1\", value: \"option1\" },\n { label: \"Option 2\", value: \"option2\" },\n { label: \"Option 3\", value: \"option3\" },\n];\nconst stringList = [\"option1\", \"option2\", \"option3\"];\n\nexport default function Dashboard() {\n const [selectedItem, setSelectedItem] = useState<\n { label: string; value: string }[]\n >([]);\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\n\n function updateState(item: string) {\n const filtered = list.find(({ value }) => value == item);\n filtered && setSel(filtered);\n }\n\n return (\n <div className=\"flex items-center gap-[1rem]\">\n <MultiSelect\n label=\"Multi Select\"\n stringOptions={stringList}\n state={{ value: selectedItem, select: setSelectedItem }}\n />\n <SingleSelect\n label=\"Single Select\"\n name=\"newinput\"\n stringOptions={stringList}\n placeholder=\"-- Pilih Status --\"\n value={sel.value}\n />\n </div>\n );\n}\n","import React from \"react\";\nexport default function Badge({\n text,\n type,\n className,\n}: {\n text: string;\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\n className?: string;\n}) {\n return (\n <div className=\"badge__wrapper\">\n <span\n style={{\n background: `var(--color-${type})`,\n }}\n className={`badge ${className}`}\n >\n {text}\n </span>\n </div>\n );\n}\n","import React from \"react\";\nexport default function Skeleton({ className }: { className?: string }) {\n return (\n <div className={`${className} skeleton`}>\n <span className=\"skeleton__item skeleton-slide\"></span>\n </div>\n );\n}\n","import React from \"react\";\n\nexport default function Navigation() {\n return <nav></nav>;\n}\n\nconst URLNavigation = (props: {\n list: { label: string; href: string }[];\n activeUrl: string;\n outerclass?: string;\n CustomComponent?: React.ElementType;\n}) => {\n const Component = props.CustomComponent || \"a\";\n function getAnchorClass(href: string) {\n return href === props.activeUrl\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\n }\n\n return (\n <nav className={`nav__wrapper ${props.outerclass}`}>\n {props.list.map((prop) => (\n <Component\n key={prop.href}\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\n {...prop}\n >\n {prop.label}\n </Component>\n ))}\n </nav>\n );\n};\n\nNavigation.URL = URLNavigation;\n\nconst base__anchor =\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\n","import React from \"react\";\n\nexport default function Confirmation({\n type = \"warning\",\n text,\n title,\n secondaryAction,\n secondaryLabel = \"Tidak\",\n mainAction,\n mainLabel = \"Ya\",\n}: {\n mainAction: () => void;\n secondaryAction?: () => void;\n mainLabel?: string;\n secondaryLabel?: string;\n title: string;\n text: string;\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\n}) {\n return (\n <div className=\"confirmation__outer\">\n <div className=\"confirmation__card\">\n <div className={wrapper}>\n <div className={`baloon__${type} baloon`}></div>\n <div>\n <h3 className=\"font-semibold\">{title}</h3>\n <p className={confirmation__text}>{text}</p>\n </div>\n </div>\n <div className=\"confirmation__footer\">\n {secondaryAction && (\n <button\n onClick={secondaryAction}\n type=\"button\"\n className=\"cursor-pointer\"\n style={{ color: `var(--color-${type})` }}\n >\n {secondaryLabel}\n </button>\n )}\n <button\n onClick={() => {\n mainAction();\n secondaryAction && secondaryAction();\n }}\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\n style={{\n background: `var(--color-${type})`,\n border: `1px solid var(--color-${type})`,\n }}\n >\n {mainLabel}\n </button>\n </div>\n </div>\n </div>\n );\n}\n\nconst wrapper =\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\nconst confirmation__text =\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\n"],"mappings":"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","names":["React","list","import_react","import_react_fontawesome","React","import_react","import_free_solid_svg_icons","import_react_fontawesome","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","React","input","input__icon","list","import_react","React","import_react","React","import_react","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","React","import_react","import_free_solid_svg_icons","import_react_fontawesome","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","label","isItemExist","React","input","input__icon","import_react","React","import_react","React","import_react","React","import_react","React","import_react","React","import_react","React"]}
package/dist/index.mjs CHANGED
@@ -69,15 +69,15 @@ var IconButton = (props) => {
69
69
  return /* @__PURE__ */ React.createElement(
70
70
  "button",
71
71
  __spreadProps(__spreadValues({}, props), {
72
- className: `${props.className} ${props.title ? "max-w-[content] px-[0.8rem]" : ""} icon__button`
72
+ className: `${props.className} ${props.label ? "max-w-[content] px-[0.8rem]" : ""} icon__button`
73
73
  }),
74
74
  props.icon && /* @__PURE__ */ React.createElement(FontAwesomeIcon, { icon: props.icon }),
75
- props.title && /* @__PURE__ */ React.createElement("span", { className: "inline-block ml-[0.8rem] text-[1rem]" }, props.title)
75
+ props.label && /* @__PURE__ */ React.createElement("span", { className: "inline-block ml-[0.8rem] text-[1rem]" }, props.label)
76
76
  );
77
77
  };
78
78
  var IconButtonGroup = ({ list: list2 }) => {
79
79
  function getBtnClass(idx) {
80
- return `icon__button !rounded-[0] border-[0] ${idx !== 0 ? "border-l border-l-[var(--color-border)]" : ""}`;
80
+ return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${idx !== 0 ? "border-l border-l-[var(--color-border)]" : ""}`;
81
81
  }
82
82
  return /* @__PURE__ */ React.createElement("div", { className: "icon__button_group" }, list2.map((props, idx) => /* @__PURE__ */ React.createElement("button", __spreadValues({ key: idx, className: getBtnClass(idx) }, props), props.icon && /* @__PURE__ */ React.createElement(FontAwesomeIcon, { icon: props.icon }))));
83
83
  };
@@ -100,10 +100,10 @@ function TextInput(_a) {
100
100
  "icon",
101
101
  "outerclass"
102
102
  ]);
103
- return /* @__PURE__ */ React2.createElement("div", { className: `group ${outerclass} w-full` }, label && /* @__PURE__ */ React2.createElement("label", { htmlFor: labelFor, className: "text-input__label" }, label), /* @__PURE__ */ React2.createElement("div", { className: "text-input__wrapper overflow-hidden" }, icon && /* @__PURE__ */ React2.createElement(FontAwesomeIcon2, { icon, className: input__icon }), /* @__PURE__ */ React2.createElement(
103
+ return /* @__PURE__ */ React2.createElement("div", { className: `group ${outerclass} w-full` }, label && /* @__PURE__ */ React2.createElement("label", { htmlFor: labelFor, className: "text-input__label" }, label), /* @__PURE__ */ React2.createElement("div", { className: `text-input__wrapper overflow-hidden ${attr.className}` }, icon && /* @__PURE__ */ React2.createElement(FontAwesomeIcon2, { icon, className: input__icon }), /* @__PURE__ */ React2.createElement(
104
104
  "input",
105
105
  __spreadProps(__spreadValues({}, attr), {
106
- className: `text-input w-full ${attr.className} ${icon && "!pl-[0.3rem]"}`
106
+ className: `text-input w-full ${icon && "!pl-[0.3rem]"}`
107
107
  })
108
108
  )));
109
109
  }
@@ -124,7 +124,7 @@ function Slider(attr) {
124
124
  var input = "peer ... w-[3rem] h-[1.6rem] opacity-[0] cursor-pointer";
125
125
 
126
126
  // src/components/SingleSelect.tsx
127
- import React4, { useDeferredValue, useEffect, useMemo, useState } from "react";
127
+ import React4, { useEffect, useMemo, useState } from "react";
128
128
  import { FontAwesomeIcon as FontAwesomeIcon4 } from "@fortawesome/react-fontawesome";
129
129
  import { faCheck as faCheck2, faChevronDown } from "@fortawesome/free-solid-svg-icons";
130
130
  function SingleSelect(attr) {
@@ -135,7 +135,6 @@ function SingleSelect(attr) {
135
135
  label: "",
136
136
  value: ""
137
137
  });
138
- const inputKeyword = useDeferredValue(keyword);
139
138
  function selectItem({ label, value }, e) {
140
139
  const triggerManual = attrInput.onChange;
141
140
  if (triggerManual) {
@@ -144,6 +143,10 @@ function SingleSelect(attr) {
144
143
  });
145
144
  }
146
145
  setSelected({ label, value });
146
+ if (attr.stateaction) {
147
+ if (stringOptions) attr.stateaction(value);
148
+ if (options) attr.stateaction({ label, value });
149
+ }
147
150
  setKeyword("");
148
151
  setTimeout(() => {
149
152
  e.target.blur();
@@ -165,9 +168,9 @@ function SingleSelect(attr) {
165
168
  }, [options, stringOptions]);
166
169
  const filteredOptions = useMemo(() => {
167
170
  return availableOptions.filter(
168
- ({ label, value }) => label.toLowerCase().includes(inputKeyword.toLowerCase()) || value.toLowerCase().includes(inputKeyword.toLowerCase())
171
+ ({ label, value }) => label.toLowerCase().includes(keyword.toLowerCase()) || value.toLowerCase().includes(keyword.toLowerCase())
169
172
  );
170
- }, [inputKeyword, availableOptions]);
173
+ }, [keyword, availableOptions]);
171
174
  useEffect(() => {
172
175
  attrInput.value && autoUpdateValue(attrInput.value);
173
176
  }, [attrInput.value]);
@@ -306,7 +309,7 @@ var Inline = ({
306
309
  FontAwesomeIcon5,
307
310
  {
308
311
  icon: getIcon(type),
309
- className: "text-[1.2rem]",
312
+ className: "text-[1.3rem]",
310
313
  style: { color: getColor(type) }
311
314
  }
312
315
  ),
@@ -351,7 +354,7 @@ function Expandable({
351
354
  }
352
355
 
353
356
  // src/components/MultiSelect.tsx
354
- import React10, { useCallback, useDeferredValue as useDeferredValue2, useMemo as useMemo2, useState as useState2 } from "react";
357
+ import React10, { useCallback, useMemo as useMemo2, useState as useState2 } from "react";
355
358
  import { FontAwesomeIcon as FontAwesomeIcon7 } from "@fortawesome/react-fontawesome";
356
359
  import { faCheck as faCheck3, faListCheck } from "@fortawesome/free-solid-svg-icons";
357
360
  function MultiSelect(_a) {
@@ -366,7 +369,6 @@ function MultiSelect(_a) {
366
369
  ]);
367
370
  const { options = [], stringOptions = [] } = attr;
368
371
  const [keyword, setKeyword] = useState2("");
369
- const inputKeyword = useDeferredValue2(keyword);
370
372
  const availableOptions = useMemo2(() => {
371
373
  const isDefaultOption = options && options.length > 0;
372
374
  if (!isDefaultOption)
@@ -375,7 +377,7 @@ function MultiSelect(_a) {
375
377
  }, [options, stringOptions]);
376
378
  function getFiltered() {
377
379
  return availableOptions.filter(
378
- ({ label: label2, value }) => label2.toLowerCase().includes(inputKeyword.toLowerCase()) || value.toLowerCase().includes(inputKeyword.toLowerCase())
380
+ ({ label: label2, value }) => label2.toLowerCase().includes(keyword.toLowerCase()) || value.toLowerCase().includes(keyword.toLowerCase())
379
381
  );
380
382
  }
381
383
  function selectItem({ label: label2, value }) {
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n icon?: IconProp;\n label?: string;\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\n isLoading?: boolean;\n};\n\nexport default function Button({\n label,\n icon,\n isLoading,\n btnType,\n className,\n ...rest\n}: Readonly<Button>) {\n const buttonIcon = isLoading ? faCircleNotch : icon;\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\n return (\n <button\n {...rest}\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\n btnType == \"secondary\" && \"btn__secondary\"\n } btn__primary`}\n >\n {buttonIcon && icon && (\n <FontAwesomeIcon\n icon={buttonIcon}\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\n isLoading && \"animate-spin\"\n }`}\n />\n )}\n {isLoading ? loadingLabel : label}\n </button>\n );\n}\n\nconst IconButton = (props: Readonly<Button>) => {\n return (\n <button\n {...props}\n className={`${props.className} ${\n props.title ? \"max-w-[content] px-[0.8rem]\" : \"\"\n } icon__button`}\n >\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\n {props.title && (\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\n {props.title}\n </span>\n )}\n </button>\n );\n};\n\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\n function getBtnClass(idx: number) {\n return `icon__button !rounded-[0] border-[0] ${\n idx !== 0 ? \"border-l border-l-[var(--color-border)]\" : \"\"\n }`;\n }\n return (\n <div className=\"icon__button_group\">\n {list.map((props, idx) => (\n <button key={idx} className={getBtnClass(idx)} {...props}>\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\n </button>\n ))}\n </div>\n );\n};\n\nButton.IconButton = IconButton;\nButton.IconButtonGroup = IconButtonGroup;\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nconst input__icon =\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)]\";\n\nexport default function TextInput({\n label,\n labelFor,\n icon,\n outerclass,\n ...attr\n}: Readonly<\n React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelFor?: string;\n icon?: IconProp;\n outerclass?: string;\n }\n>) {\n return (\n <div className={`group ${outerclass} w-full`}>\n {label && (\n <label htmlFor={labelFor} className=\"text-input__label\">\n {label}\n </label>\n )}\n <div className=\"text-input__wrapper overflow-hidden\">\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\n <input\n {...attr}\n className={`text-input w-full ${attr.className} ${\n icon && \"!pl-[0.3rem]\"\n }`}\n />\n </div>\n </div>\n );\n}\n","import React from \"react\";\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\nexport default function Slider(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <div className=\"slider__wrapper group\">\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[0.7rem] translate-x-[0.2px]\"\n />\n </label>\n </div>\n </div>\n );\n}\n\nconst input = \"peer ... w-[3rem] h-[1.6rem] opacity-[0] cursor-pointer\";\n","\"use client\";\nimport React, { useDeferredValue, useEffect, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\n\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelHtml?: string;\n placeholder?: string;\n outerclass?: string;\n options?: {\n label: string;\n value: string;\n }[];\n stringOptions?: string[];\n};\n\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\n const { options = [], stringOptions = [], ...attrInput } = attr;\n const [keyword, setKeyword] = useState(\"\");\n const [selected, setSelected] = useState<{ label: string; value: any }>({\n label: \"\",\n value: \"\",\n });\n const inputKeyword = useDeferredValue(keyword);\n\n function selectItem(\n { label, value }: { label: string; value: any },\n e: React.MouseEvent<HTMLButtonElement>\n ) {\n const triggerManual = attrInput.onChange;\n if (triggerManual) {\n triggerManual?.({\n target: { value, name: attrInput.name },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n setSelected({ label, value });\n setKeyword(\"\");\n setTimeout(() => {\n (e.target as HTMLButtonElement).blur();\n }, 250);\n }\n\n function autoUpdateValue(updatedValue: string) {\n if (updatedValue) {\n const filtered = availableOptions.find(\n ({ value }) => value == updatedValue\n );\n if (filtered) setSelected(filtered);\n }\n }\n\n const availableOptions = useMemo(() => {\n let defaultOptions = options && options.length > 0;\n if (!defaultOptions)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n const filteredOptions = useMemo(() => {\n return availableOptions.filter(\n ({ label, value }) =>\n label.toLowerCase().includes(inputKeyword.toLowerCase()) ||\n value.toLowerCase().includes(inputKeyword.toLowerCase())\n );\n }, [inputKeyword, availableOptions]);\n\n useEffect(() => {\n attrInput.value && autoUpdateValue(attrInput.value as string);\n }, [attrInput.value]);\n\n return (\n <div className={`w-full group ${attr.outerclass}`}>\n {attrInput.label && (\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\n {attrInput.label}\n </label>\n )}\n <div className={`${attrInput.className} text-input__wrapper relative`}>\n <input\n {...attrInput}\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\n value={attrInput.value ?? selected.value}\n type=\"hidden\"\n />\n <input\n value={keyword}\n type=\"search\"\n onChange={(e) => setKeyword(e.target.value)}\n className={`${attrInput.name}-keyword ${input} ${\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\n }`}\n placeholder={selected.value ? selected.label : attrInput.placeholder}\n />\n <div className=\"select-item__wrapper\">\n {filteredOptions.length == 0 && keyword != \"\" && (\n <button disabled className=\"select-item text-[var(--color-danger)]\">\n Tidak ada Item\n </button>\n )}\n {filteredOptions.map(({ label, value }) => (\n <button\n type=\"button\"\n onClick={(e) => selectItem({ label, value }, e)}\n key={value}\n className=\"select-item\"\n >\n {label}\n {selected.value == value && (\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[var(--color-primary)]\"\n />\n )}\n </button>\n ))}\n </div>\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\n </div>\n </div>\n );\n}\n\nSingleSelect.autoFill = autoFillInput;\n\nfunction autoFillInput(\n value: string,\n elName: string,\n list: { label: string; value: string }[]\n) {\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\n inp.value = `${value}`;\n const filtered = list.find((item) => item.value == value);\n const el = document.querySelector(`.${elName}-keyword`);\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\n}\n\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\nconst input = \"text-input peer ... w-full\";\n","import React from \"react\";\n\ntype Tooltip = {\n children: React.ReactNode;\n text: string;\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\n};\n\nexport default function Tooltip({\n children,\n text,\n position = \"top\",\n}: Readonly<Tooltip>) {\n function getAccent() {\n const mapping = {\n top,\n bottom,\n left,\n right,\n };\n return mapping[position];\n }\n return (\n <div className=\"relative\">\n <div className=\"peer\">{children}</div>\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\n </div>\n );\n}\n\nconst top =\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\nconst bottom =\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\nconst right =\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\nconst left =\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\n","import React from \"react\";\n\ntype Option = {\n label: string;\n value: string;\n};\n\nexport default function NavTabClient({\n items,\n state,\n}: Readonly<{\n items: Option[];\n state: {\n active: string;\n setActive: (val: string) => void;\n };\n}>) {\n return (\n <nav className=\"navtab__wrapper\">\n {items.map(({ label, value }) => (\n <button\n key={value}\n className={`navtab__item ${\n state.active == value\n ? \"navtab__item__active\"\n : \"hover:bg-[var(--color-border)]/50\"\n }`}\n onClick={() => state.setActive(value)}\n >\n {label}\n </button>\n ))}\n </nav>\n );\n}\n","import React from \"react\";\n\ntype Card = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport default function Card({ children, className }: Readonly<Card>) {\n return <div className={`card ${className}`}>{children}</div>;\n}\n\nconst Footer = ({\n className,\n children,\n}: {\n className?: string;\n children?: React.ReactNode;\n}) => {\n return (\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\n {children}\n </div>\n );\n};\n\nCard.Footer = Footer;\n","import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport {\n faCheckCircle,\n faInfoCircle,\n faQuestionCircle,\n faXmarkCircle,\n} from \"@fortawesome/free-solid-svg-icons\";\n\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\ntype Toast = {\n title: string;\n className?: string;\n description: string;\n type: ToastType;\n};\n\nexport default function Toast({\n title,\n description,\n type = \"info\",\n className,\n}: Readonly<Toast>) {\n return (\n <div className={`toast__wrapper group ${className}`}>\n <div className=\"toast__body\">\n <div style={{ background: getColor(type) }} className={bullet}></div>\n <div>\n <p className=\"toast__title\">{title}</p>\n <p className=\"toast__description\">{description}</p>\n </div>\n <div className={`toast__icon toast__icon__${type}`}></div>\n </div>\n <p\n className=\"toast__bar toast-bar-animate\"\n style={{ background: getColor(type) }}\n ></p>\n </div>\n );\n}\n\nconst Inline = ({\n className,\n text,\n type,\n}: {\n className?: string;\n text: string;\n type: ToastType;\n}) => {\n return (\n <div\n className={`toast__inline ${className}`}\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\n >\n <FontAwesomeIcon\n icon={getIcon(type)}\n className=\"text-[1.2rem]\"\n style={{ color: getColor(type) }}\n />\n <p>{text}</p>\n </div>\n );\n};\n\nToast.Inline = Inline;\n\nfunction getColor(type: string) {\n return `var(--color-${type})`;\n}\n\nfunction getIcon(type: string) {\n const mapping = {\n warning: faQuestionCircle,\n info: faInfoCircle,\n danger: faXmarkCircle,\n success: faCheckCircle,\n };\n //@ts-expect-error call object using array index\n return mapping[type];\n}\n\nconst bullet =\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\n","import React from \"react\";\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\ntype Expandable = {\n children: React.ReactNode;\n title: string;\n className?: string;\n isOpen?: boolean;\n};\n\nexport default function Expandable({\n children,\n title,\n className,\n isOpen,\n}: Readonly<Expandable>) {\n const name = title.replace(\" \", \"\");\n return (\n <div className={`expandable ${className}`}>\n <input\n id={name}\n type=\"checkbox\"\n defaultChecked={isOpen}\n className=\"opacity-[0] peer absolute top-0 ex-title\"\n />\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\n <label htmlFor={name} className=\"expandable__title\">\n {title}\n </label>\n <div className=\"expandable__body\">\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\n </div>\n </div>\n );\n}\n","import React, { useCallback, useDeferredValue, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Option = {\n value: string;\n label: string;\n};\n\ntype MultiSelect = {\n label?: string;\n labelHtml?: string;\n outerclass?: string;\n options?: Option[];\n stringOptions?: string[];\n state: { value: Option[]; select: (newVal: Option[]) => void };\n};\n\nexport default function MultiSelect({\n state,\n label,\n labelHtml,\n ...attr\n}: Readonly<MultiSelect>) {\n const { options = [], stringOptions = [] } = attr;\n const [keyword, setKeyword] = useState(\"\");\n const inputKeyword = useDeferredValue(keyword);\n\n const availableOptions = useMemo(() => {\n const isDefaultOption = options && options.length > 0;\n if (!isDefaultOption)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n function getFiltered() {\n return availableOptions.filter(\n ({ label, value }) =>\n label.toLowerCase().includes(inputKeyword.toLowerCase()) ||\n value.toLowerCase().includes(inputKeyword.toLowerCase())\n );\n }\n\n function selectItem({ label, value }: { label: string; value: string }) {\n //@ts-expect-error: avoid check\n state.select((prev) => {\n const isItemExist = prev.find((item: any) => item.value == value);\n if (isItemExist) {\n return prev.filter((item: any) => item.value != value);\n }\n return [...prev, { label, value }];\n });\n }\n\n function isItemExist(value: string) {\n return state.value.find((item: any) => item.value == value);\n }\n\n const selectUnSelectAll = useCallback(() => {\n const isAllSelected = state.value.length == availableOptions.length;\n state.select(isAllSelected ? [] : availableOptions);\n }, [state.value]);\n\n return (\n <div className={`group w-full ${attr.outerclass}`}>\n {label && (\n <label className=\"text-input__label\" htmlFor={labelHtml}>\n {label}\n </label>\n )}\n <div className=\"text-input__wrapper relative\">\n <input\n value={keyword}\n type=\"search\"\n placeholder={`${state.value.length} Dipilih`}\n className={`${input} ${\n state.value.length > 0 &&\n \"placeholder:text-[var(--color-text-primary)]\"\n }`}\n onChange={(e) => setKeyword(e.target.value)}\n />\n <div className=\"select-item__wrapper select-multiple__wrapper\">\n {getFiltered().length == 0 && keyword != \"\" && (\n <button disabled className=\"select-item text-[var(--color-danger)]\">\n Tidak ada Item\n </button>\n )}\n {getFiltered().map(({ label, value }) => (\n <button\n type=\"button\"\n onClick={() => selectItem({ label, value })}\n key={value}\n className=\"select-item\"\n >\n {label}\n {isItemExist(value) && (\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[var(--color-primary)]\"\n />\n )}\n </button>\n ))}\n </div>\n <button\n type=\"button\"\n className=\"cursor-pointer\"\n onClick={selectUnSelectAll}\n >\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\n </button>\n </div>\n </div>\n );\n}\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\nconst input = \"text-input peer ... w-full\";\n","\"use client\";\nimport React from \"react\";\n\nexport default function ThemeToggle(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <label\n htmlFor={`${attr.id || \"theme-toggle\"}`}\n className=\"slider__wrapper slider-theme slider-theme-light\"\n >\n <input\n id=\"theme-toggle\"\n {...attr}\n type=\"checkbox\"\n className=\"peer ... w-[2rem] opacity-[0] cursor-pointer\"\n />\n <span className=\"slider-theme__bullet\"></span>\n </label>\n </div>\n );\n}\n","import React, { useState } from \"react\";\nimport MultiSelect from \"./MultiSelect\";\nimport SingleSelect from \"./SingleSelect\";\n\nconst list = [\n { label: \"Option 1\", value: \"option1\" },\n { label: \"Option 2\", value: \"option2\" },\n { label: \"Option 3\", value: \"option3\" },\n];\nconst stringList = [\"option1\", \"option2\", \"option3\"];\n\nexport default function Dashboard() {\n const [selectedItem, setSelectedItem] = useState<\n { label: string; value: string }[]\n >([]);\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\n\n function updateState(item: string) {\n const filtered = list.find(({ value }) => value == item);\n filtered && setSel(filtered);\n }\n\n return (\n <div className=\"flex items-center gap-[1rem]\">\n <MultiSelect\n label=\"Multi Select\"\n stringOptions={stringList}\n state={{ value: selectedItem, select: setSelectedItem }}\n />\n <SingleSelect\n label=\"Single Select\"\n name=\"newinput\"\n stringOptions={stringList}\n placeholder=\"-- Pilih Status --\"\n value={sel.value}\n />\n </div>\n );\n}\n","import React from \"react\";\nexport default function Badge({\n text,\n type,\n className,\n}: {\n text: string;\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\n className?: string;\n}) {\n return (\n <div className=\"badge__wrapper\">\n <span\n style={{\n background: `var(--color-${type})`,\n }}\n className={`badge ${className}`}\n >\n {text}\n </span>\n </div>\n );\n}\n","import React from \"react\";\nexport default function Skeleton({ className }: { className?: string }) {\n return (\n <div className={`${className} skeleton`}>\n <span className=\"skeleton__item skeleton-slide\"></span>\n </div>\n );\n}\n","import React from \"react\";\n\nexport default function Navigation() {\n return <nav></nav>;\n}\n\nconst URLNavigation = (props: {\n list: { label: string; href: string }[];\n activeUrl: string;\n outerclass?: string;\n CustomComponent?: React.ElementType;\n}) => {\n const Component = props.CustomComponent || \"a\";\n function getAnchorClass(href: string) {\n return href === props.activeUrl\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\n }\n\n return (\n <nav className={`nav__wrapper ${props.outerclass}`}>\n {props.list.map((prop) => (\n <Component\n key={prop.href}\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\n {...prop}\n >\n {prop.label}\n </Component>\n ))}\n </nav>\n );\n};\n\nNavigation.URL = URLNavigation;\n\nconst base__anchor =\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\n","import React from \"react\";\n\nexport default function Confirmation({\n type = \"warning\",\n text,\n title,\n secondaryAction,\n secondaryLabel = \"Tidak\",\n mainAction,\n mainLabel = \"Ya\",\n}: {\n mainAction: () => void;\n secondaryAction?: () => void;\n mainLabel?: string;\n secondaryLabel?: string;\n title: string;\n text: string;\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\n}) {\n return (\n <div className=\"confirmation__outer\">\n <div className=\"confirmation__card\">\n <div className={wrapper}>\n <div className={`baloon__${type} baloon`}></div>\n <div>\n <h3 className=\"font-semibold\">{title}</h3>\n <p className={confirmation__text}>{text}</p>\n </div>\n </div>\n <div className=\"confirmation__footer\">\n {secondaryAction && (\n <button\n onClick={secondaryAction}\n type=\"button\"\n className=\"cursor-pointer\"\n style={{ color: `var(--color-${type})` }}\n >\n {secondaryLabel}\n </button>\n )}\n <button\n onClick={() => {\n mainAction();\n secondaryAction && secondaryAction();\n }}\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\n style={{\n background: `var(--color-${type})`,\n border: `1px solid var(--color-${type})`,\n }}\n >\n {mainLabel}\n </button>\n </div>\n </div>\n </div>\n );\n}\n\nconst wrapper =\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\nconst confirmation__text =\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\n"],"mappings":"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","names":["list","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","faCheck","React","input","FontAwesomeIcon","faCheck","input__icon","list","React","React","React","React","FontAwesomeIcon","React","FontAwesomeIcon","React","useDeferredValue","useMemo","useState","FontAwesomeIcon","faCheck","useState","useDeferredValue","useMemo","label","isItemExist","React","input","FontAwesomeIcon","faCheck","input__icon","React","React","React","useState","useState","React","React","React","React","React","React"]}
1
+ {"version":3,"sources":["../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n icon?: IconProp;\n label?: string;\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\n isLoading?: boolean;\n};\n\nexport default function Button({\n label,\n icon,\n isLoading,\n btnType,\n className,\n ...rest\n}: Readonly<Button>) {\n const buttonIcon = isLoading ? faCircleNotch : icon;\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\n return (\n <button\n {...rest}\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\n btnType == \"secondary\" && \"btn__secondary\"\n } btn__primary`}\n >\n {buttonIcon && icon && (\n <FontAwesomeIcon\n icon={buttonIcon}\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\n isLoading && \"animate-spin\"\n }`}\n />\n )}\n {isLoading ? loadingLabel : label}\n </button>\n );\n}\n\nconst IconButton = (props: Readonly<Button>) => {\n return (\n <button\n {...props}\n className={`${props.className} ${\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\n } icon__button`}\n >\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\n {props.label && (\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\n {props.label}\n </span>\n )}\n </button>\n );\n};\n\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\n function getBtnClass(idx: number) {\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${\n idx !== 0 ? \"border-l border-l-[var(--color-border)]\" : \"\"\n }`;\n }\n return (\n <div className=\"icon__button_group\">\n {list.map((props, idx) => (\n <button key={idx} className={getBtnClass(idx)} {...props}>\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\n </button>\n ))}\n </div>\n );\n};\n\nButton.IconButton = IconButton;\nButton.IconButtonGroup = IconButtonGroup;\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nconst input__icon =\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)]\";\n\nexport default function TextInput({\n label,\n labelFor,\n icon,\n outerclass,\n ...attr\n}: Readonly<\n React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelFor?: string;\n icon?: IconProp;\n outerclass?: string;\n }\n>) {\n return (\n <div className={`group ${outerclass} w-full`}>\n {label && (\n <label htmlFor={labelFor} className=\"text-input__label\">\n {label}\n </label>\n )}\n <div className={`text-input__wrapper overflow-hidden ${attr.className}`}>\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\n <input\n {...attr}\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"}`}\n />\n </div>\n </div>\n );\n}\n","import React from \"react\";\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\nexport default function Slider(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <div className=\"slider__wrapper group\">\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[0.7rem] translate-x-[0.2px]\"\n />\n </label>\n </div>\n </div>\n );\n}\n\nconst input = \"peer ... w-[3rem] h-[1.6rem] opacity-[0] cursor-pointer\";\n","\"use client\";\nimport React, { useDeferredValue, useEffect, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\n\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelHtml?: string;\n placeholder?: string;\n stateaction?: (param: any) => void;\n outerclass?: string;\n options?: {\n label: string;\n value: string;\n }[];\n stringOptions?: string[];\n};\n\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\n const { options = [], stringOptions = [], ...attrInput } = attr;\n const [keyword, setKeyword] = useState(\"\");\n const [selected, setSelected] = useState<{ label: string; value: any }>({\n label: \"\",\n value: \"\",\n });\n // const inputKeyword = useDeferredValue(keyword);\n\n function selectItem(\n { label, value }: { label: string; value: any },\n e: React.MouseEvent<HTMLButtonElement>\n ) {\n const triggerManual = attrInput.onChange;\n if (triggerManual) {\n triggerManual?.({\n target: { value, name: attrInput.name },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n setSelected({ label, value });\n if (attr.stateaction) {\n if (stringOptions) attr.stateaction(value);\n if (options) attr.stateaction({ label, value });\n }\n setKeyword(\"\");\n setTimeout(() => {\n (e.target as HTMLButtonElement).blur();\n }, 250);\n }\n\n function autoUpdateValue(updatedValue: string) {\n if (updatedValue) {\n const filtered = availableOptions.find(\n ({ value }) => value == updatedValue\n );\n if (filtered) setSelected(filtered);\n }\n }\n\n const availableOptions = useMemo(() => {\n let defaultOptions = options && options.length > 0;\n if (!defaultOptions)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n const filteredOptions = useMemo(() => {\n return availableOptions.filter(\n ({ label, value }) =>\n label.toLowerCase().includes(keyword.toLowerCase()) ||\n value.toLowerCase().includes(keyword.toLowerCase())\n );\n }, [keyword, availableOptions]);\n\n useEffect(() => {\n attrInput.value && autoUpdateValue(attrInput.value as string);\n }, [attrInput.value]);\n\n return (\n <div className={`w-full group ${attr.outerclass}`}>\n {attrInput.label && (\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\n {attrInput.label}\n </label>\n )}\n <div className={`${attrInput.className} text-input__wrapper relative`}>\n <input\n {...attrInput}\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\n value={attrInput.value ?? selected.value}\n type=\"hidden\"\n />\n <input\n value={keyword}\n type=\"search\"\n onChange={(e) => setKeyword(e.target.value)}\n className={`${attrInput.name}-keyword ${input} ${\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\n }`}\n placeholder={selected.value ? selected.label : attrInput.placeholder}\n />\n <div className=\"select-item__wrapper\">\n {filteredOptions.length == 0 && keyword != \"\" && (\n <button disabled className=\"select-item text-[var(--color-danger)]\">\n Tidak ada Item\n </button>\n )}\n {filteredOptions.map(({ label, value }) => (\n <button\n type=\"button\"\n onClick={(e) => selectItem({ label, value }, e)}\n key={value}\n className=\"select-item\"\n >\n {label}\n {selected.value == value && (\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[var(--color-primary)]\"\n />\n )}\n </button>\n ))}\n </div>\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\n </div>\n </div>\n );\n}\n\nSingleSelect.autoFill = autoFillInput;\n\nfunction autoFillInput(\n value: string,\n elName: string,\n list: { label: string; value: string }[]\n) {\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\n inp.value = `${value}`;\n const filtered = list.find((item) => item.value == value);\n const el = document.querySelector(`.${elName}-keyword`);\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\n}\n\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\nconst input = \"text-input peer ... w-full\";\n","import React from \"react\";\n\ntype Tooltip = {\n children: React.ReactNode;\n text: string;\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\n};\n\nexport default function Tooltip({\n children,\n text,\n position = \"top\",\n}: Readonly<Tooltip>) {\n function getAccent() {\n const mapping = {\n top,\n bottom,\n left,\n right,\n };\n return mapping[position];\n }\n return (\n <div className=\"relative\">\n <div className=\"peer\">{children}</div>\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\n </div>\n );\n}\n\nconst top =\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\nconst bottom =\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\nconst right =\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\nconst left =\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\n","import React from \"react\";\n\ntype Option = {\n label: string;\n value: string;\n};\n\nexport default function NavTabClient({\n items,\n state,\n}: Readonly<{\n items: Option[];\n state: {\n active: string;\n setActive: (val: string) => void;\n };\n}>) {\n return (\n <nav className=\"navtab__wrapper\">\n {items.map(({ label, value }) => (\n <button\n key={value}\n className={`navtab__item ${\n state.active == value\n ? \"navtab__item__active\"\n : \"hover:bg-[var(--color-border)]/50\"\n }`}\n onClick={() => state.setActive(value)}\n >\n {label}\n </button>\n ))}\n </nav>\n );\n}\n","import React from \"react\";\n\ntype Card = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport default function Card({ children, className }: Readonly<Card>) {\n return <div className={`card ${className}`}>{children}</div>;\n}\n\nconst Footer = ({\n className,\n children,\n}: {\n className?: string;\n children?: React.ReactNode;\n}) => {\n return (\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\n {children}\n </div>\n );\n};\n\nCard.Footer = Footer;\n","import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport {\n faCheckCircle,\n faInfoCircle,\n faQuestionCircle,\n faXmarkCircle,\n} from \"@fortawesome/free-solid-svg-icons\";\n\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\ntype Toast = {\n title: string;\n className?: string;\n description: string;\n type: ToastType;\n};\n\nexport default function Toast({\n title,\n description,\n type = \"info\",\n className,\n}: Readonly<Toast>) {\n return (\n <div className={`toast__wrapper group ${className}`}>\n <div className=\"toast__body\">\n <div style={{ background: getColor(type) }} className={bullet}></div>\n <div>\n <p className=\"toast__title\">{title}</p>\n <p className=\"toast__description\">{description}</p>\n </div>\n <div className={`toast__icon toast__icon__${type}`}></div>\n </div>\n <p\n className=\"toast__bar toast-bar-animate\"\n style={{ background: getColor(type) }}\n ></p>\n </div>\n );\n}\n\nconst Inline = ({\n className,\n text,\n type,\n}: {\n className?: string;\n text: string;\n type: ToastType;\n}) => {\n return (\n <div\n className={`toast__inline ${className}`}\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\n >\n <FontAwesomeIcon\n icon={getIcon(type)}\n className=\"text-[1.3rem]\"\n style={{ color: getColor(type) }}\n />\n <p>{text}</p>\n </div>\n );\n};\n\nToast.Inline = Inline;\n\nfunction getColor(type: string) {\n return `var(--color-${type})`;\n}\n\nfunction getIcon(type: string) {\n const mapping = {\n warning: faQuestionCircle,\n info: faInfoCircle,\n danger: faXmarkCircle,\n success: faCheckCircle,\n };\n //@ts-expect-error call object using array index\n return mapping[type];\n}\n\nconst bullet =\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\n","import React from \"react\";\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\ntype Expandable = {\n children: React.ReactNode;\n title: string;\n className?: string;\n isOpen?: boolean;\n};\n\nexport default function Expandable({\n children,\n title,\n className,\n isOpen,\n}: Readonly<Expandable>) {\n const name = title.replace(\" \", \"\");\n return (\n <div className={`expandable ${className}`}>\n <input\n id={name}\n type=\"checkbox\"\n defaultChecked={isOpen}\n className=\"opacity-[0] peer absolute top-0 ex-title\"\n />\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\n <label htmlFor={name} className=\"expandable__title\">\n {title}\n </label>\n <div className=\"expandable__body\">\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\n </div>\n </div>\n );\n}\n","import React, { useCallback, useDeferredValue, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Option = {\n value: string;\n label: string;\n};\n\ntype MultiSelect = {\n label?: string;\n labelHtml?: string;\n outerclass?: string;\n options?: Option[];\n stringOptions?: string[];\n state: { value: Option[]; select: (newVal: Option[]) => void };\n};\n\nexport default function MultiSelect({\n state,\n label,\n labelHtml,\n ...attr\n}: Readonly<MultiSelect>) {\n const { options = [], stringOptions = [] } = attr;\n const [keyword, setKeyword] = useState(\"\");\n\n const availableOptions = useMemo(() => {\n const isDefaultOption = options && options.length > 0;\n if (!isDefaultOption)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n function getFiltered() {\n return availableOptions.filter(\n ({ label, value }) =>\n label.toLowerCase().includes(keyword.toLowerCase()) ||\n value.toLowerCase().includes(keyword.toLowerCase())\n );\n }\n\n function selectItem({ label, value }: { label: string; value: string }) {\n //@ts-expect-error: avoid check\n state.select((prev) => {\n const isItemExist = prev.find((item: any) => item.value == value);\n if (isItemExist) {\n return prev.filter((item: any) => item.value != value);\n }\n return [...prev, { label, value }];\n });\n }\n\n function isItemExist(value: string) {\n return state.value.find((item: any) => item.value == value);\n }\n\n const selectUnSelectAll = useCallback(() => {\n const isAllSelected = state.value.length == availableOptions.length;\n state.select(isAllSelected ? [] : availableOptions);\n }, [state.value]);\n\n return (\n <div className={`group w-full ${attr.outerclass}`}>\n {label && (\n <label className=\"text-input__label\" htmlFor={labelHtml}>\n {label}\n </label>\n )}\n <div className=\"text-input__wrapper relative\">\n <input\n value={keyword}\n type=\"search\"\n placeholder={`${state.value.length} Dipilih`}\n className={`${input} ${\n state.value.length > 0 &&\n \"placeholder:text-[var(--color-text-primary)]\"\n }`}\n onChange={(e) => setKeyword(e.target.value)}\n />\n <div className=\"select-item__wrapper select-multiple__wrapper\">\n {getFiltered().length == 0 && keyword != \"\" && (\n <button disabled className=\"select-item text-[var(--color-danger)]\">\n Tidak ada Item\n </button>\n )}\n {getFiltered().map(({ label, value }) => (\n <button\n type=\"button\"\n onClick={() => selectItem({ label, value })}\n key={value}\n className=\"select-item\"\n >\n {label}\n {isItemExist(value) && (\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[var(--color-primary)]\"\n />\n )}\n </button>\n ))}\n </div>\n <button\n type=\"button\"\n className=\"cursor-pointer\"\n onClick={selectUnSelectAll}\n >\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\n </button>\n </div>\n </div>\n );\n}\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\nconst input = \"text-input peer ... w-full\";\n","\"use client\";\nimport React from \"react\";\n\nexport default function ThemeToggle(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <label\n htmlFor={`${attr.id || \"theme-toggle\"}`}\n className=\"slider__wrapper slider-theme slider-theme-light\"\n >\n <input\n id=\"theme-toggle\"\n {...attr}\n type=\"checkbox\"\n className=\"peer ... w-[2rem] opacity-[0] cursor-pointer\"\n />\n <span className=\"slider-theme__bullet\"></span>\n </label>\n </div>\n );\n}\n","import React, { useState } from \"react\";\nimport MultiSelect from \"./MultiSelect\";\nimport SingleSelect from \"./SingleSelect\";\n\nconst list = [\n { label: \"Option 1\", value: \"option1\" },\n { label: \"Option 2\", value: \"option2\" },\n { label: \"Option 3\", value: \"option3\" },\n];\nconst stringList = [\"option1\", \"option2\", \"option3\"];\n\nexport default function Dashboard() {\n const [selectedItem, setSelectedItem] = useState<\n { label: string; value: string }[]\n >([]);\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\n\n function updateState(item: string) {\n const filtered = list.find(({ value }) => value == item);\n filtered && setSel(filtered);\n }\n\n return (\n <div className=\"flex items-center gap-[1rem]\">\n <MultiSelect\n label=\"Multi Select\"\n stringOptions={stringList}\n state={{ value: selectedItem, select: setSelectedItem }}\n />\n <SingleSelect\n label=\"Single Select\"\n name=\"newinput\"\n stringOptions={stringList}\n placeholder=\"-- Pilih Status --\"\n value={sel.value}\n />\n </div>\n );\n}\n","import React from \"react\";\nexport default function Badge({\n text,\n type,\n className,\n}: {\n text: string;\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\n className?: string;\n}) {\n return (\n <div className=\"badge__wrapper\">\n <span\n style={{\n background: `var(--color-${type})`,\n }}\n className={`badge ${className}`}\n >\n {text}\n </span>\n </div>\n );\n}\n","import React from \"react\";\nexport default function Skeleton({ className }: { className?: string }) {\n return (\n <div className={`${className} skeleton`}>\n <span className=\"skeleton__item skeleton-slide\"></span>\n </div>\n );\n}\n","import React from \"react\";\n\nexport default function Navigation() {\n return <nav></nav>;\n}\n\nconst URLNavigation = (props: {\n list: { label: string; href: string }[];\n activeUrl: string;\n outerclass?: string;\n CustomComponent?: React.ElementType;\n}) => {\n const Component = props.CustomComponent || \"a\";\n function getAnchorClass(href: string) {\n return href === props.activeUrl\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\n }\n\n return (\n <nav className={`nav__wrapper ${props.outerclass}`}>\n {props.list.map((prop) => (\n <Component\n key={prop.href}\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\n {...prop}\n >\n {prop.label}\n </Component>\n ))}\n </nav>\n );\n};\n\nNavigation.URL = URLNavigation;\n\nconst base__anchor =\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\n","import React from \"react\";\n\nexport default function Confirmation({\n type = \"warning\",\n text,\n title,\n secondaryAction,\n secondaryLabel = \"Tidak\",\n mainAction,\n mainLabel = \"Ya\",\n}: {\n mainAction: () => void;\n secondaryAction?: () => void;\n mainLabel?: string;\n secondaryLabel?: string;\n title: string;\n text: string;\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\n}) {\n return (\n <div className=\"confirmation__outer\">\n <div className=\"confirmation__card\">\n <div className={wrapper}>\n <div className={`baloon__${type} baloon`}></div>\n <div>\n <h3 className=\"font-semibold\">{title}</h3>\n <p className={confirmation__text}>{text}</p>\n </div>\n </div>\n <div className=\"confirmation__footer\">\n {secondaryAction && (\n <button\n onClick={secondaryAction}\n type=\"button\"\n className=\"cursor-pointer\"\n style={{ color: `var(--color-${type})` }}\n >\n {secondaryLabel}\n </button>\n )}\n <button\n onClick={() => {\n mainAction();\n secondaryAction && secondaryAction();\n }}\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\n style={{\n background: `var(--color-${type})`,\n border: `1px solid var(--color-${type})`,\n }}\n >\n {mainLabel}\n </button>\n </div>\n </div>\n </div>\n );\n}\n\nconst wrapper =\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\nconst confirmation__text =\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\n"],"mappings":"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","names":["list","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","faCheck","React","input","FontAwesomeIcon","faCheck","input__icon","list","React","React","React","React","FontAwesomeIcon","React","FontAwesomeIcon","React","useMemo","useState","FontAwesomeIcon","faCheck","useState","useMemo","label","isItemExist","React","input","FontAwesomeIcon","faCheck","input__icon","React","React","React","useState","useState","React","React","React","React","React","React"]}
package/dist/styles.css CHANGED
@@ -263,6 +263,9 @@
263
263
  .inline-block {
264
264
  display: inline-block;
265
265
  }
266
+ .\!h-\[2\.95rem\] {
267
+ height: 2.95rem !important;
268
+ }
266
269
  .h-\[1\.6rem\] {
267
270
  height: 1.6rem;
268
271
  }
@@ -281,6 +284,9 @@
281
284
  .h-full {
282
285
  height: 100%;
283
286
  }
287
+ .h-screen {
288
+ height: 100vh;
289
+ }
284
290
  .\!w-\[30rem\] {
285
291
  width: 30rem !important;
286
292
  }
@@ -299,9 +305,6 @@
299
305
  .w-\[90\%\] {
300
306
  width: 90%;
301
307
  }
302
- .w-\[900px\] {
303
- width: 900px;
304
- }
305
308
  .w-\[max-content\] {
306
309
  width: -moz-max-content;
307
310
  width: max-content;
@@ -1071,7 +1074,7 @@ h3 {
1071
1074
  z-index: 1000;
1072
1075
  height: -moz-max-content;
1073
1076
  height: max-content;
1074
- width: 23rem;
1077
+ width: 25rem;
1075
1078
  cursor: default;
1076
1079
  overflow: hidden;
1077
1080
  border-radius: 0.6rem;
@@ -1097,7 +1100,7 @@ h3 {
1097
1100
  }
1098
1101
  .toast__description {
1099
1102
  margin-top: 0.7rem;
1100
- width: 80%;
1103
+ width: 83%;
1101
1104
  color: var(--color-text-secondary);
1102
1105
  }
1103
1106
  .toast__bar {
package/package.json CHANGED
@@ -35,7 +35,7 @@
35
35
  "react-dom": "^18.2.0 || ^19.0.0"
36
36
  },
37
37
  "name": "@safestrong/ppa-component-library",
38
- "version": "1.6.4",
38
+ "version": "1.6.6",
39
39
  "description": "Collection of reusable components for any PPA web applications",
40
40
  "main": "dist/index.cjs",
41
41
  "module": "dist/index.js",