@safestrong/ppa-component-library 1.10.0 → 1.11.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 (8) hide show
  1. package/dist/index.d.mts +2 -2
  2. package/dist/index.d.ts +2 -2
  3. package/dist/index.js +16 -16
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +16 -16
  6. package/dist/index.mjs.map +1 -1
  7. package/dist/styles.css +10 -1
  8. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -6,7 +6,6 @@ type Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {
6
6
  icon?: IconProp;
7
7
  isnotif?: boolean;
8
8
  isLoading?: boolean;
9
- isloading?: boolean;
10
9
  btnType?: "primary" | "secondary" | "tertiary";
11
10
  };
12
11
  declare function Button({ label, icon, isLoading, btnType, className, ...rest }: Readonly<Button>): React.JSX.Element;
@@ -95,10 +94,11 @@ type Toast = {
95
94
  };
96
95
  declare function Toast({ title, description, type, className, }: Readonly<Toast>): React.JSX.Element;
97
96
  declare namespace Toast {
98
- var Inline: ({ className, text, type, }: {
97
+ var Inline: ({ className, text, type, icon, }: {
99
98
  className?: string;
100
99
  text: string;
101
100
  type: ToastType;
101
+ icon?: IconProp;
102
102
  }) => React.JSX.Element;
103
103
  }
104
104
 
package/dist/index.d.ts CHANGED
@@ -6,7 +6,6 @@ type Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {
6
6
  icon?: IconProp;
7
7
  isnotif?: boolean;
8
8
  isLoading?: boolean;
9
- isloading?: boolean;
10
9
  btnType?: "primary" | "secondary" | "tertiary";
11
10
  };
12
11
  declare function Button({ label, icon, isLoading, btnType, className, ...rest }: Readonly<Button>): React.JSX.Element;
@@ -95,10 +94,11 @@ type Toast = {
95
94
  };
96
95
  declare function Toast({ title, description, type, className, }: Readonly<Toast>): React.JSX.Element;
97
96
  declare namespace Toast {
98
- var Inline: ({ className, text, type, }: {
97
+ var Inline: ({ className, text, type, icon, }: {
99
98
  className?: string;
100
99
  text: string;
101
100
  type: ToastType;
101
+ icon?: IconProp;
102
102
  }) => React.JSX.Element;
103
103
  }
104
104
 
package/dist/index.js CHANGED
@@ -108,25 +108,25 @@ function Button(_a) {
108
108
  import_react_fontawesome.FontAwesomeIcon,
109
109
  {
110
110
  icon: buttonIcon,
111
- className: `text-[1.2rem] ${label && "mr-[0.3rem]"} ${isLoading && "animate-spin"}`
111
+ className: `text-[1.2rem] ${label && "mr-[0.3rem]"} ${isLoading ? "animate-spin" : ""}`
112
112
  }
113
113
  ),
114
114
  isLoading ? loadingLabel : label
115
115
  );
116
116
  }
117
117
  var IconButton = (props) => {
118
- const btnIcon = props.isloading ? import_free_solid_svg_icons.faCircleNotch : props.icon;
118
+ const btnIcon = props.isLoading ? import_free_solid_svg_icons.faCircleNotch : props.icon;
119
119
  return /* @__PURE__ */ import_react.default.createElement(
120
120
  "button",
121
121
  __spreadProps(__spreadValues({}, props), {
122
- disabled: props.disabled || props.isloading,
122
+ disabled: props.disabled || props.isLoading,
123
123
  className: `${props.className} ${props.label ? "max-w-[content] px-[0.8rem]" : ""} icon__button`
124
124
  }),
125
125
  btnIcon && /* @__PURE__ */ import_react.default.createElement(
126
126
  import_react_fontawesome.FontAwesomeIcon,
127
127
  {
128
128
  icon: btnIcon,
129
- className: props.isloading ? "animate-spin" : ""
129
+ className: props.isLoading ? "animate-spin" : ""
130
130
  }
131
131
  ),
132
132
  props.label && /* @__PURE__ */ import_react.default.createElement("span", { className: "inline-block ml-[0.8rem] text-[1rem]" }, props.label)
@@ -134,25 +134,24 @@ var IconButton = (props) => {
134
134
  };
135
135
  var IconButtonGroup = ({ list: list2 }) => {
136
136
  function getIcon2(props) {
137
- return props.isloading ? import_free_solid_svg_icons.faCircleNotch : props.icon;
137
+ return props.isLoading ? import_free_solid_svg_icons.faCircleNotch : props.icon;
138
138
  }
139
- return /* @__PURE__ */ import_react.default.createElement("div", { className: "icon__button_group" }, list2.map((props, idx) => /* @__PURE__ */ import_react.default.createElement(
139
+ return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "icon__button_group" }, list2.map((props, idx) => /* @__PURE__ */ import_react.default.createElement(
140
140
  "button",
141
- __spreadProps(__spreadValues({
142
- key: idx + 1
143
- }, props), {
144
- disabled: props.disabled || props.isloading,
145
- className: getBtnClass(idx)
141
+ __spreadProps(__spreadValues({}, props), {
142
+ key: idx + 1,
143
+ disabled: props.disabled || props.isLoading,
144
+ className: `${getBtnClass(idx)} ${props.className}`
146
145
  }),
147
146
  getIcon2(props) && /* @__PURE__ */ import_react.default.createElement(
148
147
  import_react_fontawesome.FontAwesomeIcon,
149
148
  {
150
149
  icon: getIcon2(props),
151
- className: props.isloading ? "animate-spin" : ""
150
+ className: props.isLoading ? "animate-spin" : ""
152
151
  }
153
152
  ),
154
- props.isnotif && /* @__PURE__ */ import_react.default.createElement("span", { className: "btn__notif_badge" })
155
- )));
153
+ props.isnotif ? /* @__PURE__ */ import_react.default.createElement("span", { className: "btn__notif_badge" }) : void 0
154
+ ))));
156
155
  };
157
156
  var SSOButton = ({ href, btnclass }) => {
158
157
  return /* @__PURE__ */ import_react.default.createElement("a", { href, className: `sso-button ${btnclass}` }, /* @__PURE__ */ import_react.default.createElement(
@@ -459,7 +458,8 @@ function Toast({
459
458
  var Inline = ({
460
459
  className,
461
460
  text,
462
- type
461
+ type,
462
+ icon = void 0
463
463
  }) => {
464
464
  return /* @__PURE__ */ import_react8.default.createElement(
465
465
  "div",
@@ -470,7 +470,7 @@ var Inline = ({
470
470
  /* @__PURE__ */ import_react8.default.createElement(
471
471
  import_react_fontawesome5.FontAwesomeIcon,
472
472
  {
473
- icon: getIcon(type),
473
+ icon: icon != null ? icon : getIcon(type),
474
474
  className: "text-[1.3rem]",
475
475
  style: { color: getColor(type) }
476
476
  }
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["export { default as Button } from \"./components/Button\";\nexport { default as TextInput } from \"./components/TextInput\";\nexport { default as Slider } from \"./components/Slider\";\nexport { default as SingleSelect } from \"./components/SingleSelect\";\nexport { default as Tooltip } from \"./components/Tooltip\";\nexport { default as NavTabClient } from \"./components/NavTabClient\";\nexport { default as Card } from \"./components/Card\";\nexport { default as Toast } from \"./components/Toast\";\nexport { default as Expandable } from \"./components/Expandable\";\nexport { default as MultiSelect } from \"./components/MultiSelect\";\nexport { default as ThemeToggle } from \"./components/ThemeToggle\";\nexport { default as Dashboard } from \"./components/Dashboard\";\nexport { default as Badge } from \"./components/Badge\";\nexport { default as Skeleton } from \"./components/Skeleton\";\nexport { default as Navigation } from \"./components/Navigation\";\nexport { default as Confirmation } from \"./components/Confirmation\";\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n label?: string;\n icon?: IconProp;\n isnotif?: boolean;\n isLoading?: boolean;\n isloading?: boolean;\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\n};\n\nexport default function Button({\n label,\n icon,\n isLoading,\n btnType,\n className,\n ...rest\n}: Readonly<Button>) {\n const buttonIcon = isLoading ? faCircleNotch : icon;\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\n return (\n <button\n {...rest}\n disabled={rest.disabled || isLoading}\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\n btnType == \"secondary\" && \"btn__secondary\"\n } btn__primary ${label ? \"\" : \"!p-[0.87rem]\"}`}\n >\n {buttonIcon && icon && (\n <FontAwesomeIcon\n icon={buttonIcon}\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\n isLoading && \"animate-spin\"\n }`}\n />\n )}\n {isLoading ? loadingLabel : label}\n </button>\n );\n}\n\nconst IconButton = (props: Readonly<Button>) => {\n const btnIcon = props.isloading ? faCircleNotch : props.icon;\n return (\n <button\n {...props}\n disabled={props.disabled || props.isloading}\n className={`${props.className} ${\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\n } icon__button`}\n >\n {btnIcon && (\n <FontAwesomeIcon\n icon={btnIcon}\n className={props.isloading ? \"animate-spin\" : \"\"}\n />\n )}\n {props.label && (\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\n {props.label}\n </span>\n )}\n </button>\n );\n};\n\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\n function getIcon(props: Button) {\n return props.isloading ? faCircleNotch : props.icon;\n }\n return (\n <div className=\"icon__button_group\">\n {list.map((props, idx) => (\n <button\n key={idx + 1}\n {...props}\n disabled={props.disabled || props.isloading}\n className={getBtnClass(idx)}\n >\n {getIcon(props) && (\n <FontAwesomeIcon\n icon={getIcon(props) as IconProp}\n className={props.isloading ? \"animate-spin\" : \"\"}\n />\n )}\n {props.isnotif && <span className=\"btn__notif_badge\"></span>}\n </button>\n ))}\n </div>\n );\n};\n\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\n return (\n <a href={href} className={`sso-button ${btnclass}`}>\n <img\n alt=\"logo\"\n className=\"sso-icon\"\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\n />{\" \"}\n Login dengan SSO\n </a>\n );\n};\n\nButton.IconButton = IconButton;\nButton.IconButtonGroup = IconButtonGroup;\nButton.SSOButton = SSOButton;\n\nfunction getBtnClass(idx: number) {\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] relative ${\n idx == 0 ? \"\" : \"border-l border-l-[var(--color-border)]\"\n }`;\n}\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nconst input__icon =\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)] \";\n\nexport default function TextInput({\n label,\n labelFor,\n icon,\n outerclass,\n isdarkmode,\n inputclass,\n ...attr\n}: Readonly<\n React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelFor?: string;\n icon?: IconProp;\n outerclass?: string;\n isdarkmode?: boolean;\n inputclass?: string;\n }\n>) {\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n return (\n <div className={`group ${outerclass} w-full`}>\n {label && (\n <label\n htmlFor={labelFor}\n className=\"text-input__label\"\n style={{\n color: getThemedClass('-text-secondary')\n }}\n >\n {label}\n </label>\n )}\n <div\n className={`text-input__wrapper overflow-hidden ${attr.className}`}\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\n <input\n {...attr}\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"} ${inputclass}`}\n style={{\n color: getThemedClass('-text-primary')\n }}\n />\n </div>\n </div>\n );\n}\n","import React from \"react\";\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\nexport default function Slider(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <div className=\"slider__wrapper group relative\">\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[0.7rem] translate-x-[0.2px]\"\n />\n </label>\n </div>\n </div>\n );\n}\n\nconst input = \"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\";\n","\"use client\";\nimport React, { useEffect, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\n\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelHtml?: string;\n placeholder?: string;\n stateaction?: (param: any) => void;\n outerclass?: string;\n isdarkmode?: boolean;\n options?: {\n label: string;\n value: string;\n }[];\n stringOptions?: string[];\n};\n\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\n const { options = [], stringOptions = [], isdarkmode, ...attrInput } = attr;\n const inputValue = attrInput.value\n const [keyword, setKeyword] = useState(\"\");\n const [selected, setSelected] = useState<{ label: string; value: any }>({\n label: \"\",\n value: \"\",\n });\n\n function selectItem(\n { label, value }: { label: string; value: any },\n e: React.MouseEvent<HTMLButtonElement>,\n ) {\n const triggerManual = attrInput.onChange;\n if (triggerManual) {\n triggerManual?.({\n target: { value, name: attrInput.name },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n setSelected({ label, value });\n\n if (attr.stateaction) {\n if (options?.length > 0) attr.stateaction({ label, value });\n if (stringOptions?.length > 0) attr.stateaction(value);\n }\n\n setKeyword(\"\");\n e.currentTarget.blur();\n }\n\n function autoUpdateValue(updatedValue: string) {\n if (updatedValue) {\n const filtered = availableOptions.find(\n ({ value }) => value == updatedValue\n );\n if (filtered) setSelected(filtered);\n }\n }\n\n const availableOptions = useMemo(() => {\n let defaultOptions = options && options.length > 0;\n if (!defaultOptions)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n const filteredOptions = useMemo(() => {\n return availableOptions.filter(\n ({ label, value }) =>\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\n );\n }, [keyword, availableOptions]);\n\n useEffect(() => {\n inputValue && autoUpdateValue(inputValue as string);\n }, [inputValue]);\n\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\n\n return (\n <div className={`w-full group ${attr.outerclass}`}>\n {attrInput.label && (\n <label\n className=\"text-input__label\"\n htmlFor={attrInput.labelHtml}\n style={{color: getThemedClass('-text-secondary')}}\n >\n {attrInput.label}\n </label>\n )}\n <div\n className={`${attrInput.className} text-input__wrapper relative`}\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n <input\n type=\"hidden\"\n {...attrInput}\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\n value={attrInput.value ?? selected.value}\n />\n <input\n type=\"search\"\n value={keyword}\n autoComplete=\"off\"\n onChange={(e) => setKeyword(e.target.value)}\n className={`${attrInput.name}-keyword ${placeholderClass}`}\n placeholder={selected.value ? selected.label : attrInput.placeholder}\n style={{\n color: selected.value ? getThemedClass('-text-primary') : undefined\n }}\n />\n <div\n className=\"select-item__wrapper\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {filteredOptions.length == 0 && keyword != \"\" && (\n <button\n disabled\n className=\"select-item\"\n style={{ color: 'var(--color-danger)' }}\n >\n Tidak ada Item\n </button>\n )}\n {filteredOptions.map(({ label, value }) => (\n <button\n key={value}\n type=\"button\"\n className={`select-item ${optionHoverClass}`}\n onClick={(e) => selectItem({ label, value }, e)}\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n {selected.value == value && (\n <FontAwesomeIcon\n icon={faCheck}\n style={{ color: 'var(--color-info)' }}\n />\n )}\n </button>\n ))}\n </div>\n <FontAwesomeIcon icon={faChevronDown} style={{ color: getThemedClass('-icon-input'), paddingRight: '0.7rem' }} />\n </div>\n </div>\n );\n}\n\nSingleSelect.autoFill = autoFillInput;\n\nfunction autoFillInput(\n value: string,\n elName: string,\n list: { label: string; value: string }[]\n) {\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\n inp.value = `${value}`;\n const filtered = list.find((item) => item.value == value);\n const el = document.querySelector(`.${elName}-keyword`);\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\n}\n\nconst input = \"text-input peer ... w-full\";\n","import React from \"react\";\n\ntype Tooltip = {\n children: React.ReactNode;\n text: string;\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\n};\n\nexport default function Tooltip({\n children,\n text,\n position = \"top\",\n}: Readonly<Tooltip>) {\n function getAccent() {\n const mapping = {\n top,\n bottom,\n left,\n right,\n };\n return mapping[position];\n }\n return (\n <div className=\"relative\">\n <div className=\"peer\">{children}</div>\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\n </div>\n );\n}\n\nconst top =\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\nconst bottom =\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\nconst right =\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\nconst left =\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\n","import React from \"react\";\n\ntype Option = {\n label: string;\n value: string;\n};\n\nexport default function NavTabClient({\n items,\n state,\n}: Readonly<{\n items: Option[];\n state: {\n active: string;\n setActive: (val: string) => void;\n };\n}>) {\n return (\n <nav className=\"navtab__wrapper\">\n {items.map(({ label, value }) => (\n <button\n key={value}\n className={`navtab__item ${\n state.active == value\n ? \"navtab__item__active\"\n : \"hover:bg-[var(--color-border)]/50\"\n }`}\n onClick={() => state.setActive(value)}\n >\n {label}\n </button>\n ))}\n </nav>\n );\n}\n","import React from \"react\";\n\ntype Card = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport default function Card({ children, className }: Readonly<Card>) {\n return <div className={`card ${className}`}>{children}</div>;\n}\n\nconst Footer = ({\n className,\n children,\n}: {\n className?: string;\n children?: React.ReactNode;\n}) => {\n return (\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\n {children}\n </div>\n );\n};\n\nCard.Footer = Footer;\n","import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport {\n faCheckCircle,\n faInfoCircle,\n faQuestionCircle,\n faXmarkCircle,\n} from \"@fortawesome/free-solid-svg-icons\";\n\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\ntype Toast = {\n title: string;\n className?: string;\n description: string;\n type: ToastType;\n};\n\nexport default function Toast({\n title,\n description,\n type = \"info\",\n className,\n}: Readonly<Toast>) {\n return (\n <div className={`toast__wrapper group ${className}`}>\n <div className=\"toast__body\">\n <div style={{ background: getColor(type) }} className={bullet}></div>\n <div>\n <p className=\"toast__title\">{title}</p>\n <p className=\"toast__description\">{description}</p>\n </div>\n <div className={`toast__icon toast__icon__${type}`}></div>\n </div>\n <p\n className=\"toast__bar toast-bar-animate\"\n style={{ background: getColor(type) }}\n ></p>\n </div>\n );\n}\n\nconst Inline = ({\n className,\n text,\n type,\n}: {\n className?: string;\n text: string;\n type: ToastType;\n}) => {\n return (\n <div\n className={`toast__inline ${className}`}\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\n >\n <FontAwesomeIcon\n icon={getIcon(type)}\n className=\"text-[1.3rem]\"\n style={{ color: getColor(type) }}\n />\n <p>{text}</p>\n </div>\n );\n};\n\nToast.Inline = Inline;\n\nfunction getColor(type: string) {\n return `var(--color-${type})`;\n}\n\nfunction getIcon(type: string) {\n const mapping = {\n warning: faQuestionCircle,\n info: faInfoCircle,\n danger: faXmarkCircle,\n success: faCheckCircle,\n };\n //@ts-expect-error call object using array index\n return mapping[type];\n}\n\nconst bullet =\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\n","import React from \"react\";\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\ntype Expandable = {\n children: React.ReactNode;\n title: string;\n className?: string;\n isOpen?: boolean;\n};\n\nexport default function Expandable({\n children,\n title,\n className,\n isOpen,\n}: Readonly<Expandable>) {\n const name = title.replace(\" \", \"\");\n return (\n <div className={`expandable ${className}`}>\n <input\n id={name}\n type=\"checkbox\"\n defaultChecked={isOpen}\n className=\"opacity-[0] peer absolute top-0 ex-title\"\n />\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\n <label htmlFor={name} className=\"expandable__title\">\n {title}\n </label>\n <div className=\"expandable__body\">\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\n </div>\n </div>\n );\n}\n","import React, { useCallback, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Option = {\n value: string;\n label: string;\n};\n\ntype MultiSelect = {\n label?: string;\n labelHtml?: string;\n outerclass?: string;\n isdarkmode?: boolean;\n options?: Option[];\n stringOptions?: string[];\n state: { value: Option[]; select: (newVal: Option[]) => void };\n};\n\nexport default function MultiSelect({\n state,\n label,\n labelHtml,\n ...attr\n}: Readonly<MultiSelect>) {\n const { options = [], stringOptions = [], isdarkmode } = attr;\n const [keyword, setKeyword] = useState(\"\");\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\n\n const availableOptions = useMemo(() => {\n const isDefaultOption = options && options.length > 0;\n if (!isDefaultOption)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n function getFiltered() {\n return availableOptions.filter(\n ({ label, value }) =>\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\n );\n }\n\n function selectItem({ label, value }: { label: string; value: string }) {\n //@ts-expect-error: avoid check\n state.select((prev) => {\n const isItemExist = prev.find((item: any) => item.value == value);\n if (isItemExist) {\n return prev.filter((item: any) => item.value != value);\n }\n return [...prev, { label, value }];\n });\n }\n\n function isItemExist(value: string) {\n return state.value.find((item: any) => item.value == value);\n }\n\n const selectUnSelectAll = useCallback(() => {\n const isAllSelected = state.value.length == availableOptions.length;\n state.select(isAllSelected ? [] : availableOptions);\n }, [state.value]);\n\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n\n return (\n <div className={`group w-full ${attr.outerclass}`}>\n {label && (\n <label\n htmlFor={labelHtml}\n className=\"text-input__label\"\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n </label>\n )}\n <div\n className=\"text-input__wrapper relative\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n <input\n type=\"search\"\n value={keyword}\n autoComplete=\"off\"\n className={`${input} ${placeholderClass}`}\n onChange={(e) => setKeyword(e.target.value)}\n placeholder={`${state.value.length} Dipilih`}\n style={{\n color: state.value.length > 0 ? getThemedClass('-text-primary') : undefined\n }}\n />\n <div\n className=\"select-item__wrapper select-multiple__wrapper\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {getFiltered().length == 0 && keyword != \"\" && (\n <button\n disabled\n className=\"select-item\"\n style={{ color: 'var(--color-danger)' }}\n >\n Tidak ada Item\n </button>\n )}\n {getFiltered().map(({ label, value }) => (\n <button\n key={value}\n type=\"button\"\n onClick={() => selectItem({ label, value })}\n className={`select-item ${optionHoverClass}`}\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n {isItemExist(value) && (\n <FontAwesomeIcon\n icon={faCheck}\n style={{ color: 'var(--color-info)' }}\n />\n )}\n </button>\n ))}\n </div>\n <button\n type=\"button\"\n className=\"cursor-pointer\"\n onClick={selectUnSelectAll}\n >\n <FontAwesomeIcon\n icon={faListCheck}\n style={{\n color: getThemedClass('-icon-input'),\n paddingRight: '0.7rem',\n fontSize: '1.2rem'\n }}\n />\n </button>\n </div>\n </div>\n );\n}\nconst input = \"text-input peer ... w-full\";\n","\"use client\";\nimport React from \"react\";\n\nexport default function ThemeToggle(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <label\n htmlFor={`${attr.id || \"theme-toggle\"}`}\n className=\"slider__wrapper slider-theme slider-theme-light relative\"\n >\n <input\n id=\"theme-toggle\"\n {...attr}\n type=\"checkbox\"\n className=\"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\"\n />\n <span className=\"slider-theme__bullet\"></span>\n </label>\n </div>\n );\n}\n","import React, { useState } from \"react\";\nimport MultiSelect from \"./MultiSelect\";\nimport SingleSelect from \"./SingleSelect\";\n\nconst list = [\n { label: \"Option 1\", value: \"option1\" },\n { label: \"Option 2\", value: \"option2\" },\n { label: \"Option 3\", value: \"option3\" },\n];\nconst stringList = [\"option1\", \"option2\", \"option3\"];\n\nexport default function Dashboard() {\n const [selectedItem, setSelectedItem] = useState<\n { label: string; value: string }[]\n >([]);\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\n\n function updateState(item: string) {\n const filtered = list.find(({ value }) => value == item);\n filtered && setSel(filtered);\n }\n\n return (\n <div className=\"flex items-center gap-[1rem]\">\n <MultiSelect\n isdarkmode={true}\n label=\"Multi Select\"\n stringOptions={stringList}\n state={{ value: selectedItem, select: setSelectedItem }}\n />\n <SingleSelect\n label=\"Single Select\"\n name=\"newinput\"\n stringOptions={stringList}\n placeholder=\"-- Pilih Status --\"\n value={sel.value}\n />\n </div>\n );\n}\n","import React from \"react\";\nexport default function Badge({\n text,\n type,\n className,\n}: {\n text: string;\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\n className?: string;\n}) {\n return (\n <div className=\"badge__wrapper\">\n <span\n style={{\n background: `var(--color-${type})`,\n }}\n className={`badge ${className}`}\n >\n {text}\n </span>\n </div>\n );\n}\n","import React from \"react\";\nexport default function Skeleton({ className }: { className?: string }) {\n return (\n <div className={`${className} skeleton`}>\n <span className=\"skeleton__item skeleton-slide\"></span>\n </div>\n );\n}\n","import React from \"react\";\n\nexport default function Navigation() {\n return <nav></nav>;\n}\n\nconst URLNavigation = (props: {\n list: { label: string; href: string }[];\n activeUrl: string;\n outerclass?: string;\n CustomComponent?: React.ElementType;\n}) => {\n const Component = props.CustomComponent || \"a\";\n function getAnchorClass(href: string) {\n return href === props.activeUrl\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\n }\n\n return (\n <nav className={`nav__wrapper ${props.outerclass}`}>\n {props.list.map((prop) => (\n <Component\n key={prop.href}\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\n {...prop}\n >\n {prop.label}\n </Component>\n ))}\n </nav>\n );\n};\n\nNavigation.URL = URLNavigation;\n\nconst base__anchor =\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\n","import React from \"react\";\n\nexport default function Confirmation({\n type = \"warning\",\n text,\n title,\n secondaryAction,\n secondaryLabel = \"Tidak\",\n mainAction,\n mainLabel = \"Ya\",\n}: {\n mainAction: () => void;\n secondaryAction?: () => void;\n mainLabel?: string;\n secondaryLabel?: string;\n title: string;\n text: string;\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\n}) {\n return (\n <div className=\"confirmation__outer\">\n <div className=\"confirmation__card\">\n <div className={wrapper}>\n <div className={`baloon__${type} baloon`}></div>\n <div>\n <h3 className=\"font-semibold\">{title}</h3>\n <p className={confirmation__text}>{text}</p>\n </div>\n </div>\n <div className=\"confirmation__footer\">\n {secondaryAction && (\n <button\n onClick={secondaryAction}\n type=\"button\"\n className=\"cursor-pointer\"\n style={{ color: `var(--color-${type})` }}\n >\n {secondaryLabel}\n </button>\n )}\n <button\n onClick={mainAction}\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\n style={{\n background: `var(--color-${type})`,\n border: `1px solid var(--color-${type})`,\n }}\n >\n {mainLabel}\n </button>\n </div>\n </div>\n </div>\n );\n}\n\nconst wrapper =\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\nconst confirmation__text =\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\n"],"mappings":"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","names":["React","list","getIcon","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"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["export { default as Button } from \"./components/Button\";\nexport { default as TextInput } from \"./components/TextInput\";\nexport { default as Slider } from \"./components/Slider\";\nexport { default as SingleSelect } from \"./components/SingleSelect\";\nexport { default as Tooltip } from \"./components/Tooltip\";\nexport { default as NavTabClient } from \"./components/NavTabClient\";\nexport { default as Card } from \"./components/Card\";\nexport { default as Toast } from \"./components/Toast\";\nexport { default as Expandable } from \"./components/Expandable\";\nexport { default as MultiSelect } from \"./components/MultiSelect\";\nexport { default as ThemeToggle } from \"./components/ThemeToggle\";\nexport { default as Dashboard } from \"./components/Dashboard\";\nexport { default as Badge } from \"./components/Badge\";\nexport { default as Skeleton } from \"./components/Skeleton\";\nexport { default as Navigation } from \"./components/Navigation\";\nexport { default as Confirmation } from \"./components/Confirmation\";\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n label?: string;\n icon?: IconProp;\n isnotif?: boolean;\n isLoading?: boolean;\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\n};\n\nexport default function Button({\n label,\n icon,\n isLoading,\n btnType,\n className,\n ...rest\n}: Readonly<Button>) {\n const buttonIcon = isLoading ? faCircleNotch : icon;\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\n return (\n <button\n {...rest}\n disabled={rest.disabled || isLoading}\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\n btnType == \"secondary\" && \"btn__secondary\"\n } btn__primary ${label ? \"\" : \"!p-[0.87rem]\"}`}\n >\n {buttonIcon && icon && (\n <FontAwesomeIcon\n icon={buttonIcon}\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\n isLoading ? \"animate-spin\" : \"\"\n }`}\n />\n )}\n {isLoading ? loadingLabel : label}\n </button>\n );\n}\n\nconst IconButton = (props: Readonly<Button>) => {\n const btnIcon = props.isLoading ? faCircleNotch : props.icon;\n return (\n <button\n {...props}\n disabled={props.disabled || props.isLoading}\n className={`${props.className} ${\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\n } icon__button`}\n >\n {btnIcon && (\n <FontAwesomeIcon\n icon={btnIcon}\n className={props.isLoading ? \"animate-spin\" : \"\"}\n />\n )}\n {props.label && (\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\n {props.label}\n </span>\n )}\n </button>\n );\n};\n\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\n function getIcon(props: Button) {\n return props.isLoading ? faCircleNotch : props.icon;\n }\n return (\n <div>\n <div className=\"icon__button_group\">\n {list.map((props, idx) => (\n <button\n {...props}\n key={idx + 1}\n disabled={props.disabled || props.isLoading}\n className={`${getBtnClass(idx)} ${props.className}`}\n >\n {getIcon(props) && (\n <FontAwesomeIcon\n icon={getIcon(props) as IconProp}\n className={props.isLoading ? \"animate-spin\" : \"\"}\n />\n )}\n {props.isnotif ? (\n <span className=\"btn__notif_badge\"></span>\n ) : undefined}\n </button>\n ))}\n </div>\n </div>\n );\n};\n\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\n return (\n <a href={href} className={`sso-button ${btnclass}`}>\n <img\n alt=\"logo\"\n className=\"sso-icon\"\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\n />{\" \"}\n Login dengan SSO\n </a>\n );\n};\n\nButton.IconButton = IconButton;\nButton.IconButtonGroup = IconButtonGroup;\nButton.SSOButton = SSOButton;\n\nfunction getBtnClass(idx: number) {\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] relative ${\n idx == 0 ? \"\" : \"border-l border-l-[var(--color-border)]\"\n }`;\n}\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nconst input__icon =\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)] \";\n\nexport default function TextInput({\n label,\n labelFor,\n icon,\n outerclass,\n isdarkmode,\n inputclass,\n ...attr\n}: Readonly<\n React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelFor?: string;\n icon?: IconProp;\n outerclass?: string;\n isdarkmode?: boolean;\n inputclass?: string;\n }\n>) {\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n return (\n <div className={`group ${outerclass} w-full`}>\n {label && (\n <label\n htmlFor={labelFor}\n className=\"text-input__label\"\n style={{\n color: getThemedClass('-text-secondary')\n }}\n >\n {label}\n </label>\n )}\n <div\n className={`text-input__wrapper overflow-hidden ${attr.className}`}\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\n <input\n {...attr}\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"} ${inputclass}`}\n style={{\n color: getThemedClass('-text-primary')\n }}\n />\n </div>\n </div>\n );\n}\n","import React from \"react\";\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\nexport default function Slider(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <div className=\"slider__wrapper group relative\">\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[0.7rem] translate-x-[0.2px]\"\n />\n </label>\n </div>\n </div>\n );\n}\n\nconst input = \"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\";\n","\"use client\";\nimport React, { useEffect, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\n\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelHtml?: string;\n placeholder?: string;\n stateaction?: (param: any) => void;\n outerclass?: string;\n isdarkmode?: boolean;\n options?: {\n label: string;\n value: string;\n }[];\n stringOptions?: string[];\n};\n\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\n const { options = [], stringOptions = [], isdarkmode, ...attrInput } = attr;\n const inputValue = attrInput.value\n const [keyword, setKeyword] = useState(\"\");\n const [selected, setSelected] = useState<{ label: string; value: any }>({\n label: \"\",\n value: \"\",\n });\n\n function selectItem(\n { label, value }: { label: string; value: any },\n e: React.MouseEvent<HTMLButtonElement>,\n ) {\n const triggerManual = attrInput.onChange;\n if (triggerManual) {\n triggerManual?.({\n target: { value, name: attrInput.name },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n setSelected({ label, value });\n\n if (attr.stateaction) {\n if (options?.length > 0) attr.stateaction({ label, value });\n if (stringOptions?.length > 0) attr.stateaction(value);\n }\n\n setKeyword(\"\");\n e.currentTarget.blur();\n }\n\n function autoUpdateValue(updatedValue: string) {\n if (updatedValue) {\n const filtered = availableOptions.find(\n ({ value }) => value == updatedValue\n );\n if (filtered) setSelected(filtered);\n }\n }\n\n const availableOptions = useMemo(() => {\n let defaultOptions = options && options.length > 0;\n if (!defaultOptions)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n const filteredOptions = useMemo(() => {\n return availableOptions.filter(\n ({ label, value }) =>\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\n );\n }, [keyword, availableOptions]);\n\n useEffect(() => {\n inputValue && autoUpdateValue(inputValue as string);\n }, [inputValue]);\n\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\n\n return (\n <div className={`w-full group ${attr.outerclass}`}>\n {attrInput.label && (\n <label\n className=\"text-input__label\"\n htmlFor={attrInput.labelHtml}\n style={{color: getThemedClass('-text-secondary')}}\n >\n {attrInput.label}\n </label>\n )}\n <div\n className={`${attrInput.className} text-input__wrapper relative`}\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n <input\n type=\"hidden\"\n {...attrInput}\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\n value={attrInput.value ?? selected.value}\n />\n <input\n type=\"search\"\n value={keyword}\n autoComplete=\"off\"\n onChange={(e) => setKeyword(e.target.value)}\n className={`${attrInput.name}-keyword ${placeholderClass}`}\n placeholder={selected.value ? selected.label : attrInput.placeholder}\n style={{\n color: selected.value ? getThemedClass('-text-primary') : undefined\n }}\n />\n <div\n className=\"select-item__wrapper\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {filteredOptions.length == 0 && keyword != \"\" && (\n <button\n disabled\n className=\"select-item\"\n style={{ color: 'var(--color-danger)' }}\n >\n Tidak ada Item\n </button>\n )}\n {filteredOptions.map(({ label, value }) => (\n <button\n key={value}\n type=\"button\"\n className={`select-item ${optionHoverClass}`}\n onClick={(e) => selectItem({ label, value }, e)}\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n {selected.value == value && (\n <FontAwesomeIcon\n icon={faCheck}\n style={{ color: 'var(--color-info)' }}\n />\n )}\n </button>\n ))}\n </div>\n <FontAwesomeIcon icon={faChevronDown} style={{ color: getThemedClass('-icon-input'), paddingRight: '0.7rem' }} />\n </div>\n </div>\n );\n}\n\nSingleSelect.autoFill = autoFillInput;\n\nfunction autoFillInput(\n value: string,\n elName: string,\n list: { label: string; value: string }[]\n) {\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\n inp.value = `${value}`;\n const filtered = list.find((item) => item.value == value);\n const el = document.querySelector(`.${elName}-keyword`);\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\n}\n\nconst input = \"text-input peer ... w-full\";\n","import React from \"react\";\n\ntype Tooltip = {\n children: React.ReactNode;\n text: string;\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\n};\n\nexport default function Tooltip({\n children,\n text,\n position = \"top\",\n}: Readonly<Tooltip>) {\n function getAccent() {\n const mapping = {\n top,\n bottom,\n left,\n right,\n };\n return mapping[position];\n }\n return (\n <div className=\"relative\">\n <div className=\"peer\">{children}</div>\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\n </div>\n );\n}\n\nconst top =\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\nconst bottom =\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\nconst right =\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\nconst left =\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\n","import React from \"react\";\n\ntype Option = {\n label: string;\n value: string;\n};\n\nexport default function NavTabClient({\n items,\n state,\n}: Readonly<{\n items: Option[];\n state: {\n active: string;\n setActive: (val: string) => void;\n };\n}>) {\n return (\n <nav className=\"navtab__wrapper\">\n {items.map(({ label, value }) => (\n <button\n key={value}\n className={`navtab__item ${\n state.active == value\n ? \"navtab__item__active\"\n : \"hover:bg-[var(--color-border)]/50\"\n }`}\n onClick={() => state.setActive(value)}\n >\n {label}\n </button>\n ))}\n </nav>\n );\n}\n","import React from \"react\";\n\ntype Card = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport default function Card({ children, className }: Readonly<Card>) {\n return <div className={`card ${className}`}>{children}</div>;\n}\n\nconst Footer = ({\n className,\n children,\n}: {\n className?: string;\n children?: React.ReactNode;\n}) => {\n return (\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\n {children}\n </div>\n );\n};\n\nCard.Footer = Footer;\n","import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport {\n faCheckCircle,\n faInfoCircle,\n faQuestionCircle,\n faXmarkCircle,\n} from \"@fortawesome/free-solid-svg-icons\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\n\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\ntype Toast = {\n title: string;\n className?: string;\n description: string;\n type: ToastType;\n};\n\nexport default function Toast({\n title,\n description,\n type = \"info\",\n className,\n}: Readonly<Toast>) {\n return (\n <div className={`toast__wrapper group ${className}`}>\n <div className=\"toast__body\">\n <div style={{ background: getColor(type) }} className={bullet}></div>\n <div>\n <p className=\"toast__title\">{title}</p>\n <p className=\"toast__description\">{description}</p>\n </div>\n <div className={`toast__icon toast__icon__${type}`}></div>\n </div>\n <p\n className=\"toast__bar toast-bar-animate\"\n style={{ background: getColor(type) }}\n ></p>\n </div>\n );\n}\n\nconst Inline = ({\n className,\n text,\n type,\n icon = undefined,\n}: {\n className?: string;\n text: string;\n type: ToastType;\n icon?: IconProp;\n}) => {\n return (\n <div\n className={`toast__inline ${className}`}\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\n >\n <FontAwesomeIcon\n icon={icon ?? getIcon(type)}\n className=\"text-[1.3rem]\"\n style={{ color: getColor(type) }}\n />\n <p>{text}</p>\n </div>\n );\n};\n\nToast.Inline = Inline;\n\nfunction getColor(type: string) {\n return `var(--color-${type})`;\n}\n\nfunction getIcon(type: string) {\n const mapping = {\n warning: faQuestionCircle,\n info: faInfoCircle,\n danger: faXmarkCircle,\n success: faCheckCircle,\n };\n //@ts-expect-error call object using array index\n return mapping[type];\n}\n\nconst bullet =\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\n","import React from \"react\";\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\ntype Expandable = {\n children: React.ReactNode;\n title: string;\n className?: string;\n isOpen?: boolean;\n};\n\nexport default function Expandable({\n children,\n title,\n className,\n isOpen,\n}: Readonly<Expandable>) {\n const name = title.replace(\" \", \"\");\n return (\n <div className={`expandable ${className}`}>\n <input\n id={name}\n type=\"checkbox\"\n defaultChecked={isOpen}\n className=\"opacity-[0] peer absolute top-0 ex-title\"\n />\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\n <label htmlFor={name} className=\"expandable__title\">\n {title}\n </label>\n <div className=\"expandable__body\">\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\n </div>\n </div>\n );\n}\n","import React, { useCallback, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Option = {\n value: string;\n label: string;\n};\n\ntype MultiSelect = {\n label?: string;\n labelHtml?: string;\n outerclass?: string;\n isdarkmode?: boolean;\n options?: Option[];\n stringOptions?: string[];\n state: { value: Option[]; select: (newVal: Option[]) => void };\n};\n\nexport default function MultiSelect({\n state,\n label,\n labelHtml,\n ...attr\n}: Readonly<MultiSelect>) {\n const { options = [], stringOptions = [], isdarkmode } = attr;\n const [keyword, setKeyword] = useState(\"\");\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\n\n const availableOptions = useMemo(() => {\n const isDefaultOption = options && options.length > 0;\n if (!isDefaultOption)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n function getFiltered() {\n return availableOptions.filter(\n ({ label, value }) =>\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\n );\n }\n\n function selectItem({ label, value }: { label: string; value: string }) {\n //@ts-expect-error: avoid check\n state.select((prev) => {\n const isItemExist = prev.find((item: any) => item.value == value);\n if (isItemExist) {\n return prev.filter((item: any) => item.value != value);\n }\n return [...prev, { label, value }];\n });\n }\n\n function isItemExist(value: string) {\n return state.value.find((item: any) => item.value == value);\n }\n\n const selectUnSelectAll = useCallback(() => {\n const isAllSelected = state.value.length == availableOptions.length;\n state.select(isAllSelected ? [] : availableOptions);\n }, [state.value]);\n\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n\n return (\n <div className={`group w-full ${attr.outerclass}`}>\n {label && (\n <label\n htmlFor={labelHtml}\n className=\"text-input__label\"\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n </label>\n )}\n <div\n className=\"text-input__wrapper relative\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n <input\n type=\"search\"\n value={keyword}\n autoComplete=\"off\"\n className={`${input} ${placeholderClass}`}\n onChange={(e) => setKeyword(e.target.value)}\n placeholder={`${state.value.length} Dipilih`}\n style={{\n color: state.value.length > 0 ? getThemedClass('-text-primary') : undefined\n }}\n />\n <div\n className=\"select-item__wrapper select-multiple__wrapper\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {getFiltered().length == 0 && keyword != \"\" && (\n <button\n disabled\n className=\"select-item\"\n style={{ color: 'var(--color-danger)' }}\n >\n Tidak ada Item\n </button>\n )}\n {getFiltered().map(({ label, value }) => (\n <button\n key={value}\n type=\"button\"\n onClick={() => selectItem({ label, value })}\n className={`select-item ${optionHoverClass}`}\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n {isItemExist(value) && (\n <FontAwesomeIcon\n icon={faCheck}\n style={{ color: 'var(--color-info)' }}\n />\n )}\n </button>\n ))}\n </div>\n <button\n type=\"button\"\n className=\"cursor-pointer\"\n onClick={selectUnSelectAll}\n >\n <FontAwesomeIcon\n icon={faListCheck}\n style={{\n color: getThemedClass('-icon-input'),\n paddingRight: '0.7rem',\n fontSize: '1.2rem'\n }}\n />\n </button>\n </div>\n </div>\n );\n}\nconst input = \"text-input peer ... w-full\";\n","\"use client\";\nimport React from \"react\";\n\nexport default function ThemeToggle(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <label\n htmlFor={`${attr.id || \"theme-toggle\"}`}\n className=\"slider__wrapper slider-theme slider-theme-light relative\"\n >\n <input\n id=\"theme-toggle\"\n {...attr}\n type=\"checkbox\"\n className=\"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\"\n />\n <span className=\"slider-theme__bullet\"></span>\n </label>\n </div>\n );\n}\n","import React, { useState } from \"react\";\nimport MultiSelect from \"./MultiSelect\";\nimport SingleSelect from \"./SingleSelect\";\n\nconst list = [\n { label: \"Option 1\", value: \"option1\" },\n { label: \"Option 2\", value: \"option2\" },\n { label: \"Option 3\", value: \"option3\" },\n];\nconst stringList = [\"option1\", \"option2\", \"option3\"];\n\nexport default function Dashboard() {\n const [selectedItem, setSelectedItem] = useState<\n { label: string; value: string }[]\n >([]);\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\n\n function updateState(item: string) {\n const filtered = list.find(({ value }) => value == item);\n filtered && setSel(filtered);\n }\n\n return (\n <div className=\"flex items-center gap-[1rem]\">\n <MultiSelect\n isdarkmode={true}\n label=\"Multi Select\"\n stringOptions={stringList}\n state={{ value: selectedItem, select: setSelectedItem }}\n />\n <SingleSelect\n label=\"Single Select\"\n name=\"newinput\"\n stringOptions={stringList}\n placeholder=\"-- Pilih Status --\"\n value={sel.value}\n />\n </div>\n );\n}\n","import React from \"react\";\nexport default function Badge({\n text,\n type,\n className,\n}: {\n text: string;\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\n className?: string;\n}) {\n return (\n <div className=\"badge__wrapper\">\n <span\n style={{\n background: `var(--color-${type})`,\n }}\n className={`badge ${className}`}\n >\n {text}\n </span>\n </div>\n );\n}\n","import React from \"react\";\nexport default function Skeleton({ className }: { className?: string }) {\n return (\n <div className={`${className} skeleton`}>\n <span className=\"skeleton__item skeleton-slide\"></span>\n </div>\n );\n}\n","import React from \"react\";\n\nexport default function Navigation() {\n return <nav></nav>;\n}\n\nconst URLNavigation = (props: {\n list: { label: string; href: string }[];\n activeUrl: string;\n outerclass?: string;\n CustomComponent?: React.ElementType;\n}) => {\n const Component = props.CustomComponent || \"a\";\n function getAnchorClass(href: string) {\n return href === props.activeUrl\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\n }\n\n return (\n <nav className={`nav__wrapper ${props.outerclass}`}>\n {props.list.map((prop) => (\n <Component\n key={prop.href}\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\n {...prop}\n >\n {prop.label}\n </Component>\n ))}\n </nav>\n );\n};\n\nNavigation.URL = URLNavigation;\n\nconst base__anchor =\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\n","import React from \"react\";\n\nexport default function Confirmation({\n type = \"warning\",\n text,\n title,\n secondaryAction,\n secondaryLabel = \"Tidak\",\n mainAction,\n mainLabel = \"Ya\",\n}: {\n mainAction: () => void;\n secondaryAction?: () => void;\n mainLabel?: string;\n secondaryLabel?: string;\n title: string;\n text: string;\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\n}) {\n return (\n <div className=\"confirmation__outer\">\n <div className=\"confirmation__card\">\n <div className={wrapper}>\n <div className={`baloon__${type} baloon`}></div>\n <div>\n <h3 className=\"font-semibold\">{title}</h3>\n <p className={confirmation__text}>{text}</p>\n </div>\n </div>\n <div className=\"confirmation__footer\">\n {secondaryAction && (\n <button\n onClick={secondaryAction}\n type=\"button\"\n className=\"cursor-pointer\"\n style={{ color: `var(--color-${type})` }}\n >\n {secondaryLabel}\n </button>\n )}\n <button\n onClick={mainAction}\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\n style={{\n background: `var(--color-${type})`,\n border: `1px solid var(--color-${type})`,\n }}\n >\n {mainLabel}\n </button>\n </div>\n </div>\n </div>\n );\n}\n\nconst wrapper =\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\nconst confirmation__text =\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\n"],"mappings":"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","names":["React","list","getIcon","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
@@ -60,25 +60,25 @@ function Button(_a) {
60
60
  FontAwesomeIcon,
61
61
  {
62
62
  icon: buttonIcon,
63
- className: `text-[1.2rem] ${label && "mr-[0.3rem]"} ${isLoading && "animate-spin"}`
63
+ className: `text-[1.2rem] ${label && "mr-[0.3rem]"} ${isLoading ? "animate-spin" : ""}`
64
64
  }
65
65
  ),
66
66
  isLoading ? loadingLabel : label
67
67
  );
68
68
  }
69
69
  var IconButton = (props) => {
70
- const btnIcon = props.isloading ? faCircleNotch : props.icon;
70
+ const btnIcon = props.isLoading ? faCircleNotch : props.icon;
71
71
  return /* @__PURE__ */ React.createElement(
72
72
  "button",
73
73
  __spreadProps(__spreadValues({}, props), {
74
- disabled: props.disabled || props.isloading,
74
+ disabled: props.disabled || props.isLoading,
75
75
  className: `${props.className} ${props.label ? "max-w-[content] px-[0.8rem]" : ""} icon__button`
76
76
  }),
77
77
  btnIcon && /* @__PURE__ */ React.createElement(
78
78
  FontAwesomeIcon,
79
79
  {
80
80
  icon: btnIcon,
81
- className: props.isloading ? "animate-spin" : ""
81
+ className: props.isLoading ? "animate-spin" : ""
82
82
  }
83
83
  ),
84
84
  props.label && /* @__PURE__ */ React.createElement("span", { className: "inline-block ml-[0.8rem] text-[1rem]" }, props.label)
@@ -86,25 +86,24 @@ var IconButton = (props) => {
86
86
  };
87
87
  var IconButtonGroup = ({ list: list2 }) => {
88
88
  function getIcon2(props) {
89
- return props.isloading ? faCircleNotch : props.icon;
89
+ return props.isLoading ? faCircleNotch : props.icon;
90
90
  }
91
- return /* @__PURE__ */ React.createElement("div", { className: "icon__button_group" }, list2.map((props, idx) => /* @__PURE__ */ React.createElement(
91
+ return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", { className: "icon__button_group" }, list2.map((props, idx) => /* @__PURE__ */ React.createElement(
92
92
  "button",
93
- __spreadProps(__spreadValues({
94
- key: idx + 1
95
- }, props), {
96
- disabled: props.disabled || props.isloading,
97
- className: getBtnClass(idx)
93
+ __spreadProps(__spreadValues({}, props), {
94
+ key: idx + 1,
95
+ disabled: props.disabled || props.isLoading,
96
+ className: `${getBtnClass(idx)} ${props.className}`
98
97
  }),
99
98
  getIcon2(props) && /* @__PURE__ */ React.createElement(
100
99
  FontAwesomeIcon,
101
100
  {
102
101
  icon: getIcon2(props),
103
- className: props.isloading ? "animate-spin" : ""
102
+ className: props.isLoading ? "animate-spin" : ""
104
103
  }
105
104
  ),
106
- props.isnotif && /* @__PURE__ */ React.createElement("span", { className: "btn__notif_badge" })
107
- )));
105
+ props.isnotif ? /* @__PURE__ */ React.createElement("span", { className: "btn__notif_badge" }) : void 0
106
+ ))));
108
107
  };
109
108
  var SSOButton = ({ href, btnclass }) => {
110
109
  return /* @__PURE__ */ React.createElement("a", { href, className: `sso-button ${btnclass}` }, /* @__PURE__ */ React.createElement(
@@ -416,7 +415,8 @@ function Toast({
416
415
  var Inline = ({
417
416
  className,
418
417
  text,
419
- type
418
+ type,
419
+ icon = void 0
420
420
  }) => {
421
421
  return /* @__PURE__ */ React8.createElement(
422
422
  "div",
@@ -427,7 +427,7 @@ var Inline = ({
427
427
  /* @__PURE__ */ React8.createElement(
428
428
  FontAwesomeIcon5,
429
429
  {
430
- icon: getIcon(type),
430
+ icon: icon != null ? icon : getIcon(type),
431
431
  className: "text-[1.3rem]",
432
432
  style: { color: getColor(type) }
433
433
  }
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\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n label?: string;\n icon?: IconProp;\n isnotif?: boolean;\n isLoading?: boolean;\n isloading?: boolean;\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\n};\n\nexport default function Button({\n label,\n icon,\n isLoading,\n btnType,\n className,\n ...rest\n}: Readonly<Button>) {\n const buttonIcon = isLoading ? faCircleNotch : icon;\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\n return (\n <button\n {...rest}\n disabled={rest.disabled || isLoading}\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\n btnType == \"secondary\" && \"btn__secondary\"\n } btn__primary ${label ? \"\" : \"!p-[0.87rem]\"}`}\n >\n {buttonIcon && icon && (\n <FontAwesomeIcon\n icon={buttonIcon}\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\n isLoading && \"animate-spin\"\n }`}\n />\n )}\n {isLoading ? loadingLabel : label}\n </button>\n );\n}\n\nconst IconButton = (props: Readonly<Button>) => {\n const btnIcon = props.isloading ? faCircleNotch : props.icon;\n return (\n <button\n {...props}\n disabled={props.disabled || props.isloading}\n className={`${props.className} ${\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\n } icon__button`}\n >\n {btnIcon && (\n <FontAwesomeIcon\n icon={btnIcon}\n className={props.isloading ? \"animate-spin\" : \"\"}\n />\n )}\n {props.label && (\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\n {props.label}\n </span>\n )}\n </button>\n );\n};\n\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\n function getIcon(props: Button) {\n return props.isloading ? faCircleNotch : props.icon;\n }\n return (\n <div className=\"icon__button_group\">\n {list.map((props, idx) => (\n <button\n key={idx + 1}\n {...props}\n disabled={props.disabled || props.isloading}\n className={getBtnClass(idx)}\n >\n {getIcon(props) && (\n <FontAwesomeIcon\n icon={getIcon(props) as IconProp}\n className={props.isloading ? \"animate-spin\" : \"\"}\n />\n )}\n {props.isnotif && <span className=\"btn__notif_badge\"></span>}\n </button>\n ))}\n </div>\n );\n};\n\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\n return (\n <a href={href} className={`sso-button ${btnclass}`}>\n <img\n alt=\"logo\"\n className=\"sso-icon\"\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\n />{\" \"}\n Login dengan SSO\n </a>\n );\n};\n\nButton.IconButton = IconButton;\nButton.IconButtonGroup = IconButtonGroup;\nButton.SSOButton = SSOButton;\n\nfunction getBtnClass(idx: number) {\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] relative ${\n idx == 0 ? \"\" : \"border-l border-l-[var(--color-border)]\"\n }`;\n}\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nconst input__icon =\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)] \";\n\nexport default function TextInput({\n label,\n labelFor,\n icon,\n outerclass,\n isdarkmode,\n inputclass,\n ...attr\n}: Readonly<\n React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelFor?: string;\n icon?: IconProp;\n outerclass?: string;\n isdarkmode?: boolean;\n inputclass?: string;\n }\n>) {\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n return (\n <div className={`group ${outerclass} w-full`}>\n {label && (\n <label\n htmlFor={labelFor}\n className=\"text-input__label\"\n style={{\n color: getThemedClass('-text-secondary')\n }}\n >\n {label}\n </label>\n )}\n <div\n className={`text-input__wrapper overflow-hidden ${attr.className}`}\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\n <input\n {...attr}\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"} ${inputclass}`}\n style={{\n color: getThemedClass('-text-primary')\n }}\n />\n </div>\n </div>\n );\n}\n","import React from \"react\";\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\nexport default function Slider(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <div className=\"slider__wrapper group relative\">\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[0.7rem] translate-x-[0.2px]\"\n />\n </label>\n </div>\n </div>\n );\n}\n\nconst input = \"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\";\n","\"use client\";\nimport React, { useEffect, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\n\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelHtml?: string;\n placeholder?: string;\n stateaction?: (param: any) => void;\n outerclass?: string;\n isdarkmode?: boolean;\n options?: {\n label: string;\n value: string;\n }[];\n stringOptions?: string[];\n};\n\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\n const { options = [], stringOptions = [], isdarkmode, ...attrInput } = attr;\n const inputValue = attrInput.value\n const [keyword, setKeyword] = useState(\"\");\n const [selected, setSelected] = useState<{ label: string; value: any }>({\n label: \"\",\n value: \"\",\n });\n\n function selectItem(\n { label, value }: { label: string; value: any },\n e: React.MouseEvent<HTMLButtonElement>,\n ) {\n const triggerManual = attrInput.onChange;\n if (triggerManual) {\n triggerManual?.({\n target: { value, name: attrInput.name },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n setSelected({ label, value });\n\n if (attr.stateaction) {\n if (options?.length > 0) attr.stateaction({ label, value });\n if (stringOptions?.length > 0) attr.stateaction(value);\n }\n\n setKeyword(\"\");\n e.currentTarget.blur();\n }\n\n function autoUpdateValue(updatedValue: string) {\n if (updatedValue) {\n const filtered = availableOptions.find(\n ({ value }) => value == updatedValue\n );\n if (filtered) setSelected(filtered);\n }\n }\n\n const availableOptions = useMemo(() => {\n let defaultOptions = options && options.length > 0;\n if (!defaultOptions)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n const filteredOptions = useMemo(() => {\n return availableOptions.filter(\n ({ label, value }) =>\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\n );\n }, [keyword, availableOptions]);\n\n useEffect(() => {\n inputValue && autoUpdateValue(inputValue as string);\n }, [inputValue]);\n\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\n\n return (\n <div className={`w-full group ${attr.outerclass}`}>\n {attrInput.label && (\n <label\n className=\"text-input__label\"\n htmlFor={attrInput.labelHtml}\n style={{color: getThemedClass('-text-secondary')}}\n >\n {attrInput.label}\n </label>\n )}\n <div\n className={`${attrInput.className} text-input__wrapper relative`}\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n <input\n type=\"hidden\"\n {...attrInput}\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\n value={attrInput.value ?? selected.value}\n />\n <input\n type=\"search\"\n value={keyword}\n autoComplete=\"off\"\n onChange={(e) => setKeyword(e.target.value)}\n className={`${attrInput.name}-keyword ${placeholderClass}`}\n placeholder={selected.value ? selected.label : attrInput.placeholder}\n style={{\n color: selected.value ? getThemedClass('-text-primary') : undefined\n }}\n />\n <div\n className=\"select-item__wrapper\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {filteredOptions.length == 0 && keyword != \"\" && (\n <button\n disabled\n className=\"select-item\"\n style={{ color: 'var(--color-danger)' }}\n >\n Tidak ada Item\n </button>\n )}\n {filteredOptions.map(({ label, value }) => (\n <button\n key={value}\n type=\"button\"\n className={`select-item ${optionHoverClass}`}\n onClick={(e) => selectItem({ label, value }, e)}\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n {selected.value == value && (\n <FontAwesomeIcon\n icon={faCheck}\n style={{ color: 'var(--color-info)' }}\n />\n )}\n </button>\n ))}\n </div>\n <FontAwesomeIcon icon={faChevronDown} style={{ color: getThemedClass('-icon-input'), paddingRight: '0.7rem' }} />\n </div>\n </div>\n );\n}\n\nSingleSelect.autoFill = autoFillInput;\n\nfunction autoFillInput(\n value: string,\n elName: string,\n list: { label: string; value: string }[]\n) {\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\n inp.value = `${value}`;\n const filtered = list.find((item) => item.value == value);\n const el = document.querySelector(`.${elName}-keyword`);\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\n}\n\nconst input = \"text-input peer ... w-full\";\n","import React from \"react\";\n\ntype Tooltip = {\n children: React.ReactNode;\n text: string;\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\n};\n\nexport default function Tooltip({\n children,\n text,\n position = \"top\",\n}: Readonly<Tooltip>) {\n function getAccent() {\n const mapping = {\n top,\n bottom,\n left,\n right,\n };\n return mapping[position];\n }\n return (\n <div className=\"relative\">\n <div className=\"peer\">{children}</div>\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\n </div>\n );\n}\n\nconst top =\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\nconst bottom =\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\nconst right =\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\nconst left =\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\n","import React from \"react\";\n\ntype Option = {\n label: string;\n value: string;\n};\n\nexport default function NavTabClient({\n items,\n state,\n}: Readonly<{\n items: Option[];\n state: {\n active: string;\n setActive: (val: string) => void;\n };\n}>) {\n return (\n <nav className=\"navtab__wrapper\">\n {items.map(({ label, value }) => (\n <button\n key={value}\n className={`navtab__item ${\n state.active == value\n ? \"navtab__item__active\"\n : \"hover:bg-[var(--color-border)]/50\"\n }`}\n onClick={() => state.setActive(value)}\n >\n {label}\n </button>\n ))}\n </nav>\n );\n}\n","import React from \"react\";\n\ntype Card = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport default function Card({ children, className }: Readonly<Card>) {\n return <div className={`card ${className}`}>{children}</div>;\n}\n\nconst Footer = ({\n className,\n children,\n}: {\n className?: string;\n children?: React.ReactNode;\n}) => {\n return (\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\n {children}\n </div>\n );\n};\n\nCard.Footer = Footer;\n","import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport {\n faCheckCircle,\n faInfoCircle,\n faQuestionCircle,\n faXmarkCircle,\n} from \"@fortawesome/free-solid-svg-icons\";\n\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\ntype Toast = {\n title: string;\n className?: string;\n description: string;\n type: ToastType;\n};\n\nexport default function Toast({\n title,\n description,\n type = \"info\",\n className,\n}: Readonly<Toast>) {\n return (\n <div className={`toast__wrapper group ${className}`}>\n <div className=\"toast__body\">\n <div style={{ background: getColor(type) }} className={bullet}></div>\n <div>\n <p className=\"toast__title\">{title}</p>\n <p className=\"toast__description\">{description}</p>\n </div>\n <div className={`toast__icon toast__icon__${type}`}></div>\n </div>\n <p\n className=\"toast__bar toast-bar-animate\"\n style={{ background: getColor(type) }}\n ></p>\n </div>\n );\n}\n\nconst Inline = ({\n className,\n text,\n type,\n}: {\n className?: string;\n text: string;\n type: ToastType;\n}) => {\n return (\n <div\n className={`toast__inline ${className}`}\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\n >\n <FontAwesomeIcon\n icon={getIcon(type)}\n className=\"text-[1.3rem]\"\n style={{ color: getColor(type) }}\n />\n <p>{text}</p>\n </div>\n );\n};\n\nToast.Inline = Inline;\n\nfunction getColor(type: string) {\n return `var(--color-${type})`;\n}\n\nfunction getIcon(type: string) {\n const mapping = {\n warning: faQuestionCircle,\n info: faInfoCircle,\n danger: faXmarkCircle,\n success: faCheckCircle,\n };\n //@ts-expect-error call object using array index\n return mapping[type];\n}\n\nconst bullet =\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\n","import React from \"react\";\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\ntype Expandable = {\n children: React.ReactNode;\n title: string;\n className?: string;\n isOpen?: boolean;\n};\n\nexport default function Expandable({\n children,\n title,\n className,\n isOpen,\n}: Readonly<Expandable>) {\n const name = title.replace(\" \", \"\");\n return (\n <div className={`expandable ${className}`}>\n <input\n id={name}\n type=\"checkbox\"\n defaultChecked={isOpen}\n className=\"opacity-[0] peer absolute top-0 ex-title\"\n />\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\n <label htmlFor={name} className=\"expandable__title\">\n {title}\n </label>\n <div className=\"expandable__body\">\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\n </div>\n </div>\n );\n}\n","import React, { useCallback, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Option = {\n value: string;\n label: string;\n};\n\ntype MultiSelect = {\n label?: string;\n labelHtml?: string;\n outerclass?: string;\n isdarkmode?: boolean;\n options?: Option[];\n stringOptions?: string[];\n state: { value: Option[]; select: (newVal: Option[]) => void };\n};\n\nexport default function MultiSelect({\n state,\n label,\n labelHtml,\n ...attr\n}: Readonly<MultiSelect>) {\n const { options = [], stringOptions = [], isdarkmode } = attr;\n const [keyword, setKeyword] = useState(\"\");\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\n\n const availableOptions = useMemo(() => {\n const isDefaultOption = options && options.length > 0;\n if (!isDefaultOption)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n function getFiltered() {\n return availableOptions.filter(\n ({ label, value }) =>\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\n );\n }\n\n function selectItem({ label, value }: { label: string; value: string }) {\n //@ts-expect-error: avoid check\n state.select((prev) => {\n const isItemExist = prev.find((item: any) => item.value == value);\n if (isItemExist) {\n return prev.filter((item: any) => item.value != value);\n }\n return [...prev, { label, value }];\n });\n }\n\n function isItemExist(value: string) {\n return state.value.find((item: any) => item.value == value);\n }\n\n const selectUnSelectAll = useCallback(() => {\n const isAllSelected = state.value.length == availableOptions.length;\n state.select(isAllSelected ? [] : availableOptions);\n }, [state.value]);\n\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n\n return (\n <div className={`group w-full ${attr.outerclass}`}>\n {label && (\n <label\n htmlFor={labelHtml}\n className=\"text-input__label\"\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n </label>\n )}\n <div\n className=\"text-input__wrapper relative\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n <input\n type=\"search\"\n value={keyword}\n autoComplete=\"off\"\n className={`${input} ${placeholderClass}`}\n onChange={(e) => setKeyword(e.target.value)}\n placeholder={`${state.value.length} Dipilih`}\n style={{\n color: state.value.length > 0 ? getThemedClass('-text-primary') : undefined\n }}\n />\n <div\n className=\"select-item__wrapper select-multiple__wrapper\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {getFiltered().length == 0 && keyword != \"\" && (\n <button\n disabled\n className=\"select-item\"\n style={{ color: 'var(--color-danger)' }}\n >\n Tidak ada Item\n </button>\n )}\n {getFiltered().map(({ label, value }) => (\n <button\n key={value}\n type=\"button\"\n onClick={() => selectItem({ label, value })}\n className={`select-item ${optionHoverClass}`}\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n {isItemExist(value) && (\n <FontAwesomeIcon\n icon={faCheck}\n style={{ color: 'var(--color-info)' }}\n />\n )}\n </button>\n ))}\n </div>\n <button\n type=\"button\"\n className=\"cursor-pointer\"\n onClick={selectUnSelectAll}\n >\n <FontAwesomeIcon\n icon={faListCheck}\n style={{\n color: getThemedClass('-icon-input'),\n paddingRight: '0.7rem',\n fontSize: '1.2rem'\n }}\n />\n </button>\n </div>\n </div>\n );\n}\nconst input = \"text-input peer ... w-full\";\n","\"use client\";\nimport React from \"react\";\n\nexport default function ThemeToggle(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <label\n htmlFor={`${attr.id || \"theme-toggle\"}`}\n className=\"slider__wrapper slider-theme slider-theme-light relative\"\n >\n <input\n id=\"theme-toggle\"\n {...attr}\n type=\"checkbox\"\n className=\"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\"\n />\n <span className=\"slider-theme__bullet\"></span>\n </label>\n </div>\n );\n}\n","import React, { useState } from \"react\";\nimport MultiSelect from \"./MultiSelect\";\nimport SingleSelect from \"./SingleSelect\";\n\nconst list = [\n { label: \"Option 1\", value: \"option1\" },\n { label: \"Option 2\", value: \"option2\" },\n { label: \"Option 3\", value: \"option3\" },\n];\nconst stringList = [\"option1\", \"option2\", \"option3\"];\n\nexport default function Dashboard() {\n const [selectedItem, setSelectedItem] = useState<\n { label: string; value: string }[]\n >([]);\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\n\n function updateState(item: string) {\n const filtered = list.find(({ value }) => value == item);\n filtered && setSel(filtered);\n }\n\n return (\n <div className=\"flex items-center gap-[1rem]\">\n <MultiSelect\n isdarkmode={true}\n label=\"Multi Select\"\n stringOptions={stringList}\n state={{ value: selectedItem, select: setSelectedItem }}\n />\n <SingleSelect\n label=\"Single Select\"\n name=\"newinput\"\n stringOptions={stringList}\n placeholder=\"-- Pilih Status --\"\n value={sel.value}\n />\n </div>\n );\n}\n","import React from \"react\";\nexport default function Badge({\n text,\n type,\n className,\n}: {\n text: string;\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\n className?: string;\n}) {\n return (\n <div className=\"badge__wrapper\">\n <span\n style={{\n background: `var(--color-${type})`,\n }}\n className={`badge ${className}`}\n >\n {text}\n </span>\n </div>\n );\n}\n","import React from \"react\";\nexport default function Skeleton({ className }: { className?: string }) {\n return (\n <div className={`${className} skeleton`}>\n <span className=\"skeleton__item skeleton-slide\"></span>\n </div>\n );\n}\n","import React from \"react\";\n\nexport default function Navigation() {\n return <nav></nav>;\n}\n\nconst URLNavigation = (props: {\n list: { label: string; href: string }[];\n activeUrl: string;\n outerclass?: string;\n CustomComponent?: React.ElementType;\n}) => {\n const Component = props.CustomComponent || \"a\";\n function getAnchorClass(href: string) {\n return href === props.activeUrl\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\n }\n\n return (\n <nav className={`nav__wrapper ${props.outerclass}`}>\n {props.list.map((prop) => (\n <Component\n key={prop.href}\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\n {...prop}\n >\n {prop.label}\n </Component>\n ))}\n </nav>\n );\n};\n\nNavigation.URL = URLNavigation;\n\nconst base__anchor =\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\n","import React from \"react\";\n\nexport default function Confirmation({\n type = \"warning\",\n text,\n title,\n secondaryAction,\n secondaryLabel = \"Tidak\",\n mainAction,\n mainLabel = \"Ya\",\n}: {\n mainAction: () => void;\n secondaryAction?: () => void;\n mainLabel?: string;\n secondaryLabel?: string;\n title: string;\n text: string;\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\n}) {\n return (\n <div className=\"confirmation__outer\">\n <div className=\"confirmation__card\">\n <div className={wrapper}>\n <div className={`baloon__${type} baloon`}></div>\n <div>\n <h3 className=\"font-semibold\">{title}</h3>\n <p className={confirmation__text}>{text}</p>\n </div>\n </div>\n <div className=\"confirmation__footer\">\n {secondaryAction && (\n <button\n onClick={secondaryAction}\n type=\"button\"\n className=\"cursor-pointer\"\n style={{ color: `var(--color-${type})` }}\n >\n {secondaryLabel}\n </button>\n )}\n <button\n onClick={mainAction}\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\n style={{\n background: `var(--color-${type})`,\n border: `1px solid var(--color-${type})`,\n }}\n >\n {mainLabel}\n </button>\n </div>\n </div>\n </div>\n );\n}\n\nconst wrapper =\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\nconst confirmation__text =\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\n"],"mappings":"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","names":["list","getIcon","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"]}
1
+ {"version":3,"sources":["../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n label?: string;\n icon?: IconProp;\n isnotif?: boolean;\n isLoading?: boolean;\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\n};\n\nexport default function Button({\n label,\n icon,\n isLoading,\n btnType,\n className,\n ...rest\n}: Readonly<Button>) {\n const buttonIcon = isLoading ? faCircleNotch : icon;\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\n return (\n <button\n {...rest}\n disabled={rest.disabled || isLoading}\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\n btnType == \"secondary\" && \"btn__secondary\"\n } btn__primary ${label ? \"\" : \"!p-[0.87rem]\"}`}\n >\n {buttonIcon && icon && (\n <FontAwesomeIcon\n icon={buttonIcon}\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\n isLoading ? \"animate-spin\" : \"\"\n }`}\n />\n )}\n {isLoading ? loadingLabel : label}\n </button>\n );\n}\n\nconst IconButton = (props: Readonly<Button>) => {\n const btnIcon = props.isLoading ? faCircleNotch : props.icon;\n return (\n <button\n {...props}\n disabled={props.disabled || props.isLoading}\n className={`${props.className} ${\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\n } icon__button`}\n >\n {btnIcon && (\n <FontAwesomeIcon\n icon={btnIcon}\n className={props.isLoading ? \"animate-spin\" : \"\"}\n />\n )}\n {props.label && (\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\n {props.label}\n </span>\n )}\n </button>\n );\n};\n\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\n function getIcon(props: Button) {\n return props.isLoading ? faCircleNotch : props.icon;\n }\n return (\n <div>\n <div className=\"icon__button_group\">\n {list.map((props, idx) => (\n <button\n {...props}\n key={idx + 1}\n disabled={props.disabled || props.isLoading}\n className={`${getBtnClass(idx)} ${props.className}`}\n >\n {getIcon(props) && (\n <FontAwesomeIcon\n icon={getIcon(props) as IconProp}\n className={props.isLoading ? \"animate-spin\" : \"\"}\n />\n )}\n {props.isnotif ? (\n <span className=\"btn__notif_badge\"></span>\n ) : undefined}\n </button>\n ))}\n </div>\n </div>\n );\n};\n\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\n return (\n <a href={href} className={`sso-button ${btnclass}`}>\n <img\n alt=\"logo\"\n className=\"sso-icon\"\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\n />{\" \"}\n Login dengan SSO\n </a>\n );\n};\n\nButton.IconButton = IconButton;\nButton.IconButtonGroup = IconButtonGroup;\nButton.SSOButton = SSOButton;\n\nfunction getBtnClass(idx: number) {\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] relative ${\n idx == 0 ? \"\" : \"border-l border-l-[var(--color-border)]\"\n }`;\n}\n","import React from \"react\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nconst input__icon =\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)] \";\n\nexport default function TextInput({\n label,\n labelFor,\n icon,\n outerclass,\n isdarkmode,\n inputclass,\n ...attr\n}: Readonly<\n React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelFor?: string;\n icon?: IconProp;\n outerclass?: string;\n isdarkmode?: boolean;\n inputclass?: string;\n }\n>) {\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n return (\n <div className={`group ${outerclass} w-full`}>\n {label && (\n <label\n htmlFor={labelFor}\n className=\"text-input__label\"\n style={{\n color: getThemedClass('-text-secondary')\n }}\n >\n {label}\n </label>\n )}\n <div\n className={`text-input__wrapper overflow-hidden ${attr.className}`}\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\n <input\n {...attr}\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"} ${inputclass}`}\n style={{\n color: getThemedClass('-text-primary')\n }}\n />\n </div>\n </div>\n );\n}\n","import React from \"react\";\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\nexport default function Slider(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <div className=\"slider__wrapper group relative\">\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\n <FontAwesomeIcon\n icon={faCheck}\n className=\"text-[0.7rem] translate-x-[0.2px]\"\n />\n </label>\n </div>\n </div>\n );\n}\n\nconst input = \"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\";\n","\"use client\";\nimport React, { useEffect, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\n\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\n label?: string;\n labelHtml?: string;\n placeholder?: string;\n stateaction?: (param: any) => void;\n outerclass?: string;\n isdarkmode?: boolean;\n options?: {\n label: string;\n value: string;\n }[];\n stringOptions?: string[];\n};\n\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\n const { options = [], stringOptions = [], isdarkmode, ...attrInput } = attr;\n const inputValue = attrInput.value\n const [keyword, setKeyword] = useState(\"\");\n const [selected, setSelected] = useState<{ label: string; value: any }>({\n label: \"\",\n value: \"\",\n });\n\n function selectItem(\n { label, value }: { label: string; value: any },\n e: React.MouseEvent<HTMLButtonElement>,\n ) {\n const triggerManual = attrInput.onChange;\n if (triggerManual) {\n triggerManual?.({\n target: { value, name: attrInput.name },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n setSelected({ label, value });\n\n if (attr.stateaction) {\n if (options?.length > 0) attr.stateaction({ label, value });\n if (stringOptions?.length > 0) attr.stateaction(value);\n }\n\n setKeyword(\"\");\n e.currentTarget.blur();\n }\n\n function autoUpdateValue(updatedValue: string) {\n if (updatedValue) {\n const filtered = availableOptions.find(\n ({ value }) => value == updatedValue\n );\n if (filtered) setSelected(filtered);\n }\n }\n\n const availableOptions = useMemo(() => {\n let defaultOptions = options && options.length > 0;\n if (!defaultOptions)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n const filteredOptions = useMemo(() => {\n return availableOptions.filter(\n ({ label, value }) =>\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\n );\n }, [keyword, availableOptions]);\n\n useEffect(() => {\n inputValue && autoUpdateValue(inputValue as string);\n }, [inputValue]);\n\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\n\n return (\n <div className={`w-full group ${attr.outerclass}`}>\n {attrInput.label && (\n <label\n className=\"text-input__label\"\n htmlFor={attrInput.labelHtml}\n style={{color: getThemedClass('-text-secondary')}}\n >\n {attrInput.label}\n </label>\n )}\n <div\n className={`${attrInput.className} text-input__wrapper relative`}\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n <input\n type=\"hidden\"\n {...attrInput}\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\n value={attrInput.value ?? selected.value}\n />\n <input\n type=\"search\"\n value={keyword}\n autoComplete=\"off\"\n onChange={(e) => setKeyword(e.target.value)}\n className={`${attrInput.name}-keyword ${placeholderClass}`}\n placeholder={selected.value ? selected.label : attrInput.placeholder}\n style={{\n color: selected.value ? getThemedClass('-text-primary') : undefined\n }}\n />\n <div\n className=\"select-item__wrapper\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {filteredOptions.length == 0 && keyword != \"\" && (\n <button\n disabled\n className=\"select-item\"\n style={{ color: 'var(--color-danger)' }}\n >\n Tidak ada Item\n </button>\n )}\n {filteredOptions.map(({ label, value }) => (\n <button\n key={value}\n type=\"button\"\n className={`select-item ${optionHoverClass}`}\n onClick={(e) => selectItem({ label, value }, e)}\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n {selected.value == value && (\n <FontAwesomeIcon\n icon={faCheck}\n style={{ color: 'var(--color-info)' }}\n />\n )}\n </button>\n ))}\n </div>\n <FontAwesomeIcon icon={faChevronDown} style={{ color: getThemedClass('-icon-input'), paddingRight: '0.7rem' }} />\n </div>\n </div>\n );\n}\n\nSingleSelect.autoFill = autoFillInput;\n\nfunction autoFillInput(\n value: string,\n elName: string,\n list: { label: string; value: string }[]\n) {\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\n inp.value = `${value}`;\n const filtered = list.find((item) => item.value == value);\n const el = document.querySelector(`.${elName}-keyword`);\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\n}\n\nconst input = \"text-input peer ... w-full\";\n","import React from \"react\";\n\ntype Tooltip = {\n children: React.ReactNode;\n text: string;\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\n};\n\nexport default function Tooltip({\n children,\n text,\n position = \"top\",\n}: Readonly<Tooltip>) {\n function getAccent() {\n const mapping = {\n top,\n bottom,\n left,\n right,\n };\n return mapping[position];\n }\n return (\n <div className=\"relative\">\n <div className=\"peer\">{children}</div>\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\n </div>\n );\n}\n\nconst top =\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\nconst bottom =\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\nconst right =\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\nconst left =\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\n","import React from \"react\";\n\ntype Option = {\n label: string;\n value: string;\n};\n\nexport default function NavTabClient({\n items,\n state,\n}: Readonly<{\n items: Option[];\n state: {\n active: string;\n setActive: (val: string) => void;\n };\n}>) {\n return (\n <nav className=\"navtab__wrapper\">\n {items.map(({ label, value }) => (\n <button\n key={value}\n className={`navtab__item ${\n state.active == value\n ? \"navtab__item__active\"\n : \"hover:bg-[var(--color-border)]/50\"\n }`}\n onClick={() => state.setActive(value)}\n >\n {label}\n </button>\n ))}\n </nav>\n );\n}\n","import React from \"react\";\n\ntype Card = {\n children: React.ReactNode;\n className?: string;\n};\n\nexport default function Card({ children, className }: Readonly<Card>) {\n return <div className={`card ${className}`}>{children}</div>;\n}\n\nconst Footer = ({\n className,\n children,\n}: {\n className?: string;\n children?: React.ReactNode;\n}) => {\n return (\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\n {children}\n </div>\n );\n};\n\nCard.Footer = Footer;\n","import React from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport {\n faCheckCircle,\n faInfoCircle,\n faQuestionCircle,\n faXmarkCircle,\n} from \"@fortawesome/free-solid-svg-icons\";\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\n\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\ntype Toast = {\n title: string;\n className?: string;\n description: string;\n type: ToastType;\n};\n\nexport default function Toast({\n title,\n description,\n type = \"info\",\n className,\n}: Readonly<Toast>) {\n return (\n <div className={`toast__wrapper group ${className}`}>\n <div className=\"toast__body\">\n <div style={{ background: getColor(type) }} className={bullet}></div>\n <div>\n <p className=\"toast__title\">{title}</p>\n <p className=\"toast__description\">{description}</p>\n </div>\n <div className={`toast__icon toast__icon__${type}`}></div>\n </div>\n <p\n className=\"toast__bar toast-bar-animate\"\n style={{ background: getColor(type) }}\n ></p>\n </div>\n );\n}\n\nconst Inline = ({\n className,\n text,\n type,\n icon = undefined,\n}: {\n className?: string;\n text: string;\n type: ToastType;\n icon?: IconProp;\n}) => {\n return (\n <div\n className={`toast__inline ${className}`}\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\n >\n <FontAwesomeIcon\n icon={icon ?? getIcon(type)}\n className=\"text-[1.3rem]\"\n style={{ color: getColor(type) }}\n />\n <p>{text}</p>\n </div>\n );\n};\n\nToast.Inline = Inline;\n\nfunction getColor(type: string) {\n return `var(--color-${type})`;\n}\n\nfunction getIcon(type: string) {\n const mapping = {\n warning: faQuestionCircle,\n info: faInfoCircle,\n danger: faXmarkCircle,\n success: faCheckCircle,\n };\n //@ts-expect-error call object using array index\n return mapping[type];\n}\n\nconst bullet =\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\n","import React from \"react\";\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\n\ntype Expandable = {\n children: React.ReactNode;\n title: string;\n className?: string;\n isOpen?: boolean;\n};\n\nexport default function Expandable({\n children,\n title,\n className,\n isOpen,\n}: Readonly<Expandable>) {\n const name = title.replace(\" \", \"\");\n return (\n <div className={`expandable ${className}`}>\n <input\n id={name}\n type=\"checkbox\"\n defaultChecked={isOpen}\n className=\"opacity-[0] peer absolute top-0 ex-title\"\n />\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\n <label htmlFor={name} className=\"expandable__title\">\n {title}\n </label>\n <div className=\"expandable__body\">\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\n </div>\n </div>\n );\n}\n","import React, { useCallback, useMemo, useState } from \"react\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\n\ntype Option = {\n value: string;\n label: string;\n};\n\ntype MultiSelect = {\n label?: string;\n labelHtml?: string;\n outerclass?: string;\n isdarkmode?: boolean;\n options?: Option[];\n stringOptions?: string[];\n state: { value: Option[]; select: (newVal: Option[]) => void };\n};\n\nexport default function MultiSelect({\n state,\n label,\n labelHtml,\n ...attr\n}: Readonly<MultiSelect>) {\n const { options = [], stringOptions = [], isdarkmode } = attr;\n const [keyword, setKeyword] = useState(\"\");\n const optionHoverClass = `select-item-hover${isdarkmode?\"-dark\":\"\"}`\n const placeholderClass = `${input} select-item-placeholder-${isdarkmode?\"dark\":\"\"}`\n\n const availableOptions = useMemo(() => {\n const isDefaultOption = options && options.length > 0;\n if (!isDefaultOption)\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\n return options;\n }, [options, stringOptions]);\n\n function getFiltered() {\n return availableOptions.filter(\n ({ label, value }) =>\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\n );\n }\n\n function selectItem({ label, value }: { label: string; value: string }) {\n //@ts-expect-error: avoid check\n state.select((prev) => {\n const isItemExist = prev.find((item: any) => item.value == value);\n if (isItemExist) {\n return prev.filter((item: any) => item.value != value);\n }\n return [...prev, { label, value }];\n });\n }\n\n function isItemExist(value: string) {\n return state.value.find((item: any) => item.value == value);\n }\n\n const selectUnSelectAll = useCallback(() => {\n const isAllSelected = state.value.length == availableOptions.length;\n state.select(isAllSelected ? [] : availableOptions);\n }, [state.value]);\n\n function getThemedClass(prefix: string){\n return `var(--color${isdarkmode ? \"-dark\":\"\"}${prefix})`\n }\n\n return (\n <div className={`group w-full ${attr.outerclass}`}>\n {label && (\n <label\n htmlFor={labelHtml}\n className=\"text-input__label\"\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n </label>\n )}\n <div\n className=\"text-input__wrapper relative\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n <input\n type=\"search\"\n value={keyword}\n autoComplete=\"off\"\n className={`${input} ${placeholderClass}`}\n onChange={(e) => setKeyword(e.target.value)}\n placeholder={`${state.value.length} Dipilih`}\n style={{\n color: state.value.length > 0 ? getThemedClass('-text-primary') : undefined\n }}\n />\n <div\n className=\"select-item__wrapper select-multiple__wrapper\"\n style={{\n borderColor: getThemedClass('-border'),\n background: getThemedClass('-bg-surface'),\n }}\n >\n {getFiltered().length == 0 && keyword != \"\" && (\n <button\n disabled\n className=\"select-item\"\n style={{ color: 'var(--color-danger)' }}\n >\n Tidak ada Item\n </button>\n )}\n {getFiltered().map(({ label, value }) => (\n <button\n key={value}\n type=\"button\"\n onClick={() => selectItem({ label, value })}\n className={`select-item ${optionHoverClass}`}\n style={{ color: getThemedClass('-text-secondary')}}\n >\n {label}\n {isItemExist(value) && (\n <FontAwesomeIcon\n icon={faCheck}\n style={{ color: 'var(--color-info)' }}\n />\n )}\n </button>\n ))}\n </div>\n <button\n type=\"button\"\n className=\"cursor-pointer\"\n onClick={selectUnSelectAll}\n >\n <FontAwesomeIcon\n icon={faListCheck}\n style={{\n color: getThemedClass('-icon-input'),\n paddingRight: '0.7rem',\n fontSize: '1.2rem'\n }}\n />\n </button>\n </div>\n </div>\n );\n}\nconst input = \"text-input peer ... w-full\";\n","\"use client\";\nimport React from \"react\";\n\nexport default function ThemeToggle(\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\n) {\n return (\n <div className=\"flex items-center h-[3rem]\">\n <label\n htmlFor={`${attr.id || \"theme-toggle\"}`}\n className=\"slider__wrapper slider-theme slider-theme-light relative\"\n >\n <input\n id=\"theme-toggle\"\n {...attr}\n type=\"checkbox\"\n className=\"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\"\n />\n <span className=\"slider-theme__bullet\"></span>\n </label>\n </div>\n );\n}\n","import React, { useState } from \"react\";\nimport MultiSelect from \"./MultiSelect\";\nimport SingleSelect from \"./SingleSelect\";\n\nconst list = [\n { label: \"Option 1\", value: \"option1\" },\n { label: \"Option 2\", value: \"option2\" },\n { label: \"Option 3\", value: \"option3\" },\n];\nconst stringList = [\"option1\", \"option2\", \"option3\"];\n\nexport default function Dashboard() {\n const [selectedItem, setSelectedItem] = useState<\n { label: string; value: string }[]\n >([]);\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\n\n function updateState(item: string) {\n const filtered = list.find(({ value }) => value == item);\n filtered && setSel(filtered);\n }\n\n return (\n <div className=\"flex items-center gap-[1rem]\">\n <MultiSelect\n isdarkmode={true}\n label=\"Multi Select\"\n stringOptions={stringList}\n state={{ value: selectedItem, select: setSelectedItem }}\n />\n <SingleSelect\n label=\"Single Select\"\n name=\"newinput\"\n stringOptions={stringList}\n placeholder=\"-- Pilih Status --\"\n value={sel.value}\n />\n </div>\n );\n}\n","import React from \"react\";\nexport default function Badge({\n text,\n type,\n className,\n}: {\n text: string;\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\n className?: string;\n}) {\n return (\n <div className=\"badge__wrapper\">\n <span\n style={{\n background: `var(--color-${type})`,\n }}\n className={`badge ${className}`}\n >\n {text}\n </span>\n </div>\n );\n}\n","import React from \"react\";\nexport default function Skeleton({ className }: { className?: string }) {\n return (\n <div className={`${className} skeleton`}>\n <span className=\"skeleton__item skeleton-slide\"></span>\n </div>\n );\n}\n","import React from \"react\";\n\nexport default function Navigation() {\n return <nav></nav>;\n}\n\nconst URLNavigation = (props: {\n list: { label: string; href: string }[];\n activeUrl: string;\n outerclass?: string;\n CustomComponent?: React.ElementType;\n}) => {\n const Component = props.CustomComponent || \"a\";\n function getAnchorClass(href: string) {\n return href === props.activeUrl\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\n }\n\n return (\n <nav className={`nav__wrapper ${props.outerclass}`}>\n {props.list.map((prop) => (\n <Component\n key={prop.href}\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\n {...prop}\n >\n {prop.label}\n </Component>\n ))}\n </nav>\n );\n};\n\nNavigation.URL = URLNavigation;\n\nconst base__anchor =\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\n","import React from \"react\";\n\nexport default function Confirmation({\n type = \"warning\",\n text,\n title,\n secondaryAction,\n secondaryLabel = \"Tidak\",\n mainAction,\n mainLabel = \"Ya\",\n}: {\n mainAction: () => void;\n secondaryAction?: () => void;\n mainLabel?: string;\n secondaryLabel?: string;\n title: string;\n text: string;\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\n}) {\n return (\n <div className=\"confirmation__outer\">\n <div className=\"confirmation__card\">\n <div className={wrapper}>\n <div className={`baloon__${type} baloon`}></div>\n <div>\n <h3 className=\"font-semibold\">{title}</h3>\n <p className={confirmation__text}>{text}</p>\n </div>\n </div>\n <div className=\"confirmation__footer\">\n {secondaryAction && (\n <button\n onClick={secondaryAction}\n type=\"button\"\n className=\"cursor-pointer\"\n style={{ color: `var(--color-${type})` }}\n >\n {secondaryLabel}\n </button>\n )}\n <button\n onClick={mainAction}\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\n style={{\n background: `var(--color-${type})`,\n border: `1px solid var(--color-${type})`,\n }}\n >\n {mainLabel}\n </button>\n </div>\n </div>\n </div>\n );\n}\n\nconst wrapper =\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\nconst confirmation__text =\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\n"],"mappings":"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","names":["list","getIcon","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/dist/styles.css CHANGED
@@ -261,12 +261,18 @@
261
261
  .hidden {
262
262
  display: none;
263
263
  }
264
+ .inline {
265
+ display: inline;
266
+ }
264
267
  .inline-block {
265
268
  display: inline-block;
266
269
  }
267
270
  .\!h-\[2\.95rem\] {
268
271
  height: 2.95rem !important;
269
272
  }
273
+ .h-\[2\.5rem\]\! {
274
+ height: 2.5rem !important;
275
+ }
270
276
  .h-\[2rem\] {
271
277
  height: 2rem;
272
278
  }
@@ -489,6 +495,9 @@
489
495
  --tw-font-weight: var(--font-weight-semibold);
490
496
  font-weight: var(--font-weight-semibold);
491
497
  }
498
+ .text-\(--color-info\) {
499
+ color: var(--color-info);
500
+ }
492
501
  .text-\[var\(--color-icon-input\)\] {
493
502
  color: var(--color-icon-input);
494
503
  }
@@ -1145,7 +1154,7 @@ h3 {
1145
1154
  position: relative;
1146
1155
  z-index: 5;
1147
1156
  margin-top: 0.7rem;
1148
- width: 88%;
1157
+ width: 230px;
1149
1158
  color: var(--color-text-secondary);
1150
1159
  }
1151
1160
  .toast__bar {
package/package.json CHANGED
@@ -40,7 +40,7 @@
40
40
  "uuid": "^11.1.1"
41
41
  },
42
42
  "name": "@safestrong/ppa-component-library",
43
- "version": "1.10.0",
43
+ "version": "1.11.1",
44
44
  "description": "Collection of reusable components for any PPA web applications",
45
45
  "main": "dist/index.js",
46
46
  "module": "dist/index.mjs",