@safestrong/ppa-component-library 1.8.0 → 1.8.1

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.
Files changed (5) hide show
  1. package/dist/index.js +4 -2
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.mjs +4 -2
  4. package/dist/index.mjs.map +1 -1
  5. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -228,7 +228,6 @@ function SingleSelect(attr) {
228
228
  value: ""
229
229
  });
230
230
  function selectItem({ label, value }, e) {
231
- var _a2;
232
231
  const triggerManual = attrInput.onChange;
233
232
  if (triggerManual) {
234
233
  triggerManual == null ? void 0 : triggerManual({
@@ -236,7 +235,10 @@ function SingleSelect(attr) {
236
235
  });
237
236
  }
238
237
  setSelected({ label, value });
239
- (_a2 = attr.stateaction) == null ? void 0 : _a2.call(attr, stringOptions ? value : { label, value });
238
+ if (attr.stateaction) {
239
+ if ((options == null ? void 0 : options.length) > 0) attr.stateaction({ label, value });
240
+ if ((stringOptions == null ? void 0 : stringOptions.length) > 0) attr.stateaction(value);
241
+ }
240
242
  setKeyword("");
241
243
  e.currentTarget.blur();
242
244
  }
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 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 isdarkmode,\r\n inputclass,\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 isdarkmode?: boolean;\r\n inputclass?: string;\r\n }\r\n>) {\r\n function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label\r\n htmlFor={labelFor}\r\n className=\"text-input__label\"\r\n style={{\r\n color: getThemedClass('-text-secondary')\r\n }}\r\n >\r\n {label}\r\n </label>\r\n )}\r\n <div\r\n className={`text-input__wrapper overflow-hidden ${attr.className}`}\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\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]\"} ${inputclass}`}\r\n style={{\r\n color: getThemedClass('-text-primary')\r\n }}\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 isdarkmode?: boolean;\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 = [], isdarkmode, ...attrInput } = attr;\r\n const inputValue = attrInput.value\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 attr.stateaction?.(stringOptions ? value : {label, value})\r\n setKeyword(\"\");\r\n e.currentTarget.blur()\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 inputValue && autoUpdateValue(inputValue as string);\r\n }, [inputValue]);\r\n\r\n function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\r\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label\r\n className=\"text-input__label\"\r\n htmlFor={attrInput.labelHtml}\r\n style={{color: getThemedClass('-text-secondary')}}\r\n >\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div\r\n className={`${attrInput.className} text-input__wrapper relative`}\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n <input\r\n type=\"hidden\"\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n />\r\n <input\r\n type=\"search\"\r\n value={keyword}\r\n autoComplete=\"off\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${placeholderClass}`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n style={{\r\n color: selected.value ? getThemedClass('-text-primary') : undefined\r\n }}\r\n />\r\n <div\r\n className=\"select-item__wrapper\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button\r\n disabled\r\n className=\"select-item\"\r\n style={{ color: 'var(--color-danger)' }}\r\n >\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n type=\"button\"\r\n className={`select-item ${optionHoverClass}`}\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n style={{ color: 'var(--color-info)' }}\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} style={{ color: getThemedClass('-icon-input'), paddingRight: '0.7rem' }} />\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 = \"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 isdarkmode?: boolean;\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 = [], isdarkmode } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\r\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\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 function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label\r\n htmlFor={labelHtml}\r\n className=\"text-input__label\"\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n </label>\r\n )}\r\n <div\r\n className=\"text-input__wrapper relative\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n <input\r\n type=\"search\"\r\n value={keyword}\r\n autoComplete=\"off\"\r\n className={`${input} ${placeholderClass}`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n placeholder={`${state.value.length} Dipilih`}\r\n style={{\r\n color: state.value.length > 0 ? getThemedClass('-text-primary') : undefined\r\n }}\r\n />\r\n <div\r\n className=\"select-item__wrapper select-multiple__wrapper\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button\r\n disabled\r\n className=\"select-item\"\r\n style={{ color: 'var(--color-danger)' }}\r\n >\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n key={value}\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n className={`select-item ${optionHoverClass}`}\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n style={{ color: 'var(--color-info)' }}\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\r\n icon={faListCheck}\r\n style={{\r\n color: getThemedClass('-icon-input'),\r\n paddingRight: '0.7rem',\r\n fontSize: '1.2rem'\r\n }}\r\n />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\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 isdarkmode={true}\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","_a","input","React","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","input","label","isItemExist","React","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 isdarkmode,\r\n inputclass,\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 isdarkmode?: boolean;\r\n inputclass?: string;\r\n }\r\n>) {\r\n function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label\r\n htmlFor={labelFor}\r\n className=\"text-input__label\"\r\n style={{\r\n color: getThemedClass('-text-secondary')\r\n }}\r\n >\r\n {label}\r\n </label>\r\n )}\r\n <div\r\n className={`text-input__wrapper overflow-hidden ${attr.className}`}\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\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]\"} ${inputclass}`}\r\n style={{\r\n color: getThemedClass('-text-primary')\r\n }}\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 isdarkmode?: boolean;\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 = [], isdarkmode, ...attrInput } = attr;\r\n const inputValue = attrInput.value\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\r\n if (attr.stateaction) {\r\n if (options?.length > 0) attr.stateaction({ label, value });\r\n if (stringOptions?.length > 0) attr.stateaction(value);\r\n }\r\n\r\n setKeyword(\"\");\r\n e.currentTarget.blur();\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 inputValue && autoUpdateValue(inputValue as string);\r\n }, [inputValue]);\r\n\r\n function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\r\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label\r\n className=\"text-input__label\"\r\n htmlFor={attrInput.labelHtml}\r\n style={{color: getThemedClass('-text-secondary')}}\r\n >\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div\r\n className={`${attrInput.className} text-input__wrapper relative`}\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n <input\r\n type=\"hidden\"\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n />\r\n <input\r\n type=\"search\"\r\n value={keyword}\r\n autoComplete=\"off\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${placeholderClass}`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n style={{\r\n color: selected.value ? getThemedClass('-text-primary') : undefined\r\n }}\r\n />\r\n <div\r\n className=\"select-item__wrapper\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button\r\n disabled\r\n className=\"select-item\"\r\n style={{ color: 'var(--color-danger)' }}\r\n >\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n type=\"button\"\r\n className={`select-item ${optionHoverClass}`}\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n style={{ color: 'var(--color-info)' }}\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} style={{ color: getThemedClass('-icon-input'), paddingRight: '0.7rem' }} />\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 = \"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 isdarkmode?: boolean;\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 = [], isdarkmode } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\r\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\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 function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label\r\n htmlFor={labelHtml}\r\n className=\"text-input__label\"\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n </label>\r\n )}\r\n <div\r\n className=\"text-input__wrapper relative\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n <input\r\n type=\"search\"\r\n value={keyword}\r\n autoComplete=\"off\"\r\n className={`${input} ${placeholderClass}`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n placeholder={`${state.value.length} Dipilih`}\r\n style={{\r\n color: state.value.length > 0 ? getThemedClass('-text-primary') : undefined\r\n }}\r\n />\r\n <div\r\n className=\"select-item__wrapper select-multiple__wrapper\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button\r\n disabled\r\n className=\"select-item\"\r\n style={{ color: 'var(--color-danger)' }}\r\n >\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n key={value}\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n className={`select-item ${optionHoverClass}`}\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n style={{ color: 'var(--color-info)' }}\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\r\n icon={faListCheck}\r\n style={{\r\n color: getThemedClass('-icon-input'),\r\n paddingRight: '0.7rem',\r\n fontSize: '1.2rem'\r\n }}\r\n />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\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 isdarkmode={true}\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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAkB;AAElB,+BAAgC;AAChC,kCAA8B;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,4CAAgB;AAC/C,QAAM,eAAe,SAAS,YAAY,kBAAkB;AAC5D,SACE,6BAAAA,QAAA;AAAA,IAAC;AAAA,qCACK,OADL;AAAA,MAEC,UAAU,KAAK,YAAY;AAAA,MAC3B,WAAW,GAAG,CAAC,QAAQ,cAAc,IAAI,SAAS,IAChD,WAAW,eAAe,gBAC5B,iBAAiB,QAAQ,KAAK,cAAc;AAAA;AAAA,IAE3C,cAAc,QACb,6BAAAA,QAAA;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,6BAAAA,QAAA;AAAA,IAAC;AAAA,qCACK,QADL;AAAA,MAEC,WAAW,GAAG,MAAM,SAAS,IAC3B,MAAM,QAAQ,gCAAgC,EAChD;AAAA;AAAA,IAEC,MAAM,QAAQ,6BAAAA,QAAA,cAAC,4CAAgB,MAAM,MAAM,MAAM;AAAA,IACjD,MAAM,SACL,6BAAAA,QAAA,cAAC,UAAK,WAAU,0CACb,MAAM,KACT;AAAA,EAEJ;AAEJ;AAEA,IAAM,kBAAkB,CAAC,EAAE,MAAAC,MAAK,MAA0B;AACxD,SACE,6BAAAD,QAAA,cAAC,SAAI,WAAU,wBACZC,MAAK,IAAI,CAAC,OAAO,QAChB,6BAAAD,QAAA,cAAC,2BAAO,KAAK,MAAM,GAAG,WAAW,YAAY,GAAG,KAAO,QACpD,MAAM,QAAQ,6BAAAA,QAAA,cAAC,4CAAgB,MAAM,MAAM,MAAM,CACpD,CACD,CACH;AAEJ;AAEA,IAAM,YAAY,CAAC,EAAE,MAAM,SAAS,MAA2C;AAC7E,SACE,6BAAAA,QAAA,cAAC,OAAE,MAAY,WAAW,cAAc,QAAQ,MAC9C,6BAAAA,QAAA;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;;;AC9FA,IAAAE,gBAAkB;AAElB,IAAAC,4BAAgC;AAChC,IAAM,cACJ;AAEa,SAAR,UAA2B,IAiB/B;AAjB+B,eAChC;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAZF,IAMkC,IAO7B,iBAP6B,IAO7B;AAAA,IANH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAYA,WAAS,eAAe,QAAe;AACrC,WAAO,cAAc,aAAa,UAAQ,EAAE,GAAG,MAAM;AAAA,EACvD;AACA,SACE,8BAAAC,QAAA,cAAC,SAAI,WAAW,SAAS,UAAU,aAChC,SACC,8BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,WAAU;AAAA,MACV,OAAO;AAAA,QACL,OAAO,eAAe,iBAAiB;AAAA,MACzC;AAAA;AAAA,IAEC;AAAA,EACH,GAEF,8BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,uCAAuC,KAAK,SAAS;AAAA,MAChE,OAAO;AAAA,QACL,aAAa,eAAe,SAAS;AAAA,QACrC,YAAY,eAAe,aAAa;AAAA,MAC1C;AAAA;AAAA,IAEC,QAAQ,8BAAAA,QAAA,cAAC,6CAAgB,MAAY,WAAW,aAAa;AAAA,IAC9D,8BAAAA,QAAA;AAAA,MAAC;AAAA,uCACK,OADL;AAAA,QAEC,WAAW,qBAAqB,QAAQ,cAAc,IAAI,UAAU;AAAA,QACpE,OAAO;AAAA,UACL,OAAO,eAAe,eAAe;AAAA,QACvC;AAAA;AAAA,IACF;AAAA,EACF,CACF;AAEJ;;;AC1DA,IAAAC,gBAAkB;AAClB,IAAAC,+BAAwB;AACxB,IAAAC,4BAAgC;AAEjB,SAAR,OACL,MACA;AACA,SACE,8BAAAC,QAAA,cAAC,SAAI,WAAU,gCACb,8BAAAA,QAAA,cAAC,SAAI,WAAU,oCACb,8BAAAA,QAAA,cAAC,0BAAM,IAAG,UAAS,MAAK,YAAW,WAAW,SAAW,KAAM,GAC/D,8BAAAA,QAAA,cAAC,WAAM,SAAS,KAAK,MAAM,UAAU,WAAU,YAC7C,8BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,WAAU;AAAA;AAAA,EACZ,CACF,CACF,CACF;AAEJ;AAEA,IAAM,QAAQ;;;ACrBd,IAAAC,gBAAoD;AACpD,IAAAC,4BAAgC;AAChC,IAAAC,+BAAuC;AAgBxB,SAAR,aAA8B,MAA8B;AAnBnE;AAoBE,QAAuE,WAA/D,YAAU,CAAC,GAAG,gBAAgB,CAAC,GAAG,WApB5C,IAoByE,IAAd,sBAAc,IAAd,CAAjD,WAAc,iBAAoB;AAC1C,QAAM,aAAa,UAAU;AAC7B,QAAM,CAAC,SAAS,UAAU,QAAI,wBAAS,EAAE;AACzC,QAAM,CAAC,UAAU,WAAW,QAAI,wBAAwC;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;AAE5B,QAAI,KAAK,aAAa;AACpB,WAAI,mCAAS,UAAS,EAAG,MAAK,YAAY,EAAE,OAAO,MAAM,CAAC;AAC1D,WAAI,+CAAe,UAAS,EAAG,MAAK,YAAY,KAAK;AAAA,IACvD;AAEA,eAAW,EAAE;AACb,MAAE,cAAc,KAAK;AAAA,EACvB;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,uBAAmB,uBAAQ,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,sBAAkB,uBAAQ,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,+BAAU,MAAM;AACd,kBAAc,gBAAgB,UAAoB;AAAA,EACpD,GAAG,CAAC,UAAU,CAAC;AAEf,WAAS,eAAe,QAAe;AACrC,WAAO,cAAc,aAAa,UAAQ,EAAE,GAAG,MAAM;AAAA,EACvD;AACA,QAAM,mBAAmB,GAAGC,MAAK,4BAA4B,aAAW,SAAO,EAAE;AACjF,QAAM,mBAAmB,oBAAoB,aAAW,UAAQ,EAAE;AAElE,SACE,8BAAAC,QAAA,cAAC,SAAI,WAAW,gBAAgB,KAAK,UAAU,MAC5C,UAAU,SACT,8BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,SAAS,UAAU;AAAA,MACnB,OAAO,EAAC,OAAO,eAAe,iBAAiB,EAAC;AAAA;AAAA,IAE/C,UAAU;AAAA,EACb,GAEF,8BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,UAAU,SAAS;AAAA,MACjC,OAAO;AAAA,QACL,aAAa,eAAe,SAAS;AAAA,QACrC,YAAY,eAAe,aAAa;AAAA,MAC1C;AAAA;AAAA,IAEA,8BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,SACD,YACC,UAAU,WAAW,EAAE,UAAU,UAAU,SAAS,IAAI,CAAC,IAH/D;AAAA,QAIC,QAAO,eAAU,UAAV,YAAmB,SAAS;AAAA;AAAA,IACrC;AAAA,IACA,8BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAO;AAAA,QACP,cAAa;AAAA,QACb,UAAU,CAAC,MAAM,WAAW,EAAE,OAAO,KAAK;AAAA,QAC1C,WAAW,GAAG,UAAU,IAAI,YAAY,gBAAgB;AAAA,QACxD,aAAa,SAAS,QAAQ,SAAS,QAAQ,UAAU;AAAA,QACzD,OAAO;AAAA,UACL,OAAO,SAAS,QAAQ,eAAe,eAAe,IAAI;AAAA,QAC5D;AAAA;AAAA,IACF;AAAA,IACA,8BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO;AAAA,UACL,aAAa,eAAe,SAAS;AAAA,UACrC,YAAY,eAAe,aAAa;AAAA,QAC1C;AAAA;AAAA,MAEC,gBAAgB,UAAU,KAAK,WAAW,MACzC,8BAAAA,QAAA;AAAA,QAAC;AAAA;AAAA,UACC,UAAQ;AAAA,UACR,WAAU;AAAA,UACV,OAAO,EAAE,OAAO,sBAAsB;AAAA;AAAA,QACvC;AAAA,MAED;AAAA,MAED,gBAAgB,IAAI,CAAC,EAAE,OAAO,MAAM,MACnC,8BAAAA,QAAA;AAAA,QAAC;AAAA;AAAA,UACC,KAAK;AAAA,UACL,MAAK;AAAA,UACL,WAAW,eAAe,gBAAgB;AAAA,UAC1C,SAAS,CAAC,MAAM,WAAW,EAAE,OAAO,MAAM,GAAG,CAAC;AAAA,UAC9C,OAAO,EAAE,OAAO,eAAe,iBAAiB,EAAC;AAAA;AAAA,QAEhD;AAAA,QACA,SAAS,SAAS,SACjB,8BAAAA,QAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,OAAO,EAAE,OAAO,oBAAoB;AAAA;AAAA,QACtC;AAAA,MAEJ,CACD;AAAA,IACH;AAAA,IACA,8BAAAA,QAAA,cAAC,6CAAgB,MAAM,4CAAe,OAAO,EAAE,OAAO,eAAe,aAAa,GAAG,cAAc,SAAS,GAAG;AAAA,EACjH,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,IAAMF,SAAQ;;;AC5Kd,IAAAG,gBAAkB;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,8BAAAC,QAAA,cAAC,SAAI,WAAU,cACb,8BAAAA,QAAA,cAAC,SAAI,WAAU,UAAQ,QAAS,GAChC,8BAAAA,QAAA,cAAC,UAAK,WAAW,gBAAgB,UAAU,CAAC,MAAK,IAAK,CACxD;AAEJ;AAEA,IAAM,MACJ;AACF,IAAM,SACJ;AACF,IAAM,QACJ;AACF,IAAM,OACJ;;;ACrCF,IAAAC,gBAAkB;AAOH,SAAR,aAA8B;AAAA,EACnC;AAAA,EACA;AACF,GAMI;AACF,SACE,8BAAAC,QAAA,cAAC,SAAI,WAAU,qBACZ,MAAM,IAAI,CAAC,EAAE,OAAO,MAAM,MACzB,8BAAAA,QAAA;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,IAAAC,gBAAkB;AAOH,SAAR,KAAsB,EAAE,UAAU,UAAU,GAAmB;AACpE,SAAO,8BAAAC,QAAA,cAAC,SAAI,WAAW,QAAQ,SAAS,MAAK,QAAS;AACxD;AAEA,IAAM,SAAS,CAAC;AAAA,EACd;AAAA,EACA;AACF,MAGM;AACJ,SACE,8BAAAA,QAAA,cAAC,SAAI,WAAW,GAAG,SAAS,8CACzB,QACH;AAEJ;AAEA,KAAK,SAAS;;;ACzBd,IAAAC,gBAAkB;AAClB,IAAAC,4BAAgC;AAChC,IAAAC,+BAKO;AAUQ,SAAR,MAAuB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AACF,GAAoB;AAClB,SACE,8BAAAC,QAAA,cAAC,SAAI,WAAW,wBAAwB,SAAS,MAC/C,8BAAAA,QAAA,cAAC,SAAI,WAAU,iBACb,8BAAAA,QAAA,cAAC,SAAI,OAAO,EAAE,YAAY,SAAS,IAAI,EAAE,GAAG,WAAW,QAAQ,GAC/D,8BAAAA,QAAA,cAAC,aACC,8BAAAA,QAAA,cAAC,OAAE,WAAU,kBAAgB,KAAM,GACnC,8BAAAA,QAAA,cAAC,OAAE,WAAU,wBAAsB,WAAY,CACjD,GACA,8BAAAA,QAAA,cAAC,SAAI,WAAW,4BAA4B,IAAI,IAAI,CACtD,GACA,8BAAAA,QAAA;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,8BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,iBAAiB,SAAS;AAAA,MACrC,OAAO,EAAE,YAAY,eAAe,IAAI,UAAU,SAAS,IAAI;AAAA;AAAA,IAE/D,8BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAM,QAAQ,IAAI;AAAA,QAClB,WAAU;AAAA,QACV,OAAO,EAAE,OAAO,SAAS,IAAI,EAAE;AAAA;AAAA,IACjC;AAAA,IACA,8BAAAA,QAAA,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,IAAAC,gBAAkB;AAClB,IAAAC,+BAA6B;AAC7B,IAAAC,4BAAgC;AASjB,SAAR,WAA4B;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAyB;AACvB,QAAM,OAAO,MAAM,QAAQ,KAAK,EAAE;AAClC,SACE,8BAAAC,QAAA,cAAC,SAAI,WAAW,cAAc,SAAS,MACrC,8BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,MAAK;AAAA,MACL,gBAAgB;AAAA,MAChB,WAAU;AAAA;AAAA,EACZ,GACA,8BAAAA,QAAA,cAAC,6CAAgB,MAAM,2CAAc,WAAU,oBAAmB,GAClE,8BAAAA,QAAA,cAAC,WAAM,SAAS,MAAM,WAAU,uBAC7B,KACH,GACA,8BAAAA,QAAA,cAAC,SAAI,WAAU,sBACb,8BAAAA,QAAA,cAAC,SAAI,WAAU,2BAAyB,QAAS,CACnD,CACF;AAEJ;;;ACnCA,IAAAC,iBAAsD;AACtD,IAAAC,4BAAgC;AAChC,IAAAC,+BAAqC;AAiBtB,SAAR,YAA6B,IAKV;AALU,eAClC;AAAA;AAAA,IACA;AAAA,IACA;AAAA,EAtBF,IAmBoC,IAI/B,iBAJ+B,IAI/B;AAAA,IAHH;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,EAAE,UAAU,CAAC,GAAG,gBAAgB,CAAC,GAAG,WAAW,IAAI;AACzD,QAAM,CAAC,SAAS,UAAU,QAAI,yBAAS,EAAE;AACzC,QAAM,mBAAmB,oBAAoB,aAAW,UAAQ,EAAE;AAClE,QAAM,mBAAmB,GAAGC,MAAK,4BAA4B,aAAW,SAAO,EAAE;AAEjF,QAAM,uBAAmB,wBAAQ,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,wBAAoB,4BAAY,MAAM;AAC1C,UAAM,gBAAgB,MAAM,MAAM,UAAU,iBAAiB;AAC7D,UAAM,OAAO,gBAAgB,CAAC,IAAI,gBAAgB;AAAA,EACpD,GAAG,CAAC,MAAM,KAAK,CAAC;AAEhB,WAAS,eAAe,QAAe;AACrC,WAAO,cAAc,aAAa,UAAQ,EAAE,GAAG,MAAM;AAAA,EACvD;AAEA,SACE,+BAAAE,QAAA,cAAC,SAAI,WAAW,gBAAgB,KAAK,UAAU,MAC5C,SACC,+BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,WAAU;AAAA,MACV,OAAO,EAAE,OAAO,eAAe,iBAAiB,EAAC;AAAA;AAAA,IAEhD;AAAA,EACH,GAEF,+BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,OAAO;AAAA,QACL,aAAa,eAAe,SAAS;AAAA,QACrC,YAAY,eAAe,aAAa;AAAA,MAC1C;AAAA;AAAA,IAEA,+BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAO;AAAA,QACP,cAAa;AAAA,QACb,WAAW,GAAGH,MAAK,IAAI,gBAAgB;AAAA,QACvC,UAAU,CAAC,MAAM,WAAW,EAAE,OAAO,KAAK;AAAA,QAC1C,aAAa,GAAG,MAAM,MAAM,MAAM;AAAA,QAClC,OAAO;AAAA,UACL,OAAO,MAAM,MAAM,SAAS,IAAI,eAAe,eAAe,IAAI;AAAA,QACpE;AAAA;AAAA,IACF;AAAA,IACA,+BAAAG,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO;AAAA,UACL,aAAa,eAAe,SAAS;AAAA,UACrC,YAAY,eAAe,aAAa;AAAA,QAC1C;AAAA;AAAA,MAEC,YAAY,EAAE,UAAU,KAAK,WAAW,MACvC,+BAAAA,QAAA;AAAA,QAAC;AAAA;AAAA,UACC,UAAQ;AAAA,UACR,WAAU;AAAA,UACV,OAAO,EAAE,OAAO,sBAAsB;AAAA;AAAA,QACvC;AAAA,MAED;AAAA,MAED,YAAY,EAAE,IAAI,CAAC,EAAE,OAAAF,QAAO,MAAM,MACjC,+BAAAE,QAAA;AAAA,QAAC;AAAA;AAAA,UACC,KAAK;AAAA,UACL,MAAK;AAAA,UACL,SAAS,MAAM,WAAW,EAAE,OAAAF,QAAO,MAAM,CAAC;AAAA,UAC1C,WAAW,eAAe,gBAAgB;AAAA,UAC1C,OAAO,EAAE,OAAO,eAAe,iBAAiB,EAAC;AAAA;AAAA,QAEhDA;AAAA,QACA,YAAY,KAAK,KAChB,+BAAAE,QAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,OAAO,EAAE,OAAO,oBAAoB;AAAA;AAAA,QACtC;AAAA,MAEJ,CACD;AAAA,IACH;AAAA,IACA,+BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS;AAAA;AAAA,MAET,+BAAAA,QAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,OAAO;AAAA,YACL,OAAO,eAAe,aAAa;AAAA,YACnC,cAAc;AAAA,YACd,UAAU;AAAA,UACZ;AAAA;AAAA,MACF;AAAA,IACF;AAAA,EACF,CACF;AAEJ;AACA,IAAMH,SAAQ;;;ACrJd,IAAAI,iBAAkB;AAEH,SAAR,YACL,MACA;AACA,SACE,+BAAAC,QAAA,cAAC,SAAI,WAAU,gCACb,+BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,GAAG,KAAK,MAAM,cAAc;AAAA,MACrC,WAAU;AAAA;AAAA,IAEV,+BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,SACC,OAFL;AAAA,QAGC,MAAK;AAAA,QACL,WAAU;AAAA;AAAA,IACZ;AAAA,IACA,+BAAAA,QAAA,cAAC,UAAK,WAAU,wBAAuB;AAAA,EACzC,CACF;AAEJ;;;ACtBA,IAAAC,iBAAgC;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,QAAI,yBAEtC,CAAC,CAAC;AACJ,QAAM,CAAC,KAAK,MAAM,QAAI,yBAAS,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,+BAAAC,QAAA,cAAC,SAAI,WAAU,kCACb,+BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,YAAY;AAAA,MACZ,OAAM;AAAA,MACN,eAAe;AAAA,MACf,OAAO,EAAE,OAAO,cAAc,QAAQ,gBAAgB;AAAA;AAAA,EACxD,GACA,+BAAAA,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;;;ACvCA,IAAAC,iBAAkB;AACH,SAAR,MAAuB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,SACE,+BAAAC,QAAA,cAAC,SAAI,WAAU,oBACb,+BAAAA,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,IAAAC,iBAAkB;AACH,SAAR,SAA0B,EAAE,UAAU,GAA2B;AACtE,SACE,+BAAAC,QAAA,cAAC,SAAI,WAAW,GAAG,SAAS,eAC1B,+BAAAA,QAAA,cAAC,UAAK,WAAU,iCAAgC,CAClD;AAEJ;;;ACPA,IAAAC,iBAAkB;AAEH,SAAR,aAA8B;AACnC,SAAO,+BAAAC,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,+BAAAA,QAAA,cAAC,SAAI,WAAW,gBAAgB,MAAM,UAAU,MAC7C,MAAM,KAAK,IAAI,CAAC,SACf,+BAAAA,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,IAAAC,iBAAkB;AAEH,SAAR,aAA8B;AAAA,EACnC,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA,YAAY;AACd,GAQG;AACD,SACE,+BAAAC,QAAA,cAAC,SAAI,WAAU,yBACb,+BAAAA,QAAA,cAAC,SAAI,WAAU,wBACb,+BAAAA,QAAA,cAAC,SAAI,WAAW,WACd,+BAAAA,QAAA,cAAC,SAAI,WAAW,WAAW,IAAI,WAAW,GAC1C,+BAAAA,QAAA,cAAC,aACC,+BAAAA,QAAA,cAAC,QAAG,WAAU,mBAAiB,KAAM,GACrC,+BAAAA,QAAA,cAAC,OAAE,WAAW,sBAAqB,IAAK,CAC1C,CACF,GACA,+BAAAA,QAAA,cAAC,SAAI,WAAU,0BACZ,mBACC,+BAAAA,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,+BAAAA,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":["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","input","React","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","input","label","isItemExist","React","import_react","React","import_react","React","import_react","React","import_react","React","import_react","React","import_react","React"]}
package/dist/index.mjs CHANGED
@@ -180,7 +180,6 @@ function SingleSelect(attr) {
180
180
  value: ""
181
181
  });
182
182
  function selectItem({ label, value }, e) {
183
- var _a2;
184
183
  const triggerManual = attrInput.onChange;
185
184
  if (triggerManual) {
186
185
  triggerManual == null ? void 0 : triggerManual({
@@ -188,7 +187,10 @@ function SingleSelect(attr) {
188
187
  });
189
188
  }
190
189
  setSelected({ label, value });
191
- (_a2 = attr.stateaction) == null ? void 0 : _a2.call(attr, stringOptions ? value : { label, value });
190
+ if (attr.stateaction) {
191
+ if ((options == null ? void 0 : options.length) > 0) attr.stateaction({ label, value });
192
+ if ((stringOptions == null ? void 0 : stringOptions.length) > 0) attr.stateaction(value);
193
+ }
192
194
  setKeyword("");
193
195
  e.currentTarget.blur();
194
196
  }
package/dist/index.mjs.map CHANGED
@@ -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 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 isdarkmode,\r\n inputclass,\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 isdarkmode?: boolean;\r\n inputclass?: string;\r\n }\r\n>) {\r\n function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label\r\n htmlFor={labelFor}\r\n className=\"text-input__label\"\r\n style={{\r\n color: getThemedClass('-text-secondary')\r\n }}\r\n >\r\n {label}\r\n </label>\r\n )}\r\n <div\r\n className={`text-input__wrapper overflow-hidden ${attr.className}`}\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\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]\"} ${inputclass}`}\r\n style={{\r\n color: getThemedClass('-text-primary')\r\n }}\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 isdarkmode?: boolean;\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 = [], isdarkmode, ...attrInput } = attr;\r\n const inputValue = attrInput.value\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 attr.stateaction?.(stringOptions ? value : {label, value})\r\n setKeyword(\"\");\r\n e.currentTarget.blur()\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 inputValue && autoUpdateValue(inputValue as string);\r\n }, [inputValue]);\r\n\r\n function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\r\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label\r\n className=\"text-input__label\"\r\n htmlFor={attrInput.labelHtml}\r\n style={{color: getThemedClass('-text-secondary')}}\r\n >\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div\r\n className={`${attrInput.className} text-input__wrapper relative`}\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n <input\r\n type=\"hidden\"\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n />\r\n <input\r\n type=\"search\"\r\n value={keyword}\r\n autoComplete=\"off\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${placeholderClass}`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n style={{\r\n color: selected.value ? getThemedClass('-text-primary') : undefined\r\n }}\r\n />\r\n <div\r\n className=\"select-item__wrapper\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button\r\n disabled\r\n className=\"select-item\"\r\n style={{ color: 'var(--color-danger)' }}\r\n >\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n type=\"button\"\r\n className={`select-item ${optionHoverClass}`}\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n style={{ color: 'var(--color-info)' }}\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} style={{ color: getThemedClass('-icon-input'), paddingRight: '0.7rem' }} />\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 = \"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 isdarkmode?: boolean;\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 = [], isdarkmode } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\r\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\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 function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label\r\n htmlFor={labelHtml}\r\n className=\"text-input__label\"\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n </label>\r\n )}\r\n <div\r\n className=\"text-input__wrapper relative\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n <input\r\n type=\"search\"\r\n value={keyword}\r\n autoComplete=\"off\"\r\n className={`${input} ${placeholderClass}`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n placeholder={`${state.value.length} Dipilih`}\r\n style={{\r\n color: state.value.length > 0 ? getThemedClass('-text-primary') : undefined\r\n }}\r\n />\r\n <div\r\n className=\"select-item__wrapper select-multiple__wrapper\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button\r\n disabled\r\n className=\"select-item\"\r\n style={{ color: 'var(--color-danger)' }}\r\n >\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n key={value}\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n className={`select-item ${optionHoverClass}`}\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n style={{ color: 'var(--color-info)' }}\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\r\n icon={faListCheck}\r\n style={{\r\n color: getThemedClass('-icon-input'),\r\n paddingRight: '0.7rem',\r\n fontSize: '1.2rem'\r\n }}\r\n />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\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 isdarkmode={true}\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","_a","input","React","FontAwesomeIcon","faCheck","list","React","React","React","React","FontAwesomeIcon","React","FontAwesomeIcon","React","useMemo","useState","FontAwesomeIcon","faCheck","useState","input","useMemo","label","isItemExist","React","FontAwesomeIcon","faCheck","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 isdarkmode,\r\n inputclass,\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 isdarkmode?: boolean;\r\n inputclass?: string;\r\n }\r\n>) {\r\n function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label\r\n htmlFor={labelFor}\r\n className=\"text-input__label\"\r\n style={{\r\n color: getThemedClass('-text-secondary')\r\n }}\r\n >\r\n {label}\r\n </label>\r\n )}\r\n <div\r\n className={`text-input__wrapper overflow-hidden ${attr.className}`}\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\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]\"} ${inputclass}`}\r\n style={{\r\n color: getThemedClass('-text-primary')\r\n }}\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 isdarkmode?: boolean;\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 = [], isdarkmode, ...attrInput } = attr;\r\n const inputValue = attrInput.value\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\r\n if (attr.stateaction) {\r\n if (options?.length > 0) attr.stateaction({ label, value });\r\n if (stringOptions?.length > 0) attr.stateaction(value);\r\n }\r\n\r\n setKeyword(\"\");\r\n e.currentTarget.blur();\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 inputValue && autoUpdateValue(inputValue as string);\r\n }, [inputValue]);\r\n\r\n function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\r\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label\r\n className=\"text-input__label\"\r\n htmlFor={attrInput.labelHtml}\r\n style={{color: getThemedClass('-text-secondary')}}\r\n >\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div\r\n className={`${attrInput.className} text-input__wrapper relative`}\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n <input\r\n type=\"hidden\"\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n />\r\n <input\r\n type=\"search\"\r\n value={keyword}\r\n autoComplete=\"off\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${placeholderClass}`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n style={{\r\n color: selected.value ? getThemedClass('-text-primary') : undefined\r\n }}\r\n />\r\n <div\r\n className=\"select-item__wrapper\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button\r\n disabled\r\n className=\"select-item\"\r\n style={{ color: 'var(--color-danger)' }}\r\n >\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n type=\"button\"\r\n className={`select-item ${optionHoverClass}`}\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n style={{ color: 'var(--color-info)' }}\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} style={{ color: getThemedClass('-icon-input'), paddingRight: '0.7rem' }} />\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 = \"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 isdarkmode?: boolean;\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 = [], isdarkmode } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\r\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\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 function getThemedClass(prefix: string){\r\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\r\n }\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label\r\n htmlFor={labelHtml}\r\n className=\"text-input__label\"\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n </label>\r\n )}\r\n <div\r\n className=\"text-input__wrapper relative\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n <input\r\n type=\"search\"\r\n value={keyword}\r\n autoComplete=\"off\"\r\n className={`${input} ${placeholderClass}`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n placeholder={`${state.value.length} Dipilih`}\r\n style={{\r\n color: state.value.length > 0 ? getThemedClass('-text-primary') : undefined\r\n }}\r\n />\r\n <div\r\n className=\"select-item__wrapper select-multiple__wrapper\"\r\n style={{\r\n borderColor: getThemedClass('-border'),\r\n background: getThemedClass('-bg-surface'),\r\n }}\r\n >\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button\r\n disabled\r\n className=\"select-item\"\r\n style={{ color: 'var(--color-danger)' }}\r\n >\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n key={value}\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n className={`select-item ${optionHoverClass}`}\r\n style={{ color: getThemedClass('-text-secondary')}}\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n style={{ color: 'var(--color-info)' }}\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\r\n icon={faListCheck}\r\n style={{\r\n color: getThemedClass('-icon-input'),\r\n paddingRight: '0.7rem',\r\n fontSize: '1.2rem'\r\n }}\r\n />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\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 isdarkmode={true}\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","input","React","FontAwesomeIcon","faCheck","list","React","React","React","React","FontAwesomeIcon","React","FontAwesomeIcon","React","useMemo","useState","FontAwesomeIcon","faCheck","useState","input","useMemo","label","isItemExist","React","FontAwesomeIcon","faCheck","React","React","React","useState","useState","React","React","React","React","React","React"]}
package/package.json CHANGED
@@ -34,7 +34,7 @@
34
34
  "react-dom": "^18.2.0 || ^19.0.0"
35
35
  },
36
36
  "name": "@safestrong/ppa-component-library",
37
- "version": "1.8.0",
37
+ "version": "1.8.1",
38
38
  "description": "Collection of reusable components for any PPA web applications",
39
39
  "main": "dist/index.cjs",
40
40
  "module": "dist/index.js",