@safestrong/ppa-component-library 1.7.1 → 1.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +10 -10
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +10 -10
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +30 -30
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -101,7 +101,7 @@ function Button(_a) {
|
|
|
101
101
|
return /* @__PURE__ */ import_react.default.createElement(
|
|
102
102
|
"button",
|
|
103
103
|
__spreadProps(__spreadValues({}, rest), {
|
|
104
|
-
className: `${!icon && "py-[0.84rem]"} ${className} ${btnType == "secondary" && "btn__secondary"} btn__primary ${
|
|
104
|
+
className: `${!icon && "py-[0.84rem]"} ${className} ${btnType == "secondary" && "btn__secondary"} btn__primary ${label ? "" : "!p-[0.87rem]"}`
|
|
105
105
|
}),
|
|
106
106
|
buttonIcon && icon && /* @__PURE__ */ import_react.default.createElement(
|
|
107
107
|
import_react_fontawesome.FontAwesomeIcon,
|
|
@@ -124,10 +124,7 @@ var IconButton = (props) => {
|
|
|
124
124
|
);
|
|
125
125
|
};
|
|
126
126
|
var IconButtonGroup = ({ list: list2 }) => {
|
|
127
|
-
|
|
128
|
-
return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${idx !== 0 ? "border-l border-l-[var(--color-border)]" : ""}`;
|
|
129
|
-
}
|
|
130
|
-
return /* @__PURE__ */ import_react.default.createElement("div", { className: "icon__button_group" }, list2.map((props, idx) => /* @__PURE__ */ import_react.default.createElement("button", __spreadValues({ key: idx, className: getBtnClass(idx) }, props), props.icon && /* @__PURE__ */ import_react.default.createElement(import_react_fontawesome.FontAwesomeIcon, { icon: props.icon }))));
|
|
127
|
+
return /* @__PURE__ */ import_react.default.createElement("div", { className: "icon__button_group" }, list2.map((props, idx) => /* @__PURE__ */ import_react.default.createElement("button", __spreadValues({ key: idx + 1, className: getBtnClass(idx) }, props), props.icon && /* @__PURE__ */ import_react.default.createElement(import_react_fontawesome.FontAwesomeIcon, { icon: props.icon }))));
|
|
131
128
|
};
|
|
132
129
|
var SSOButton = ({ href, btnclass }) => {
|
|
133
130
|
return /* @__PURE__ */ import_react.default.createElement("a", { href, className: `sso-button ${btnclass}` }, /* @__PURE__ */ import_react.default.createElement(
|
|
@@ -137,11 +134,14 @@ var SSOButton = ({ href, btnclass }) => {
|
|
|
137
134
|
className: "sso-icon",
|
|
138
135
|
src: "https://storage.ppa-ho.net/public/ppa-component-library/lock.png"
|
|
139
136
|
}
|
|
140
|
-
), "Login dengan SSO");
|
|
137
|
+
), " ", "Login dengan SSO");
|
|
141
138
|
};
|
|
142
139
|
Button.IconButton = IconButton;
|
|
143
140
|
Button.IconButtonGroup = IconButtonGroup;
|
|
144
141
|
Button.SSOButton = SSOButton;
|
|
142
|
+
function getBtnClass(idx) {
|
|
143
|
+
return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${idx == 0 ? "" : "border-l border-l-[var(--color-border)]"}`;
|
|
144
|
+
}
|
|
145
145
|
|
|
146
146
|
// src/components/TextInput.tsx
|
|
147
147
|
var import_react2 = __toESM(require("react"));
|
|
@@ -172,7 +172,7 @@ var import_react3 = __toESM(require("react"));
|
|
|
172
172
|
var import_free_solid_svg_icons2 = require("@fortawesome/free-solid-svg-icons");
|
|
173
173
|
var import_react_fontawesome3 = require("@fortawesome/react-fontawesome");
|
|
174
174
|
function Slider(attr) {
|
|
175
|
-
return /* @__PURE__ */ import_react3.default.createElement("div", { className: "flex items-center h-[3rem]" }, /* @__PURE__ */ import_react3.default.createElement("div", { className: "slider__wrapper group" }, /* @__PURE__ */ import_react3.default.createElement("input", __spreadValues({ id: "slider", type: "checkbox", className: input }, attr)), /* @__PURE__ */ import_react3.default.createElement("label", { htmlFor: attr.id || "slider", className: "slider" }, /* @__PURE__ */ import_react3.default.createElement(
|
|
175
|
+
return /* @__PURE__ */ import_react3.default.createElement("div", { className: "flex items-center h-[3rem]" }, /* @__PURE__ */ import_react3.default.createElement("div", { className: "slider__wrapper group relative" }, /* @__PURE__ */ import_react3.default.createElement("input", __spreadValues({ id: "slider", type: "checkbox", className: input }, attr)), /* @__PURE__ */ import_react3.default.createElement("label", { htmlFor: attr.id || "slider", className: "slider" }, /* @__PURE__ */ import_react3.default.createElement(
|
|
176
176
|
import_react_fontawesome3.FontAwesomeIcon,
|
|
177
177
|
{
|
|
178
178
|
icon: import_free_solid_svg_icons2.faCheck,
|
|
@@ -180,7 +180,7 @@ function Slider(attr) {
|
|
|
180
180
|
}
|
|
181
181
|
))));
|
|
182
182
|
}
|
|
183
|
-
var input = "peer ... w-[
|
|
183
|
+
var input = "peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute";
|
|
184
184
|
|
|
185
185
|
// src/components/SingleSelect.tsx
|
|
186
186
|
var import_react4 = __toESM(require("react"));
|
|
@@ -495,7 +495,7 @@ function ThemeToggle(attr) {
|
|
|
495
495
|
"label",
|
|
496
496
|
{
|
|
497
497
|
htmlFor: `${attr.id || "theme-toggle"}`,
|
|
498
|
-
className: "slider__wrapper slider-theme slider-theme-light"
|
|
498
|
+
className: "slider__wrapper slider-theme slider-theme-light relative"
|
|
499
499
|
},
|
|
500
500
|
/* @__PURE__ */ import_react11.default.createElement(
|
|
501
501
|
"input",
|
|
@@ -503,7 +503,7 @@ function ThemeToggle(attr) {
|
|
|
503
503
|
id: "theme-toggle"
|
|
504
504
|
}, attr), {
|
|
505
505
|
type: "checkbox",
|
|
506
|
-
className: "peer ... w-[
|
|
506
|
+
className: "peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute"
|
|
507
507
|
})
|
|
508
508
|
),
|
|
509
509
|
/* @__PURE__ */ import_react11.default.createElement("span", { className: "slider-theme__bullet" })
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["export { default as Button } from \"./components/Button\";\r\nexport { default as TextInput } from \"./components/TextInput\";\r\nexport { default as Slider } from \"./components/Slider\";\r\nexport { default as SingleSelect } from \"./components/SingleSelect\";\r\nexport { default as Tooltip } from \"./components/Tooltip\";\r\nexport { default as NavTabClient } from \"./components/NavTabClient\";\r\nexport { default as Card } from \"./components/Card\";\r\nexport { default as Toast } from \"./components/Toast\";\r\nexport { default as Expandable } from \"./components/Expandable\";\r\nexport { default as MultiSelect } from \"./components/MultiSelect\";\r\nexport { default as ThemeToggle } from \"./components/ThemeToggle\";\r\nexport { default as Dashboard } from \"./components/Dashboard\";\r\nexport { default as Badge } from \"./components/Badge\";\r\nexport { default as Skeleton } from \"./components/Skeleton\";\r\nexport { default as Navigation } from \"./components/Navigation\";\r\nexport { default as Confirmation } from \"./components/Confirmation\";\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\r\n icon?: IconProp;\r\n label?: string;\r\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\r\n isLoading?: boolean;\r\n};\r\n\r\nexport default function Button({\r\n label,\r\n icon,\r\n isLoading,\r\n btnType,\r\n className,\r\n ...rest\r\n}: Readonly<Button>) {\r\n const buttonIcon = isLoading ? faCircleNotch : icon;\r\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\r\n return (\r\n <button\r\n {...rest}\r\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\r\n btnType == \"secondary\" && \"btn__secondary\"\r\n } btn__primary ${!label ? \"!p-[0.87rem]\" : \"\"}`}\r\n >\r\n {buttonIcon && icon && (\r\n <FontAwesomeIcon\r\n icon={buttonIcon}\r\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\r\n isLoading && \"animate-spin\"\r\n }`}\r\n />\r\n )}\r\n {isLoading ? loadingLabel : label}\r\n </button>\r\n );\r\n}\r\n\r\nconst IconButton = (props: Readonly<Button>) => {\r\n return (\r\n <button\r\n {...props}\r\n className={`${props.className} ${\r\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\r\n } icon__button`}\r\n >\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n {props.label && (\r\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\r\n {props.label}\r\n </span>\r\n )}\r\n </button>\r\n );\r\n};\r\n\r\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\r\n function getBtnClass(idx: number) {\r\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${\r\n idx !== 0 ? \"border-l border-l-[var(--color-border)]\" : \"\"\r\n }`;\r\n }\r\n return (\r\n <div className=\"icon__button_group\">\r\n {list.map((props, idx) => (\r\n <button key={idx} className={getBtnClass(idx)} {...props}>\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n </button>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\r\n return (\r\n <a href={href} className={`sso-button ${btnclass}`}>\r\n <img\r\n alt=\"logo\"\r\n className=\"sso-icon\"\r\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\r\n />\r\n Login dengan SSO\r\n </a>\r\n );\r\n};\r\n\r\nButton.IconButton = IconButton;\r\nButton.IconButtonGroup = IconButtonGroup;\r\nButton.SSOButton = SSOButton;\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nconst input__icon =\r\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)]\";\r\n\r\nexport default function TextInput({\r\n label,\r\n labelFor,\r\n icon,\r\n outerclass,\r\n ...attr\r\n}: Readonly<\r\n React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelFor?: string;\r\n icon?: IconProp;\r\n outerclass?: string;\r\n }\r\n>) {\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label htmlFor={labelFor} className=\"text-input__label\">\r\n {label}\r\n </label>\r\n )}\r\n <div className={`text-input__wrapper overflow-hidden ${attr.className}`}>\r\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\r\n <input\r\n {...attr}\r\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"}`}\r\n />\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\nexport default function Slider(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <div className=\"slider__wrapper group\">\r\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\r\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[0.7rem] translate-x-[0.2px]\"\r\n />\r\n </label>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst input = \"peer ... w-[3rem] h-[1.6rem] opacity-[0] cursor-pointer\";\r\n","\"use client\";\r\nimport React, { useEffect, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelHtml?: string;\r\n placeholder?: string;\r\n stateaction?: (param: any) => void;\r\n outerclass?: string;\r\n options?: {\r\n label: string;\r\n value: string;\r\n }[];\r\n stringOptions?: string[];\r\n};\r\n\r\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\r\n const { options = [], stringOptions = [], ...attrInput } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const [selected, setSelected] = useState<{ label: string; value: any }>({\r\n label: \"\",\r\n value: \"\",\r\n });\r\n\r\n function selectItem(\r\n { label, value }: { label: string; value: any },\r\n e: React.MouseEvent<HTMLButtonElement>\r\n ) {\r\n const triggerManual = attrInput.onChange;\r\n if (triggerManual) {\r\n triggerManual?.({\r\n target: { value, name: attrInput.name },\r\n } as React.ChangeEvent<HTMLInputElement>);\r\n }\r\n setSelected({ label, value });\r\n if (attr.stateaction) {\r\n if (stringOptions) attr.stateaction(value);\r\n if (options) attr.stateaction({ label, value });\r\n }\r\n setKeyword(\"\");\r\n setTimeout(() => {\r\n (e.target as HTMLButtonElement).blur();\r\n }, 250);\r\n }\r\n\r\n function autoUpdateValue(updatedValue: string) {\r\n if (updatedValue) {\r\n const filtered = availableOptions.find(\r\n ({ value }) => value == updatedValue\r\n );\r\n if (filtered) setSelected(filtered);\r\n }\r\n }\r\n\r\n const availableOptions = useMemo(() => {\r\n let defaultOptions = options && options.length > 0;\r\n if (!defaultOptions)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n const filteredOptions = useMemo(() => {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }, [keyword, availableOptions]);\r\n\r\n useEffect(() => {\r\n attrInput.value && autoUpdateValue(attrInput.value as string);\r\n }, [attrInput.value]);\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div className={`${attrInput.className} text-input__wrapper relative`}>\r\n <input\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n type=\"hidden\"\r\n />\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${input} ${\r\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n />\r\n <div className=\"select-item__wrapper\">\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nSingleSelect.autoFill = autoFillInput;\r\n\r\nfunction autoFillInput(\r\n value: string,\r\n elName: string,\r\n list: { label: string; value: string }[]\r\n) {\r\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\r\n inp.value = `${value}`;\r\n const filtered = list.find((item) => item.value == value);\r\n const el = document.querySelector(`.${elName}-keyword`);\r\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\r\n}\r\n\r\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","import React from \"react\";\r\n\r\ntype Tooltip = {\r\n children: React.ReactNode;\r\n text: string;\r\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\r\n};\r\n\r\nexport default function Tooltip({\r\n children,\r\n text,\r\n position = \"top\",\r\n}: Readonly<Tooltip>) {\r\n function getAccent() {\r\n const mapping = {\r\n top,\r\n bottom,\r\n left,\r\n right,\r\n };\r\n return mapping[position];\r\n }\r\n return (\r\n <div className=\"relative\">\r\n <div className=\"peer\">{children}</div>\r\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\r\n </div>\r\n );\r\n}\r\n\r\nconst top =\r\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\r\nconst bottom =\r\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\r\nconst right =\r\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\r\nconst left =\r\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\r\n","import React from \"react\";\r\n\r\ntype Option = {\r\n label: string;\r\n value: string;\r\n};\r\n\r\nexport default function NavTabClient({\r\n items,\r\n state,\r\n}: Readonly<{\r\n items: Option[];\r\n state: {\r\n active: string;\r\n setActive: (val: string) => void;\r\n };\r\n}>) {\r\n return (\r\n <nav className=\"navtab__wrapper\">\r\n {items.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n className={`navtab__item ${\r\n state.active == value\r\n ? \"navtab__item__active\"\r\n : \"hover:bg-[var(--color-border)]/50\"\r\n }`}\r\n onClick={() => state.setActive(value)}\r\n >\r\n {label}\r\n </button>\r\n ))}\r\n </nav>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\ntype Card = {\r\n children: React.ReactNode;\r\n className?: string;\r\n};\r\n\r\nexport default function Card({ children, className }: Readonly<Card>) {\r\n return <div className={`card ${className}`}>{children}</div>;\r\n}\r\n\r\nconst Footer = ({\r\n className,\r\n children,\r\n}: {\r\n className?: string;\r\n children?: React.ReactNode;\r\n}) => {\r\n return (\r\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\r\n {children}\r\n </div>\r\n );\r\n};\r\n\r\nCard.Footer = Footer;\r\n","import React from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {\r\n faCheckCircle,\r\n faInfoCircle,\r\n faQuestionCircle,\r\n faXmarkCircle,\r\n} from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\r\ntype Toast = {\r\n title: string;\r\n className?: string;\r\n description: string;\r\n type: ToastType;\r\n};\r\n\r\nexport default function Toast({\r\n title,\r\n description,\r\n type = \"info\",\r\n className,\r\n}: Readonly<Toast>) {\r\n return (\r\n <div className={`toast__wrapper group ${className}`}>\r\n <div className=\"toast__body\">\r\n <div style={{ background: getColor(type) }} className={bullet}></div>\r\n <div>\r\n <p className=\"toast__title\">{title}</p>\r\n <p className=\"toast__description\">{description}</p>\r\n </div>\r\n <div className={`toast__icon toast__icon__${type}`}></div>\r\n </div>\r\n <p\r\n className=\"toast__bar toast-bar-animate\"\r\n style={{ background: getColor(type) }}\r\n ></p>\r\n </div>\r\n );\r\n}\r\n\r\nconst Inline = ({\r\n className,\r\n text,\r\n type,\r\n}: {\r\n className?: string;\r\n text: string;\r\n type: ToastType;\r\n}) => {\r\n return (\r\n <div\r\n className={`toast__inline ${className}`}\r\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\r\n >\r\n <FontAwesomeIcon\r\n icon={getIcon(type)}\r\n className=\"text-[1.3rem]\"\r\n style={{ color: getColor(type) }}\r\n />\r\n <p>{text}</p>\r\n </div>\r\n );\r\n};\r\n\r\nToast.Inline = Inline;\r\n\r\nfunction getColor(type: string) {\r\n return `var(--color-${type})`;\r\n}\r\n\r\nfunction getIcon(type: string) {\r\n const mapping = {\r\n warning: faQuestionCircle,\r\n info: faInfoCircle,\r\n danger: faXmarkCircle,\r\n success: faCheckCircle,\r\n };\r\n //@ts-expect-error call object using array index\r\n return mapping[type];\r\n}\r\n\r\nconst bullet =\r\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\r\n","import React from \"react\";\r\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\ntype Expandable = {\r\n children: React.ReactNode;\r\n title: string;\r\n className?: string;\r\n isOpen?: boolean;\r\n};\r\n\r\nexport default function Expandable({\r\n children,\r\n title,\r\n className,\r\n isOpen,\r\n}: Readonly<Expandable>) {\r\n const name = title.replace(\" \", \"\");\r\n return (\r\n <div className={`expandable ${className}`}>\r\n <input\r\n id={name}\r\n type=\"checkbox\"\r\n defaultChecked={isOpen}\r\n className=\"opacity-[0] peer absolute top-0 ex-title\"\r\n />\r\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\r\n <label htmlFor={name} className=\"expandable__title\">\r\n {title}\r\n </label>\r\n <div className=\"expandable__body\">\r\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React, { useCallback, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Option = {\r\n value: string;\r\n label: string;\r\n};\r\n\r\ntype MultiSelect = {\r\n label?: string;\r\n labelHtml?: string;\r\n outerclass?: string;\r\n options?: Option[];\r\n stringOptions?: string[];\r\n state: { value: Option[]; select: (newVal: Option[]) => void };\r\n};\r\n\r\nexport default function MultiSelect({\r\n state,\r\n label,\r\n labelHtml,\r\n ...attr\r\n}: Readonly<MultiSelect>) {\r\n const { options = [], stringOptions = [] } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n\r\n const availableOptions = useMemo(() => {\r\n const isDefaultOption = options && options.length > 0;\r\n if (!isDefaultOption)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n function getFiltered() {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }\r\n\r\n function selectItem({ label, value }: { label: string; value: string }) {\r\n //@ts-expect-error: avoid check\r\n state.select((prev) => {\r\n const isItemExist = prev.find((item: any) => item.value == value);\r\n if (isItemExist) {\r\n return prev.filter((item: any) => item.value != value);\r\n }\r\n return [...prev, { label, value }];\r\n });\r\n }\r\n\r\n function isItemExist(value: string) {\r\n return state.value.find((item: any) => item.value == value);\r\n }\r\n\r\n const selectUnSelectAll = useCallback(() => {\r\n const isAllSelected = state.value.length == availableOptions.length;\r\n state.select(isAllSelected ? [] : availableOptions);\r\n }, [state.value]);\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label className=\"text-input__label\" htmlFor={labelHtml}>\r\n {label}\r\n </label>\r\n )}\r\n <div className=\"text-input__wrapper relative\">\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n placeholder={`${state.value.length} Dipilih`}\r\n className={`${input} ${\r\n state.value.length > 0 &&\r\n \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n />\r\n <div className=\"select-item__wrapper select-multiple__wrapper\">\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <button\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n onClick={selectUnSelectAll}\r\n >\r\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\r\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","\"use client\";\r\nimport React from \"react\";\r\n\r\nexport default function ThemeToggle(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <label\r\n htmlFor={`${attr.id || \"theme-toggle\"}`}\r\n className=\"slider__wrapper slider-theme slider-theme-light\"\r\n >\r\n <input\r\n id=\"theme-toggle\"\r\n {...attr}\r\n type=\"checkbox\"\r\n className=\"peer ... w-[2rem] opacity-[0] cursor-pointer\"\r\n />\r\n <span className=\"slider-theme__bullet\"></span>\r\n </label>\r\n </div>\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport MultiSelect from \"./MultiSelect\";\r\nimport SingleSelect from \"./SingleSelect\";\r\n\r\nconst list = [\r\n { label: \"Option 1\", value: \"option1\" },\r\n { label: \"Option 2\", value: \"option2\" },\r\n { label: \"Option 3\", value: \"option3\" },\r\n];\r\nconst stringList = [\"option1\", \"option2\", \"option3\"];\r\n\r\nexport default function Dashboard() {\r\n const [selectedItem, setSelectedItem] = useState<\r\n { label: string; value: string }[]\r\n >([]);\r\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\r\n\r\n function updateState(item: string) {\r\n const filtered = list.find(({ value }) => value == item);\r\n filtered && setSel(filtered);\r\n }\r\n\r\n return (\r\n <div className=\"flex items-center gap-[1rem]\">\r\n <MultiSelect\r\n label=\"Multi Select\"\r\n stringOptions={stringList}\r\n state={{ value: selectedItem, select: setSelectedItem }}\r\n />\r\n <SingleSelect\r\n label=\"Single Select\"\r\n name=\"newinput\"\r\n stringOptions={stringList}\r\n placeholder=\"-- Pilih Status --\"\r\n value={sel.value}\r\n />\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Badge({\r\n text,\r\n type,\r\n className,\r\n}: {\r\n text: string;\r\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\r\n className?: string;\r\n}) {\r\n return (\r\n <div className=\"badge__wrapper\">\r\n <span\r\n style={{\r\n background: `var(--color-${type})`,\r\n }}\r\n className={`badge ${className}`}\r\n >\r\n {text}\r\n </span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Skeleton({ className }: { className?: string }) {\r\n return (\r\n <div className={`${className} skeleton`}>\r\n <span className=\"skeleton__item skeleton-slide\"></span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nexport default function Navigation() {\r\n return <nav></nav>;\r\n}\r\n\r\nconst URLNavigation = (props: {\r\n list: { label: string; href: string }[];\r\n activeUrl: string;\r\n outerclass?: string;\r\n CustomComponent?: React.ElementType;\r\n}) => {\r\n const Component = props.CustomComponent || \"a\";\r\n function getAnchorClass(href: string) {\r\n return href === props.activeUrl\r\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\r\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\r\n }\r\n\r\n return (\r\n <nav className={`nav__wrapper ${props.outerclass}`}>\r\n {props.list.map((prop) => (\r\n <Component\r\n key={prop.href}\r\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\r\n {...prop}\r\n >\r\n {prop.label}\r\n </Component>\r\n ))}\r\n </nav>\r\n );\r\n};\r\n\r\nNavigation.URL = URLNavigation;\r\n\r\nconst base__anchor =\r\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\r\n","import React from \"react\";\r\n\r\nexport default function Confirmation({\r\n type = \"warning\",\r\n text,\r\n title,\r\n secondaryAction,\r\n secondaryLabel = \"Tidak\",\r\n mainAction,\r\n mainLabel = \"Ya\",\r\n}: {\r\n mainAction: () => void;\r\n secondaryAction?: () => void;\r\n mainLabel?: string;\r\n secondaryLabel?: string;\r\n title: string;\r\n text: string;\r\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\r\n}) {\r\n return (\r\n <div className=\"confirmation__outer\">\r\n <div className=\"confirmation__card\">\r\n <div className={wrapper}>\r\n <div className={`baloon__${type} baloon`}></div>\r\n <div>\r\n <h3 className=\"font-semibold\">{title}</h3>\r\n <p className={confirmation__text}>{text}</p>\r\n </div>\r\n </div>\r\n <div className=\"confirmation__footer\">\r\n {secondaryAction && (\r\n <button\r\n onClick={secondaryAction}\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n style={{ color: `var(--color-${type})` }}\r\n >\r\n {secondaryLabel}\r\n </button>\r\n )}\r\n <button\r\n onClick={() => {\r\n mainAction();\r\n secondaryAction && secondaryAction();\r\n }}\r\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\r\n style={{\r\n background: `var(--color-${type})`,\r\n border: `1px solid var(--color-${type})`,\r\n }}\r\n >\r\n {mainLabel}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst wrapper =\r\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\r\nconst confirmation__text =\r\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\r\n"],"mappings":"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","names":["React","list","import_react","import_react_fontawesome","React","import_react","import_free_solid_svg_icons","import_react_fontawesome","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","React","input","input__icon","list","import_react","React","import_react","React","import_react","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","React","import_react","import_free_solid_svg_icons","import_react_fontawesome","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","label","isItemExist","React","input","input__icon","import_react","React","import_react","React","import_react","React","import_react","React","import_react","React","import_react","React"]}
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["export { default as Button } from \"./components/Button\";\r\nexport { default as TextInput } from \"./components/TextInput\";\r\nexport { default as Slider } from \"./components/Slider\";\r\nexport { default as SingleSelect } from \"./components/SingleSelect\";\r\nexport { default as Tooltip } from \"./components/Tooltip\";\r\nexport { default as NavTabClient } from \"./components/NavTabClient\";\r\nexport { default as Card } from \"./components/Card\";\r\nexport { default as Toast } from \"./components/Toast\";\r\nexport { default as Expandable } from \"./components/Expandable\";\r\nexport { default as MultiSelect } from \"./components/MultiSelect\";\r\nexport { default as ThemeToggle } from \"./components/ThemeToggle\";\r\nexport { default as Dashboard } from \"./components/Dashboard\";\r\nexport { default as Badge } from \"./components/Badge\";\r\nexport { default as Skeleton } from \"./components/Skeleton\";\r\nexport { default as Navigation } from \"./components/Navigation\";\r\nexport { default as Confirmation } from \"./components/Confirmation\";\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\r\n icon?: IconProp;\r\n label?: string;\r\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\r\n isLoading?: boolean;\r\n};\r\n\r\nexport default function Button({\r\n label,\r\n icon,\r\n isLoading,\r\n btnType,\r\n className,\r\n ...rest\r\n}: Readonly<Button>) {\r\n const buttonIcon = isLoading ? faCircleNotch : icon;\r\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\r\n return (\r\n <button\r\n {...rest}\r\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\r\n btnType == \"secondary\" && \"btn__secondary\"\r\n } btn__primary ${label ? \"\" : \"!p-[0.87rem]\"}`}\r\n >\r\n {buttonIcon && icon && (\r\n <FontAwesomeIcon\r\n icon={buttonIcon}\r\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\r\n isLoading && \"animate-spin\"\r\n }`}\r\n />\r\n )}\r\n {isLoading ? loadingLabel : label}\r\n </button>\r\n );\r\n}\r\n\r\nconst IconButton = (props: Readonly<Button>) => {\r\n return (\r\n <button\r\n {...props}\r\n className={`${props.className} ${\r\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\r\n } icon__button`}\r\n >\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n {props.label && (\r\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\r\n {props.label}\r\n </span>\r\n )}\r\n </button>\r\n );\r\n};\r\n\r\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\r\n return (\r\n <div className=\"icon__button_group\">\r\n {list.map((props, idx) => (\r\n <button key={idx + 1} className={getBtnClass(idx)} {...props}>\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n </button>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\r\n return (\r\n <a href={href} className={`sso-button ${btnclass}`}>\r\n <img\r\n alt=\"logo\"\r\n className=\"sso-icon\"\r\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\r\n />{\" \"}\r\n Login dengan SSO\r\n </a>\r\n );\r\n};\r\n\r\nButton.IconButton = IconButton;\r\nButton.IconButtonGroup = IconButtonGroup;\r\nButton.SSOButton = SSOButton;\r\n\r\nfunction getBtnClass(idx: number) {\r\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${\r\n idx == 0 ? \"\" : \"border-l border-l-[var(--color-border)]\"\r\n }`;\r\n}\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nconst input__icon =\r\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)]\";\r\n\r\nexport default function TextInput({\r\n label,\r\n labelFor,\r\n icon,\r\n outerclass,\r\n ...attr\r\n}: Readonly<\r\n React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelFor?: string;\r\n icon?: IconProp;\r\n outerclass?: string;\r\n }\r\n>) {\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label htmlFor={labelFor} className=\"text-input__label\">\r\n {label}\r\n </label>\r\n )}\r\n <div className={`text-input__wrapper overflow-hidden ${attr.className}`}>\r\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\r\n <input\r\n {...attr}\r\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"}`}\r\n />\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\nexport default function Slider(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <div className=\"slider__wrapper group relative\">\r\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\r\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[0.7rem] translate-x-[0.2px]\"\r\n />\r\n </label>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst input = \"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\";\r\n","\"use client\";\r\nimport React, { useEffect, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelHtml?: string;\r\n placeholder?: string;\r\n stateaction?: (param: any) => void;\r\n outerclass?: string;\r\n options?: {\r\n label: string;\r\n value: string;\r\n }[];\r\n stringOptions?: string[];\r\n};\r\n\r\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\r\n const { options = [], stringOptions = [], ...attrInput } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const [selected, setSelected] = useState<{ label: string; value: any }>({\r\n label: \"\",\r\n value: \"\",\r\n });\r\n\r\n function selectItem(\r\n { label, value }: { label: string; value: any },\r\n e: React.MouseEvent<HTMLButtonElement>\r\n ) {\r\n const triggerManual = attrInput.onChange;\r\n if (triggerManual) {\r\n triggerManual?.({\r\n target: { value, name: attrInput.name },\r\n } as React.ChangeEvent<HTMLInputElement>);\r\n }\r\n setSelected({ label, value });\r\n if (attr.stateaction) {\r\n if (stringOptions) attr.stateaction(value);\r\n if (options) attr.stateaction({ label, value });\r\n }\r\n setKeyword(\"\");\r\n setTimeout(() => {\r\n (e.target as HTMLButtonElement).blur();\r\n }, 250);\r\n }\r\n\r\n function autoUpdateValue(updatedValue: string) {\r\n if (updatedValue) {\r\n const filtered = availableOptions.find(\r\n ({ value }) => value == updatedValue\r\n );\r\n if (filtered) setSelected(filtered);\r\n }\r\n }\r\n\r\n const availableOptions = useMemo(() => {\r\n let defaultOptions = options && options.length > 0;\r\n if (!defaultOptions)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n const filteredOptions = useMemo(() => {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }, [keyword, availableOptions]);\r\n\r\n useEffect(() => {\r\n attrInput.value && autoUpdateValue(attrInput.value as string);\r\n }, [attrInput.value]);\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div className={`${attrInput.className} text-input__wrapper relative`}>\r\n <input\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n type=\"hidden\"\r\n />\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${input} ${\r\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n />\r\n <div className=\"select-item__wrapper\">\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nSingleSelect.autoFill = autoFillInput;\r\n\r\nfunction autoFillInput(\r\n value: string,\r\n elName: string,\r\n list: { label: string; value: string }[]\r\n) {\r\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\r\n inp.value = `${value}`;\r\n const filtered = list.find((item) => item.value == value);\r\n const el = document.querySelector(`.${elName}-keyword`);\r\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\r\n}\r\n\r\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","import React from \"react\";\r\n\r\ntype Tooltip = {\r\n children: React.ReactNode;\r\n text: string;\r\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\r\n};\r\n\r\nexport default function Tooltip({\r\n children,\r\n text,\r\n position = \"top\",\r\n}: Readonly<Tooltip>) {\r\n function getAccent() {\r\n const mapping = {\r\n top,\r\n bottom,\r\n left,\r\n right,\r\n };\r\n return mapping[position];\r\n }\r\n return (\r\n <div className=\"relative\">\r\n <div className=\"peer\">{children}</div>\r\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\r\n </div>\r\n );\r\n}\r\n\r\nconst top =\r\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\r\nconst bottom =\r\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\r\nconst right =\r\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\r\nconst left =\r\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\r\n","import React from \"react\";\r\n\r\ntype Option = {\r\n label: string;\r\n value: string;\r\n};\r\n\r\nexport default function NavTabClient({\r\n items,\r\n state,\r\n}: Readonly<{\r\n items: Option[];\r\n state: {\r\n active: string;\r\n setActive: (val: string) => void;\r\n };\r\n}>) {\r\n return (\r\n <nav className=\"navtab__wrapper\">\r\n {items.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n className={`navtab__item ${\r\n state.active == value\r\n ? \"navtab__item__active\"\r\n : \"hover:bg-[var(--color-border)]/50\"\r\n }`}\r\n onClick={() => state.setActive(value)}\r\n >\r\n {label}\r\n </button>\r\n ))}\r\n </nav>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\ntype Card = {\r\n children: React.ReactNode;\r\n className?: string;\r\n};\r\n\r\nexport default function Card({ children, className }: Readonly<Card>) {\r\n return <div className={`card ${className}`}>{children}</div>;\r\n}\r\n\r\nconst Footer = ({\r\n className,\r\n children,\r\n}: {\r\n className?: string;\r\n children?: React.ReactNode;\r\n}) => {\r\n return (\r\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\r\n {children}\r\n </div>\r\n );\r\n};\r\n\r\nCard.Footer = Footer;\r\n","import React from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {\r\n faCheckCircle,\r\n faInfoCircle,\r\n faQuestionCircle,\r\n faXmarkCircle,\r\n} from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\r\ntype Toast = {\r\n title: string;\r\n className?: string;\r\n description: string;\r\n type: ToastType;\r\n};\r\n\r\nexport default function Toast({\r\n title,\r\n description,\r\n type = \"info\",\r\n className,\r\n}: Readonly<Toast>) {\r\n return (\r\n <div className={`toast__wrapper group ${className}`}>\r\n <div className=\"toast__body\">\r\n <div style={{ background: getColor(type) }} className={bullet}></div>\r\n <div>\r\n <p className=\"toast__title\">{title}</p>\r\n <p className=\"toast__description\">{description}</p>\r\n </div>\r\n <div className={`toast__icon toast__icon__${type}`}></div>\r\n </div>\r\n <p\r\n className=\"toast__bar toast-bar-animate\"\r\n style={{ background: getColor(type) }}\r\n ></p>\r\n </div>\r\n );\r\n}\r\n\r\nconst Inline = ({\r\n className,\r\n text,\r\n type,\r\n}: {\r\n className?: string;\r\n text: string;\r\n type: ToastType;\r\n}) => {\r\n return (\r\n <div\r\n className={`toast__inline ${className}`}\r\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\r\n >\r\n <FontAwesomeIcon\r\n icon={getIcon(type)}\r\n className=\"text-[1.3rem]\"\r\n style={{ color: getColor(type) }}\r\n />\r\n <p>{text}</p>\r\n </div>\r\n );\r\n};\r\n\r\nToast.Inline = Inline;\r\n\r\nfunction getColor(type: string) {\r\n return `var(--color-${type})`;\r\n}\r\n\r\nfunction getIcon(type: string) {\r\n const mapping = {\r\n warning: faQuestionCircle,\r\n info: faInfoCircle,\r\n danger: faXmarkCircle,\r\n success: faCheckCircle,\r\n };\r\n //@ts-expect-error call object using array index\r\n return mapping[type];\r\n}\r\n\r\nconst bullet =\r\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\r\n","import React from \"react\";\r\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\ntype Expandable = {\r\n children: React.ReactNode;\r\n title: string;\r\n className?: string;\r\n isOpen?: boolean;\r\n};\r\n\r\nexport default function Expandable({\r\n children,\r\n title,\r\n className,\r\n isOpen,\r\n}: Readonly<Expandable>) {\r\n const name = title.replace(\" \", \"\");\r\n return (\r\n <div className={`expandable ${className}`}>\r\n <input\r\n id={name}\r\n type=\"checkbox\"\r\n defaultChecked={isOpen}\r\n className=\"opacity-[0] peer absolute top-0 ex-title\"\r\n />\r\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\r\n <label htmlFor={name} className=\"expandable__title\">\r\n {title}\r\n </label>\r\n <div className=\"expandable__body\">\r\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React, { useCallback, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Option = {\r\n value: string;\r\n label: string;\r\n};\r\n\r\ntype MultiSelect = {\r\n label?: string;\r\n labelHtml?: string;\r\n outerclass?: string;\r\n options?: Option[];\r\n stringOptions?: string[];\r\n state: { value: Option[]; select: (newVal: Option[]) => void };\r\n};\r\n\r\nexport default function MultiSelect({\r\n state,\r\n label,\r\n labelHtml,\r\n ...attr\r\n}: Readonly<MultiSelect>) {\r\n const { options = [], stringOptions = [] } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n\r\n const availableOptions = useMemo(() => {\r\n const isDefaultOption = options && options.length > 0;\r\n if (!isDefaultOption)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n function getFiltered() {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }\r\n\r\n function selectItem({ label, value }: { label: string; value: string }) {\r\n //@ts-expect-error: avoid check\r\n state.select((prev) => {\r\n const isItemExist = prev.find((item: any) => item.value == value);\r\n if (isItemExist) {\r\n return prev.filter((item: any) => item.value != value);\r\n }\r\n return [...prev, { label, value }];\r\n });\r\n }\r\n\r\n function isItemExist(value: string) {\r\n return state.value.find((item: any) => item.value == value);\r\n }\r\n\r\n const selectUnSelectAll = useCallback(() => {\r\n const isAllSelected = state.value.length == availableOptions.length;\r\n state.select(isAllSelected ? [] : availableOptions);\r\n }, [state.value]);\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label className=\"text-input__label\" htmlFor={labelHtml}>\r\n {label}\r\n </label>\r\n )}\r\n <div className=\"text-input__wrapper relative\">\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n placeholder={`${state.value.length} Dipilih`}\r\n className={`${input} ${\r\n state.value.length > 0 &&\r\n \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n />\r\n <div className=\"select-item__wrapper select-multiple__wrapper\">\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <button\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n onClick={selectUnSelectAll}\r\n >\r\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\r\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","\"use client\";\r\nimport React from \"react\";\r\n\r\nexport default function ThemeToggle(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <label\r\n htmlFor={`${attr.id || \"theme-toggle\"}`}\r\n className=\"slider__wrapper slider-theme slider-theme-light relative\"\r\n >\r\n <input\r\n id=\"theme-toggle\"\r\n {...attr}\r\n type=\"checkbox\"\r\n className=\"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\"\r\n />\r\n <span className=\"slider-theme__bullet\"></span>\r\n </label>\r\n </div>\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport MultiSelect from \"./MultiSelect\";\r\nimport SingleSelect from \"./SingleSelect\";\r\n\r\nconst list = [\r\n { label: \"Option 1\", value: \"option1\" },\r\n { label: \"Option 2\", value: \"option2\" },\r\n { label: \"Option 3\", value: \"option3\" },\r\n];\r\nconst stringList = [\"option1\", \"option2\", \"option3\"];\r\n\r\nexport default function Dashboard() {\r\n const [selectedItem, setSelectedItem] = useState<\r\n { label: string; value: string }[]\r\n >([]);\r\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\r\n\r\n function updateState(item: string) {\r\n const filtered = list.find(({ value }) => value == item);\r\n filtered && setSel(filtered);\r\n }\r\n\r\n return (\r\n <div className=\"flex items-center gap-[1rem]\">\r\n <MultiSelect\r\n label=\"Multi Select\"\r\n stringOptions={stringList}\r\n state={{ value: selectedItem, select: setSelectedItem }}\r\n />\r\n <SingleSelect\r\n label=\"Single Select\"\r\n name=\"newinput\"\r\n stringOptions={stringList}\r\n placeholder=\"-- Pilih Status --\"\r\n value={sel.value}\r\n />\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Badge({\r\n text,\r\n type,\r\n className,\r\n}: {\r\n text: string;\r\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\r\n className?: string;\r\n}) {\r\n return (\r\n <div className=\"badge__wrapper\">\r\n <span\r\n style={{\r\n background: `var(--color-${type})`,\r\n }}\r\n className={`badge ${className}`}\r\n >\r\n {text}\r\n </span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Skeleton({ className }: { className?: string }) {\r\n return (\r\n <div className={`${className} skeleton`}>\r\n <span className=\"skeleton__item skeleton-slide\"></span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nexport default function Navigation() {\r\n return <nav></nav>;\r\n}\r\n\r\nconst URLNavigation = (props: {\r\n list: { label: string; href: string }[];\r\n activeUrl: string;\r\n outerclass?: string;\r\n CustomComponent?: React.ElementType;\r\n}) => {\r\n const Component = props.CustomComponent || \"a\";\r\n function getAnchorClass(href: string) {\r\n return href === props.activeUrl\r\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\r\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\r\n }\r\n\r\n return (\r\n <nav className={`nav__wrapper ${props.outerclass}`}>\r\n {props.list.map((prop) => (\r\n <Component\r\n key={prop.href}\r\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\r\n {...prop}\r\n >\r\n {prop.label}\r\n </Component>\r\n ))}\r\n </nav>\r\n );\r\n};\r\n\r\nNavigation.URL = URLNavigation;\r\n\r\nconst base__anchor =\r\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\r\n","import React from \"react\";\r\n\r\nexport default function Confirmation({\r\n type = \"warning\",\r\n text,\r\n title,\r\n secondaryAction,\r\n secondaryLabel = \"Tidak\",\r\n mainAction,\r\n mainLabel = \"Ya\",\r\n}: {\r\n mainAction: () => void;\r\n secondaryAction?: () => void;\r\n mainLabel?: string;\r\n secondaryLabel?: string;\r\n title: string;\r\n text: string;\r\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\r\n}) {\r\n return (\r\n <div className=\"confirmation__outer\">\r\n <div className=\"confirmation__card\">\r\n <div className={wrapper}>\r\n <div className={`baloon__${type} baloon`}></div>\r\n <div>\r\n <h3 className=\"font-semibold\">{title}</h3>\r\n <p className={confirmation__text}>{text}</p>\r\n </div>\r\n </div>\r\n <div className=\"confirmation__footer\">\r\n {secondaryAction && (\r\n <button\r\n onClick={secondaryAction}\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n style={{ color: `var(--color-${type})` }}\r\n >\r\n {secondaryLabel}\r\n </button>\r\n )}\r\n <button\r\n onClick={() => {\r\n mainAction();\r\n secondaryAction && secondaryAction();\r\n }}\r\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\r\n style={{\r\n background: `var(--color-${type})`,\r\n border: `1px solid var(--color-${type})`,\r\n }}\r\n >\r\n {mainLabel}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst wrapper =\r\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\r\nconst confirmation__text =\r\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\r\n"],"mappings":"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","names":["React","list","import_react","import_react_fontawesome","React","import_react","import_free_solid_svg_icons","import_react_fontawesome","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","React","input","input__icon","list","import_react","React","import_react","React","import_react","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","React","import_react","import_free_solid_svg_icons","import_react_fontawesome","React","import_react","import_react_fontawesome","import_free_solid_svg_icons","label","isItemExist","React","input","input__icon","import_react","React","import_react","React","import_react","React","import_react","React","import_react","React","import_react","React"]}
|
package/dist/index.mjs
CHANGED
|
@@ -53,7 +53,7 @@ function Button(_a) {
|
|
|
53
53
|
return /* @__PURE__ */ React.createElement(
|
|
54
54
|
"button",
|
|
55
55
|
__spreadProps(__spreadValues({}, rest), {
|
|
56
|
-
className: `${!icon && "py-[0.84rem]"} ${className} ${btnType == "secondary" && "btn__secondary"} btn__primary ${
|
|
56
|
+
className: `${!icon && "py-[0.84rem]"} ${className} ${btnType == "secondary" && "btn__secondary"} btn__primary ${label ? "" : "!p-[0.87rem]"}`
|
|
57
57
|
}),
|
|
58
58
|
buttonIcon && icon && /* @__PURE__ */ React.createElement(
|
|
59
59
|
FontAwesomeIcon,
|
|
@@ -76,10 +76,7 @@ var IconButton = (props) => {
|
|
|
76
76
|
);
|
|
77
77
|
};
|
|
78
78
|
var IconButtonGroup = ({ list: list2 }) => {
|
|
79
|
-
|
|
80
|
-
return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${idx !== 0 ? "border-l border-l-[var(--color-border)]" : ""}`;
|
|
81
|
-
}
|
|
82
|
-
return /* @__PURE__ */ React.createElement("div", { className: "icon__button_group" }, list2.map((props, idx) => /* @__PURE__ */ React.createElement("button", __spreadValues({ key: idx, className: getBtnClass(idx) }, props), props.icon && /* @__PURE__ */ React.createElement(FontAwesomeIcon, { icon: props.icon }))));
|
|
79
|
+
return /* @__PURE__ */ React.createElement("div", { className: "icon__button_group" }, list2.map((props, idx) => /* @__PURE__ */ React.createElement("button", __spreadValues({ key: idx + 1, className: getBtnClass(idx) }, props), props.icon && /* @__PURE__ */ React.createElement(FontAwesomeIcon, { icon: props.icon }))));
|
|
83
80
|
};
|
|
84
81
|
var SSOButton = ({ href, btnclass }) => {
|
|
85
82
|
return /* @__PURE__ */ React.createElement("a", { href, className: `sso-button ${btnclass}` }, /* @__PURE__ */ React.createElement(
|
|
@@ -89,11 +86,14 @@ var SSOButton = ({ href, btnclass }) => {
|
|
|
89
86
|
className: "sso-icon",
|
|
90
87
|
src: "https://storage.ppa-ho.net/public/ppa-component-library/lock.png"
|
|
91
88
|
}
|
|
92
|
-
), "Login dengan SSO");
|
|
89
|
+
), " ", "Login dengan SSO");
|
|
93
90
|
};
|
|
94
91
|
Button.IconButton = IconButton;
|
|
95
92
|
Button.IconButtonGroup = IconButtonGroup;
|
|
96
93
|
Button.SSOButton = SSOButton;
|
|
94
|
+
function getBtnClass(idx) {
|
|
95
|
+
return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${idx == 0 ? "" : "border-l border-l-[var(--color-border)]"}`;
|
|
96
|
+
}
|
|
97
97
|
|
|
98
98
|
// src/components/TextInput.tsx
|
|
99
99
|
import React2 from "react";
|
|
@@ -124,7 +124,7 @@ import React3 from "react";
|
|
|
124
124
|
import { faCheck } from "@fortawesome/free-solid-svg-icons";
|
|
125
125
|
import { FontAwesomeIcon as FontAwesomeIcon3 } from "@fortawesome/react-fontawesome";
|
|
126
126
|
function Slider(attr) {
|
|
127
|
-
return /* @__PURE__ */ React3.createElement("div", { className: "flex items-center h-[3rem]" }, /* @__PURE__ */ React3.createElement("div", { className: "slider__wrapper group" }, /* @__PURE__ */ React3.createElement("input", __spreadValues({ id: "slider", type: "checkbox", className: input }, attr)), /* @__PURE__ */ React3.createElement("label", { htmlFor: attr.id || "slider", className: "slider" }, /* @__PURE__ */ React3.createElement(
|
|
127
|
+
return /* @__PURE__ */ React3.createElement("div", { className: "flex items-center h-[3rem]" }, /* @__PURE__ */ React3.createElement("div", { className: "slider__wrapper group relative" }, /* @__PURE__ */ React3.createElement("input", __spreadValues({ id: "slider", type: "checkbox", className: input }, attr)), /* @__PURE__ */ React3.createElement("label", { htmlFor: attr.id || "slider", className: "slider" }, /* @__PURE__ */ React3.createElement(
|
|
128
128
|
FontAwesomeIcon3,
|
|
129
129
|
{
|
|
130
130
|
icon: faCheck,
|
|
@@ -132,7 +132,7 @@ function Slider(attr) {
|
|
|
132
132
|
}
|
|
133
133
|
))));
|
|
134
134
|
}
|
|
135
|
-
var input = "peer ... w-[
|
|
135
|
+
var input = "peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute";
|
|
136
136
|
|
|
137
137
|
// src/components/SingleSelect.tsx
|
|
138
138
|
import React4, { useEffect, useMemo, useState } from "react";
|
|
@@ -452,7 +452,7 @@ function ThemeToggle(attr) {
|
|
|
452
452
|
"label",
|
|
453
453
|
{
|
|
454
454
|
htmlFor: `${attr.id || "theme-toggle"}`,
|
|
455
|
-
className: "slider__wrapper slider-theme slider-theme-light"
|
|
455
|
+
className: "slider__wrapper slider-theme slider-theme-light relative"
|
|
456
456
|
},
|
|
457
457
|
/* @__PURE__ */ React11.createElement(
|
|
458
458
|
"input",
|
|
@@ -460,7 +460,7 @@ function ThemeToggle(attr) {
|
|
|
460
460
|
id: "theme-toggle"
|
|
461
461
|
}, attr), {
|
|
462
462
|
type: "checkbox",
|
|
463
|
-
className: "peer ... w-[
|
|
463
|
+
className: "peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute"
|
|
464
464
|
})
|
|
465
465
|
),
|
|
466
466
|
/* @__PURE__ */ React11.createElement("span", { className: "slider-theme__bullet" })
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\r\n icon?: IconProp;\r\n label?: string;\r\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\r\n isLoading?: boolean;\r\n};\r\n\r\nexport default function Button({\r\n label,\r\n icon,\r\n isLoading,\r\n btnType,\r\n className,\r\n ...rest\r\n}: Readonly<Button>) {\r\n const buttonIcon = isLoading ? faCircleNotch : icon;\r\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\r\n return (\r\n <button\r\n {...rest}\r\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\r\n btnType == \"secondary\" && \"btn__secondary\"\r\n } btn__primary ${!label ? \"!p-[0.87rem]\" : \"\"}`}\r\n >\r\n {buttonIcon && icon && (\r\n <FontAwesomeIcon\r\n icon={buttonIcon}\r\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\r\n isLoading && \"animate-spin\"\r\n }`}\r\n />\r\n )}\r\n {isLoading ? loadingLabel : label}\r\n </button>\r\n );\r\n}\r\n\r\nconst IconButton = (props: Readonly<Button>) => {\r\n return (\r\n <button\r\n {...props}\r\n className={`${props.className} ${\r\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\r\n } icon__button`}\r\n >\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n {props.label && (\r\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\r\n {props.label}\r\n </span>\r\n )}\r\n </button>\r\n );\r\n};\r\n\r\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\r\n function getBtnClass(idx: number) {\r\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${\r\n idx !== 0 ? \"border-l border-l-[var(--color-border)]\" : \"\"\r\n }`;\r\n }\r\n return (\r\n <div className=\"icon__button_group\">\r\n {list.map((props, idx) => (\r\n <button key={idx} className={getBtnClass(idx)} {...props}>\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n </button>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\r\n return (\r\n <a href={href} className={`sso-button ${btnclass}`}>\r\n <img\r\n alt=\"logo\"\r\n className=\"sso-icon\"\r\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\r\n />\r\n Login dengan SSO\r\n </a>\r\n );\r\n};\r\n\r\nButton.IconButton = IconButton;\r\nButton.IconButtonGroup = IconButtonGroup;\r\nButton.SSOButton = SSOButton;\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nconst input__icon =\r\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)]\";\r\n\r\nexport default function TextInput({\r\n label,\r\n labelFor,\r\n icon,\r\n outerclass,\r\n ...attr\r\n}: Readonly<\r\n React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelFor?: string;\r\n icon?: IconProp;\r\n outerclass?: string;\r\n }\r\n>) {\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label htmlFor={labelFor} className=\"text-input__label\">\r\n {label}\r\n </label>\r\n )}\r\n <div className={`text-input__wrapper overflow-hidden ${attr.className}`}>\r\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\r\n <input\r\n {...attr}\r\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"}`}\r\n />\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\nexport default function Slider(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <div className=\"slider__wrapper group\">\r\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\r\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[0.7rem] translate-x-[0.2px]\"\r\n />\r\n </label>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst input = \"peer ... w-[3rem] h-[1.6rem] opacity-[0] cursor-pointer\";\r\n","\"use client\";\r\nimport React, { useEffect, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelHtml?: string;\r\n placeholder?: string;\r\n stateaction?: (param: any) => void;\r\n outerclass?: string;\r\n options?: {\r\n label: string;\r\n value: string;\r\n }[];\r\n stringOptions?: string[];\r\n};\r\n\r\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\r\n const { options = [], stringOptions = [], ...attrInput } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const [selected, setSelected] = useState<{ label: string; value: any }>({\r\n label: \"\",\r\n value: \"\",\r\n });\r\n\r\n function selectItem(\r\n { label, value }: { label: string; value: any },\r\n e: React.MouseEvent<HTMLButtonElement>\r\n ) {\r\n const triggerManual = attrInput.onChange;\r\n if (triggerManual) {\r\n triggerManual?.({\r\n target: { value, name: attrInput.name },\r\n } as React.ChangeEvent<HTMLInputElement>);\r\n }\r\n setSelected({ label, value });\r\n if (attr.stateaction) {\r\n if (stringOptions) attr.stateaction(value);\r\n if (options) attr.stateaction({ label, value });\r\n }\r\n setKeyword(\"\");\r\n setTimeout(() => {\r\n (e.target as HTMLButtonElement).blur();\r\n }, 250);\r\n }\r\n\r\n function autoUpdateValue(updatedValue: string) {\r\n if (updatedValue) {\r\n const filtered = availableOptions.find(\r\n ({ value }) => value == updatedValue\r\n );\r\n if (filtered) setSelected(filtered);\r\n }\r\n }\r\n\r\n const availableOptions = useMemo(() => {\r\n let defaultOptions = options && options.length > 0;\r\n if (!defaultOptions)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n const filteredOptions = useMemo(() => {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }, [keyword, availableOptions]);\r\n\r\n useEffect(() => {\r\n attrInput.value && autoUpdateValue(attrInput.value as string);\r\n }, [attrInput.value]);\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div className={`${attrInput.className} text-input__wrapper relative`}>\r\n <input\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n type=\"hidden\"\r\n />\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${input} ${\r\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n />\r\n <div className=\"select-item__wrapper\">\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nSingleSelect.autoFill = autoFillInput;\r\n\r\nfunction autoFillInput(\r\n value: string,\r\n elName: string,\r\n list: { label: string; value: string }[]\r\n) {\r\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\r\n inp.value = `${value}`;\r\n const filtered = list.find((item) => item.value == value);\r\n const el = document.querySelector(`.${elName}-keyword`);\r\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\r\n}\r\n\r\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","import React from \"react\";\r\n\r\ntype Tooltip = {\r\n children: React.ReactNode;\r\n text: string;\r\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\r\n};\r\n\r\nexport default function Tooltip({\r\n children,\r\n text,\r\n position = \"top\",\r\n}: Readonly<Tooltip>) {\r\n function getAccent() {\r\n const mapping = {\r\n top,\r\n bottom,\r\n left,\r\n right,\r\n };\r\n return mapping[position];\r\n }\r\n return (\r\n <div className=\"relative\">\r\n <div className=\"peer\">{children}</div>\r\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\r\n </div>\r\n );\r\n}\r\n\r\nconst top =\r\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\r\nconst bottom =\r\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\r\nconst right =\r\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\r\nconst left =\r\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\r\n","import React from \"react\";\r\n\r\ntype Option = {\r\n label: string;\r\n value: string;\r\n};\r\n\r\nexport default function NavTabClient({\r\n items,\r\n state,\r\n}: Readonly<{\r\n items: Option[];\r\n state: {\r\n active: string;\r\n setActive: (val: string) => void;\r\n };\r\n}>) {\r\n return (\r\n <nav className=\"navtab__wrapper\">\r\n {items.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n className={`navtab__item ${\r\n state.active == value\r\n ? \"navtab__item__active\"\r\n : \"hover:bg-[var(--color-border)]/50\"\r\n }`}\r\n onClick={() => state.setActive(value)}\r\n >\r\n {label}\r\n </button>\r\n ))}\r\n </nav>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\ntype Card = {\r\n children: React.ReactNode;\r\n className?: string;\r\n};\r\n\r\nexport default function Card({ children, className }: Readonly<Card>) {\r\n return <div className={`card ${className}`}>{children}</div>;\r\n}\r\n\r\nconst Footer = ({\r\n className,\r\n children,\r\n}: {\r\n className?: string;\r\n children?: React.ReactNode;\r\n}) => {\r\n return (\r\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\r\n {children}\r\n </div>\r\n );\r\n};\r\n\r\nCard.Footer = Footer;\r\n","import React from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {\r\n faCheckCircle,\r\n faInfoCircle,\r\n faQuestionCircle,\r\n faXmarkCircle,\r\n} from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\r\ntype Toast = {\r\n title: string;\r\n className?: string;\r\n description: string;\r\n type: ToastType;\r\n};\r\n\r\nexport default function Toast({\r\n title,\r\n description,\r\n type = \"info\",\r\n className,\r\n}: Readonly<Toast>) {\r\n return (\r\n <div className={`toast__wrapper group ${className}`}>\r\n <div className=\"toast__body\">\r\n <div style={{ background: getColor(type) }} className={bullet}></div>\r\n <div>\r\n <p className=\"toast__title\">{title}</p>\r\n <p className=\"toast__description\">{description}</p>\r\n </div>\r\n <div className={`toast__icon toast__icon__${type}`}></div>\r\n </div>\r\n <p\r\n className=\"toast__bar toast-bar-animate\"\r\n style={{ background: getColor(type) }}\r\n ></p>\r\n </div>\r\n );\r\n}\r\n\r\nconst Inline = ({\r\n className,\r\n text,\r\n type,\r\n}: {\r\n className?: string;\r\n text: string;\r\n type: ToastType;\r\n}) => {\r\n return (\r\n <div\r\n className={`toast__inline ${className}`}\r\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\r\n >\r\n <FontAwesomeIcon\r\n icon={getIcon(type)}\r\n className=\"text-[1.3rem]\"\r\n style={{ color: getColor(type) }}\r\n />\r\n <p>{text}</p>\r\n </div>\r\n );\r\n};\r\n\r\nToast.Inline = Inline;\r\n\r\nfunction getColor(type: string) {\r\n return `var(--color-${type})`;\r\n}\r\n\r\nfunction getIcon(type: string) {\r\n const mapping = {\r\n warning: faQuestionCircle,\r\n info: faInfoCircle,\r\n danger: faXmarkCircle,\r\n success: faCheckCircle,\r\n };\r\n //@ts-expect-error call object using array index\r\n return mapping[type];\r\n}\r\n\r\nconst bullet =\r\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\r\n","import React from \"react\";\r\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\ntype Expandable = {\r\n children: React.ReactNode;\r\n title: string;\r\n className?: string;\r\n isOpen?: boolean;\r\n};\r\n\r\nexport default function Expandable({\r\n children,\r\n title,\r\n className,\r\n isOpen,\r\n}: Readonly<Expandable>) {\r\n const name = title.replace(\" \", \"\");\r\n return (\r\n <div className={`expandable ${className}`}>\r\n <input\r\n id={name}\r\n type=\"checkbox\"\r\n defaultChecked={isOpen}\r\n className=\"opacity-[0] peer absolute top-0 ex-title\"\r\n />\r\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\r\n <label htmlFor={name} className=\"expandable__title\">\r\n {title}\r\n </label>\r\n <div className=\"expandable__body\">\r\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React, { useCallback, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Option = {\r\n value: string;\r\n label: string;\r\n};\r\n\r\ntype MultiSelect = {\r\n label?: string;\r\n labelHtml?: string;\r\n outerclass?: string;\r\n options?: Option[];\r\n stringOptions?: string[];\r\n state: { value: Option[]; select: (newVal: Option[]) => void };\r\n};\r\n\r\nexport default function MultiSelect({\r\n state,\r\n label,\r\n labelHtml,\r\n ...attr\r\n}: Readonly<MultiSelect>) {\r\n const { options = [], stringOptions = [] } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n\r\n const availableOptions = useMemo(() => {\r\n const isDefaultOption = options && options.length > 0;\r\n if (!isDefaultOption)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n function getFiltered() {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }\r\n\r\n function selectItem({ label, value }: { label: string; value: string }) {\r\n //@ts-expect-error: avoid check\r\n state.select((prev) => {\r\n const isItemExist = prev.find((item: any) => item.value == value);\r\n if (isItemExist) {\r\n return prev.filter((item: any) => item.value != value);\r\n }\r\n return [...prev, { label, value }];\r\n });\r\n }\r\n\r\n function isItemExist(value: string) {\r\n return state.value.find((item: any) => item.value == value);\r\n }\r\n\r\n const selectUnSelectAll = useCallback(() => {\r\n const isAllSelected = state.value.length == availableOptions.length;\r\n state.select(isAllSelected ? [] : availableOptions);\r\n }, [state.value]);\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label className=\"text-input__label\" htmlFor={labelHtml}>\r\n {label}\r\n </label>\r\n )}\r\n <div className=\"text-input__wrapper relative\">\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n placeholder={`${state.value.length} Dipilih`}\r\n className={`${input} ${\r\n state.value.length > 0 &&\r\n \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n />\r\n <div className=\"select-item__wrapper select-multiple__wrapper\">\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <button\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n onClick={selectUnSelectAll}\r\n >\r\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\r\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","\"use client\";\r\nimport React from \"react\";\r\n\r\nexport default function ThemeToggle(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <label\r\n htmlFor={`${attr.id || \"theme-toggle\"}`}\r\n className=\"slider__wrapper slider-theme slider-theme-light\"\r\n >\r\n <input\r\n id=\"theme-toggle\"\r\n {...attr}\r\n type=\"checkbox\"\r\n className=\"peer ... w-[2rem] opacity-[0] cursor-pointer\"\r\n />\r\n <span className=\"slider-theme__bullet\"></span>\r\n </label>\r\n </div>\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport MultiSelect from \"./MultiSelect\";\r\nimport SingleSelect from \"./SingleSelect\";\r\n\r\nconst list = [\r\n { label: \"Option 1\", value: \"option1\" },\r\n { label: \"Option 2\", value: \"option2\" },\r\n { label: \"Option 3\", value: \"option3\" },\r\n];\r\nconst stringList = [\"option1\", \"option2\", \"option3\"];\r\n\r\nexport default function Dashboard() {\r\n const [selectedItem, setSelectedItem] = useState<\r\n { label: string; value: string }[]\r\n >([]);\r\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\r\n\r\n function updateState(item: string) {\r\n const filtered = list.find(({ value }) => value == item);\r\n filtered && setSel(filtered);\r\n }\r\n\r\n return (\r\n <div className=\"flex items-center gap-[1rem]\">\r\n <MultiSelect\r\n label=\"Multi Select\"\r\n stringOptions={stringList}\r\n state={{ value: selectedItem, select: setSelectedItem }}\r\n />\r\n <SingleSelect\r\n label=\"Single Select\"\r\n name=\"newinput\"\r\n stringOptions={stringList}\r\n placeholder=\"-- Pilih Status --\"\r\n value={sel.value}\r\n />\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Badge({\r\n text,\r\n type,\r\n className,\r\n}: {\r\n text: string;\r\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\r\n className?: string;\r\n}) {\r\n return (\r\n <div className=\"badge__wrapper\">\r\n <span\r\n style={{\r\n background: `var(--color-${type})`,\r\n }}\r\n className={`badge ${className}`}\r\n >\r\n {text}\r\n </span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Skeleton({ className }: { className?: string }) {\r\n return (\r\n <div className={`${className} skeleton`}>\r\n <span className=\"skeleton__item skeleton-slide\"></span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nexport default function Navigation() {\r\n return <nav></nav>;\r\n}\r\n\r\nconst URLNavigation = (props: {\r\n list: { label: string; href: string }[];\r\n activeUrl: string;\r\n outerclass?: string;\r\n CustomComponent?: React.ElementType;\r\n}) => {\r\n const Component = props.CustomComponent || \"a\";\r\n function getAnchorClass(href: string) {\r\n return href === props.activeUrl\r\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\r\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\r\n }\r\n\r\n return (\r\n <nav className={`nav__wrapper ${props.outerclass}`}>\r\n {props.list.map((prop) => (\r\n <Component\r\n key={prop.href}\r\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\r\n {...prop}\r\n >\r\n {prop.label}\r\n </Component>\r\n ))}\r\n </nav>\r\n );\r\n};\r\n\r\nNavigation.URL = URLNavigation;\r\n\r\nconst base__anchor =\r\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\r\n","import React from \"react\";\r\n\r\nexport default function Confirmation({\r\n type = \"warning\",\r\n text,\r\n title,\r\n secondaryAction,\r\n secondaryLabel = \"Tidak\",\r\n mainAction,\r\n mainLabel = \"Ya\",\r\n}: {\r\n mainAction: () => void;\r\n secondaryAction?: () => void;\r\n mainLabel?: string;\r\n secondaryLabel?: string;\r\n title: string;\r\n text: string;\r\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\r\n}) {\r\n return (\r\n <div className=\"confirmation__outer\">\r\n <div className=\"confirmation__card\">\r\n <div className={wrapper}>\r\n <div className={`baloon__${type} baloon`}></div>\r\n <div>\r\n <h3 className=\"font-semibold\">{title}</h3>\r\n <p className={confirmation__text}>{text}</p>\r\n </div>\r\n </div>\r\n <div className=\"confirmation__footer\">\r\n {secondaryAction && (\r\n <button\r\n onClick={secondaryAction}\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n style={{ color: `var(--color-${type})` }}\r\n >\r\n {secondaryLabel}\r\n </button>\r\n )}\r\n <button\r\n onClick={() => {\r\n mainAction();\r\n secondaryAction && secondaryAction();\r\n }}\r\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\r\n style={{\r\n background: `var(--color-${type})`,\r\n border: `1px solid var(--color-${type})`,\r\n }}\r\n >\r\n {mainLabel}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst wrapper =\r\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\r\nconst confirmation__text =\r\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\r\n"],"mappings":"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","names":["list","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","faCheck","React","input","FontAwesomeIcon","faCheck","input__icon","list","React","React","React","React","FontAwesomeIcon","React","FontAwesomeIcon","React","useMemo","useState","FontAwesomeIcon","faCheck","useState","useMemo","label","isItemExist","React","input","FontAwesomeIcon","faCheck","input__icon","React","React","React","useState","useState","React","React","React","React","React","React"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/Button.tsx","../src/components/TextInput.tsx","../src/components/Slider.tsx","../src/components/SingleSelect.tsx","../src/components/Tooltip.tsx","../src/components/NavTabClient.tsx","../src/components/Card.tsx","../src/components/Toast.tsx","../src/components/Expandable.tsx","../src/components/MultiSelect.tsx","../src/components/ThemeToggle.tsx","../src/components/Dashboard.tsx","../src/components/Badge.tsx","../src/components/Skeleton.tsx","../src/components/Navigation.tsx","../src/components/Confirmation.tsx"],"sourcesContent":["import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCircleNotch } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Button = React.ButtonHTMLAttributes<HTMLButtonElement> & {\r\n icon?: IconProp;\r\n label?: string;\r\n btnType?: \"primary\" | \"secondary\" | \"tertiary\";\r\n isLoading?: boolean;\r\n};\r\n\r\nexport default function Button({\r\n label,\r\n icon,\r\n isLoading,\r\n btnType,\r\n className,\r\n ...rest\r\n}: Readonly<Button>) {\r\n const buttonIcon = isLoading ? faCircleNotch : icon;\r\n const loadingLabel = label && isLoading ? \"Memproses ...\" : \"\";\r\n return (\r\n <button\r\n {...rest}\r\n className={`${!icon && \"py-[0.84rem]\"} ${className} ${\r\n btnType == \"secondary\" && \"btn__secondary\"\r\n } btn__primary ${label ? \"\" : \"!p-[0.87rem]\"}`}\r\n >\r\n {buttonIcon && icon && (\r\n <FontAwesomeIcon\r\n icon={buttonIcon}\r\n className={`text-[1.2rem] ${label && \"mr-[0.3rem]\"} ${\r\n isLoading && \"animate-spin\"\r\n }`}\r\n />\r\n )}\r\n {isLoading ? loadingLabel : label}\r\n </button>\r\n );\r\n}\r\n\r\nconst IconButton = (props: Readonly<Button>) => {\r\n return (\r\n <button\r\n {...props}\r\n className={`${props.className} ${\r\n props.label ? \"max-w-[content] px-[0.8rem]\" : \"\"\r\n } icon__button`}\r\n >\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n {props.label && (\r\n <span className=\"inline-block ml-[0.8rem] text-[1rem]\">\r\n {props.label}\r\n </span>\r\n )}\r\n </button>\r\n );\r\n};\r\n\r\nconst IconButtonGroup = ({ list }: { list: Button[] }) => {\r\n return (\r\n <div className=\"icon__button_group\">\r\n {list.map((props, idx) => (\r\n <button key={idx + 1} className={getBtnClass(idx)} {...props}>\r\n {props.icon && <FontAwesomeIcon icon={props.icon} />}\r\n </button>\r\n ))}\r\n </div>\r\n );\r\n};\r\n\r\nconst SSOButton = ({ href, btnclass }: { href: string; btnclass?: string }) => {\r\n return (\r\n <a href={href} className={`sso-button ${btnclass}`}>\r\n <img\r\n alt=\"logo\"\r\n className=\"sso-icon\"\r\n src=\"https://storage.ppa-ho.net/public/ppa-component-library/lock.png\"\r\n />{\" \"}\r\n Login dengan SSO\r\n </a>\r\n );\r\n};\r\n\r\nButton.IconButton = IconButton;\r\nButton.IconButtonGroup = IconButtonGroup;\r\nButton.SSOButton = SSOButton;\r\n\r\nfunction getBtnClass(idx: number) {\r\n return `icon__button !h-[2.95rem] !rounded-[0] border-[0] ${\r\n idx == 0 ? \"\" : \"border-l border-l-[var(--color-border)]\"\r\n }`;\r\n}\r\n","import React from \"react\";\r\nimport { IconProp } from \"@fortawesome/fontawesome-svg-core\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nconst input__icon =\r\n \"w-[2rem] p-[0.9rem] px-[0.7rem] text-[1.2rem] bg-[var(--color-background-icon)] text-[var(--color-icon-input)] mr-2 group-focus-within:text-[var(--color-primary)]\";\r\n\r\nexport default function TextInput({\r\n label,\r\n labelFor,\r\n icon,\r\n outerclass,\r\n ...attr\r\n}: Readonly<\r\n React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelFor?: string;\r\n icon?: IconProp;\r\n outerclass?: string;\r\n }\r\n>) {\r\n return (\r\n <div className={`group ${outerclass} w-full`}>\r\n {label && (\r\n <label htmlFor={labelFor} className=\"text-input__label\">\r\n {label}\r\n </label>\r\n )}\r\n <div className={`text-input__wrapper overflow-hidden ${attr.className}`}>\r\n {icon && <FontAwesomeIcon icon={icon} className={input__icon} />}\r\n <input\r\n {...attr}\r\n className={`text-input w-full ${icon && \"!pl-[0.3rem]\"}`}\r\n />\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nimport { faCheck } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\nexport default function Slider(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <div className=\"slider__wrapper group relative\">\r\n <input id=\"slider\" type=\"checkbox\" className={input} {...attr} />\r\n <label htmlFor={attr.id || \"slider\"} className=\"slider\">\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[0.7rem] translate-x-[0.2px]\"\r\n />\r\n </label>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst input = \"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\";\r\n","\"use client\";\r\nimport React, { useEffect, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faChevronDown } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype SingleSelect = React.InputHTMLAttributes<HTMLInputElement> & {\r\n label?: string;\r\n labelHtml?: string;\r\n placeholder?: string;\r\n stateaction?: (param: any) => void;\r\n outerclass?: string;\r\n options?: {\r\n label: string;\r\n value: string;\r\n }[];\r\n stringOptions?: string[];\r\n};\r\n\r\nexport default function SingleSelect(attr: Readonly<SingleSelect>) {\r\n const { options = [], stringOptions = [], ...attrInput } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n const [selected, setSelected] = useState<{ label: string; value: any }>({\r\n label: \"\",\r\n value: \"\",\r\n });\r\n\r\n function selectItem(\r\n { label, value }: { label: string; value: any },\r\n e: React.MouseEvent<HTMLButtonElement>\r\n ) {\r\n const triggerManual = attrInput.onChange;\r\n if (triggerManual) {\r\n triggerManual?.({\r\n target: { value, name: attrInput.name },\r\n } as React.ChangeEvent<HTMLInputElement>);\r\n }\r\n setSelected({ label, value });\r\n if (attr.stateaction) {\r\n if (stringOptions) attr.stateaction(value);\r\n if (options) attr.stateaction({ label, value });\r\n }\r\n setKeyword(\"\");\r\n setTimeout(() => {\r\n (e.target as HTMLButtonElement).blur();\r\n }, 250);\r\n }\r\n\r\n function autoUpdateValue(updatedValue: string) {\r\n if (updatedValue) {\r\n const filtered = availableOptions.find(\r\n ({ value }) => value == updatedValue\r\n );\r\n if (filtered) setSelected(filtered);\r\n }\r\n }\r\n\r\n const availableOptions = useMemo(() => {\r\n let defaultOptions = options && options.length > 0;\r\n if (!defaultOptions)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n const filteredOptions = useMemo(() => {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }, [keyword, availableOptions]);\r\n\r\n useEffect(() => {\r\n attrInput.value && autoUpdateValue(attrInput.value as string);\r\n }, [attrInput.value]);\r\n\r\n return (\r\n <div className={`w-full group ${attr.outerclass}`}>\r\n {attrInput.label && (\r\n <label className=\"text-input__label\" htmlFor={attrInput.labelHtml}>\r\n {attrInput.label}\r\n </label>\r\n )}\r\n <div className={`${attrInput.className} text-input__wrapper relative`}>\r\n <input\r\n {...attrInput}\r\n {...(attrInput.onChange ? { onChange: attrInput.onChange } : {})}\r\n value={attrInput.value ?? selected.value}\r\n type=\"hidden\"\r\n />\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n onChange={(e) => setKeyword(e.target.value)}\r\n className={`${attrInput.name}-keyword ${input} ${\r\n selected.value && \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n placeholder={selected.value ? selected.label : attrInput.placeholder}\r\n />\r\n <div className=\"select-item__wrapper\">\r\n {filteredOptions.length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {filteredOptions.map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={(e) => selectItem({ label, value }, e)}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {selected.value == value && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <FontAwesomeIcon icon={faChevronDown} className={input__icon} />\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nSingleSelect.autoFill = autoFillInput;\r\n\r\nfunction autoFillInput(\r\n value: string,\r\n elName: string,\r\n list: { label: string; value: string }[]\r\n) {\r\n const inp = document.querySelector(`[name=\"${elName}\"]`) as HTMLInputElement;\r\n inp.value = `${value}`;\r\n const filtered = list.find((item) => item.value == value);\r\n const el = document.querySelector(`.${elName}-keyword`);\r\n el?.setAttribute(\"placeholder\", `${filtered?.label}`);\r\n}\r\n\r\nconst input__icon = \"pr-[0.7rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","import React from \"react\";\r\n\r\ntype Tooltip = {\r\n children: React.ReactNode;\r\n text: string;\r\n position: \"top\" | \"bottom\" | \"right\" | \"left\";\r\n};\r\n\r\nexport default function Tooltip({\r\n children,\r\n text,\r\n position = \"top\",\r\n}: Readonly<Tooltip>) {\r\n function getAccent() {\r\n const mapping = {\r\n top,\r\n bottom,\r\n left,\r\n right,\r\n };\r\n return mapping[position];\r\n }\r\n return (\r\n <div className=\"relative\">\r\n <div className=\"peer\">{children}</div>\r\n <span className={`tooltip-text ${getAccent()}`}>{text}</span>\r\n </div>\r\n );\r\n}\r\n\r\nconst top =\r\n \"bottom-full translate-y-[-0.3rem] right-0 after:bottom-0 after:translate-y-[0.25rem] \";\r\nconst bottom =\r\n \"right-0 top-full translate-y-[0.3rem] after:top-[-0.4rem] after:translate-y-[0.2rem] \";\r\nconst right =\r\n \"left-full w-[max-content] translate-x-[0.6rem] after:left-[-0.2rem] top-[-0.2rem] after:top-[0.6rem]\";\r\nconst left =\r\n \"right-full w-[max-content] translate-x-[-0.6rem] top-[-0.2rem] after:right-[-0.2rem] after:top-[0.6rem]\";\r\n","import React from \"react\";\r\n\r\ntype Option = {\r\n label: string;\r\n value: string;\r\n};\r\n\r\nexport default function NavTabClient({\r\n items,\r\n state,\r\n}: Readonly<{\r\n items: Option[];\r\n state: {\r\n active: string;\r\n setActive: (val: string) => void;\r\n };\r\n}>) {\r\n return (\r\n <nav className=\"navtab__wrapper\">\r\n {items.map(({ label, value }) => (\r\n <button\r\n key={value}\r\n className={`navtab__item ${\r\n state.active == value\r\n ? \"navtab__item__active\"\r\n : \"hover:bg-[var(--color-border)]/50\"\r\n }`}\r\n onClick={() => state.setActive(value)}\r\n >\r\n {label}\r\n </button>\r\n ))}\r\n </nav>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\ntype Card = {\r\n children: React.ReactNode;\r\n className?: string;\r\n};\r\n\r\nexport default function Card({ children, className }: Readonly<Card>) {\r\n return <div className={`card ${className}`}>{children}</div>;\r\n}\r\n\r\nconst Footer = ({\r\n className,\r\n children,\r\n}: {\r\n className?: string;\r\n children?: React.ReactNode;\r\n}) => {\r\n return (\r\n <div className={`${className} border-t border-t-[var(--color-border)]`}>\r\n {children}\r\n </div>\r\n );\r\n};\r\n\r\nCard.Footer = Footer;\r\n","import React from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport {\r\n faCheckCircle,\r\n faInfoCircle,\r\n faQuestionCircle,\r\n faXmarkCircle,\r\n} from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype ToastType = \"warning\" | \"success\" | \"info\" | \"danger\";\r\ntype Toast = {\r\n title: string;\r\n className?: string;\r\n description: string;\r\n type: ToastType;\r\n};\r\n\r\nexport default function Toast({\r\n title,\r\n description,\r\n type = \"info\",\r\n className,\r\n}: Readonly<Toast>) {\r\n return (\r\n <div className={`toast__wrapper group ${className}`}>\r\n <div className=\"toast__body\">\r\n <div style={{ background: getColor(type) }} className={bullet}></div>\r\n <div>\r\n <p className=\"toast__title\">{title}</p>\r\n <p className=\"toast__description\">{description}</p>\r\n </div>\r\n <div className={`toast__icon toast__icon__${type}`}></div>\r\n </div>\r\n <p\r\n className=\"toast__bar toast-bar-animate\"\r\n style={{ background: getColor(type) }}\r\n ></p>\r\n </div>\r\n );\r\n}\r\n\r\nconst Inline = ({\r\n className,\r\n text,\r\n type,\r\n}: {\r\n className?: string;\r\n text: string;\r\n type: ToastType;\r\n}) => {\r\n return (\r\n <div\r\n className={`toast__inline ${className}`}\r\n style={{ background: `var(--color-${type}-soft)`, opacity: 0.9 }}\r\n >\r\n <FontAwesomeIcon\r\n icon={getIcon(type)}\r\n className=\"text-[1.3rem]\"\r\n style={{ color: getColor(type) }}\r\n />\r\n <p>{text}</p>\r\n </div>\r\n );\r\n};\r\n\r\nToast.Inline = Inline;\r\n\r\nfunction getColor(type: string) {\r\n return `var(--color-${type})`;\r\n}\r\n\r\nfunction getIcon(type: string) {\r\n const mapping = {\r\n warning: faQuestionCircle,\r\n info: faInfoCircle,\r\n danger: faXmarkCircle,\r\n success: faCheckCircle,\r\n };\r\n //@ts-expect-error call object using array index\r\n return mapping[type];\r\n}\r\n\r\nconst bullet =\r\n \"w-[2rem] h-[2rem] absolute top-[-0.7rem] left-[-0.7rem] rounded-[50%]\";\r\n","import React from \"react\";\r\nimport { faCaretRight } from \"@fortawesome/free-solid-svg-icons\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\n\r\ntype Expandable = {\r\n children: React.ReactNode;\r\n title: string;\r\n className?: string;\r\n isOpen?: boolean;\r\n};\r\n\r\nexport default function Expandable({\r\n children,\r\n title,\r\n className,\r\n isOpen,\r\n}: Readonly<Expandable>) {\r\n const name = title.replace(\" \", \"\");\r\n return (\r\n <div className={`expandable ${className}`}>\r\n <input\r\n id={name}\r\n type=\"checkbox\"\r\n defaultChecked={isOpen}\r\n className=\"opacity-[0] peer absolute top-0 ex-title\"\r\n />\r\n <FontAwesomeIcon icon={faCaretRight} className=\"expandable__icon\" />\r\n <label htmlFor={name} className=\"expandable__title\">\r\n {title}\r\n </label>\r\n <div className=\"expandable__body\">\r\n <div className=\"p-[0.75rem] px-[1rem]\">{children}</div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n","import React, { useCallback, useMemo, useState } from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faCheck, faListCheck } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\ntype Option = {\r\n value: string;\r\n label: string;\r\n};\r\n\r\ntype MultiSelect = {\r\n label?: string;\r\n labelHtml?: string;\r\n outerclass?: string;\r\n options?: Option[];\r\n stringOptions?: string[];\r\n state: { value: Option[]; select: (newVal: Option[]) => void };\r\n};\r\n\r\nexport default function MultiSelect({\r\n state,\r\n label,\r\n labelHtml,\r\n ...attr\r\n}: Readonly<MultiSelect>) {\r\n const { options = [], stringOptions = [] } = attr;\r\n const [keyword, setKeyword] = useState(\"\");\r\n\r\n const availableOptions = useMemo(() => {\r\n const isDefaultOption = options && options.length > 0;\r\n if (!isDefaultOption)\r\n return stringOptions.map((opt) => ({ label: opt, value: opt }));\r\n return options;\r\n }, [options, stringOptions]);\r\n\r\n function getFiltered() {\r\n return availableOptions.filter(\r\n ({ label, value }) =>\r\n (label + \"\").toLowerCase().includes(keyword.toLowerCase()) ||\r\n (value + \"\").toLowerCase().includes(keyword.toLowerCase())\r\n );\r\n }\r\n\r\n function selectItem({ label, value }: { label: string; value: string }) {\r\n //@ts-expect-error: avoid check\r\n state.select((prev) => {\r\n const isItemExist = prev.find((item: any) => item.value == value);\r\n if (isItemExist) {\r\n return prev.filter((item: any) => item.value != value);\r\n }\r\n return [...prev, { label, value }];\r\n });\r\n }\r\n\r\n function isItemExist(value: string) {\r\n return state.value.find((item: any) => item.value == value);\r\n }\r\n\r\n const selectUnSelectAll = useCallback(() => {\r\n const isAllSelected = state.value.length == availableOptions.length;\r\n state.select(isAllSelected ? [] : availableOptions);\r\n }, [state.value]);\r\n\r\n return (\r\n <div className={`group w-full ${attr.outerclass}`}>\r\n {label && (\r\n <label className=\"text-input__label\" htmlFor={labelHtml}>\r\n {label}\r\n </label>\r\n )}\r\n <div className=\"text-input__wrapper relative\">\r\n <input\r\n value={keyword}\r\n type=\"search\"\r\n placeholder={`${state.value.length} Dipilih`}\r\n className={`${input} ${\r\n state.value.length > 0 &&\r\n \"placeholder:text-[var(--color-text-primary)]\"\r\n }`}\r\n onChange={(e) => setKeyword(e.target.value)}\r\n />\r\n <div className=\"select-item__wrapper select-multiple__wrapper\">\r\n {getFiltered().length == 0 && keyword != \"\" && (\r\n <button disabled className=\"select-item text-[var(--color-danger)]\">\r\n Tidak ada Item\r\n </button>\r\n )}\r\n {getFiltered().map(({ label, value }) => (\r\n <button\r\n type=\"button\"\r\n onClick={() => selectItem({ label, value })}\r\n key={value}\r\n className=\"select-item\"\r\n >\r\n {label}\r\n {isItemExist(value) && (\r\n <FontAwesomeIcon\r\n icon={faCheck}\r\n className=\"text-[var(--color-primary)]\"\r\n />\r\n )}\r\n </button>\r\n ))}\r\n </div>\r\n <button\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n onClick={selectUnSelectAll}\r\n >\r\n <FontAwesomeIcon icon={faListCheck} className={input__icon} />\r\n </button>\r\n </div>\r\n </div>\r\n );\r\n}\r\nconst input__icon = \"pr-[0.7rem] text-[1.2rem] text-[var(--color-icon-input)]\";\r\nconst input = \"text-input peer ... w-full\";\r\n","\"use client\";\r\nimport React from \"react\";\r\n\r\nexport default function ThemeToggle(\r\n attr: Readonly<React.InputHTMLAttributes<HTMLInputElement>>\r\n) {\r\n return (\r\n <div className=\"flex items-center h-[3rem]\">\r\n <label\r\n htmlFor={`${attr.id || \"theme-toggle\"}`}\r\n className=\"slider__wrapper slider-theme slider-theme-light relative\"\r\n >\r\n <input\r\n id=\"theme-toggle\"\r\n {...attr}\r\n type=\"checkbox\"\r\n className=\"peer ... w-[38px] h-[20px] opacity-[0] cursor-pointer absolute\"\r\n />\r\n <span className=\"slider-theme__bullet\"></span>\r\n </label>\r\n </div>\r\n );\r\n}\r\n","import React, { useState } from \"react\";\r\nimport MultiSelect from \"./MultiSelect\";\r\nimport SingleSelect from \"./SingleSelect\";\r\n\r\nconst list = [\r\n { label: \"Option 1\", value: \"option1\" },\r\n { label: \"Option 2\", value: \"option2\" },\r\n { label: \"Option 3\", value: \"option3\" },\r\n];\r\nconst stringList = [\"option1\", \"option2\", \"option3\"];\r\n\r\nexport default function Dashboard() {\r\n const [selectedItem, setSelectedItem] = useState<\r\n { label: string; value: string }[]\r\n >([]);\r\n const [sel, setSel] = useState({ label: \"\", value: \"\" });\r\n\r\n function updateState(item: string) {\r\n const filtered = list.find(({ value }) => value == item);\r\n filtered && setSel(filtered);\r\n }\r\n\r\n return (\r\n <div className=\"flex items-center gap-[1rem]\">\r\n <MultiSelect\r\n label=\"Multi Select\"\r\n stringOptions={stringList}\r\n state={{ value: selectedItem, select: setSelectedItem }}\r\n />\r\n <SingleSelect\r\n label=\"Single Select\"\r\n name=\"newinput\"\r\n stringOptions={stringList}\r\n placeholder=\"-- Pilih Status --\"\r\n value={sel.value}\r\n />\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Badge({\r\n text,\r\n type,\r\n className,\r\n}: {\r\n text: string;\r\n type: \"success\" | \"danger\" | \"warning\" | \"info\";\r\n className?: string;\r\n}) {\r\n return (\r\n <div className=\"badge__wrapper\">\r\n <span\r\n style={{\r\n background: `var(--color-${type})`,\r\n }}\r\n className={`badge ${className}`}\r\n >\r\n {text}\r\n </span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\nexport default function Skeleton({ className }: { className?: string }) {\r\n return (\r\n <div className={`${className} skeleton`}>\r\n <span className=\"skeleton__item skeleton-slide\"></span>\r\n </div>\r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nexport default function Navigation() {\r\n return <nav></nav>;\r\n}\r\n\r\nconst URLNavigation = (props: {\r\n list: { label: string; href: string }[];\r\n activeUrl: string;\r\n outerclass?: string;\r\n CustomComponent?: React.ElementType;\r\n}) => {\r\n const Component = props.CustomComponent || \"a\";\r\n function getAnchorClass(href: string) {\r\n return href === props.activeUrl\r\n ? \"bg-[var(--color-primary-soft)] text-[var(--color-primary)]\"\r\n : \"text-[var(--color-text-secondary)]/70 hover:bg-[var(--color-border)]/40\";\r\n }\r\n\r\n return (\r\n <nav className={`nav__wrapper ${props.outerclass}`}>\r\n {props.list.map((prop) => (\r\n <Component\r\n key={prop.href}\r\n className={`${base__anchor} ${getAnchorClass(prop.href)}`}\r\n {...prop}\r\n >\r\n {prop.label}\r\n </Component>\r\n ))}\r\n </nav>\r\n );\r\n};\r\n\r\nNavigation.URL = URLNavigation;\r\n\r\nconst base__anchor =\r\n \"p-[0.8rem] h-full grid items-center transition-all leading-[1] px-[1.2rem] rounded-[0.4rem]\";\r\n","import React from \"react\";\r\n\r\nexport default function Confirmation({\r\n type = \"warning\",\r\n text,\r\n title,\r\n secondaryAction,\r\n secondaryLabel = \"Tidak\",\r\n mainAction,\r\n mainLabel = \"Ya\",\r\n}: {\r\n mainAction: () => void;\r\n secondaryAction?: () => void;\r\n mainLabel?: string;\r\n secondaryLabel?: string;\r\n title: string;\r\n text: string;\r\n type?: \"info\" | \"warning\" | \"danger\" | \"success\";\r\n}) {\r\n return (\r\n <div className=\"confirmation__outer\">\r\n <div className=\"confirmation__card\">\r\n <div className={wrapper}>\r\n <div className={`baloon__${type} baloon`}></div>\r\n <div>\r\n <h3 className=\"font-semibold\">{title}</h3>\r\n <p className={confirmation__text}>{text}</p>\r\n </div>\r\n </div>\r\n <div className=\"confirmation__footer\">\r\n {secondaryAction && (\r\n <button\r\n onClick={secondaryAction}\r\n type=\"button\"\r\n className=\"cursor-pointer\"\r\n style={{ color: `var(--color-${type})` }}\r\n >\r\n {secondaryLabel}\r\n </button>\r\n )}\r\n <button\r\n onClick={() => {\r\n mainAction();\r\n secondaryAction && secondaryAction();\r\n }}\r\n className=\"cursor-pointer btn__primary min-w-[8rem]\"\r\n style={{\r\n background: `var(--color-${type})`,\r\n border: `1px solid var(--color-${type})`,\r\n }}\r\n >\r\n {mainLabel}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\nconst wrapper =\r\n \"pt-[0.5rem] pb-[1rem] px-[1.8rem] grid items-center gap-[1.5rem]\";\r\nconst confirmation__text =\r\n \"mt-[0.7rem] w-[90%] text-[var(--color-text-secondary)]\";\r\n"],"mappings":"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","names":["list","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","React","FontAwesomeIcon","faCheck","React","input","FontAwesomeIcon","faCheck","input__icon","list","React","React","React","React","FontAwesomeIcon","React","FontAwesomeIcon","React","useMemo","useState","FontAwesomeIcon","faCheck","useState","useMemo","label","isItemExist","React","input","FontAwesomeIcon","faCheck","input__icon","React","React","React","useState","useState","React","React","React","React","React","React"]}
|
package/dist/styles.css
CHANGED
|
@@ -266,9 +266,6 @@
|
|
|
266
266
|
.\!h-\[2\.95rem\] {
|
|
267
267
|
height: 2.95rem !important;
|
|
268
268
|
}
|
|
269
|
-
.h-\[1\.6rem\] {
|
|
270
|
-
height: 1.6rem;
|
|
271
|
-
}
|
|
272
269
|
.h-\[2rem\] {
|
|
273
270
|
height: 2rem;
|
|
274
271
|
}
|
|
@@ -281,6 +278,9 @@
|
|
|
281
278
|
.h-\[17rem\] {
|
|
282
279
|
height: 17rem;
|
|
283
280
|
}
|
|
281
|
+
.h-\[20px\] {
|
|
282
|
+
height: 20px;
|
|
283
|
+
}
|
|
284
284
|
.h-full {
|
|
285
285
|
height: 100%;
|
|
286
286
|
}
|
|
@@ -296,12 +296,12 @@
|
|
|
296
296
|
.w-\[2rem\] {
|
|
297
297
|
width: 2rem;
|
|
298
298
|
}
|
|
299
|
-
.w-\[3rem\] {
|
|
300
|
-
width: 3rem;
|
|
301
|
-
}
|
|
302
299
|
.w-\[30rem\] {
|
|
303
300
|
width: 30rem;
|
|
304
301
|
}
|
|
302
|
+
.w-\[38px\] {
|
|
303
|
+
width: 38px;
|
|
304
|
+
}
|
|
305
305
|
.w-\[90\%\] {
|
|
306
306
|
width: 90%;
|
|
307
307
|
}
|
|
@@ -629,7 +629,8 @@ h3 {
|
|
|
629
629
|
background-position: center;
|
|
630
630
|
background-repeat: no-repeat;
|
|
631
631
|
width: 80px;
|
|
632
|
-
opacity: 0.
|
|
632
|
+
opacity: 0.7;
|
|
633
|
+
z-index: 2;
|
|
633
634
|
}
|
|
634
635
|
.toast__icon__info {
|
|
635
636
|
background-image: url("https://storage.ppa-ho.net/public/ppa-component-library/message-info.svg") !important;
|
|
@@ -884,24 +885,22 @@ h3 {
|
|
|
884
885
|
color: var(--color-text-secondary);
|
|
885
886
|
}
|
|
886
887
|
.slider__wrapper {
|
|
887
|
-
|
|
888
|
-
height:
|
|
889
|
-
width:
|
|
888
|
+
display: flex;
|
|
889
|
+
height: 20px;
|
|
890
|
+
width: 35px;
|
|
890
891
|
cursor: pointer;
|
|
891
|
-
|
|
892
|
+
align-items: center;
|
|
893
|
+
border-radius: 20px;
|
|
892
894
|
background-color: var(--color-icon-input);
|
|
893
895
|
&:has(*:checked) {
|
|
894
896
|
background-color: var(--color-primary);
|
|
895
897
|
}
|
|
896
898
|
}
|
|
897
899
|
.slider {
|
|
898
|
-
position: absolute;
|
|
899
|
-
top: 0.02rem;
|
|
900
900
|
display: flex;
|
|
901
|
-
height:
|
|
902
|
-
width:
|
|
903
|
-
--tw-translate-x:
|
|
904
|
-
--tw-translate-y: 0.15rem;
|
|
901
|
+
height: 15px;
|
|
902
|
+
width: 15px;
|
|
903
|
+
--tw-translate-x: 3px;
|
|
905
904
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
906
905
|
cursor: pointer;
|
|
907
906
|
align-items: center;
|
|
@@ -913,8 +912,7 @@ h3 {
|
|
|
913
912
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
914
913
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
915
914
|
&:is(:where(.peer):checked ~ *) {
|
|
916
|
-
|
|
917
|
-
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
915
|
+
margin-left: 14px;
|
|
918
916
|
}
|
|
919
917
|
&:is(:where(.peer):checked ~ *) {
|
|
920
918
|
border-color: var(--color-primary);
|
|
@@ -1122,8 +1120,10 @@ h3 {
|
|
|
1122
1120
|
padding: 1.2rem;
|
|
1123
1121
|
}
|
|
1124
1122
|
.toast__description {
|
|
1123
|
+
position: relative;
|
|
1124
|
+
z-index: 5;
|
|
1125
1125
|
margin-top: 0.7rem;
|
|
1126
|
-
width:
|
|
1126
|
+
width: 88%;
|
|
1127
1127
|
color: var(--color-text-secondary);
|
|
1128
1128
|
}
|
|
1129
1129
|
.toast__bar {
|
|
@@ -1217,9 +1217,11 @@ h3 {
|
|
|
1217
1217
|
}
|
|
1218
1218
|
}
|
|
1219
1219
|
.slider-theme {
|
|
1220
|
-
display:
|
|
1221
|
-
height:
|
|
1222
|
-
width:
|
|
1220
|
+
display: flex;
|
|
1221
|
+
height: 22px !important;
|
|
1222
|
+
width: 37.5px !important;
|
|
1223
|
+
align-items: center;
|
|
1224
|
+
justify-content: flex-start;
|
|
1223
1225
|
border-radius: 5rem;
|
|
1224
1226
|
border-style: var(--tw-border-style);
|
|
1225
1227
|
border-width: 2px;
|
|
@@ -1235,19 +1237,17 @@ h3 {
|
|
|
1235
1237
|
transition-duration: 0.5s;
|
|
1236
1238
|
}
|
|
1237
1239
|
.slider-theme__bullet {
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
width: 1rem;
|
|
1240
|
+
top: 0;
|
|
1241
|
+
margin-left: 3px;
|
|
1242
|
+
height: 14px;
|
|
1243
|
+
width: 14px;
|
|
1243
1244
|
border-radius: 50%;
|
|
1244
1245
|
background-color: #fbd549;
|
|
1245
1246
|
transition-property: all;
|
|
1246
1247
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
1247
1248
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
1248
1249
|
&:is(:where(.peer):checked ~ *) {
|
|
1249
|
-
|
|
1250
|
-
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
1250
|
+
margin-left: 17px;
|
|
1251
1251
|
}
|
|
1252
1252
|
&:is(:where(.peer):checked ~ *) {
|
|
1253
1253
|
background-color: #eceff1;
|
package/package.json
CHANGED
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
"react-dom": "^18.2.0 || ^19.0.0"
|
|
36
36
|
},
|
|
37
37
|
"name": "@safestrong/ppa-component-library",
|
|
38
|
-
"version": "1.7.
|
|
38
|
+
"version": "1.7.2",
|
|
39
39
|
"description": "Collection of reusable components for any PPA web applications",
|
|
40
40
|
"main": "dist/index.cjs",
|
|
41
41
|
"module": "dist/index.js",
|