@safestrong/ppa-component-library 1.7.2 → 1.7.3

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.js CHANGED
@@ -101,6 +101,7 @@ function Button(_a) {
101
101
  return /* @__PURE__ */ import_react.default.createElement(
102
102
  "button",
103
103
  __spreadProps(__spreadValues({}, rest), {
104
+ disabled: rest.disabled || isLoading,
104
105
  className: `${!icon && "py-[0.84rem]"} ${className} ${btnType == "secondary" && "btn__secondary"} btn__primary ${label ? "" : "!p-[0.87rem]"}`
105
106
  }),
106
107
  buttonIcon && icon && /* @__PURE__ */ import_react.default.createElement(
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\";\r\nexport { default as TextInput } from \"./components/TextInput\";\r\nexport { default as Slider } from \"./components/Slider\";\r\nexport { default as SingleSelect } from \"./components/SingleSelect\";\r\nexport { default as Tooltip } from \"./components/Tooltip\";\r\nexport { default as NavTabClient } from \"./components/NavTabClient\";\r\nexport { default as Card } from \"./components/Card\";\r\nexport { default as Toast } from \"./components/Toast\";\r\nexport { default as Expandable } from \"./components/Expandable\";\r\nexport { default as MultiSelect } from \"./components/MultiSelect\";\r\nexport { default as ThemeToggle } from \"./components/ThemeToggle\";\r\nexport { default as Dashboard } from \"./components/Dashboard\";\r\nexport { default as Badge } from \"./components/Badge\";\r\nexport { default as Skeleton } from \"./components/Skeleton\";\r\nexport { default as Navigation } from \"./components/Navigation\";\r\nexport { default as Confirmation } from \"./components/Confirmation\";\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\r\n icon?: IconProp;\r\n label?: string;\r\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\r\n isLoading?: boolean;\r\n};\r\n\r\nexport default function Button({\r\n label,\r\n icon,\r\n isLoading,\r\n btnType,\r\n className,\r\n ...rest\r\n}: Readonly<Button>) {\r\n const buttonIcon = isLoading ? faCircleNotch : icon;\r\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\r\n return (\r\n <button\r\n {...rest}\r\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\r\n btnType == \"secondary\" && \"btn__secondary\"\r\n } btn__primary ${label ? \"\" : \"!p-[0.87rem]\"}`}\r\n >\r\n {buttonIcon && icon && (\r\n <FontAwesomeIcon\r\n icon={buttonIcon}\r\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\r\n isLoading && \"animate-spin\"\r\n }`}\r\n />\r\n )}\r\n {isLoading ? loadingLabel : label}\r\n </button>\r\n );\r\n}\r\n\r\nconst IconButton = (props: Readonly<Button>) => {\r\n return (\r\n <button\r\n {...props}\r\n className={`${props.className} ${\r\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\r\n } icon__button`}\r\n >\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n {props.label && (\r\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\r\n {props.label}\r\n </span>\r\n )}\r\n </button>\r\n );\r\n};\r\n\r\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\r\n return (\r\n <div className=\"icon__button_group\">\r\n {list.map((props, idx) => (\r\n <button key={idx + 1} className={getBtnClass(idx)} {...props}>\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n </button>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\r\n return (\r\n <a href={href} className={`sso-button ${btnclass}`}>\r\n <img\r\n alt=\"logo\"\r\n className=\"sso-icon\"\r\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\r\n />{\" \"}\r\n Login dengan SSO\r\n </a>\r\n );\r\n};\r\n\r\nButton.IconButton = IconButton;\r\nButton.IconButtonGroup = IconButtonGroup;\r\nButton.SSOButton = SSOButton;\r\n\r\nfunction getBtnClass(idx: number) {\r\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${\r\n idx == 0 ? \"\" : \"border-l border-l-[var(--color-border)]\"\r\n }`;\r\n}\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nconst input__icon =\r\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)]\";\r\n\r\nexport default function TextInput({\r\n label,\r\n labelFor,\r\n icon,\r\n outerclass,\r\n ...attr\r\n}: Readonly<\r\n React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelFor?: string;\r\n icon?: IconProp;\r\n outerclass?: string;\r\n }\r\n>) {\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label htmlFor={labelFor} className=\"text-input__label\">\r\n {label}\r\n </label>\r\n )}\r\n <div className={`text-input__wrapper overflow-hidden ${attr.className}`}>\r\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\r\n <input\r\n {...attr}\r\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"}`}\r\n />\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\nexport default function Slider(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <div className=\"slider__wrapper group relative\">\r\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\r\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[0.7rem] translate-x-[0.2px]\"\r\n />\r\n </label>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst input = \"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\";\r\n","\"use client\";\r\nimport React, { useEffect, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelHtml?: string;\r\n placeholder?: string;\r\n stateaction?: (param: any) => void;\r\n outerclass?: string;\r\n options?: {\r\n label: string;\r\n value: string;\r\n }[];\r\n stringOptions?: string[];\r\n};\r\n\r\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\r\n const { options = [], stringOptions = [], ...attrInput } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const [selected, setSelected] = useState<{ label: string; value: any }>({\r\n label: \"\",\r\n value: \"\",\r\n });\r\n\r\n function selectItem(\r\n { label, value }: { label: string; value: any },\r\n e: React.MouseEvent<HTMLButtonElement>\r\n ) {\r\n const triggerManual = attrInput.onChange;\r\n if (triggerManual) {\r\n triggerManual?.({\r\n target: { value, name: attrInput.name },\r\n } as React.ChangeEvent<HTMLInputElement>);\r\n }\r\n setSelected({ label, value });\r\n if (attr.stateaction) {\r\n if (stringOptions) attr.stateaction(value);\r\n if (options) attr.stateaction({ label, value });\r\n }\r\n setKeyword(\"\");\r\n setTimeout(() => {\r\n (e.target as HTMLButtonElement).blur();\r\n }, 250);\r\n }\r\n\r\n function autoUpdateValue(updatedValue: string) {\r\n if (updatedValue) {\r\n const filtered = availableOptions.find(\r\n ({ value }) => value == updatedValue\r\n );\r\n if (filtered) setSelected(filtered);\r\n }\r\n }\r\n\r\n const availableOptions = useMemo(() => {\r\n let defaultOptions = options && options.length > 0;\r\n if (!defaultOptions)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n const filteredOptions = useMemo(() => {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }, [keyword, availableOptions]);\r\n\r\n useEffect(() => {\r\n attrInput.value && autoUpdateValue(attrInput.value as string);\r\n }, [attrInput.value]);\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div className={`${attrInput.className} text-input__wrapper relative`}>\r\n <input\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n type=\"hidden\"\r\n />\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${input} ${\r\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n />\r\n <div className=\"select-item__wrapper\">\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nSingleSelect.autoFill = autoFillInput;\r\n\r\nfunction autoFillInput(\r\n value: string,\r\n elName: string,\r\n list: { label: string; value: string }[]\r\n) {\r\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\r\n inp.value = `${value}`;\r\n const filtered = list.find((item) => item.value == value);\r\n const el = document.querySelector(`.${elName}-keyword`);\r\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\r\n}\r\n\r\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","import React from \"react\";\r\n\r\ntype Tooltip = {\r\n children: React.ReactNode;\r\n text: string;\r\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\r\n};\r\n\r\nexport default function Tooltip({\r\n children,\r\n text,\r\n position = \"top\",\r\n}: Readonly<Tooltip>) {\r\n function getAccent() {\r\n const mapping = {\r\n top,\r\n bottom,\r\n left,\r\n right,\r\n };\r\n return mapping[position];\r\n }\r\n return (\r\n <div className=\"relative\">\r\n <div className=\"peer\">{children}</div>\r\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\r\n </div>\r\n );\r\n}\r\n\r\nconst top =\r\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\r\nconst bottom =\r\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\r\nconst right =\r\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\r\nconst left =\r\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\r\n","import React from \"react\";\r\n\r\ntype Option = {\r\n label: string;\r\n value: string;\r\n};\r\n\r\nexport default function NavTabClient({\r\n items,\r\n state,\r\n}: Readonly<{\r\n items: Option[];\r\n state: {\r\n active: string;\r\n setActive: (val: string) => void;\r\n };\r\n}>) {\r\n return (\r\n <nav className=\"navtab__wrapper\">\r\n {items.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n className={`navtab__item ${\r\n state.active == value\r\n ? \"navtab__item__active\"\r\n : \"hover:bg-[var(--color-border)]/50\"\r\n }`}\r\n onClick={() => state.setActive(value)}\r\n >\r\n {label}\r\n </button>\r\n ))}\r\n </nav>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\ntype Card = {\r\n children: React.ReactNode;\r\n className?: string;\r\n};\r\n\r\nexport default function Card({ children, className }: Readonly<Card>) {\r\n return <div className={`card ${className}`}>{children}</div>;\r\n}\r\n\r\nconst Footer = ({\r\n className,\r\n children,\r\n}: {\r\n className?: string;\r\n children?: React.ReactNode;\r\n}) => {\r\n return (\r\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\r\n {children}\r\n </div>\r\n );\r\n};\r\n\r\nCard.Footer = Footer;\r\n","import React from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {\r\n faCheckCircle,\r\n faInfoCircle,\r\n faQuestionCircle,\r\n faXmarkCircle,\r\n} from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\r\ntype Toast = {\r\n title: string;\r\n className?: string;\r\n description: string;\r\n type: ToastType;\r\n};\r\n\r\nexport default function Toast({\r\n title,\r\n description,\r\n type = \"info\",\r\n className,\r\n}: Readonly<Toast>) {\r\n return (\r\n <div className={`toast__wrapper group ${className}`}>\r\n <div className=\"toast__body\">\r\n <div style={{ background: getColor(type) }} className={bullet}></div>\r\n <div>\r\n <p className=\"toast__title\">{title}</p>\r\n <p className=\"toast__description\">{description}</p>\r\n </div>\r\n <div className={`toast__icon toast__icon__${type}`}></div>\r\n </div>\r\n <p\r\n className=\"toast__bar toast-bar-animate\"\r\n style={{ background: getColor(type) }}\r\n ></p>\r\n </div>\r\n );\r\n}\r\n\r\nconst Inline = ({\r\n className,\r\n text,\r\n type,\r\n}: {\r\n className?: string;\r\n text: string;\r\n type: ToastType;\r\n}) => {\r\n return (\r\n <div\r\n className={`toast__inline ${className}`}\r\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\r\n >\r\n <FontAwesomeIcon\r\n icon={getIcon(type)}\r\n className=\"text-[1.3rem]\"\r\n style={{ color: getColor(type) }}\r\n />\r\n <p>{text}</p>\r\n </div>\r\n );\r\n};\r\n\r\nToast.Inline = Inline;\r\n\r\nfunction getColor(type: string) {\r\n return `var(--color-${type})`;\r\n}\r\n\r\nfunction getIcon(type: string) {\r\n const mapping = {\r\n warning: faQuestionCircle,\r\n info: faInfoCircle,\r\n danger: faXmarkCircle,\r\n success: faCheckCircle,\r\n };\r\n //@ts-expect-error call object using array index\r\n return mapping[type];\r\n}\r\n\r\nconst bullet =\r\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\r\n","import React from \"react\";\r\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\ntype Expandable = {\r\n children: React.ReactNode;\r\n title: string;\r\n className?: string;\r\n isOpen?: boolean;\r\n};\r\n\r\nexport default function Expandable({\r\n children,\r\n title,\r\n className,\r\n isOpen,\r\n}: Readonly<Expandable>) {\r\n const name = title.replace(\" \", \"\");\r\n return (\r\n <div className={`expandable ${className}`}>\r\n <input\r\n id={name}\r\n type=\"checkbox\"\r\n defaultChecked={isOpen}\r\n className=\"opacity-[0] peer absolute top-0 ex-title\"\r\n />\r\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\r\n <label htmlFor={name} className=\"expandable__title\">\r\n {title}\r\n </label>\r\n <div className=\"expandable__body\">\r\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React, { useCallback, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Option = {\r\n value: string;\r\n label: string;\r\n};\r\n\r\ntype MultiSelect = {\r\n label?: string;\r\n labelHtml?: string;\r\n outerclass?: string;\r\n options?: Option[];\r\n stringOptions?: string[];\r\n state: { value: Option[]; select: (newVal: Option[]) => void };\r\n};\r\n\r\nexport default function MultiSelect({\r\n state,\r\n label,\r\n labelHtml,\r\n ...attr\r\n}: Readonly<MultiSelect>) {\r\n const { options = [], stringOptions = [] } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n\r\n const availableOptions = useMemo(() => {\r\n const isDefaultOption = options && options.length > 0;\r\n if (!isDefaultOption)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n function getFiltered() {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }\r\n\r\n function selectItem({ label, value }: { label: string; value: string }) {\r\n //@ts-expect-error: avoid check\r\n state.select((prev) => {\r\n const isItemExist = prev.find((item: any) => item.value == value);\r\n if (isItemExist) {\r\n return prev.filter((item: any) => item.value != value);\r\n }\r\n return [...prev, { label, value }];\r\n });\r\n }\r\n\r\n function isItemExist(value: string) {\r\n return state.value.find((item: any) => item.value == value);\r\n }\r\n\r\n const selectUnSelectAll = useCallback(() => {\r\n const isAllSelected = state.value.length == availableOptions.length;\r\n state.select(isAllSelected ? [] : availableOptions);\r\n }, [state.value]);\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label className=\"text-input__label\" htmlFor={labelHtml}>\r\n {label}\r\n </label>\r\n )}\r\n <div className=\"text-input__wrapper relative\">\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n placeholder={`${state.value.length} Dipilih`}\r\n className={`${input} ${\r\n state.value.length > 0 &&\r\n \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n />\r\n <div className=\"select-item__wrapper select-multiple__wrapper\">\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <button\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n onClick={selectUnSelectAll}\r\n >\r\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\r\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","\"use client\";\r\nimport React from \"react\";\r\n\r\nexport default function ThemeToggle(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <label\r\n htmlFor={`${attr.id || \"theme-toggle\"}`}\r\n className=\"slider__wrapper slider-theme slider-theme-light relative\"\r\n >\r\n <input\r\n id=\"theme-toggle\"\r\n {...attr}\r\n type=\"checkbox\"\r\n className=\"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\"\r\n />\r\n <span className=\"slider-theme__bullet\"></span>\r\n </label>\r\n </div>\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport MultiSelect from \"./MultiSelect\";\r\nimport SingleSelect from \"./SingleSelect\";\r\n\r\nconst list = [\r\n { label: \"Option 1\", value: \"option1\" },\r\n { label: \"Option 2\", value: \"option2\" },\r\n { label: \"Option 3\", value: \"option3\" },\r\n];\r\nconst stringList = [\"option1\", \"option2\", \"option3\"];\r\n\r\nexport default function Dashboard() {\r\n const [selectedItem, setSelectedItem] = useState<\r\n { label: string; value: string }[]\r\n >([]);\r\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\r\n\r\n function updateState(item: string) {\r\n const filtered = list.find(({ value }) => value == item);\r\n filtered && setSel(filtered);\r\n }\r\n\r\n return (\r\n <div className=\"flex items-center gap-[1rem]\">\r\n <MultiSelect\r\n label=\"Multi Select\"\r\n stringOptions={stringList}\r\n state={{ value: selectedItem, select: setSelectedItem }}\r\n />\r\n <SingleSelect\r\n label=\"Single Select\"\r\n name=\"newinput\"\r\n stringOptions={stringList}\r\n placeholder=\"-- Pilih Status --\"\r\n value={sel.value}\r\n />\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Badge({\r\n text,\r\n type,\r\n className,\r\n}: {\r\n text: string;\r\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\r\n className?: string;\r\n}) {\r\n return (\r\n <div className=\"badge__wrapper\">\r\n <span\r\n style={{\r\n background: `var(--color-${type})`,\r\n }}\r\n className={`badge ${className}`}\r\n >\r\n {text}\r\n </span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Skeleton({ className }: { className?: string }) {\r\n return (\r\n <div className={`${className} skeleton`}>\r\n <span className=\"skeleton__item skeleton-slide\"></span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nexport default function Navigation() {\r\n return <nav></nav>;\r\n}\r\n\r\nconst URLNavigation = (props: {\r\n list: { label: string; href: string }[];\r\n activeUrl: string;\r\n outerclass?: string;\r\n CustomComponent?: React.ElementType;\r\n}) => {\r\n const Component = props.CustomComponent || \"a\";\r\n function getAnchorClass(href: string) {\r\n return href === props.activeUrl\r\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\r\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\r\n }\r\n\r\n return (\r\n <nav className={`nav__wrapper ${props.outerclass}`}>\r\n {props.list.map((prop) => (\r\n <Component\r\n key={prop.href}\r\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\r\n {...prop}\r\n >\r\n {prop.label}\r\n </Component>\r\n ))}\r\n </nav>\r\n );\r\n};\r\n\r\nNavigation.URL = URLNavigation;\r\n\r\nconst base__anchor =\r\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\r\n","import React from \"react\";\r\n\r\nexport default function Confirmation({\r\n type = \"warning\",\r\n text,\r\n title,\r\n secondaryAction,\r\n secondaryLabel = \"Tidak\",\r\n mainAction,\r\n mainLabel = \"Ya\",\r\n}: {\r\n mainAction: () => void;\r\n secondaryAction?: () => void;\r\n mainLabel?: string;\r\n secondaryLabel?: string;\r\n title: string;\r\n text: string;\r\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\r\n}) {\r\n return (\r\n <div className=\"confirmation__outer\">\r\n <div className=\"confirmation__card\">\r\n <div className={wrapper}>\r\n <div className={`baloon__${type} baloon`}></div>\r\n <div>\r\n <h3 className=\"font-semibold\">{title}</h3>\r\n <p className={confirmation__text}>{text}</p>\r\n </div>\r\n </div>\r\n <div className=\"confirmation__footer\">\r\n {secondaryAction && (\r\n <button\r\n onClick={secondaryAction}\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n style={{ color: `var(--color-${type})` }}\r\n >\r\n {secondaryLabel}\r\n </button>\r\n )}\r\n <button\r\n onClick={() => {\r\n mainAction();\r\n secondaryAction && secondaryAction();\r\n }}\r\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\r\n style={{\r\n background: `var(--color-${type})`,\r\n border: `1px solid var(--color-${type})`,\r\n }}\r\n >\r\n {mainLabel}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst wrapper =\r\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\r\nconst confirmation__text =\r\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\r\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\";\r\nexport { default as TextInput } from \"./components/TextInput\";\r\nexport { default as Slider } from \"./components/Slider\";\r\nexport { default as SingleSelect } from \"./components/SingleSelect\";\r\nexport { default as Tooltip } from \"./components/Tooltip\";\r\nexport { default as NavTabClient } from \"./components/NavTabClient\";\r\nexport { default as Card } from \"./components/Card\";\r\nexport { default as Toast } from \"./components/Toast\";\r\nexport { default as Expandable } from \"./components/Expandable\";\r\nexport { default as MultiSelect } from \"./components/MultiSelect\";\r\nexport { default as ThemeToggle } from \"./components/ThemeToggle\";\r\nexport { default as Dashboard } from \"./components/Dashboard\";\r\nexport { default as Badge } from \"./components/Badge\";\r\nexport { default as Skeleton } from \"./components/Skeleton\";\r\nexport { default as Navigation } from \"./components/Navigation\";\r\nexport { default as Confirmation } from \"./components/Confirmation\";\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\r\n icon?: IconProp;\r\n label?: string;\r\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\r\n isLoading?: boolean;\r\n};\r\n\r\nexport default function Button({\r\n label,\r\n icon,\r\n isLoading,\r\n btnType,\r\n className,\r\n ...rest\r\n}: Readonly<Button>) {\r\n const buttonIcon = isLoading ? faCircleNotch : icon;\r\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\r\n return (\r\n <button\r\n {...rest}\r\n disabled={rest.disabled || isLoading}\r\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\r\n btnType == \"secondary\" && \"btn__secondary\"\r\n } btn__primary ${label ? \"\" : \"!p-[0.87rem]\"}`}\r\n >\r\n {buttonIcon && icon && (\r\n <FontAwesomeIcon\r\n icon={buttonIcon}\r\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\r\n isLoading && \"animate-spin\"\r\n }`}\r\n />\r\n )}\r\n {isLoading ? loadingLabel : label}\r\n </button>\r\n );\r\n}\r\n\r\nconst IconButton = (props: Readonly<Button>) => {\r\n return (\r\n <button\r\n {...props}\r\n className={`${props.className} ${\r\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\r\n } icon__button`}\r\n >\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n {props.label && (\r\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\r\n {props.label}\r\n </span>\r\n )}\r\n </button>\r\n );\r\n};\r\n\r\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\r\n return (\r\n <div className=\"icon__button_group\">\r\n {list.map((props, idx) => (\r\n <button key={idx + 1} className={getBtnClass(idx)} {...props}>\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n </button>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\r\n return (\r\n <a href={href} className={`sso-button ${btnclass}`}>\r\n <img\r\n alt=\"logo\"\r\n className=\"sso-icon\"\r\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\r\n />{\" \"}\r\n Login dengan SSO\r\n </a>\r\n );\r\n};\r\n\r\nButton.IconButton = IconButton;\r\nButton.IconButtonGroup = IconButtonGroup;\r\nButton.SSOButton = SSOButton;\r\n\r\nfunction getBtnClass(idx: number) {\r\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${\r\n idx == 0 ? \"\" : \"border-l border-l-[var(--color-border)]\"\r\n }`;\r\n}\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nconst input__icon =\r\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)]\";\r\n\r\nexport default function TextInput({\r\n label,\r\n labelFor,\r\n icon,\r\n outerclass,\r\n ...attr\r\n}: Readonly<\r\n React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelFor?: string;\r\n icon?: IconProp;\r\n outerclass?: string;\r\n }\r\n>) {\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label htmlFor={labelFor} className=\"text-input__label\">\r\n {label}\r\n </label>\r\n )}\r\n <div className={`text-input__wrapper overflow-hidden ${attr.className}`}>\r\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\r\n <input\r\n {...attr}\r\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"}`}\r\n />\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\nexport default function Slider(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <div className=\"slider__wrapper group relative\">\r\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\r\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[0.7rem] translate-x-[0.2px]\"\r\n />\r\n </label>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst input = \"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\";\r\n","\"use client\";\r\nimport React, { useEffect, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelHtml?: string;\r\n placeholder?: string;\r\n stateaction?: (param: any) => void;\r\n outerclass?: string;\r\n options?: {\r\n label: string;\r\n value: string;\r\n }[];\r\n stringOptions?: string[];\r\n};\r\n\r\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\r\n const { options = [], stringOptions = [], ...attrInput } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const [selected, setSelected] = useState<{ label: string; value: any }>({\r\n label: \"\",\r\n value: \"\",\r\n });\r\n\r\n function selectItem(\r\n { label, value }: { label: string; value: any },\r\n e: React.MouseEvent<HTMLButtonElement>\r\n ) {\r\n const triggerManual = attrInput.onChange;\r\n if (triggerManual) {\r\n triggerManual?.({\r\n target: { value, name: attrInput.name },\r\n } as React.ChangeEvent<HTMLInputElement>);\r\n }\r\n setSelected({ label, value });\r\n if (attr.stateaction) {\r\n if (stringOptions) attr.stateaction(value);\r\n if (options) attr.stateaction({ label, value });\r\n }\r\n setKeyword(\"\");\r\n setTimeout(() => {\r\n (e.target as HTMLButtonElement).blur();\r\n }, 250);\r\n }\r\n\r\n function autoUpdateValue(updatedValue: string) {\r\n if (updatedValue) {\r\n const filtered = availableOptions.find(\r\n ({ value }) => value == updatedValue\r\n );\r\n if (filtered) setSelected(filtered);\r\n }\r\n }\r\n\r\n const availableOptions = useMemo(() => {\r\n let defaultOptions = options && options.length > 0;\r\n if (!defaultOptions)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n const filteredOptions = useMemo(() => {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }, [keyword, availableOptions]);\r\n\r\n useEffect(() => {\r\n attrInput.value && autoUpdateValue(attrInput.value as string);\r\n }, [attrInput.value]);\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div className={`${attrInput.className} text-input__wrapper relative`}>\r\n <input\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n type=\"hidden\"\r\n />\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${input} ${\r\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n />\r\n <div className=\"select-item__wrapper\">\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nSingleSelect.autoFill = autoFillInput;\r\n\r\nfunction autoFillInput(\r\n value: string,\r\n elName: string,\r\n list: { label: string; value: string }[]\r\n) {\r\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\r\n inp.value = `${value}`;\r\n const filtered = list.find((item) => item.value == value);\r\n const el = document.querySelector(`.${elName}-keyword`);\r\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\r\n}\r\n\r\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","import React from \"react\";\r\n\r\ntype Tooltip = {\r\n children: React.ReactNode;\r\n text: string;\r\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\r\n};\r\n\r\nexport default function Tooltip({\r\n children,\r\n text,\r\n position = \"top\",\r\n}: Readonly<Tooltip>) {\r\n function getAccent() {\r\n const mapping = {\r\n top,\r\n bottom,\r\n left,\r\n right,\r\n };\r\n return mapping[position];\r\n }\r\n return (\r\n <div className=\"relative\">\r\n <div className=\"peer\">{children}</div>\r\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\r\n </div>\r\n );\r\n}\r\n\r\nconst top =\r\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\r\nconst bottom =\r\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\r\nconst right =\r\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\r\nconst left =\r\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\r\n","import React from \"react\";\r\n\r\ntype Option = {\r\n label: string;\r\n value: string;\r\n};\r\n\r\nexport default function NavTabClient({\r\n items,\r\n state,\r\n}: Readonly<{\r\n items: Option[];\r\n state: {\r\n active: string;\r\n setActive: (val: string) => void;\r\n };\r\n}>) {\r\n return (\r\n <nav className=\"navtab__wrapper\">\r\n {items.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n className={`navtab__item ${\r\n state.active == value\r\n ? \"navtab__item__active\"\r\n : \"hover:bg-[var(--color-border)]/50\"\r\n }`}\r\n onClick={() => state.setActive(value)}\r\n >\r\n {label}\r\n </button>\r\n ))}\r\n </nav>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\ntype Card = {\r\n children: React.ReactNode;\r\n className?: string;\r\n};\r\n\r\nexport default function Card({ children, className }: Readonly<Card>) {\r\n return <div className={`card ${className}`}>{children}</div>;\r\n}\r\n\r\nconst Footer = ({\r\n className,\r\n children,\r\n}: {\r\n className?: string;\r\n children?: React.ReactNode;\r\n}) => {\r\n return (\r\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\r\n {children}\r\n </div>\r\n );\r\n};\r\n\r\nCard.Footer = Footer;\r\n","import React from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {\r\n faCheckCircle,\r\n faInfoCircle,\r\n faQuestionCircle,\r\n faXmarkCircle,\r\n} from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\r\ntype Toast = {\r\n title: string;\r\n className?: string;\r\n description: string;\r\n type: ToastType;\r\n};\r\n\r\nexport default function Toast({\r\n title,\r\n description,\r\n type = \"info\",\r\n className,\r\n}: Readonly<Toast>) {\r\n return (\r\n <div className={`toast__wrapper group ${className}`}>\r\n <div className=\"toast__body\">\r\n <div style={{ background: getColor(type) }} className={bullet}></div>\r\n <div>\r\n <p className=\"toast__title\">{title}</p>\r\n <p className=\"toast__description\">{description}</p>\r\n </div>\r\n <div className={`toast__icon toast__icon__${type}`}></div>\r\n </div>\r\n <p\r\n className=\"toast__bar toast-bar-animate\"\r\n style={{ background: getColor(type) }}\r\n ></p>\r\n </div>\r\n );\r\n}\r\n\r\nconst Inline = ({\r\n className,\r\n text,\r\n type,\r\n}: {\r\n className?: string;\r\n text: string;\r\n type: ToastType;\r\n}) => {\r\n return (\r\n <div\r\n className={`toast__inline ${className}`}\r\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\r\n >\r\n <FontAwesomeIcon\r\n icon={getIcon(type)}\r\n className=\"text-[1.3rem]\"\r\n style={{ color: getColor(type) }}\r\n />\r\n <p>{text}</p>\r\n </div>\r\n );\r\n};\r\n\r\nToast.Inline = Inline;\r\n\r\nfunction getColor(type: string) {\r\n return `var(--color-${type})`;\r\n}\r\n\r\nfunction getIcon(type: string) {\r\n const mapping = {\r\n warning: faQuestionCircle,\r\n info: faInfoCircle,\r\n danger: faXmarkCircle,\r\n success: faCheckCircle,\r\n };\r\n //@ts-expect-error call object using array index\r\n return mapping[type];\r\n}\r\n\r\nconst bullet =\r\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\r\n","import React from \"react\";\r\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\ntype Expandable = {\r\n children: React.ReactNode;\r\n title: string;\r\n className?: string;\r\n isOpen?: boolean;\r\n};\r\n\r\nexport default function Expandable({\r\n children,\r\n title,\r\n className,\r\n isOpen,\r\n}: Readonly<Expandable>) {\r\n const name = title.replace(\" \", \"\");\r\n return (\r\n <div className={`expandable ${className}`}>\r\n <input\r\n id={name}\r\n type=\"checkbox\"\r\n defaultChecked={isOpen}\r\n className=\"opacity-[0] peer absolute top-0 ex-title\"\r\n />\r\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\r\n <label htmlFor={name} className=\"expandable__title\">\r\n {title}\r\n </label>\r\n <div className=\"expandable__body\">\r\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React, { useCallback, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Option = {\r\n value: string;\r\n label: string;\r\n};\r\n\r\ntype MultiSelect = {\r\n label?: string;\r\n labelHtml?: string;\r\n outerclass?: string;\r\n options?: Option[];\r\n stringOptions?: string[];\r\n state: { value: Option[]; select: (newVal: Option[]) => void };\r\n};\r\n\r\nexport default function MultiSelect({\r\n state,\r\n label,\r\n labelHtml,\r\n ...attr\r\n}: Readonly<MultiSelect>) {\r\n const { options = [], stringOptions = [] } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n\r\n const availableOptions = useMemo(() => {\r\n const isDefaultOption = options && options.length > 0;\r\n if (!isDefaultOption)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n function getFiltered() {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }\r\n\r\n function selectItem({ label, value }: { label: string; value: string }) {\r\n //@ts-expect-error: avoid check\r\n state.select((prev) => {\r\n const isItemExist = prev.find((item: any) => item.value == value);\r\n if (isItemExist) {\r\n return prev.filter((item: any) => item.value != value);\r\n }\r\n return [...prev, { label, value }];\r\n });\r\n }\r\n\r\n function isItemExist(value: string) {\r\n return state.value.find((item: any) => item.value == value);\r\n }\r\n\r\n const selectUnSelectAll = useCallback(() => {\r\n const isAllSelected = state.value.length == availableOptions.length;\r\n state.select(isAllSelected ? [] : availableOptions);\r\n }, [state.value]);\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label className=\"text-input__label\" htmlFor={labelHtml}>\r\n {label}\r\n </label>\r\n )}\r\n <div className=\"text-input__wrapper relative\">\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n placeholder={`${state.value.length} Dipilih`}\r\n className={`${input} ${\r\n state.value.length > 0 &&\r\n \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n />\r\n <div className=\"select-item__wrapper select-multiple__wrapper\">\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <button\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n onClick={selectUnSelectAll}\r\n >\r\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\r\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","\"use client\";\r\nimport React from \"react\";\r\n\r\nexport default function ThemeToggle(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <label\r\n htmlFor={`${attr.id || \"theme-toggle\"}`}\r\n className=\"slider__wrapper slider-theme slider-theme-light relative\"\r\n >\r\n <input\r\n id=\"theme-toggle\"\r\n {...attr}\r\n type=\"checkbox\"\r\n className=\"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\"\r\n />\r\n <span className=\"slider-theme__bullet\"></span>\r\n </label>\r\n </div>\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport MultiSelect from \"./MultiSelect\";\r\nimport SingleSelect from \"./SingleSelect\";\r\n\r\nconst list = [\r\n { label: \"Option 1\", value: \"option1\" },\r\n { label: \"Option 2\", value: \"option2\" },\r\n { label: \"Option 3\", value: \"option3\" },\r\n];\r\nconst stringList = [\"option1\", \"option2\", \"option3\"];\r\n\r\nexport default function Dashboard() {\r\n const [selectedItem, setSelectedItem] = useState<\r\n { label: string; value: string }[]\r\n >([]);\r\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\r\n\r\n function updateState(item: string) {\r\n const filtered = list.find(({ value }) => value == item);\r\n filtered && setSel(filtered);\r\n }\r\n\r\n return (\r\n <div className=\"flex items-center gap-[1rem]\">\r\n <MultiSelect\r\n label=\"Multi Select\"\r\n stringOptions={stringList}\r\n state={{ value: selectedItem, select: setSelectedItem }}\r\n />\r\n <SingleSelect\r\n label=\"Single Select\"\r\n name=\"newinput\"\r\n stringOptions={stringList}\r\n placeholder=\"-- Pilih Status --\"\r\n value={sel.value}\r\n />\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Badge({\r\n text,\r\n type,\r\n className,\r\n}: {\r\n text: string;\r\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\r\n className?: string;\r\n}) {\r\n return (\r\n <div className=\"badge__wrapper\">\r\n <span\r\n style={{\r\n background: `var(--color-${type})`,\r\n }}\r\n className={`badge ${className}`}\r\n >\r\n {text}\r\n </span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Skeleton({ className }: { className?: string }) {\r\n return (\r\n <div className={`${className} skeleton`}>\r\n <span className=\"skeleton__item skeleton-slide\"></span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nexport default function Navigation() {\r\n return <nav></nav>;\r\n}\r\n\r\nconst URLNavigation = (props: {\r\n list: { label: string; href: string }[];\r\n activeUrl: string;\r\n outerclass?: string;\r\n CustomComponent?: React.ElementType;\r\n}) => {\r\n const Component = props.CustomComponent || \"a\";\r\n function getAnchorClass(href: string) {\r\n return href === props.activeUrl\r\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\r\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\r\n }\r\n\r\n return (\r\n <nav className={`nav__wrapper ${props.outerclass}`}>\r\n {props.list.map((prop) => (\r\n <Component\r\n key={prop.href}\r\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\r\n {...prop}\r\n >\r\n {prop.label}\r\n </Component>\r\n ))}\r\n </nav>\r\n );\r\n};\r\n\r\nNavigation.URL = URLNavigation;\r\n\r\nconst base__anchor =\r\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\r\n","import React from \"react\";\r\n\r\nexport default function Confirmation({\r\n type = \"warning\",\r\n text,\r\n title,\r\n secondaryAction,\r\n secondaryLabel = \"Tidak\",\r\n mainAction,\r\n mainLabel = \"Ya\",\r\n}: {\r\n mainAction: () => void;\r\n secondaryAction?: () => void;\r\n mainLabel?: string;\r\n secondaryLabel?: string;\r\n title: string;\r\n text: string;\r\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\r\n}) {\r\n return (\r\n <div className=\"confirmation__outer\">\r\n <div className=\"confirmation__card\">\r\n <div className={wrapper}>\r\n <div className={`baloon__${type} baloon`}></div>\r\n <div>\r\n <h3 className=\"font-semibold\">{title}</h3>\r\n <p className={confirmation__text}>{text}</p>\r\n </div>\r\n </div>\r\n <div className=\"confirmation__footer\">\r\n {secondaryAction && (\r\n <button\r\n onClick={secondaryAction}\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n style={{ color: `var(--color-${type})` }}\r\n >\r\n {secondaryLabel}\r\n </button>\r\n )}\r\n <button\r\n onClick={() => {\r\n mainAction();\r\n secondaryAction && secondaryAction();\r\n }}\r\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\r\n style={{\r\n background: `var(--color-${type})`,\r\n border: `1px solid var(--color-${type})`,\r\n }}\r\n >\r\n {mainLabel}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst wrapper =\r\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\r\nconst confirmation__text =\r\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\r\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
@@ -53,6 +53,7 @@ function Button(_a) {
53
53
  return /* @__PURE__ */ React.createElement(
54
54
  "button",
55
55
  __spreadProps(__spreadValues({}, rest), {
56
+ disabled: rest.disabled || isLoading,
56
57
  className: `${!icon && "py-[0.84rem]"} ${className} ${btnType == "secondary" && "btn__secondary"} btn__primary ${label ? "" : "!p-[0.87rem]"}`
57
58
  }),
58
59
  buttonIcon && icon && /* @__PURE__ */ React.createElement(
@@ -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\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\r\n icon?: IconProp;\r\n label?: string;\r\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\r\n isLoading?: boolean;\r\n};\r\n\r\nexport default function Button({\r\n label,\r\n icon,\r\n isLoading,\r\n btnType,\r\n className,\r\n ...rest\r\n}: Readonly<Button>) {\r\n const buttonIcon = isLoading ? faCircleNotch : icon;\r\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\r\n return (\r\n <button\r\n {...rest}\r\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\r\n btnType == \"secondary\" && \"btn__secondary\"\r\n } btn__primary ${label ? \"\" : \"!p-[0.87rem]\"}`}\r\n >\r\n {buttonIcon && icon && (\r\n <FontAwesomeIcon\r\n icon={buttonIcon}\r\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\r\n isLoading && \"animate-spin\"\r\n }`}\r\n />\r\n )}\r\n {isLoading ? loadingLabel : label}\r\n </button>\r\n );\r\n}\r\n\r\nconst IconButton = (props: Readonly<Button>) => {\r\n return (\r\n <button\r\n {...props}\r\n className={`${props.className} ${\r\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\r\n } icon__button`}\r\n >\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n {props.label && (\r\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\r\n {props.label}\r\n </span>\r\n )}\r\n </button>\r\n );\r\n};\r\n\r\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\r\n return (\r\n <div className=\"icon__button_group\">\r\n {list.map((props, idx) => (\r\n <button key={idx + 1} className={getBtnClass(idx)} {...props}>\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n </button>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\r\n return (\r\n <a href={href} className={`sso-button ${btnclass}`}>\r\n <img\r\n alt=\"logo\"\r\n className=\"sso-icon\"\r\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\r\n />{\" \"}\r\n Login dengan SSO\r\n </a>\r\n );\r\n};\r\n\r\nButton.IconButton = IconButton;\r\nButton.IconButtonGroup = IconButtonGroup;\r\nButton.SSOButton = SSOButton;\r\n\r\nfunction getBtnClass(idx: number) {\r\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${\r\n idx == 0 ? \"\" : \"border-l border-l-[var(--color-border)]\"\r\n }`;\r\n}\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nconst input__icon =\r\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)]\";\r\n\r\nexport default function TextInput({\r\n label,\r\n labelFor,\r\n icon,\r\n outerclass,\r\n ...attr\r\n}: Readonly<\r\n React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelFor?: string;\r\n icon?: IconProp;\r\n outerclass?: string;\r\n }\r\n>) {\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label htmlFor={labelFor} className=\"text-input__label\">\r\n {label}\r\n </label>\r\n )}\r\n <div className={`text-input__wrapper overflow-hidden ${attr.className}`}>\r\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\r\n <input\r\n {...attr}\r\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"}`}\r\n />\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\nexport default function Slider(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <div className=\"slider__wrapper group relative\">\r\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\r\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[0.7rem] translate-x-[0.2px]\"\r\n />\r\n </label>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst input = \"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\";\r\n","\"use client\";\r\nimport React, { useEffect, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelHtml?: string;\r\n placeholder?: string;\r\n stateaction?: (param: any) => void;\r\n outerclass?: string;\r\n options?: {\r\n label: string;\r\n value: string;\r\n }[];\r\n stringOptions?: string[];\r\n};\r\n\r\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\r\n const { options = [], stringOptions = [], ...attrInput } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const [selected, setSelected] = useState<{ label: string; value: any }>({\r\n label: \"\",\r\n value: \"\",\r\n });\r\n\r\n function selectItem(\r\n { label, value }: { label: string; value: any },\r\n e: React.MouseEvent<HTMLButtonElement>\r\n ) {\r\n const triggerManual = attrInput.onChange;\r\n if (triggerManual) {\r\n triggerManual?.({\r\n target: { value, name: attrInput.name },\r\n } as React.ChangeEvent<HTMLInputElement>);\r\n }\r\n setSelected({ label, value });\r\n if (attr.stateaction) {\r\n if (stringOptions) attr.stateaction(value);\r\n if (options) attr.stateaction({ label, value });\r\n }\r\n setKeyword(\"\");\r\n setTimeout(() => {\r\n (e.target as HTMLButtonElement).blur();\r\n }, 250);\r\n }\r\n\r\n function autoUpdateValue(updatedValue: string) {\r\n if (updatedValue) {\r\n const filtered = availableOptions.find(\r\n ({ value }) => value == updatedValue\r\n );\r\n if (filtered) setSelected(filtered);\r\n }\r\n }\r\n\r\n const availableOptions = useMemo(() => {\r\n let defaultOptions = options && options.length > 0;\r\n if (!defaultOptions)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n const filteredOptions = useMemo(() => {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }, [keyword, availableOptions]);\r\n\r\n useEffect(() => {\r\n attrInput.value && autoUpdateValue(attrInput.value as string);\r\n }, [attrInput.value]);\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div className={`${attrInput.className} text-input__wrapper relative`}>\r\n <input\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n type=\"hidden\"\r\n />\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${input} ${\r\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n />\r\n <div className=\"select-item__wrapper\">\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nSingleSelect.autoFill = autoFillInput;\r\n\r\nfunction autoFillInput(\r\n value: string,\r\n elName: string,\r\n list: { label: string; value: string }[]\r\n) {\r\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\r\n inp.value = `${value}`;\r\n const filtered = list.find((item) => item.value == value);\r\n const el = document.querySelector(`.${elName}-keyword`);\r\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\r\n}\r\n\r\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","import React from \"react\";\r\n\r\ntype Tooltip = {\r\n children: React.ReactNode;\r\n text: string;\r\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\r\n};\r\n\r\nexport default function Tooltip({\r\n children,\r\n text,\r\n position = \"top\",\r\n}: Readonly<Tooltip>) {\r\n function getAccent() {\r\n const mapping = {\r\n top,\r\n bottom,\r\n left,\r\n right,\r\n };\r\n return mapping[position];\r\n }\r\n return (\r\n <div className=\"relative\">\r\n <div className=\"peer\">{children}</div>\r\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\r\n </div>\r\n );\r\n}\r\n\r\nconst top =\r\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\r\nconst bottom =\r\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\r\nconst right =\r\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\r\nconst left =\r\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\r\n","import React from \"react\";\r\n\r\ntype Option = {\r\n label: string;\r\n value: string;\r\n};\r\n\r\nexport default function NavTabClient({\r\n items,\r\n state,\r\n}: Readonly<{\r\n items: Option[];\r\n state: {\r\n active: string;\r\n setActive: (val: string) => void;\r\n };\r\n}>) {\r\n return (\r\n <nav className=\"navtab__wrapper\">\r\n {items.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n className={`navtab__item ${\r\n state.active == value\r\n ? \"navtab__item__active\"\r\n : \"hover:bg-[var(--color-border)]/50\"\r\n }`}\r\n onClick={() => state.setActive(value)}\r\n >\r\n {label}\r\n </button>\r\n ))}\r\n </nav>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\ntype Card = {\r\n children: React.ReactNode;\r\n className?: string;\r\n};\r\n\r\nexport default function Card({ children, className }: Readonly<Card>) {\r\n return <div className={`card ${className}`}>{children}</div>;\r\n}\r\n\r\nconst Footer = ({\r\n className,\r\n children,\r\n}: {\r\n className?: string;\r\n children?: React.ReactNode;\r\n}) => {\r\n return (\r\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\r\n {children}\r\n </div>\r\n );\r\n};\r\n\r\nCard.Footer = Footer;\r\n","import React from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {\r\n faCheckCircle,\r\n faInfoCircle,\r\n faQuestionCircle,\r\n faXmarkCircle,\r\n} from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\r\ntype Toast = {\r\n title: string;\r\n className?: string;\r\n description: string;\r\n type: ToastType;\r\n};\r\n\r\nexport default function Toast({\r\n title,\r\n description,\r\n type = \"info\",\r\n className,\r\n}: Readonly<Toast>) {\r\n return (\r\n <div className={`toast__wrapper group ${className}`}>\r\n <div className=\"toast__body\">\r\n <div style={{ background: getColor(type) }} className={bullet}></div>\r\n <div>\r\n <p className=\"toast__title\">{title}</p>\r\n <p className=\"toast__description\">{description}</p>\r\n </div>\r\n <div className={`toast__icon toast__icon__${type}`}></div>\r\n </div>\r\n <p\r\n className=\"toast__bar toast-bar-animate\"\r\n style={{ background: getColor(type) }}\r\n ></p>\r\n </div>\r\n );\r\n}\r\n\r\nconst Inline = ({\r\n className,\r\n text,\r\n type,\r\n}: {\r\n className?: string;\r\n text: string;\r\n type: ToastType;\r\n}) => {\r\n return (\r\n <div\r\n className={`toast__inline ${className}`}\r\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\r\n >\r\n <FontAwesomeIcon\r\n icon={getIcon(type)}\r\n className=\"text-[1.3rem]\"\r\n style={{ color: getColor(type) }}\r\n />\r\n <p>{text}</p>\r\n </div>\r\n );\r\n};\r\n\r\nToast.Inline = Inline;\r\n\r\nfunction getColor(type: string) {\r\n return `var(--color-${type})`;\r\n}\r\n\r\nfunction getIcon(type: string) {\r\n const mapping = {\r\n warning: faQuestionCircle,\r\n info: faInfoCircle,\r\n danger: faXmarkCircle,\r\n success: faCheckCircle,\r\n };\r\n //@ts-expect-error call object using array index\r\n return mapping[type];\r\n}\r\n\r\nconst bullet =\r\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\r\n","import React from \"react\";\r\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\ntype Expandable = {\r\n children: React.ReactNode;\r\n title: string;\r\n className?: string;\r\n isOpen?: boolean;\r\n};\r\n\r\nexport default function Expandable({\r\n children,\r\n title,\r\n className,\r\n isOpen,\r\n}: Readonly<Expandable>) {\r\n const name = title.replace(\" \", \"\");\r\n return (\r\n <div className={`expandable ${className}`}>\r\n <input\r\n id={name}\r\n type=\"checkbox\"\r\n defaultChecked={isOpen}\r\n className=\"opacity-[0] peer absolute top-0 ex-title\"\r\n />\r\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\r\n <label htmlFor={name} className=\"expandable__title\">\r\n {title}\r\n </label>\r\n <div className=\"expandable__body\">\r\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React, { useCallback, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Option = {\r\n value: string;\r\n label: string;\r\n};\r\n\r\ntype MultiSelect = {\r\n label?: string;\r\n labelHtml?: string;\r\n outerclass?: string;\r\n options?: Option[];\r\n stringOptions?: string[];\r\n state: { value: Option[]; select: (newVal: Option[]) => void };\r\n};\r\n\r\nexport default function MultiSelect({\r\n state,\r\n label,\r\n labelHtml,\r\n ...attr\r\n}: Readonly<MultiSelect>) {\r\n const { options = [], stringOptions = [] } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n\r\n const availableOptions = useMemo(() => {\r\n const isDefaultOption = options && options.length > 0;\r\n if (!isDefaultOption)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n function getFiltered() {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }\r\n\r\n function selectItem({ label, value }: { label: string; value: string }) {\r\n //@ts-expect-error: avoid check\r\n state.select((prev) => {\r\n const isItemExist = prev.find((item: any) => item.value == value);\r\n if (isItemExist) {\r\n return prev.filter((item: any) => item.value != value);\r\n }\r\n return [...prev, { label, value }];\r\n });\r\n }\r\n\r\n function isItemExist(value: string) {\r\n return state.value.find((item: any) => item.value == value);\r\n }\r\n\r\n const selectUnSelectAll = useCallback(() => {\r\n const isAllSelected = state.value.length == availableOptions.length;\r\n state.select(isAllSelected ? [] : availableOptions);\r\n }, [state.value]);\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label className=\"text-input__label\" htmlFor={labelHtml}>\r\n {label}\r\n </label>\r\n )}\r\n <div className=\"text-input__wrapper relative\">\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n placeholder={`${state.value.length} Dipilih`}\r\n className={`${input} ${\r\n state.value.length > 0 &&\r\n \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n />\r\n <div className=\"select-item__wrapper select-multiple__wrapper\">\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <button\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n onClick={selectUnSelectAll}\r\n >\r\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\r\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","\"use client\";\r\nimport React from \"react\";\r\n\r\nexport default function ThemeToggle(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <label\r\n htmlFor={`${attr.id || \"theme-toggle\"}`}\r\n className=\"slider__wrapper slider-theme slider-theme-light relative\"\r\n >\r\n <input\r\n id=\"theme-toggle\"\r\n {...attr}\r\n type=\"checkbox\"\r\n className=\"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\"\r\n />\r\n <span className=\"slider-theme__bullet\"></span>\r\n </label>\r\n </div>\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport MultiSelect from \"./MultiSelect\";\r\nimport SingleSelect from \"./SingleSelect\";\r\n\r\nconst list = [\r\n { label: \"Option 1\", value: \"option1\" },\r\n { label: \"Option 2\", value: \"option2\" },\r\n { label: \"Option 3\", value: \"option3\" },\r\n];\r\nconst stringList = [\"option1\", \"option2\", \"option3\"];\r\n\r\nexport default function Dashboard() {\r\n const [selectedItem, setSelectedItem] = useState<\r\n { label: string; value: string }[]\r\n >([]);\r\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\r\n\r\n function updateState(item: string) {\r\n const filtered = list.find(({ value }) => value == item);\r\n filtered && setSel(filtered);\r\n }\r\n\r\n return (\r\n <div className=\"flex items-center gap-[1rem]\">\r\n <MultiSelect\r\n label=\"Multi Select\"\r\n stringOptions={stringList}\r\n state={{ value: selectedItem, select: setSelectedItem }}\r\n />\r\n <SingleSelect\r\n label=\"Single Select\"\r\n name=\"newinput\"\r\n stringOptions={stringList}\r\n placeholder=\"-- Pilih Status --\"\r\n value={sel.value}\r\n />\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Badge({\r\n text,\r\n type,\r\n className,\r\n}: {\r\n text: string;\r\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\r\n className?: string;\r\n}) {\r\n return (\r\n <div className=\"badge__wrapper\">\r\n <span\r\n style={{\r\n background: `var(--color-${type})`,\r\n }}\r\n className={`badge ${className}`}\r\n >\r\n {text}\r\n </span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Skeleton({ className }: { className?: string }) {\r\n return (\r\n <div className={`${className} skeleton`}>\r\n <span className=\"skeleton__item skeleton-slide\"></span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nexport default function Navigation() {\r\n return <nav></nav>;\r\n}\r\n\r\nconst URLNavigation = (props: {\r\n list: { label: string; href: string }[];\r\n activeUrl: string;\r\n outerclass?: string;\r\n CustomComponent?: React.ElementType;\r\n}) => {\r\n const Component = props.CustomComponent || \"a\";\r\n function getAnchorClass(href: string) {\r\n return href === props.activeUrl\r\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\r\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\r\n }\r\n\r\n return (\r\n <nav className={`nav__wrapper ${props.outerclass}`}>\r\n {props.list.map((prop) => (\r\n <Component\r\n key={prop.href}\r\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\r\n {...prop}\r\n >\r\n {prop.label}\r\n </Component>\r\n ))}\r\n </nav>\r\n );\r\n};\r\n\r\nNavigation.URL = URLNavigation;\r\n\r\nconst base__anchor =\r\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\r\n","import React from \"react\";\r\n\r\nexport default function Confirmation({\r\n type = \"warning\",\r\n text,\r\n title,\r\n secondaryAction,\r\n secondaryLabel = \"Tidak\",\r\n mainAction,\r\n mainLabel = \"Ya\",\r\n}: {\r\n mainAction: () => void;\r\n secondaryAction?: () => void;\r\n mainLabel?: string;\r\n secondaryLabel?: string;\r\n title: string;\r\n text: string;\r\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\r\n}) {\r\n return (\r\n <div className=\"confirmation__outer\">\r\n <div className=\"confirmation__card\">\r\n <div className={wrapper}>\r\n <div className={`baloon__${type} baloon`}></div>\r\n <div>\r\n <h3 className=\"font-semibold\">{title}</h3>\r\n <p className={confirmation__text}>{text}</p>\r\n </div>\r\n </div>\r\n <div className=\"confirmation__footer\">\r\n {secondaryAction && (\r\n <button\r\n onClick={secondaryAction}\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n style={{ color: `var(--color-${type})` }}\r\n >\r\n {secondaryLabel}\r\n </button>\r\n )}\r\n <button\r\n onClick={() => {\r\n mainAction();\r\n secondaryAction && secondaryAction();\r\n }}\r\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\r\n style={{\r\n background: `var(--color-${type})`,\r\n border: `1px solid var(--color-${type})`,\r\n }}\r\n >\r\n {mainLabel}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst wrapper =\r\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\r\nconst confirmation__text =\r\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,WAAW;AAElB,SAAS,uBAAuB;AAChC,SAAS,qBAAqB;AASf,SAAR,OAAwB,IAOV;AAPU,eAC7B;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAjBF,IAY+B,IAM1B,iBAN0B,IAM1B;AAAA,IALH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,aAAa,YAAY,gBAAgB;AAC/C,QAAM,eAAe,SAAS,YAAY,kBAAkB;AAC5D,SACE;AAAA,IAAC;AAAA,qCACK,OADL;AAAA,MAEC,WAAW,GAAG,CAAC,QAAQ,cAAc,IAAI,SAAS,IAChD,WAAW,eAAe,gBAC5B,iBAAiB,QAAQ,KAAK,cAAc;AAAA;AAAA,IAE3C,cAAc,QACb;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,WAAW,iBAAiB,SAAS,aAAa,IAChD,aAAa,cACf;AAAA;AAAA,IACF;AAAA,IAED,YAAY,eAAe;AAAA,EAC9B;AAEJ;AAEA,IAAM,aAAa,CAAC,UAA4B;AAC9C,SACE;AAAA,IAAC;AAAA,qCACK,QADL;AAAA,MAEC,WAAW,GAAG,MAAM,SAAS,IAC3B,MAAM,QAAQ,gCAAgC,EAChD;AAAA;AAAA,IAEC,MAAM,QAAQ,oCAAC,mBAAgB,MAAM,MAAM,MAAM;AAAA,IACjD,MAAM,SACL,oCAAC,UAAK,WAAU,0CACb,MAAM,KACT;AAAA,EAEJ;AAEJ;AAEA,IAAM,kBAAkB,CAAC,EAAE,MAAAA,MAAK,MAA0B;AACxD,SACE,oCAAC,SAAI,WAAU,wBACZA,MAAK,IAAI,CAAC,OAAO,QAChB,oCAAC,2BAAO,KAAK,MAAM,GAAG,WAAW,YAAY,GAAG,KAAO,QACpD,MAAM,QAAQ,oCAAC,mBAAgB,MAAM,MAAM,MAAM,CACpD,CACD,CACH;AAEJ;AAEA,IAAM,YAAY,CAAC,EAAE,MAAM,SAAS,MAA2C;AAC7E,SACE,oCAAC,OAAE,MAAY,WAAW,cAAc,QAAQ,MAC9C;AAAA,IAAC;AAAA;AAAA,MACC,KAAI;AAAA,MACJ,WAAU;AAAA,MACV,KAAI;AAAA;AAAA,EACN,GAAG,KAAI,kBAET;AAEJ;AAEA,OAAO,aAAa;AACpB,OAAO,kBAAkB;AACzB,OAAO,YAAY;AAEnB,SAAS,YAAY,KAAa;AAChC,SAAO,qDACL,OAAO,IAAI,KAAK,yCAClB;AACF;;;AC7FA,OAAOC,YAAW;AAElB,SAAS,mBAAAC,wBAAuB;AAChC,IAAM,cACJ;AAEa,SAAR,UAA2B,IAa/B;AAb+B,eAChC;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAVF,IAMkC,IAK7B,iBAL6B,IAK7B;AAAA,IAJH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAUA,SACE,gBAAAC,OAAA,cAAC,SAAI,WAAW,SAAS,UAAU,aAChC,SACC,gBAAAA,OAAA,cAAC,WAAM,SAAS,UAAU,WAAU,uBACjC,KACH,GAEF,gBAAAA,OAAA,cAAC,SAAI,WAAW,uCAAuC,KAAK,SAAS,MAClE,QAAQ,gBAAAA,OAAA,cAACC,kBAAA,EAAgB,MAAY,WAAW,aAAa,GAC9D,gBAAAD,OAAA;AAAA,IAAC;AAAA,qCACK,OADL;AAAA,MAEC,WAAW,qBAAqB,QAAQ,cAAc;AAAA;AAAA,EACxD,CACF,CACF;AAEJ;;;ACpCA,OAAOE,YAAW;AAClB,SAAS,eAAe;AACxB,SAAS,mBAAAC,wBAAuB;AAEjB,SAAR,OACL,MACA;AACA,SACE,gBAAAC,OAAA,cAAC,SAAI,WAAU,gCACb,gBAAAA,OAAA,cAAC,SAAI,WAAU,oCACb,gBAAAA,OAAA,cAAC,0BAAM,IAAG,UAAS,MAAK,YAAW,WAAW,SAAW,KAAM,GAC/D,gBAAAA,OAAA,cAAC,WAAM,SAAS,KAAK,MAAM,UAAU,WAAU,YAC7C,gBAAAA,OAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAM;AAAA,MACN,WAAU;AAAA;AAAA,EACZ,CACF,CACF,CACF;AAEJ;AAEA,IAAM,QAAQ;;;ACrBd,OAAOC,UAAS,WAAW,SAAS,gBAAgB;AACpD,SAAS,mBAAAC,wBAAuB;AAChC,SAAS,WAAAC,UAAS,qBAAqB;AAexB,SAAR,aAA8B,MAA8B;AAlBnE;AAmBE,QAA2D,WAAnD,YAAU,CAAC,GAAG,gBAAgB,CAAC,EAnBzC,IAmB6D,IAAd,sBAAc,IAAd,CAArC,WAAc;AACtB,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,EAAE;AACzC,QAAM,CAAC,UAAU,WAAW,IAAI,SAAwC;AAAA,IACtE,OAAO;AAAA,IACP,OAAO;AAAA,EACT,CAAC;AAED,WAAS,WACP,EAAE,OAAO,MAAM,GACf,GACA;AACA,UAAM,gBAAgB,UAAU;AAChC,QAAI,eAAe;AACjB,qDAAgB;AAAA,QACd,QAAQ,EAAE,OAAO,MAAM,UAAU,KAAK;AAAA,MACxC;AAAA,IACF;AACA,gBAAY,EAAE,OAAO,MAAM,CAAC;AAC5B,QAAI,KAAK,aAAa;AACpB,UAAI,cAAe,MAAK,YAAY,KAAK;AACzC,UAAI,QAAS,MAAK,YAAY,EAAE,OAAO,MAAM,CAAC;AAAA,IAChD;AACA,eAAW,EAAE;AACb,eAAW,MAAM;AACf,MAAC,EAAE,OAA6B,KAAK;AAAA,IACvC,GAAG,GAAG;AAAA,EACR;AAEA,WAAS,gBAAgB,cAAsB;AAC7C,QAAI,cAAc;AAChB,YAAM,WAAW,iBAAiB;AAAA,QAChC,CAAC,EAAE,MAAM,MAAM,SAAS;AAAA,MAC1B;AACA,UAAI,SAAU,aAAY,QAAQ;AAAA,IACpC;AAAA,EACF;AAEA,QAAM,mBAAmB,QAAQ,MAAM;AACrC,QAAI,iBAAiB,WAAW,QAAQ,SAAS;AACjD,QAAI,CAAC;AACH,aAAO,cAAc,IAAI,CAAC,SAAS,EAAE,OAAO,KAAK,OAAO,IAAI,EAAE;AAChE,WAAO;AAAA,EACT,GAAG,CAAC,SAAS,aAAa,CAAC;AAE3B,QAAM,kBAAkB,QAAQ,MAAM;AACpC,WAAO,iBAAiB;AAAA,MACtB,CAAC,EAAE,OAAO,MAAM,OACb,QAAQ,IAAI,YAAY,EAAE,SAAS,QAAQ,YAAY,CAAC,MACxD,QAAQ,IAAI,YAAY,EAAE,SAAS,QAAQ,YAAY,CAAC;AAAA,IAC7D;AAAA,EACF,GAAG,CAAC,SAAS,gBAAgB,CAAC;AAE9B,YAAU,MAAM;AACd,cAAU,SAAS,gBAAgB,UAAU,KAAe;AAAA,EAC9D,GAAG,CAAC,UAAU,KAAK,CAAC;AAEpB,SACE,gBAAAC,OAAA,cAAC,SAAI,WAAW,gBAAgB,KAAK,UAAU,MAC5C,UAAU,SACT,gBAAAA,OAAA,cAAC,WAAM,WAAU,qBAAoB,SAAS,UAAU,aACrD,UAAU,KACb,GAEF,gBAAAA,OAAA,cAAC,SAAI,WAAW,GAAG,UAAU,SAAS,mCACpC,gBAAAA,OAAA;AAAA,IAAC;AAAA,oDACK,YACC,UAAU,WAAW,EAAE,UAAU,UAAU,SAAS,IAAI,CAAC,IAF/D;AAAA,MAGC,QAAO,eAAU,UAAV,YAAmB,SAAS;AAAA,MACnC,MAAK;AAAA;AAAA,EACP,GACA,gBAAAA,OAAA;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,MAAK;AAAA,MACL,UAAU,CAAC,MAAM,WAAW,EAAE,OAAO,KAAK;AAAA,MAC1C,WAAW,GAAG,UAAU,IAAI,YAAYC,MAAK,IAC3C,SAAS,SAAS,8CACpB;AAAA,MACA,aAAa,SAAS,QAAQ,SAAS,QAAQ,UAAU;AAAA;AAAA,EAC3D,GACA,gBAAAD,OAAA,cAAC,SAAI,WAAU,0BACZ,gBAAgB,UAAU,KAAK,WAAW,MACzC,gBAAAA,OAAA,cAAC,YAAO,UAAQ,MAAC,WAAU,4CAAyC,gBAEpE,GAED,gBAAgB,IAAI,CAAC,EAAE,OAAO,MAAM,MACnC,gBAAAA,OAAA;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,SAAS,CAAC,MAAM,WAAW,EAAE,OAAO,MAAM,GAAG,CAAC;AAAA,MAC9C,KAAK;AAAA,MACL,WAAU;AAAA;AAAA,IAET;AAAA,IACA,SAAS,SAAS,SACjB,gBAAAA,OAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,MAAMC;AAAA,QACN,WAAU;AAAA;AAAA,IACZ;AAAA,EAEJ,CACD,CACH,GACA,gBAAAH,OAAA,cAACE,kBAAA,EAAgB,MAAM,eAAe,WAAWE,cAAa,CAChE,CACF;AAEJ;AAEA,aAAa,WAAW;AAExB,SAAS,cACP,OACA,QACAC,OACA;AACA,QAAM,MAAM,SAAS,cAAc,UAAU,MAAM,IAAI;AACvD,MAAI,QAAQ,GAAG,KAAK;AACpB,QAAM,WAAWA,MAAK,KAAK,CAAC,SAAS,KAAK,SAAS,KAAK;AACxD,QAAM,KAAK,SAAS,cAAc,IAAI,MAAM,UAAU;AACtD,2BAAI,aAAa,eAAe,GAAG,qCAAU,KAAK;AACpD;AAEA,IAAMD,eAAc;AACpB,IAAMH,SAAQ;;;AC9Id,OAAOK,YAAW;AAQH,SAAR,QAAyB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA,WAAW;AACb,GAAsB;AACpB,WAAS,YAAY;AACnB,UAAM,UAAU;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AACA,WAAO,QAAQ,QAAQ;AAAA,EACzB;AACA,SACE,gBAAAA,OAAA,cAAC,SAAI,WAAU,cACb,gBAAAA,OAAA,cAAC,SAAI,WAAU,UAAQ,QAAS,GAChC,gBAAAA,OAAA,cAAC,UAAK,WAAW,gBAAgB,UAAU,CAAC,MAAK,IAAK,CACxD;AAEJ;AAEA,IAAM,MACJ;AACF,IAAM,SACJ;AACF,IAAM,QACJ;AACF,IAAM,OACJ;;;ACrCF,OAAOC,YAAW;AAOH,SAAR,aAA8B;AAAA,EACnC;AAAA,EACA;AACF,GAMI;AACF,SACE,gBAAAA,OAAA,cAAC,SAAI,WAAU,qBACZ,MAAM,IAAI,CAAC,EAAE,OAAO,MAAM,MACzB,gBAAAA,OAAA;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW,gBACT,MAAM,UAAU,QACZ,yBACA,mCACN;AAAA,MACA,SAAS,MAAM,MAAM,UAAU,KAAK;AAAA;AAAA,IAEnC;AAAA,EACH,CACD,CACH;AAEJ;;;AClCA,OAAOC,YAAW;AAOH,SAAR,KAAsB,EAAE,UAAU,UAAU,GAAmB;AACpE,SAAO,gBAAAA,OAAA,cAAC,SAAI,WAAW,QAAQ,SAAS,MAAK,QAAS;AACxD;AAEA,IAAM,SAAS,CAAC;AAAA,EACd;AAAA,EACA;AACF,MAGM;AACJ,SACE,gBAAAA,OAAA,cAAC,SAAI,WAAW,GAAG,SAAS,8CACzB,QACH;AAEJ;AAEA,KAAK,SAAS;;;ACzBd,OAAOC,YAAW;AAClB,SAAS,mBAAAC,wBAAuB;AAChC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAUQ,SAAR,MAAuB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AACF,GAAoB;AAClB,SACE,gBAAAD,OAAA,cAAC,SAAI,WAAW,wBAAwB,SAAS,MAC/C,gBAAAA,OAAA,cAAC,SAAI,WAAU,iBACb,gBAAAA,OAAA,cAAC,SAAI,OAAO,EAAE,YAAY,SAAS,IAAI,EAAE,GAAG,WAAW,QAAQ,GAC/D,gBAAAA,OAAA,cAAC,aACC,gBAAAA,OAAA,cAAC,OAAE,WAAU,kBAAgB,KAAM,GACnC,gBAAAA,OAAA,cAAC,OAAE,WAAU,wBAAsB,WAAY,CACjD,GACA,gBAAAA,OAAA,cAAC,SAAI,WAAW,4BAA4B,IAAI,IAAI,CACtD,GACA,gBAAAA,OAAA;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO,EAAE,YAAY,SAAS,IAAI,EAAE;AAAA;AAAA,EACrC,CACH;AAEJ;AAEA,IAAM,SAAS,CAAC;AAAA,EACd;AAAA,EACA;AAAA,EACA;AACF,MAIM;AACJ,SACE,gBAAAA,OAAA;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,iBAAiB,SAAS;AAAA,MACrC,OAAO,EAAE,YAAY,eAAe,IAAI,UAAU,SAAS,IAAI;AAAA;AAAA,IAE/D,gBAAAA,OAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAM,QAAQ,IAAI;AAAA,QAClB,WAAU;AAAA,QACV,OAAO,EAAE,OAAO,SAAS,IAAI,EAAE;AAAA;AAAA,IACjC;AAAA,IACA,gBAAAD,OAAA,cAAC,WAAG,IAAK;AAAA,EACX;AAEJ;AAEA,MAAM,SAAS;AAEf,SAAS,SAAS,MAAc;AAC9B,SAAO,eAAe,IAAI;AAC5B;AAEA,SAAS,QAAQ,MAAc;AAC7B,QAAM,UAAU;AAAA,IACd,SAAS;AAAA,IACT,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,SAAS;AAAA,EACX;AAEA,SAAO,QAAQ,IAAI;AACrB;AAEA,IAAM,SACJ;;;ACnFF,OAAOE,YAAW;AAClB,SAAS,oBAAoB;AAC7B,SAAS,mBAAAC,wBAAuB;AASjB,SAAR,WAA4B;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAyB;AACvB,QAAM,OAAO,MAAM,QAAQ,KAAK,EAAE;AAClC,SACE,gBAAAD,OAAA,cAAC,SAAI,WAAW,cAAc,SAAS,MACrC,gBAAAA,OAAA;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,MAAK;AAAA,MACL,gBAAgB;AAAA,MAChB,WAAU;AAAA;AAAA,EACZ,GACA,gBAAAA,OAAA,cAACC,kBAAA,EAAgB,MAAM,cAAc,WAAU,oBAAmB,GAClE,gBAAAD,OAAA,cAAC,WAAM,SAAS,MAAM,WAAU,uBAC7B,KACH,GACA,gBAAAA,OAAA,cAAC,SAAI,WAAU,sBACb,gBAAAA,OAAA,cAAC,SAAI,WAAU,2BAAyB,QAAS,CACnD,CACF;AAEJ;;;ACnCA,OAAOE,WAAS,aAAa,WAAAC,UAAS,YAAAC,iBAAgB;AACtD,SAAS,mBAAAC,wBAAuB;AAChC,SAAS,WAAAC,UAAS,mBAAmB;AAgBtB,SAAR,YAA6B,IAKV;AALU,eAClC;AAAA;AAAA,IACA;AAAA,IACA;AAAA,EArBF,IAkBoC,IAI/B,iBAJ+B,IAI/B;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,EAAE,UAAU,CAAC,GAAG,gBAAgB,CAAC,EAAE,IAAI;AAC7C,QAAM,CAAC,SAAS,UAAU,IAAIC,UAAS,EAAE;AAEzC,QAAM,mBAAmBC,SAAQ,MAAM;AACrC,UAAM,kBAAkB,WAAW,QAAQ,SAAS;AACpD,QAAI,CAAC;AACH,aAAO,cAAc,IAAI,CAAC,SAAS,EAAE,OAAO,KAAK,OAAO,IAAI,EAAE;AAChE,WAAO;AAAA,EACT,GAAG,CAAC,SAAS,aAAa,CAAC;AAE3B,WAAS,cAAc;AACrB,WAAO,iBAAiB;AAAA,MACtB,CAAC,EAAE,OAAAC,QAAO,MAAM,OACbA,SAAQ,IAAI,YAAY,EAAE,SAAS,QAAQ,YAAY,CAAC,MACxD,QAAQ,IAAI,YAAY,EAAE,SAAS,QAAQ,YAAY,CAAC;AAAA,IAC7D;AAAA,EACF;AAEA,WAAS,WAAW,EAAE,OAAAA,QAAO,MAAM,GAAqC;AAEtE,UAAM,OAAO,CAAC,SAAS;AACrB,YAAMC,eAAc,KAAK,KAAK,CAAC,SAAc,KAAK,SAAS,KAAK;AAChE,UAAIA,cAAa;AACf,eAAO,KAAK,OAAO,CAAC,SAAc,KAAK,SAAS,KAAK;AAAA,MACvD;AACA,aAAO,CAAC,GAAG,MAAM,EAAE,OAAAD,QAAO,MAAM,CAAC;AAAA,IACnC,CAAC;AAAA,EACH;AAEA,WAAS,YAAY,OAAe;AAClC,WAAO,MAAM,MAAM,KAAK,CAAC,SAAc,KAAK,SAAS,KAAK;AAAA,EAC5D;AAEA,QAAM,oBAAoB,YAAY,MAAM;AAC1C,UAAM,gBAAgB,MAAM,MAAM,UAAU,iBAAiB;AAC7D,UAAM,OAAO,gBAAgB,CAAC,IAAI,gBAAgB;AAAA,EACpD,GAAG,CAAC,MAAM,KAAK,CAAC;AAEhB,SACE,gBAAAE,QAAA,cAAC,SAAI,WAAW,gBAAgB,KAAK,UAAU,MAC5C,SACC,gBAAAA,QAAA,cAAC,WAAM,WAAU,qBAAoB,SAAS,aAC3C,KACH,GAEF,gBAAAA,QAAA,cAAC,SAAI,WAAU,kCACb,gBAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,MAAK;AAAA,MACL,aAAa,GAAG,MAAM,MAAM,MAAM;AAAA,MAClC,WAAW,GAAGC,MAAK,IACjB,MAAM,MAAM,SAAS,KACrB,8CACF;AAAA,MACA,UAAU,CAAC,MAAM,WAAW,EAAE,OAAO,KAAK;AAAA;AAAA,EAC5C,GACA,gBAAAD,QAAA,cAAC,SAAI,WAAU,mDACZ,YAAY,EAAE,UAAU,KAAK,WAAW,MACvC,gBAAAA,QAAA,cAAC,YAAO,UAAQ,MAAC,WAAU,4CAAyC,gBAEpE,GAED,YAAY,EAAE,IAAI,CAAC,EAAE,OAAAF,QAAO,MAAM,MACjC,gBAAAE,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,SAAS,MAAM,WAAW,EAAE,OAAAF,QAAO,MAAM,CAAC;AAAA,MAC1C,KAAK;AAAA,MACL,WAAU;AAAA;AAAA,IAETA;AAAA,IACA,YAAY,KAAK,KAChB,gBAAAE,QAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,MAAMC;AAAA,QACN,WAAU;AAAA;AAAA,IACZ;AAAA,EAEJ,CACD,CACH,GACA,gBAAAH,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MACV,SAAS;AAAA;AAAA,IAET,gBAAAA,QAAA,cAACE,kBAAA,EAAgB,MAAM,aAAa,WAAWE,cAAa;AAAA,EAC9D,CACF,CACF;AAEJ;AACA,IAAMA,eAAc;AACpB,IAAMH,SAAQ;;;AClHd,OAAOI,aAAW;AAEH,SAAR,YACL,MACA;AACA,SACE,gBAAAC,QAAA,cAAC,SAAI,WAAU,gCACb,gBAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,GAAG,KAAK,MAAM,cAAc;AAAA,MACrC,WAAU;AAAA;AAAA,IAEV,gBAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,SACC,OAFL;AAAA,QAGC,MAAK;AAAA,QACL,WAAU;AAAA;AAAA,IACZ;AAAA,IACA,gBAAAA,QAAA,cAAC,UAAK,WAAU,wBAAuB;AAAA,EACzC,CACF;AAEJ;;;ACtBA,OAAOC,WAAS,YAAAC,iBAAgB;AAIhC,IAAM,OAAO;AAAA,EACX,EAAE,OAAO,YAAY,OAAO,UAAU;AAAA,EACtC,EAAE,OAAO,YAAY,OAAO,UAAU;AAAA,EACtC,EAAE,OAAO,YAAY,OAAO,UAAU;AACxC;AACA,IAAM,aAAa,CAAC,WAAW,WAAW,SAAS;AAEpC,SAAR,YAA6B;AAClC,QAAM,CAAC,cAAc,eAAe,IAAIC,UAEtC,CAAC,CAAC;AACJ,QAAM,CAAC,KAAK,MAAM,IAAIA,UAAS,EAAE,OAAO,IAAI,OAAO,GAAG,CAAC;AAEvD,WAAS,YAAY,MAAc;AACjC,UAAM,WAAW,KAAK,KAAK,CAAC,EAAE,MAAM,MAAM,SAAS,IAAI;AACvD,gBAAY,OAAO,QAAQ;AAAA,EAC7B;AAEA,SACE,gBAAAC,QAAA,cAAC,SAAI,WAAU,kCACb,gBAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,eAAe;AAAA,MACf,OAAO,EAAE,OAAO,cAAc,QAAQ,gBAAgB;AAAA;AAAA,EACxD,GACA,gBAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,MAAK;AAAA,MACL,eAAe;AAAA,MACf,aAAY;AAAA,MACZ,OAAO,IAAI;AAAA;AAAA,EACb,CACF;AAEJ;;;ACtCA,OAAOC,aAAW;AACH,SAAR,MAAuB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,SACE,gBAAAA,QAAA,cAAC,SAAI,WAAU,oBACb,gBAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,YAAY,eAAe,IAAI;AAAA,MACjC;AAAA,MACA,WAAW,SAAS,SAAS;AAAA;AAAA,IAE5B;AAAA,EACH,CACF;AAEJ;;;ACtBA,OAAOC,aAAW;AACH,SAAR,SAA0B,EAAE,UAAU,GAA2B;AACtE,SACE,gBAAAA,QAAA,cAAC,SAAI,WAAW,GAAG,SAAS,eAC1B,gBAAAA,QAAA,cAAC,UAAK,WAAU,iCAAgC,CAClD;AAEJ;;;ACPA,OAAOC,aAAW;AAEH,SAAR,aAA8B;AACnC,SAAO,gBAAAC,QAAA,cAAC,WAAI;AACd;AAEA,IAAM,gBAAgB,CAAC,UAKjB;AACJ,QAAM,YAAY,MAAM,mBAAmB;AAC3C,WAAS,eAAe,MAAc;AACpC,WAAO,SAAS,MAAM,YAClB,+DACA;AAAA,EACN;AAEA,SACE,gBAAAA,QAAA,cAAC,SAAI,WAAW,gBAAgB,MAAM,UAAU,MAC7C,MAAM,KAAK,IAAI,CAAC,SACf,gBAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,KAAK,KAAK;AAAA,MACV,WAAW,GAAG,YAAY,IAAI,eAAe,KAAK,IAAI,CAAC;AAAA,OACnD;AAAA,IAEH,KAAK;AAAA,EACR,CACD,CACH;AAEJ;AAEA,WAAW,MAAM;AAEjB,IAAM,eACJ;;;ACrCF,OAAOC,aAAW;AAEH,SAAR,aAA8B;AAAA,EACnC,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA,YAAY;AACd,GAQG;AACD,SACE,gBAAAA,QAAA,cAAC,SAAI,WAAU,yBACb,gBAAAA,QAAA,cAAC,SAAI,WAAU,wBACb,gBAAAA,QAAA,cAAC,SAAI,WAAW,WACd,gBAAAA,QAAA,cAAC,SAAI,WAAW,WAAW,IAAI,WAAW,GAC1C,gBAAAA,QAAA,cAAC,aACC,gBAAAA,QAAA,cAAC,QAAG,WAAU,mBAAiB,KAAM,GACrC,gBAAAA,QAAA,cAAC,OAAE,WAAW,sBAAqB,IAAK,CAC1C,CACF,GACA,gBAAAA,QAAA,cAAC,SAAI,WAAU,0BACZ,mBACC,gBAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,MAAK;AAAA,MACL,WAAU;AAAA,MACV,OAAO,EAAE,OAAO,eAAe,IAAI,IAAI;AAAA;AAAA,IAEtC;AAAA,EACH,GAEF,gBAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,MAAM;AACb,mBAAW;AACX,2BAAmB,gBAAgB;AAAA,MACrC;AAAA,MACA,WAAU;AAAA,MACV,OAAO;AAAA,QACL,YAAY,eAAe,IAAI;AAAA,QAC/B,QAAQ,yBAAyB,IAAI;AAAA,MACvC;AAAA;AAAA,IAEC;AAAA,EACH,CACF,CACF,CACF;AAEJ;AAEA,IAAM,UACJ;AACF,IAAM,qBACJ;","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"]}
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\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\r\n icon?: IconProp;\r\n label?: string;\r\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\r\n isLoading?: boolean;\r\n};\r\n\r\nexport default function Button({\r\n label,\r\n icon,\r\n isLoading,\r\n btnType,\r\n className,\r\n ...rest\r\n}: Readonly<Button>) {\r\n const buttonIcon = isLoading ? faCircleNotch : icon;\r\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\r\n return (\r\n <button\r\n {...rest}\r\n disabled={rest.disabled || isLoading}\r\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\r\n btnType == \"secondary\" && \"btn__secondary\"\r\n } btn__primary ${label ? \"\" : \"!p-[0.87rem]\"}`}\r\n >\r\n {buttonIcon && icon && (\r\n <FontAwesomeIcon\r\n icon={buttonIcon}\r\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\r\n isLoading && \"animate-spin\"\r\n }`}\r\n />\r\n )}\r\n {isLoading ? loadingLabel : label}\r\n </button>\r\n );\r\n}\r\n\r\nconst IconButton = (props: Readonly<Button>) => {\r\n return (\r\n <button\r\n {...props}\r\n className={`${props.className} ${\r\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\r\n } icon__button`}\r\n >\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n {props.label && (\r\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\r\n {props.label}\r\n </span>\r\n )}\r\n </button>\r\n );\r\n};\r\n\r\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\r\n return (\r\n <div className=\"icon__button_group\">\r\n {list.map((props, idx) => (\r\n <button key={idx + 1} className={getBtnClass(idx)} {...props}>\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n </button>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\r\n return (\r\n <a href={href} className={`sso-button ${btnclass}`}>\r\n <img\r\n alt=\"logo\"\r\n className=\"sso-icon\"\r\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\r\n />{\" \"}\r\n Login dengan SSO\r\n </a>\r\n );\r\n};\r\n\r\nButton.IconButton = IconButton;\r\nButton.IconButtonGroup = IconButtonGroup;\r\nButton.SSOButton = SSOButton;\r\n\r\nfunction getBtnClass(idx: number) {\r\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${\r\n idx == 0 ? \"\" : \"border-l border-l-[var(--color-border)]\"\r\n }`;\r\n}\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nconst input__icon =\r\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)]\";\r\n\r\nexport default function TextInput({\r\n label,\r\n labelFor,\r\n icon,\r\n outerclass,\r\n ...attr\r\n}: Readonly<\r\n React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelFor?: string;\r\n icon?: IconProp;\r\n outerclass?: string;\r\n }\r\n>) {\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label htmlFor={labelFor} className=\"text-input__label\">\r\n {label}\r\n </label>\r\n )}\r\n <div className={`text-input__wrapper overflow-hidden ${attr.className}`}>\r\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\r\n <input\r\n {...attr}\r\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"}`}\r\n />\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\nexport default function Slider(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <div className=\"slider__wrapper group relative\">\r\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\r\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[0.7rem] translate-x-[0.2px]\"\r\n />\r\n </label>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst input = \"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\";\r\n","\"use client\";\r\nimport React, { useEffect, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelHtml?: string;\r\n placeholder?: string;\r\n stateaction?: (param: any) => void;\r\n outerclass?: string;\r\n options?: {\r\n label: string;\r\n value: string;\r\n }[];\r\n stringOptions?: string[];\r\n};\r\n\r\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\r\n const { options = [], stringOptions = [], ...attrInput } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const [selected, setSelected] = useState<{ label: string; value: any }>({\r\n label: \"\",\r\n value: \"\",\r\n });\r\n\r\n function selectItem(\r\n { label, value }: { label: string; value: any },\r\n e: React.MouseEvent<HTMLButtonElement>\r\n ) {\r\n const triggerManual = attrInput.onChange;\r\n if (triggerManual) {\r\n triggerManual?.({\r\n target: { value, name: attrInput.name },\r\n } as React.ChangeEvent<HTMLInputElement>);\r\n }\r\n setSelected({ label, value });\r\n if (attr.stateaction) {\r\n if (stringOptions) attr.stateaction(value);\r\n if (options) attr.stateaction({ label, value });\r\n }\r\n setKeyword(\"\");\r\n setTimeout(() => {\r\n (e.target as HTMLButtonElement).blur();\r\n }, 250);\r\n }\r\n\r\n function autoUpdateValue(updatedValue: string) {\r\n if (updatedValue) {\r\n const filtered = availableOptions.find(\r\n ({ value }) => value == updatedValue\r\n );\r\n if (filtered) setSelected(filtered);\r\n }\r\n }\r\n\r\n const availableOptions = useMemo(() => {\r\n let defaultOptions = options && options.length > 0;\r\n if (!defaultOptions)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n const filteredOptions = useMemo(() => {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }, [keyword, availableOptions]);\r\n\r\n useEffect(() => {\r\n attrInput.value && autoUpdateValue(attrInput.value as string);\r\n }, [attrInput.value]);\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div className={`${attrInput.className} text-input__wrapper relative`}>\r\n <input\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n type=\"hidden\"\r\n />\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${input} ${\r\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n />\r\n <div className=\"select-item__wrapper\">\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nSingleSelect.autoFill = autoFillInput;\r\n\r\nfunction autoFillInput(\r\n value: string,\r\n elName: string,\r\n list: { label: string; value: string }[]\r\n) {\r\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\r\n inp.value = `${value}`;\r\n const filtered = list.find((item) => item.value == value);\r\n const el = document.querySelector(`.${elName}-keyword`);\r\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\r\n}\r\n\r\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","import React from \"react\";\r\n\r\ntype Tooltip = {\r\n children: React.ReactNode;\r\n text: string;\r\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\r\n};\r\n\r\nexport default function Tooltip({\r\n children,\r\n text,\r\n position = \"top\",\r\n}: Readonly<Tooltip>) {\r\n function getAccent() {\r\n const mapping = {\r\n top,\r\n bottom,\r\n left,\r\n right,\r\n };\r\n return mapping[position];\r\n }\r\n return (\r\n <div className=\"relative\">\r\n <div className=\"peer\">{children}</div>\r\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\r\n </div>\r\n );\r\n}\r\n\r\nconst top =\r\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\r\nconst bottom =\r\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\r\nconst right =\r\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\r\nconst left =\r\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\r\n","import React from \"react\";\r\n\r\ntype Option = {\r\n label: string;\r\n value: string;\r\n};\r\n\r\nexport default function NavTabClient({\r\n items,\r\n state,\r\n}: Readonly<{\r\n items: Option[];\r\n state: {\r\n active: string;\r\n setActive: (val: string) => void;\r\n };\r\n}>) {\r\n return (\r\n <nav className=\"navtab__wrapper\">\r\n {items.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n className={`navtab__item ${\r\n state.active == value\r\n ? \"navtab__item__active\"\r\n : \"hover:bg-[var(--color-border)]/50\"\r\n }`}\r\n onClick={() => state.setActive(value)}\r\n >\r\n {label}\r\n </button>\r\n ))}\r\n </nav>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\ntype Card = {\r\n children: React.ReactNode;\r\n className?: string;\r\n};\r\n\r\nexport default function Card({ children, className }: Readonly<Card>) {\r\n return <div className={`card ${className}`}>{children}</div>;\r\n}\r\n\r\nconst Footer = ({\r\n className,\r\n children,\r\n}: {\r\n className?: string;\r\n children?: React.ReactNode;\r\n}) => {\r\n return (\r\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\r\n {children}\r\n </div>\r\n );\r\n};\r\n\r\nCard.Footer = Footer;\r\n","import React from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {\r\n faCheckCircle,\r\n faInfoCircle,\r\n faQuestionCircle,\r\n faXmarkCircle,\r\n} from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\r\ntype Toast = {\r\n title: string;\r\n className?: string;\r\n description: string;\r\n type: ToastType;\r\n};\r\n\r\nexport default function Toast({\r\n title,\r\n description,\r\n type = \"info\",\r\n className,\r\n}: Readonly<Toast>) {\r\n return (\r\n <div className={`toast__wrapper group ${className}`}>\r\n <div className=\"toast__body\">\r\n <div style={{ background: getColor(type) }} className={bullet}></div>\r\n <div>\r\n <p className=\"toast__title\">{title}</p>\r\n <p className=\"toast__description\">{description}</p>\r\n </div>\r\n <div className={`toast__icon toast__icon__${type}`}></div>\r\n </div>\r\n <p\r\n className=\"toast__bar toast-bar-animate\"\r\n style={{ background: getColor(type) }}\r\n ></p>\r\n </div>\r\n );\r\n}\r\n\r\nconst Inline = ({\r\n className,\r\n text,\r\n type,\r\n}: {\r\n className?: string;\r\n text: string;\r\n type: ToastType;\r\n}) => {\r\n return (\r\n <div\r\n className={`toast__inline ${className}`}\r\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\r\n >\r\n <FontAwesomeIcon\r\n icon={getIcon(type)}\r\n className=\"text-[1.3rem]\"\r\n style={{ color: getColor(type) }}\r\n />\r\n <p>{text}</p>\r\n </div>\r\n );\r\n};\r\n\r\nToast.Inline = Inline;\r\n\r\nfunction getColor(type: string) {\r\n return `var(--color-${type})`;\r\n}\r\n\r\nfunction getIcon(type: string) {\r\n const mapping = {\r\n warning: faQuestionCircle,\r\n info: faInfoCircle,\r\n danger: faXmarkCircle,\r\n success: faCheckCircle,\r\n };\r\n //@ts-expect-error call object using array index\r\n return mapping[type];\r\n}\r\n\r\nconst bullet =\r\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\r\n","import React from \"react\";\r\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\ntype Expandable = {\r\n children: React.ReactNode;\r\n title: string;\r\n className?: string;\r\n isOpen?: boolean;\r\n};\r\n\r\nexport default function Expandable({\r\n children,\r\n title,\r\n className,\r\n isOpen,\r\n}: Readonly<Expandable>) {\r\n const name = title.replace(\" \", \"\");\r\n return (\r\n <div className={`expandable ${className}`}>\r\n <input\r\n id={name}\r\n type=\"checkbox\"\r\n defaultChecked={isOpen}\r\n className=\"opacity-[0] peer absolute top-0 ex-title\"\r\n />\r\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\r\n <label htmlFor={name} className=\"expandable__title\">\r\n {title}\r\n </label>\r\n <div className=\"expandable__body\">\r\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React, { useCallback, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Option = {\r\n value: string;\r\n label: string;\r\n};\r\n\r\ntype MultiSelect = {\r\n label?: string;\r\n labelHtml?: string;\r\n outerclass?: string;\r\n options?: Option[];\r\n stringOptions?: string[];\r\n state: { value: Option[]; select: (newVal: Option[]) => void };\r\n};\r\n\r\nexport default function MultiSelect({\r\n state,\r\n label,\r\n labelHtml,\r\n ...attr\r\n}: Readonly<MultiSelect>) {\r\n const { options = [], stringOptions = [] } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n\r\n const availableOptions = useMemo(() => {\r\n const isDefaultOption = options && options.length > 0;\r\n if (!isDefaultOption)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n function getFiltered() {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }\r\n\r\n function selectItem({ label, value }: { label: string; value: string }) {\r\n //@ts-expect-error: avoid check\r\n state.select((prev) => {\r\n const isItemExist = prev.find((item: any) => item.value == value);\r\n if (isItemExist) {\r\n return prev.filter((item: any) => item.value != value);\r\n }\r\n return [...prev, { label, value }];\r\n });\r\n }\r\n\r\n function isItemExist(value: string) {\r\n return state.value.find((item: any) => item.value == value);\r\n }\r\n\r\n const selectUnSelectAll = useCallback(() => {\r\n const isAllSelected = state.value.length == availableOptions.length;\r\n state.select(isAllSelected ? [] : availableOptions);\r\n }, [state.value]);\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label className=\"text-input__label\" htmlFor={labelHtml}>\r\n {label}\r\n </label>\r\n )}\r\n <div className=\"text-input__wrapper relative\">\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n placeholder={`${state.value.length} Dipilih`}\r\n className={`${input} ${\r\n state.value.length > 0 &&\r\n \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n />\r\n <div className=\"select-item__wrapper select-multiple__wrapper\">\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <button\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n onClick={selectUnSelectAll}\r\n >\r\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\r\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","\"use client\";\r\nimport React from \"react\";\r\n\r\nexport default function ThemeToggle(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <label\r\n htmlFor={`${attr.id || \"theme-toggle\"}`}\r\n className=\"slider__wrapper slider-theme slider-theme-light relative\"\r\n >\r\n <input\r\n id=\"theme-toggle\"\r\n {...attr}\r\n type=\"checkbox\"\r\n className=\"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\"\r\n />\r\n <span className=\"slider-theme__bullet\"></span>\r\n </label>\r\n </div>\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport MultiSelect from \"./MultiSelect\";\r\nimport SingleSelect from \"./SingleSelect\";\r\n\r\nconst list = [\r\n { label: \"Option 1\", value: \"option1\" },\r\n { label: \"Option 2\", value: \"option2\" },\r\n { label: \"Option 3\", value: \"option3\" },\r\n];\r\nconst stringList = [\"option1\", \"option2\", \"option3\"];\r\n\r\nexport default function Dashboard() {\r\n const [selectedItem, setSelectedItem] = useState<\r\n { label: string; value: string }[]\r\n >([]);\r\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\r\n\r\n function updateState(item: string) {\r\n const filtered = list.find(({ value }) => value == item);\r\n filtered && setSel(filtered);\r\n }\r\n\r\n return (\r\n <div className=\"flex items-center gap-[1rem]\">\r\n <MultiSelect\r\n label=\"Multi Select\"\r\n stringOptions={stringList}\r\n state={{ value: selectedItem, select: setSelectedItem }}\r\n />\r\n <SingleSelect\r\n label=\"Single Select\"\r\n name=\"newinput\"\r\n stringOptions={stringList}\r\n placeholder=\"-- Pilih Status --\"\r\n value={sel.value}\r\n />\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Badge({\r\n text,\r\n type,\r\n className,\r\n}: {\r\n text: string;\r\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\r\n className?: string;\r\n}) {\r\n return (\r\n <div className=\"badge__wrapper\">\r\n <span\r\n style={{\r\n background: `var(--color-${type})`,\r\n }}\r\n className={`badge ${className}`}\r\n >\r\n {text}\r\n </span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Skeleton({ className }: { className?: string }) {\r\n return (\r\n <div className={`${className} skeleton`}>\r\n <span className=\"skeleton__item skeleton-slide\"></span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nexport default function Navigation() {\r\n return <nav></nav>;\r\n}\r\n\r\nconst URLNavigation = (props: {\r\n list: { label: string; href: string }[];\r\n activeUrl: string;\r\n outerclass?: string;\r\n CustomComponent?: React.ElementType;\r\n}) => {\r\n const Component = props.CustomComponent || \"a\";\r\n function getAnchorClass(href: string) {\r\n return href === props.activeUrl\r\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\r\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\r\n }\r\n\r\n return (\r\n <nav className={`nav__wrapper ${props.outerclass}`}>\r\n {props.list.map((prop) => (\r\n <Component\r\n key={prop.href}\r\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\r\n {...prop}\r\n >\r\n {prop.label}\r\n </Component>\r\n ))}\r\n </nav>\r\n );\r\n};\r\n\r\nNavigation.URL = URLNavigation;\r\n\r\nconst base__anchor =\r\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\r\n","import React from \"react\";\r\n\r\nexport default function Confirmation({\r\n type = \"warning\",\r\n text,\r\n title,\r\n secondaryAction,\r\n secondaryLabel = \"Tidak\",\r\n mainAction,\r\n mainLabel = \"Ya\",\r\n}: {\r\n mainAction: () => void;\r\n secondaryAction?: () => void;\r\n mainLabel?: string;\r\n secondaryLabel?: string;\r\n title: string;\r\n text: string;\r\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\r\n}) {\r\n return (\r\n <div className=\"confirmation__outer\">\r\n <div className=\"confirmation__card\">\r\n <div className={wrapper}>\r\n <div className={`baloon__${type} baloon`}></div>\r\n <div>\r\n <h3 className=\"font-semibold\">{title}</h3>\r\n <p className={confirmation__text}>{text}</p>\r\n </div>\r\n </div>\r\n <div className=\"confirmation__footer\">\r\n {secondaryAction && (\r\n <button\r\n onClick={secondaryAction}\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n style={{ color: `var(--color-${type})` }}\r\n >\r\n {secondaryLabel}\r\n </button>\r\n )}\r\n <button\r\n onClick={() => {\r\n mainAction();\r\n secondaryAction && secondaryAction();\r\n }}\r\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\r\n style={{\r\n background: `var(--color-${type})`,\r\n border: `1px solid var(--color-${type})`,\r\n }}\r\n >\r\n {mainLabel}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst wrapper =\r\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\r\nconst confirmation__text =\r\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\r\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/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.7.2",
38
+ "version": "1.7.3",
39
39
  "description": "Collection of reusable components for any PPA web applications",
40
40
  "main": "dist/index.cjs",
41
41
  "module": "dist/index.js",