@axtec/components 0.1.0
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/components/Accordion/Accordion.d.ts +12 -0
- package/dist/components/ActionBar/ActionBar.d.ts +10 -0
- package/dist/components/ActionBar/index.d.ts +1 -0
- package/dist/components/ActionLayout/ActionLayout.d.ts +15 -0
- package/dist/components/ActionLayout/index.d.ts +1 -0
- package/dist/components/Alert/Alert.d.ts +9 -0
- package/dist/components/AlertBox/AlertBox.d.ts +15 -0
- package/dist/components/AlertBox/index.d.ts +1 -0
- package/dist/components/AlertModal/AlertModal.d.ts +14 -0
- package/dist/components/AlertModal/index.d.ts +1 -0
- package/dist/components/AutoComplete/AutoComplete.d.ts +17 -0
- package/dist/components/AutoComplete/index.d.ts +1 -0
- package/dist/components/Avatar/Avatar.d.ts +8 -0
- package/dist/components/AvatarCard/AvatarCard.d.ts +27 -0
- package/dist/components/AvatarCard/index.d.ts +1 -0
- package/dist/components/AverageRating/AverageRating.d.ts +8 -0
- package/dist/components/AverageRating/index.d.ts +1 -0
- package/dist/components/Badge/Badge.d.ts +9 -0
- package/dist/components/Breadcrumbs/Breadcrumbs.d.ts +15 -0
- package/dist/components/Button/Button.d.ts +9 -0
- package/dist/components/ButtonGroup/ButtonGroup.d.ts +11 -0
- package/dist/components/ButtonGroup/index.d.ts +1 -0
- package/dist/components/Card/Card.d.ts +56 -0
- package/dist/components/Checkbox/Checkbox.d.ts +6 -0
- package/dist/components/ConfirmModal/ConfirmModal.d.ts +18 -0
- package/dist/components/ConfirmModal/index.d.ts +1 -0
- package/dist/components/DatePicker/DatePicker.d.ts +13 -0
- package/dist/components/DatePicker/index.d.ts +1 -0
- package/dist/components/Drawer/Drawer.d.ts +10 -0
- package/dist/components/Drawer/index.d.ts +1 -0
- package/dist/components/Dropdown/Dropdown.d.ts +21 -0
- package/dist/components/EmptyData/EmptyData.d.ts +9 -0
- package/dist/components/EmptyData/index.d.ts +1 -0
- package/dist/components/FileUploader/FileUploader.d.ts +10 -0
- package/dist/components/FileUploader/index.d.ts +1 -0
- package/dist/components/IconButton/IconButton.d.ts +7 -0
- package/dist/components/IconButton/index.d.ts +1 -0
- package/dist/components/Image/Image.d.ts +13 -0
- package/dist/components/Image/index.d.ts +1 -0
- package/dist/components/ImageGrid/ImageGrid.d.ts +19 -0
- package/dist/components/ImageGrid/index.d.ts +1 -0
- package/dist/components/ImageUploading/ImageUploading.d.ts +7 -0
- package/dist/components/ImageUploading/index.d.ts +1 -0
- package/dist/components/Input/Input.d.ts +7 -0
- package/dist/components/LinkButton/LinkButton.d.ts +15 -0
- package/dist/components/LinkButton/index.d.ts +1 -0
- package/dist/components/Loader/Loader.d.ts +6 -0
- package/dist/components/LoadingModal/LoadingModal.d.ts +6 -0
- package/dist/components/LoadingModal/index.d.ts +1 -0
- package/dist/components/Logo/AxtecLogo.d.ts +5 -0
- package/dist/components/Logo/MyHomeVaultLogo.d.ts +5 -0
- package/dist/components/Logo/index.d.ts +2 -0
- package/dist/components/LogoLoader/LogoLoader.d.ts +5 -0
- package/dist/components/LogoLoader/index.d.ts +1 -0
- package/dist/components/MenuText/MenuText.d.ts +7 -0
- package/dist/components/MenuText/index.d.ts +1 -0
- package/dist/components/Modal/Modal.d.ts +10 -0
- package/dist/components/MultiItemSelect/MultiItemSelect.d.ts +13 -0
- package/dist/components/MultiItemSelect/index.d.ts +1 -0
- package/dist/components/Notification/Notification.d.ts +11 -0
- package/dist/components/Notification/index.d.ts +1 -0
- package/dist/components/Pagination/Pagination.d.ts +8 -0
- package/dist/components/Panel/Panel.d.ts +40 -0
- package/dist/components/Panel/index.d.ts +1 -0
- package/dist/components/PhotoLibrary/PhotoLibrary.d.ts +14 -0
- package/dist/components/PhotoLibrary/index.d.ts +1 -0
- package/dist/components/Pill/Pill.d.ts +11 -0
- package/dist/components/Pill/index.d.ts +1 -0
- package/dist/components/Progress/Progress.d.ts +10 -0
- package/dist/components/QuickActions/QuickActions.d.ts +8 -0
- package/dist/components/QuickActions/index.d.ts +1 -0
- package/dist/components/RadioGroup/RadioGroup.d.ts +15 -0
- package/dist/components/Rating/Rating.d.ts +11 -0
- package/dist/components/Rating/index.d.ts +1 -0
- package/dist/components/Row/Row.d.ts +10 -0
- package/dist/components/Row/index.d.ts +1 -0
- package/dist/components/ScrollableModal/ScrollableModal.d.ts +17 -0
- package/dist/components/ScrollableModal/index.d.ts +1 -0
- package/dist/components/Select/Select.d.ts +16 -0
- package/dist/components/Skeleton/Skeleton.d.ts +18 -0
- package/dist/components/StatisticsChart/StatisticsChart.d.ts +43 -0
- package/dist/components/StatisticsChart/index.d.ts +1 -0
- package/dist/components/StatisticsLegend/StatisticsLegend.d.ts +22 -0
- package/dist/components/StatisticsLegend/index.d.ts +1 -0
- package/dist/components/StatusIndicator/StatusIndicator.d.ts +21 -0
- package/dist/components/StatusIndicator/index.d.ts +1 -0
- package/dist/components/StepList/StepList.d.ts +8 -0
- package/dist/components/StepList/index.d.ts +1 -0
- package/dist/components/TabView/TabView.d.ts +17 -0
- package/dist/components/TabView/index.d.ts +1 -0
- package/dist/components/Table/Table.d.ts +19 -0
- package/dist/components/Tabs/Tabs.d.ts +16 -0
- package/dist/components/TaskList/TaskList.d.ts +20 -0
- package/dist/components/TaskList/index.d.ts +1 -0
- package/dist/components/Textarea/Textarea.d.ts +7 -0
- package/dist/components/Toggle/Toggle.d.ts +10 -0
- package/dist/components/ToggleButton/ToggleButton.d.ts +8 -0
- package/dist/components/ToggleButton/index.d.ts +1 -0
- package/dist/components/Tooltip/Tooltip.d.ts +9 -0
- package/dist/components/TrendIndicator/TrendIndicator.d.ts +8 -0
- package/dist/components/TrendIndicator/index.d.ts +1 -0
- package/dist/components/Typography/CardHeading.d.ts +6 -0
- package/dist/components/Typography/PageHeading.d.ts +6 -0
- package/dist/components/Typography/SectionHeading.d.ts +10 -0
- package/dist/components/Typography/SubsectionHeading.d.ts +6 -0
- package/dist/components/Typography/Text.d.ts +10 -0
- package/dist/components/Typography/index.d.ts +5 -0
- package/dist/components/index.d.ts +62 -0
- package/dist/index.css +1 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +153 -0
- package/dist/index.js.map +1 -0
- package/dist/index10.js +104 -0
- package/dist/index10.js.map +1 -0
- package/dist/index11.js +42 -0
- package/dist/index11.js.map +1 -0
- package/dist/index12.js +82 -0
- package/dist/index12.js.map +1 -0
- package/dist/index13.js +28 -0
- package/dist/index13.js.map +1 -0
- package/dist/index14.js +22 -0
- package/dist/index14.js.map +1 -0
- package/dist/index15.js +42 -0
- package/dist/index15.js.map +1 -0
- package/dist/index16.js +76 -0
- package/dist/index16.js.map +1 -0
- package/dist/index17.js +53 -0
- package/dist/index17.js.map +1 -0
- package/dist/index18.js +16 -0
- package/dist/index18.js.map +1 -0
- package/dist/index19.js +157 -0
- package/dist/index19.js.map +1 -0
- package/dist/index20.js +21 -0
- package/dist/index20.js.map +1 -0
- package/dist/index21.js +49 -0
- package/dist/index21.js.map +1 -0
- package/dist/index22.js +53 -0
- package/dist/index22.js.map +1 -0
- package/dist/index23.js +82 -0
- package/dist/index23.js.map +1 -0
- package/dist/index24.js +223 -0
- package/dist/index24.js.map +1 -0
- package/dist/index25.js +55 -0
- package/dist/index25.js.map +1 -0
- package/dist/index26.js +81 -0
- package/dist/index26.js.map +1 -0
- package/dist/index27.js +27 -0
- package/dist/index27.js.map +1 -0
- package/dist/index28.js +81 -0
- package/dist/index28.js.map +1 -0
- package/dist/index29.js +36 -0
- package/dist/index29.js.map +1 -0
- package/dist/index3.js +9 -0
- package/dist/index3.js.map +1 -0
- package/dist/index30.js +95 -0
- package/dist/index30.js.map +1 -0
- package/dist/index31.js +63 -0
- package/dist/index31.js.map +1 -0
- package/dist/index32.js +48 -0
- package/dist/index32.js.map +1 -0
- package/dist/index33.js +51 -0
- package/dist/index33.js.map +1 -0
- package/dist/index34.js +55 -0
- package/dist/index34.js.map +1 -0
- package/dist/index35.js +31 -0
- package/dist/index35.js.map +1 -0
- package/dist/index36.js +57 -0
- package/dist/index36.js.map +1 -0
- package/dist/index37.js +52 -0
- package/dist/index37.js.map +1 -0
- package/dist/index38.js +16 -0
- package/dist/index38.js.map +1 -0
- package/dist/index39.js +85 -0
- package/dist/index39.js.map +1 -0
- package/dist/index4.js +36 -0
- package/dist/index4.js.map +1 -0
- package/dist/index40.js +52 -0
- package/dist/index40.js.map +1 -0
- package/dist/index41.js +22 -0
- package/dist/index41.js.map +1 -0
- package/dist/index42.js +37 -0
- package/dist/index42.js.map +1 -0
- package/dist/index43.js +18 -0
- package/dist/index43.js.map +1 -0
- package/dist/index44.js +94 -0
- package/dist/index44.js.map +1 -0
- package/dist/index45.js +72 -0
- package/dist/index45.js.map +1 -0
- package/dist/index46.js +125 -0
- package/dist/index46.js.map +1 -0
- package/dist/index47.js +43 -0
- package/dist/index47.js.map +1 -0
- package/dist/index48.js +59 -0
- package/dist/index48.js.map +1 -0
- package/dist/index49.js +19 -0
- package/dist/index49.js.map +1 -0
- package/dist/index5.js +24 -0
- package/dist/index5.js.map +1 -0
- package/dist/index50.js +68 -0
- package/dist/index50.js.map +1 -0
- package/dist/index51.js +57 -0
- package/dist/index51.js.map +1 -0
- package/dist/index52.js +40 -0
- package/dist/index52.js.map +1 -0
- package/dist/index53.js +69 -0
- package/dist/index53.js.map +1 -0
- package/dist/index54.js +25 -0
- package/dist/index54.js.map +1 -0
- package/dist/index55.js +107 -0
- package/dist/index55.js.map +1 -0
- package/dist/index56.js +71 -0
- package/dist/index56.js.map +1 -0
- package/dist/index57.js +239 -0
- package/dist/index57.js.map +1 -0
- package/dist/index58.js +105 -0
- package/dist/index58.js.map +1 -0
- package/dist/index59.js +39 -0
- package/dist/index59.js.map +1 -0
- package/dist/index6.js +47 -0
- package/dist/index6.js.map +1 -0
- package/dist/index60.js +21 -0
- package/dist/index60.js.map +1 -0
- package/dist/index61.js +63 -0
- package/dist/index61.js.map +1 -0
- package/dist/index62.js +64 -0
- package/dist/index62.js.map +1 -0
- package/dist/index63.js +78 -0
- package/dist/index63.js.map +1 -0
- package/dist/index64.js +112 -0
- package/dist/index64.js.map +1 -0
- package/dist/index65.js +43 -0
- package/dist/index65.js.map +1 -0
- package/dist/index66.js +51 -0
- package/dist/index66.js.map +1 -0
- package/dist/index67.js +79 -0
- package/dist/index67.js.map +1 -0
- package/dist/index68.js +57 -0
- package/dist/index68.js.map +1 -0
- package/dist/index69.js +71 -0
- package/dist/index69.js.map +1 -0
- package/dist/index7.js +80 -0
- package/dist/index7.js.map +1 -0
- package/dist/index70.js +39 -0
- package/dist/index70.js.map +1 -0
- package/dist/index71.js +17 -0
- package/dist/index71.js.map +1 -0
- package/dist/index72.js +2267 -0
- package/dist/index72.js.map +1 -0
- package/dist/index8.js +82 -0
- package/dist/index8.js.map +1 -0
- package/dist/index9.js +97 -0
- package/dist/index9.js.map +1 -0
- package/dist/lib/utils.d.ts +2 -0
- package/dist/logos/axtec-logo.png +0 -0
- package/dist/logos/mhv-icon.svg +5 -0
- package/dist/logos/mhv-logo.png +0 -0
- package/dist/logos/mhv-logo.svg +23 -0
- package/package.json +63 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index39.js","sources":["../src/components/Modal/Modal.tsx"],"sourcesContent":["import { Fragment, type ReactNode } from 'react'\nimport {\n Dialog,\n DialogPanel,\n DialogTitle,\n Transition,\n TransitionChild,\n} from '@headlessui/react'\nimport { XMarkIcon } from '@heroicons/react/24/outline'\nimport { cn } from '@/lib/utils'\n\nexport interface ModalProps {\n open: boolean\n onClose: () => void\n title?: string\n children?: ReactNode\n maxWidth?: 'sm' | 'md' | 'lg' | 'xl' | '2xl'\n className?: string\n}\n\nconst maxWidthStyles = {\n sm: 'max-w-sm',\n md: 'max-w-md',\n lg: 'max-w-lg',\n xl: 'max-w-xl',\n '2xl': 'max-w-2xl',\n}\n\nexport function Modal({\n open,\n onClose,\n title,\n children,\n maxWidth = 'md',\n className,\n}: ModalProps) {\n return (\n <Transition show={open} as={Fragment}>\n <Dialog onClose={onClose} className=\"relative z-50\">\n {/* Backdrop */}\n <TransitionChild\n as={Fragment}\n enter=\"ease-out duration-300\"\n enterFrom=\"opacity-0\"\n enterTo=\"opacity-100\"\n leave=\"ease-in duration-200\"\n leaveFrom=\"opacity-100\"\n leaveTo=\"opacity-0\"\n >\n <div className=\"fixed inset-0 bg-black/50\" aria-hidden=\"true\" />\n </TransitionChild>\n\n {/* Full-screen container for centering */}\n <div className=\"fixed inset-0 flex items-center justify-center p-4\">\n <TransitionChild\n as={Fragment}\n enter=\"ease-out duration-300\"\n enterFrom=\"opacity-0 scale-95\"\n enterTo=\"opacity-100 scale-100\"\n leave=\"ease-in duration-200\"\n leaveFrom=\"opacity-100 scale-100\"\n leaveTo=\"opacity-0 scale-95\"\n >\n <DialogPanel\n className={cn(\n 'w-full bg-white rounded-2xl shadow-xl',\n 'transform transition-all',\n maxWidthStyles[maxWidth],\n className\n )}\n >\n {/* Header */}\n {title && (\n <div className=\"flex items-center justify-between px-6 py-4 border-b border-slate-200\">\n <DialogTitle className=\"text-lg font-semibold text-slate-900\">\n {title}\n </DialogTitle>\n <button\n type=\"button\"\n onClick={onClose}\n className={cn(\n 'p-1 rounded-lg transition-colors duration-200',\n 'text-slate-400 hover:text-slate-600 hover:bg-slate-100',\n 'focus:outline-none focus:ring-2 focus:ring-primary-500'\n )}\n >\n <XMarkIcon className=\"h-5 w-5\" />\n <span className=\"sr-only\">Close</span>\n </button>\n </div>\n )}\n\n {/* Content */}\n <div className=\"p-6\">{children}</div>\n </DialogPanel>\n </TransitionChild>\n </div>\n </Dialog>\n </Transition>\n )\n}\n"],"names":["maxWidthStyles","Modal","open","onClose","title","children","maxWidth","className","jsx","Transition","Fragment","jsxs","Dialog","TransitionChild","DialogPanel","cn","DialogTitle","XMarkIcon"],"mappings":";;;;;AAoBA,MAAMA,IAAiB;AAAA,EACrB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,OAAO;AACT;AAEO,SAASC,EAAM;AAAA,EACpB,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,WAAAC;AACF,GAAe;AACb,SACE,gBAAAC,EAACC,GAAA,EAAW,MAAMP,GAAM,IAAIQ,GAC1B,UAAA,gBAAAC,EAACC,GAAA,EAAO,SAAAT,GAAkB,WAAU,iBAElC,UAAA;AAAA,IAAA,gBAAAK;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,IAAIH;AAAA,QACJ,OAAM;AAAA,QACN,WAAU;AAAA,QACV,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,WAAU;AAAA,QACV,SAAQ;AAAA,QAER,UAAA,gBAAAF,EAAC,OAAA,EAAI,WAAU,6BAA4B,eAAY,OAAA,CAAO;AAAA,MAAA;AAAA,IAAA;AAAA,IAIhE,gBAAAA,EAAC,OAAA,EAAI,WAAU,sDACb,UAAA,gBAAAA;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,IAAIH;AAAA,QACJ,OAAM;AAAA,QACN,WAAU;AAAA,QACV,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,WAAU;AAAA,QACV,SAAQ;AAAA,QAER,UAAA,gBAAAC;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,WAAWC;AAAA,cACT;AAAA,cACA;AAAA,cACAf,EAAeM,CAAQ;AAAA,cACvBC;AAAA,YAAA;AAAA,YAID,UAAA;AAAA,cAAAH,KACC,gBAAAO,EAAC,OAAA,EAAI,WAAU,yEACb,UAAA;AAAA,gBAAA,gBAAAH,EAACQ,GAAA,EAAY,WAAU,wCACpB,UAAAZ,GACH;AAAA,gBACA,gBAAAO;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAK;AAAA,oBACL,SAASR;AAAA,oBACT,WAAWY;AAAA,sBACT;AAAA,sBACA;AAAA,sBACA;AAAA,oBAAA;AAAA,oBAGF,UAAA;AAAA,sBAAA,gBAAAP,EAACS,GAAA,EAAU,WAAU,UAAA,CAAU;AAAA,sBAC/B,gBAAAT,EAAC,QAAA,EAAK,WAAU,WAAU,UAAA,QAAA,CAAK;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACjC,GACF;AAAA,cAIF,gBAAAA,EAAC,OAAA,EAAI,WAAU,OAAO,UAAAH,EAAA,CAAS;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACjC;AAAA,IAAA,EACF,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;"}
|
package/dist/index4.js
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { jsx as e, jsxs as n, Fragment as l } from "react/jsx-runtime";
|
|
2
|
+
import { Disclosure as a, DisclosureButton as c, DisclosurePanel as d } from "@headlessui/react";
|
|
3
|
+
import { ChevronDownIcon as m } from "@heroicons/react/20/solid";
|
|
4
|
+
import { cn as r } from "./index3.js";
|
|
5
|
+
function h({ items: o, className: i }) {
|
|
6
|
+
return /* @__PURE__ */ e("div", { className: r("divide-y divide-slate-200 border-y border-slate-200", i), children: o.map((t) => /* @__PURE__ */ e(a, { defaultOpen: t.defaultOpen, children: ({ open: s }) => /* @__PURE__ */ n(l, { children: [
|
|
7
|
+
/* @__PURE__ */ n(
|
|
8
|
+
c,
|
|
9
|
+
{
|
|
10
|
+
className: r(
|
|
11
|
+
"flex w-full items-center justify-between py-4 text-left",
|
|
12
|
+
"text-base font-medium text-slate-900",
|
|
13
|
+
"hover:text-primary-600 transition-colors duration-150",
|
|
14
|
+
"focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500"
|
|
15
|
+
),
|
|
16
|
+
children: [
|
|
17
|
+
/* @__PURE__ */ e("span", { children: t.title }),
|
|
18
|
+
/* @__PURE__ */ e(
|
|
19
|
+
m,
|
|
20
|
+
{
|
|
21
|
+
className: r(
|
|
22
|
+
"h-5 w-5 text-slate-500 transition-transform duration-200",
|
|
23
|
+
s && "rotate-180"
|
|
24
|
+
)
|
|
25
|
+
}
|
|
26
|
+
)
|
|
27
|
+
]
|
|
28
|
+
}
|
|
29
|
+
),
|
|
30
|
+
/* @__PURE__ */ e(d, { className: "pb-4 text-slate-600", children: t.content })
|
|
31
|
+
] }) }, t.key)) });
|
|
32
|
+
}
|
|
33
|
+
export {
|
|
34
|
+
h as Accordion
|
|
35
|
+
};
|
|
36
|
+
//# sourceMappingURL=index4.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index4.js","sources":["../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import { Disclosure, DisclosureButton, DisclosurePanel } from '@headlessui/react'\nimport { ChevronDownIcon } from '@heroicons/react/20/solid'\nimport { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface AccordionItem {\n key: string\n title: ReactNode\n content: ReactNode\n defaultOpen?: boolean\n}\n\nexport interface AccordionProps {\n items: AccordionItem[]\n className?: string\n}\n\nexport function Accordion({ items, className }: AccordionProps) {\n return (\n <div className={cn('divide-y divide-slate-200 border-y border-slate-200', className)}>\n {items.map((item) => (\n <Disclosure key={item.key} defaultOpen={item.defaultOpen}>\n {({ open }) => (\n <>\n <DisclosureButton\n className={cn(\n 'flex w-full items-center justify-between py-4 text-left',\n 'text-base font-medium text-slate-900',\n 'hover:text-primary-600 transition-colors duration-150',\n 'focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500'\n )}\n >\n <span>{item.title}</span>\n <ChevronDownIcon\n className={cn(\n 'h-5 w-5 text-slate-500 transition-transform duration-200',\n open && 'rotate-180'\n )}\n />\n </DisclosureButton>\n <DisclosurePanel className=\"pb-4 text-slate-600\">\n {item.content}\n </DisclosurePanel>\n </>\n )}\n </Disclosure>\n ))}\n </div>\n )\n}\n"],"names":["Accordion","items","className","jsx","cn","item","Disclosure","open","jsxs","Fragment","DisclosureButton","ChevronDownIcon","DisclosurePanel"],"mappings":";;;;AAiBO,SAASA,EAAU,EAAE,OAAAC,GAAO,WAAAC,KAA6B;AAC9D,SACE,gBAAAC,EAAC,SAAI,WAAWC,EAAG,uDAAuDF,CAAS,GAChF,YAAM,IAAI,CAACG,MACV,gBAAAF,EAACG,GAAA,EAA0B,aAAaD,EAAK,aAC1C,WAAC,EAAE,MAAAE,QACF,gBAAAC,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,WAAWN;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,QAGF,UAAA;AAAA,UAAA,gBAAAD,EAAC,QAAA,EAAM,YAAK,MAAA,CAAM;AAAA,UAClB,gBAAAA;AAAA,YAACQ;AAAA,YAAA;AAAA,cACC,WAAWP;AAAA,gBACT;AAAA,gBACAG,KAAQ;AAAA,cAAA;AAAA,YACV;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,gBAAAJ,EAACS,GAAA,EAAgB,WAAU,uBACxB,YAAK,QAAA,CACR;AAAA,EAAA,EAAA,CACF,EAAA,GAtBaP,EAAK,GAwBtB,CACD,EAAA,CACH;AAEJ;"}
|
package/dist/index40.js
ADDED
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { jsxs as l, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import { useState as d } from "react";
|
|
3
|
+
import { cn as i } from "./index3.js";
|
|
4
|
+
import { Checkbox as x } from "./index22.js";
|
|
5
|
+
import { ChevronUpIcon as f, ChevronDownIcon as u } from "@heroicons/react/24/outline";
|
|
6
|
+
const w = ({
|
|
7
|
+
label: c,
|
|
8
|
+
items: t,
|
|
9
|
+
onChange: r,
|
|
10
|
+
initialDisplayCount: a = 5,
|
|
11
|
+
className: o
|
|
12
|
+
}) => {
|
|
13
|
+
const [n, h] = d(!1);
|
|
14
|
+
if (t.length === 0) return null;
|
|
15
|
+
const m = n ? t.length : Math.min(t.length, a), p = t.length > a;
|
|
16
|
+
return /* @__PURE__ */ l("div", { className: i("w-full", o), children: [
|
|
17
|
+
/* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-primary-500 mb-3", children: c }),
|
|
18
|
+
/* @__PURE__ */ e("div", { className: "space-y-2", children: t.slice(0, m).map((s) => /* @__PURE__ */ l(
|
|
19
|
+
"label",
|
|
20
|
+
{
|
|
21
|
+
className: "flex items-center gap-3 cursor-pointer",
|
|
22
|
+
children: [
|
|
23
|
+
/* @__PURE__ */ e(
|
|
24
|
+
x,
|
|
25
|
+
{
|
|
26
|
+
checked: s.checked || !1,
|
|
27
|
+
onChange: () => r(s.value, !s.checked)
|
|
28
|
+
}
|
|
29
|
+
),
|
|
30
|
+
/* @__PURE__ */ e("span", { className: "text-sm text-slate-700 flex-1", children: s.name })
|
|
31
|
+
]
|
|
32
|
+
},
|
|
33
|
+
`${c}-${s.value}`
|
|
34
|
+
)) }),
|
|
35
|
+
p && /* @__PURE__ */ l(
|
|
36
|
+
"button",
|
|
37
|
+
{
|
|
38
|
+
type: "button",
|
|
39
|
+
onClick: () => h(!n),
|
|
40
|
+
className: "flex items-center justify-center gap-1 w-full mt-3 py-2 text-sm text-slate-600 hover:text-slate-800 transition-colors",
|
|
41
|
+
children: [
|
|
42
|
+
/* @__PURE__ */ e("span", { children: n ? "Less" : "More" }),
|
|
43
|
+
n ? /* @__PURE__ */ e(f, { className: "w-4 h-4" }) : /* @__PURE__ */ e(u, { className: "w-4 h-4" })
|
|
44
|
+
]
|
|
45
|
+
}
|
|
46
|
+
)
|
|
47
|
+
] });
|
|
48
|
+
};
|
|
49
|
+
export {
|
|
50
|
+
w as MultiItemSelect
|
|
51
|
+
};
|
|
52
|
+
//# sourceMappingURL=index40.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index40.js","sources":["../src/components/MultiItemSelect/MultiItemSelect.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { cn } from '@/lib/utils'\nimport { Checkbox } from '../Checkbox/Checkbox'\nimport { ChevronDownIcon, ChevronUpIcon } from '@heroicons/react/24/outline'\n\nexport interface MultiItemSelectItem {\n name: string\n value: string\n checked?: boolean\n}\n\nexport interface MultiItemSelectProps {\n label: string\n items: MultiItemSelectItem[]\n onChange: (value: string, checked: boolean) => void\n initialDisplayCount?: number\n className?: string\n}\n\nexport const MultiItemSelect = ({\n label,\n items,\n onChange,\n initialDisplayCount = 5,\n className,\n}: MultiItemSelectProps) => {\n const [isExpanded, setIsExpanded] = useState(false)\n\n if (items.length === 0) return null\n\n const displayCount = isExpanded ? items.length : Math.min(items.length, initialDisplayCount)\n const hasMore = items.length > initialDisplayCount\n\n return (\n <div className={cn('w-full', className)}>\n <h3 className=\"text-sm font-semibold text-primary-500 mb-3\">\n {label}\n </h3>\n\n <div className=\"space-y-2\">\n {items.slice(0, displayCount).map((item) => (\n <label\n key={`${label}-${item.value}`}\n className=\"flex items-center gap-3 cursor-pointer\"\n >\n <Checkbox\n checked={item.checked || false}\n onChange={() => onChange(item.value, !item.checked)}\n />\n <span className=\"text-sm text-slate-700 flex-1\">\n {item.name}\n </span>\n </label>\n ))}\n </div>\n\n {hasMore && (\n <button\n type=\"button\"\n onClick={() => setIsExpanded(!isExpanded)}\n className=\"flex items-center justify-center gap-1 w-full mt-3 py-2 text-sm text-slate-600 hover:text-slate-800 transition-colors\"\n >\n <span>{isExpanded ? 'Less' : 'More'}</span>\n {isExpanded ? (\n <ChevronUpIcon className=\"w-4 h-4\" />\n ) : (\n <ChevronDownIcon className=\"w-4 h-4\" />\n )}\n </button>\n )}\n </div>\n )\n}\n"],"names":["MultiItemSelect","label","items","onChange","initialDisplayCount","className","isExpanded","setIsExpanded","useState","displayCount","hasMore","cn","jsx","item","jsxs","Checkbox","ChevronUpIcon","ChevronDownIcon"],"mappings":";;;;;AAmBO,MAAMA,IAAkB,CAAC;AAAA,EAC9B,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,qBAAAC,IAAsB;AAAA,EACtB,WAAAC;AACF,MAA4B;AAC1B,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAS,EAAK;AAElD,MAAIN,EAAM,WAAW,EAAG,QAAO;AAE/B,QAAMO,IAAeH,IAAaJ,EAAM,SAAS,KAAK,IAAIA,EAAM,QAAQE,CAAmB,GACrFM,IAAUR,EAAM,SAASE;AAE/B,2BACG,OAAA,EAAI,WAAWO,EAAG,UAAUN,CAAS,GACpC,UAAA;AAAA,IAAA,gBAAAO,EAAC,MAAA,EAAG,WAAU,+CACX,UAAAX,GACH;AAAA,IAEA,gBAAAW,EAAC,OAAA,EAAI,WAAU,aACZ,UAAAV,EAAM,MAAM,GAAGO,CAAY,EAAE,IAAI,CAACI,MACjC,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAU;AAAA,QAEV,UAAA;AAAA,UAAA,gBAAAF;AAAA,YAACG;AAAA,YAAA;AAAA,cACC,SAASF,EAAK,WAAW;AAAA,cACzB,UAAU,MAAMV,EAASU,EAAK,OAAO,CAACA,EAAK,OAAO;AAAA,YAAA;AAAA,UAAA;AAAA,UAEpD,gBAAAD,EAAC,QAAA,EAAK,WAAU,iCACb,YAAK,KAAA,CACR;AAAA,QAAA;AAAA,MAAA;AAAA,MATK,GAAGX,CAAK,IAAIY,EAAK,KAAK;AAAA,IAAA,CAW9B,GACH;AAAA,IAECH,KACC,gBAAAI;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS,MAAMP,EAAc,CAACD,CAAU;AAAA,QACxC,WAAU;AAAA,QAEV,UAAA;AAAA,UAAA,gBAAAM,EAAC,QAAA,EAAM,UAAAN,IAAa,SAAS,QAAO;AAAA,UACnCA,sBACEU,GAAA,EAAc,WAAU,WAAU,IAEnC,gBAAAJ,EAACK,GAAA,EAAgB,WAAU,UAAA,CAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAEzC,GAEJ;AAEJ;"}
|
package/dist/index41.js
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
2
|
+
import { cn as a } from "./index3.js";
|
|
3
|
+
const x = {
|
|
4
|
+
sm: "h-6 max-w-[120px]",
|
|
5
|
+
md: "h-8 max-w-[160px]",
|
|
6
|
+
lg: "h-10 max-w-[200px]",
|
|
7
|
+
xl: "h-14 max-w-[280px]"
|
|
8
|
+
};
|
|
9
|
+
function e({ size: o = "md", className: m }) {
|
|
10
|
+
return /* @__PURE__ */ t(
|
|
11
|
+
"img",
|
|
12
|
+
{
|
|
13
|
+
src: "/logos/mhv-logo.png",
|
|
14
|
+
alt: "My Home Vault",
|
|
15
|
+
className: a(x[o], "w-auto object-contain", m)
|
|
16
|
+
}
|
|
17
|
+
);
|
|
18
|
+
}
|
|
19
|
+
export {
|
|
20
|
+
e as MyHomeVaultLogo
|
|
21
|
+
};
|
|
22
|
+
//# sourceMappingURL=index41.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index41.js","sources":["../src/components/Logo/MyHomeVaultLogo.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\n\nexport interface MyHomeVaultLogoProps {\n size?: 'sm' | 'md' | 'lg' | 'xl'\n className?: string\n}\n\nconst sizeStyles = {\n sm: 'h-6 max-w-[120px]',\n md: 'h-8 max-w-[160px]',\n lg: 'h-10 max-w-[200px]',\n xl: 'h-14 max-w-[280px]',\n}\n\nexport function MyHomeVaultLogo({ size = 'md', className }: MyHomeVaultLogoProps) {\n return (\n <img\n src=\"/logos/mhv-logo.png\"\n alt=\"My Home Vault\"\n className={cn(sizeStyles[size], 'w-auto object-contain', className)}\n />\n )\n}\n"],"names":["sizeStyles","MyHomeVaultLogo","size","className","jsx","cn"],"mappings":";;AAOA,MAAMA,IAAa;AAAA,EACjB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEO,SAASC,EAAgB,EAAE,MAAAC,IAAO,MAAM,WAAAC,KAAmC;AAChF,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAI;AAAA,MACJ,KAAI;AAAA,MACJ,WAAWC,EAAGL,EAAWE,CAAI,GAAG,yBAAyBC,CAAS;AAAA,IAAA;AAAA,EAAA;AAGxE;"}
|
package/dist/index42.js
ADDED
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { jsx as e, jsxs as s } from "react/jsx-runtime";
|
|
2
|
+
import { Modal as a } from "./index39.js";
|
|
3
|
+
import { Button as n } from "./index17.js";
|
|
4
|
+
const p = ({
|
|
5
|
+
isOpen: l,
|
|
6
|
+
onClose: t,
|
|
7
|
+
message: r,
|
|
8
|
+
title: c = "Notification",
|
|
9
|
+
icon: i,
|
|
10
|
+
confirmText: m = "OK",
|
|
11
|
+
className: o
|
|
12
|
+
}) => /* @__PURE__ */ e(
|
|
13
|
+
a,
|
|
14
|
+
{
|
|
15
|
+
open: l,
|
|
16
|
+
onClose: t,
|
|
17
|
+
title: c,
|
|
18
|
+
maxWidth: "sm",
|
|
19
|
+
className: o,
|
|
20
|
+
children: /* @__PURE__ */ s("div", { className: "flex flex-col items-center text-center px-4 py-6", children: [
|
|
21
|
+
i && /* @__PURE__ */ e("div", { className: "mb-4", children: i }),
|
|
22
|
+
/* @__PURE__ */ e("p", { className: "text-slate-700 mb-8", children: r }),
|
|
23
|
+
/* @__PURE__ */ e(
|
|
24
|
+
n,
|
|
25
|
+
{
|
|
26
|
+
onClick: t,
|
|
27
|
+
className: "w-full",
|
|
28
|
+
children: m
|
|
29
|
+
}
|
|
30
|
+
)
|
|
31
|
+
] })
|
|
32
|
+
}
|
|
33
|
+
);
|
|
34
|
+
export {
|
|
35
|
+
p as Notification
|
|
36
|
+
};
|
|
37
|
+
//# sourceMappingURL=index42.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index42.js","sources":["../src/components/Notification/Notification.tsx"],"sourcesContent":["import { type ReactNode } from 'react'\nimport { Modal } from '../Modal/Modal'\nimport { Button } from '../Button/Button'\n\nexport interface NotificationProps {\n isOpen: boolean\n onClose: () => void\n message: string\n title?: string\n icon?: ReactNode\n confirmText?: string\n className?: string\n}\n\nexport const Notification = ({\n isOpen,\n onClose,\n message,\n title = 'Notification',\n icon,\n confirmText = 'OK',\n className,\n}: NotificationProps) => {\n return (\n <Modal\n open={isOpen}\n onClose={onClose}\n title={title}\n maxWidth=\"sm\"\n className={className}\n >\n <div className=\"flex flex-col items-center text-center px-4 py-6\">\n {icon && (\n <div className=\"mb-4\">\n {icon}\n </div>\n )}\n\n <p className=\"text-slate-700 mb-8\">\n {message}\n </p>\n\n <Button\n onClick={onClose}\n className=\"w-full\"\n >\n {confirmText}\n </Button>\n </div>\n </Modal>\n )\n}\n"],"names":["Notification","isOpen","onClose","message","title","icon","confirmText","className","jsx","Modal","jsxs","Button"],"mappings":";;;AAcO,MAAMA,IAAe,CAAC;AAAA,EAC3B,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,MAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAC;AACF,MAEI,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,MAAMR;AAAA,IACN,SAAAC;AAAA,IACA,OAAAE;AAAA,IACA,UAAS;AAAA,IACT,WAAAG;AAAA,IAEA,UAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,oDACZ,UAAA;AAAA,MAAAL,KACC,gBAAAG,EAAC,OAAA,EAAI,WAAU,QACZ,UAAAH,GACH;AAAA,MAGF,gBAAAG,EAAC,KAAA,EAAE,WAAU,uBACV,UAAAL,GACH;AAAA,MAEA,gBAAAK;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,SAAST;AAAA,UACT,WAAU;AAAA,UAET,UAAAI;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,EAAA,CACF;AAAA,EAAA;AAAA;"}
|
package/dist/index43.js
ADDED
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { cn as i } from "./index3.js";
|
|
3
|
+
function a({ children: t, className: e }) {
|
|
4
|
+
return /* @__PURE__ */ r(
|
|
5
|
+
"h1",
|
|
6
|
+
{
|
|
7
|
+
className: i(
|
|
8
|
+
"text-5xl font-light text-slate-900 tracking-tight",
|
|
9
|
+
e
|
|
10
|
+
),
|
|
11
|
+
children: t
|
|
12
|
+
}
|
|
13
|
+
);
|
|
14
|
+
}
|
|
15
|
+
export {
|
|
16
|
+
a as PageHeading
|
|
17
|
+
};
|
|
18
|
+
//# sourceMappingURL=index43.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index43.js","sources":["../src/components/Typography/PageHeading.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface PageHeadingProps {\n children: ReactNode\n className?: string\n}\n\nexport function PageHeading({ children, className }: PageHeadingProps) {\n return (\n <h1\n className={cn(\n 'text-5xl font-light text-slate-900 tracking-tight',\n className\n )}\n >\n {children}\n </h1>\n )\n}\n"],"names":["PageHeading","children","className","jsx","cn"],"mappings":";;AAQO,SAASA,EAAY,EAAE,UAAAC,GAAU,WAAAC,KAA+B;AACrE,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAF;AAAA,MAAA;AAAA,MAGD,UAAAD;AAAA,IAAA;AAAA,EAAA;AAGP;"}
|
package/dist/index44.js
ADDED
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
import { jsxs as m, jsx as s } from "react/jsx-runtime";
|
|
2
|
+
import { ChevronLeftIcon as b, ChevronRightIcon as f } from "@heroicons/react/20/solid";
|
|
3
|
+
import { cn as c } from "./index3.js";
|
|
4
|
+
function p(i, t) {
|
|
5
|
+
return Array.from({ length: t - i + 1 }, (e, l) => i + l);
|
|
6
|
+
}
|
|
7
|
+
function u(i, t, e) {
|
|
8
|
+
const l = e * 2 + 5;
|
|
9
|
+
if (t <= l)
|
|
10
|
+
return p(1, t);
|
|
11
|
+
const o = Math.max(i - e, 1), r = Math.min(i + e, t), a = o > 2, d = r < t - 1;
|
|
12
|
+
return !a && d ? [...p(1, 3 + e * 2), "ellipsis", t] : a && !d ? [1, "ellipsis", ...p(t - (2 + e * 2), t)] : [1, "ellipsis", ...p(o, r), "ellipsis", t];
|
|
13
|
+
}
|
|
14
|
+
function R({
|
|
15
|
+
currentPage: i,
|
|
16
|
+
totalPages: t,
|
|
17
|
+
onPageChange: e,
|
|
18
|
+
siblingCount: l = 1,
|
|
19
|
+
className: o
|
|
20
|
+
}) {
|
|
21
|
+
const r = u(i, t, l);
|
|
22
|
+
if (t <= 1)
|
|
23
|
+
return null;
|
|
24
|
+
const a = () => {
|
|
25
|
+
i > 1 && e(i - 1);
|
|
26
|
+
}, d = () => {
|
|
27
|
+
i < t && e(i + 1);
|
|
28
|
+
};
|
|
29
|
+
return /* @__PURE__ */ m(
|
|
30
|
+
"nav",
|
|
31
|
+
{
|
|
32
|
+
"aria-label": "Pagination",
|
|
33
|
+
className: c("flex items-center justify-center gap-1", o),
|
|
34
|
+
children: [
|
|
35
|
+
/* @__PURE__ */ s(
|
|
36
|
+
"button",
|
|
37
|
+
{
|
|
38
|
+
type: "button",
|
|
39
|
+
onClick: a,
|
|
40
|
+
disabled: i === 1,
|
|
41
|
+
className: c(
|
|
42
|
+
"p-2 rounded-lg transition-colors duration-150",
|
|
43
|
+
"text-slate-500 hover:bg-slate-100 hover:text-slate-700",
|
|
44
|
+
"disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent"
|
|
45
|
+
),
|
|
46
|
+
"aria-label": "Previous page",
|
|
47
|
+
children: /* @__PURE__ */ s(b, { className: "h-5 w-5" })
|
|
48
|
+
}
|
|
49
|
+
),
|
|
50
|
+
r.map((n, h) => n === "ellipsis" ? /* @__PURE__ */ s(
|
|
51
|
+
"span",
|
|
52
|
+
{
|
|
53
|
+
className: "px-3 py-2 text-slate-400",
|
|
54
|
+
children: "..."
|
|
55
|
+
},
|
|
56
|
+
`ellipsis-${h}`
|
|
57
|
+
) : /* @__PURE__ */ s(
|
|
58
|
+
"button",
|
|
59
|
+
{
|
|
60
|
+
type: "button",
|
|
61
|
+
onClick: () => e(n),
|
|
62
|
+
className: c(
|
|
63
|
+
"min-w-[40px] h-10 px-3 rounded-lg text-sm font-medium",
|
|
64
|
+
"transition-colors duration-150",
|
|
65
|
+
n === i ? "bg-primary-500 text-white" : "text-slate-700 hover:bg-slate-100"
|
|
66
|
+
),
|
|
67
|
+
"aria-current": n === i ? "page" : void 0,
|
|
68
|
+
children: n
|
|
69
|
+
},
|
|
70
|
+
n
|
|
71
|
+
)),
|
|
72
|
+
/* @__PURE__ */ s(
|
|
73
|
+
"button",
|
|
74
|
+
{
|
|
75
|
+
type: "button",
|
|
76
|
+
onClick: d,
|
|
77
|
+
disabled: i === t,
|
|
78
|
+
className: c(
|
|
79
|
+
"p-2 rounded-lg transition-colors duration-150",
|
|
80
|
+
"text-slate-500 hover:bg-slate-100 hover:text-slate-700",
|
|
81
|
+
"disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent"
|
|
82
|
+
),
|
|
83
|
+
"aria-label": "Next page",
|
|
84
|
+
children: /* @__PURE__ */ s(f, { className: "h-5 w-5" })
|
|
85
|
+
}
|
|
86
|
+
)
|
|
87
|
+
]
|
|
88
|
+
}
|
|
89
|
+
);
|
|
90
|
+
}
|
|
91
|
+
export {
|
|
92
|
+
R as Pagination
|
|
93
|
+
};
|
|
94
|
+
//# sourceMappingURL=index44.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index44.js","sources":["../src/components/Pagination/Pagination.tsx"],"sourcesContent":["import { ChevronLeftIcon, ChevronRightIcon } from '@heroicons/react/20/solid'\nimport { cn } from '@/lib/utils'\n\nexport interface PaginationProps {\n currentPage: number\n totalPages: number\n onPageChange: (page: number) => void\n siblingCount?: number\n className?: string\n}\n\nfunction range(start: number, end: number): number[] {\n return Array.from({ length: end - start + 1 }, (_, i) => start + i)\n}\n\nfunction getPaginationRange(\n currentPage: number,\n totalPages: number,\n siblingCount: number\n): (number | 'ellipsis')[] {\n const totalPageNumbers = siblingCount * 2 + 5 // siblings + first + last + current + 2 ellipsis\n\n if (totalPages <= totalPageNumbers) {\n return range(1, totalPages)\n }\n\n const leftSiblingIndex = Math.max(currentPage - siblingCount, 1)\n const rightSiblingIndex = Math.min(currentPage + siblingCount, totalPages)\n\n const showLeftEllipsis = leftSiblingIndex > 2\n const showRightEllipsis = rightSiblingIndex < totalPages - 1\n\n if (!showLeftEllipsis && showRightEllipsis) {\n const leftRange = range(1, 3 + siblingCount * 2)\n return [...leftRange, 'ellipsis', totalPages]\n }\n\n if (showLeftEllipsis && !showRightEllipsis) {\n const rightRange = range(totalPages - (2 + siblingCount * 2), totalPages)\n return [1, 'ellipsis', ...rightRange]\n }\n\n const middleRange = range(leftSiblingIndex, rightSiblingIndex)\n return [1, 'ellipsis', ...middleRange, 'ellipsis', totalPages]\n}\n\nexport function Pagination({\n currentPage,\n totalPages,\n onPageChange,\n siblingCount = 1,\n className,\n}: PaginationProps) {\n const paginationRange = getPaginationRange(currentPage, totalPages, siblingCount)\n\n if (totalPages <= 1) {\n return null\n }\n\n const onPrevious = () => {\n if (currentPage > 1) {\n onPageChange(currentPage - 1)\n }\n }\n\n const onNext = () => {\n if (currentPage < totalPages) {\n onPageChange(currentPage + 1)\n }\n }\n\n return (\n <nav\n aria-label=\"Pagination\"\n className={cn('flex items-center justify-center gap-1', className)}\n >\n <button\n type=\"button\"\n onClick={onPrevious}\n disabled={currentPage === 1}\n className={cn(\n 'p-2 rounded-lg transition-colors duration-150',\n 'text-slate-500 hover:bg-slate-100 hover:text-slate-700',\n 'disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent'\n )}\n aria-label=\"Previous page\"\n >\n <ChevronLeftIcon className=\"h-5 w-5\" />\n </button>\n\n {paginationRange.map((page, index) => {\n if (page === 'ellipsis') {\n return (\n <span\n key={`ellipsis-${index}`}\n className=\"px-3 py-2 text-slate-400\"\n >\n ...\n </span>\n )\n }\n\n return (\n <button\n key={page}\n type=\"button\"\n onClick={() => onPageChange(page)}\n className={cn(\n 'min-w-[40px] h-10 px-3 rounded-lg text-sm font-medium',\n 'transition-colors duration-150',\n page === currentPage\n ? 'bg-primary-500 text-white'\n : 'text-slate-700 hover:bg-slate-100'\n )}\n aria-current={page === currentPage ? 'page' : undefined}\n >\n {page}\n </button>\n )\n })}\n\n <button\n type=\"button\"\n onClick={onNext}\n disabled={currentPage === totalPages}\n className={cn(\n 'p-2 rounded-lg transition-colors duration-150',\n 'text-slate-500 hover:bg-slate-100 hover:text-slate-700',\n 'disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent'\n )}\n aria-label=\"Next page\"\n >\n <ChevronRightIcon className=\"h-5 w-5\" />\n </button>\n </nav>\n )\n}\n"],"names":["range","start","end","_","i","getPaginationRange","currentPage","totalPages","siblingCount","totalPageNumbers","leftSiblingIndex","rightSiblingIndex","showLeftEllipsis","showRightEllipsis","Pagination","onPageChange","className","paginationRange","onPrevious","onNext","jsxs","cn","jsx","ChevronLeftIcon","page","index","ChevronRightIcon"],"mappings":";;;AAWA,SAASA,EAAMC,GAAeC,GAAuB;AACnD,SAAO,MAAM,KAAK,EAAE,QAAQA,IAAMD,IAAQ,EAAA,GAAK,CAACE,GAAGC,MAAMH,IAAQG,CAAC;AACpE;AAEA,SAASC,EACPC,GACAC,GACAC,GACyB;AACzB,QAAMC,IAAmBD,IAAe,IAAI;AAE5C,MAAID,KAAcE;AAChB,WAAOT,EAAM,GAAGO,CAAU;AAG5B,QAAMG,IAAmB,KAAK,IAAIJ,IAAcE,GAAc,CAAC,GACzDG,IAAoB,KAAK,IAAIL,IAAcE,GAAcD,CAAU,GAEnEK,IAAmBF,IAAmB,GACtCG,IAAoBF,IAAoBJ,IAAa;AAE3D,SAAI,CAACK,KAAoBC,IAEhB,CAAC,GADUb,EAAM,GAAG,IAAIQ,IAAe,CAAC,GACzB,YAAYD,CAAU,IAG1CK,KAAoB,CAACC,IAEhB,CAAC,GAAG,YAAY,GADJb,EAAMO,KAAc,IAAIC,IAAe,IAAID,CAAU,CACpC,IAI/B,CAAC,GAAG,YAAY,GADHP,EAAMU,GAAkBC,CAAiB,GACtB,YAAYJ,CAAU;AAC/D;AAEO,SAASO,EAAW;AAAA,EACzB,aAAAR;AAAA,EACA,YAAAC;AAAA,EACA,cAAAQ;AAAA,EACA,cAAAP,IAAe;AAAA,EACf,WAAAQ;AACF,GAAoB;AAClB,QAAMC,IAAkBZ,EAAmBC,GAAaC,GAAYC,CAAY;AAEhF,MAAID,KAAc;AAChB,WAAO;AAGT,QAAMW,IAAa,MAAM;AACvB,IAAIZ,IAAc,KAChBS,EAAaT,IAAc,CAAC;AAAA,EAEhC,GAEMa,IAAS,MAAM;AACnB,IAAIb,IAAcC,KAChBQ,EAAaT,IAAc,CAAC;AAAA,EAEhC;AAEA,SACE,gBAAAc;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,cAAW;AAAA,MACX,WAAWC,EAAG,0CAA0CL,CAAS;AAAA,MAEjE,UAAA;AAAA,QAAA,gBAAAM;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,SAASJ;AAAA,YACT,UAAUZ,MAAgB;AAAA,YAC1B,WAAWe;AAAA,cACT;AAAA,cACA;AAAA,cACA;AAAA,YAAA;AAAA,YAEF,cAAW;AAAA,YAEX,UAAA,gBAAAC,EAACC,GAAA,EAAgB,WAAU,UAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,QAGtCN,EAAgB,IAAI,CAACO,GAAMC,MACtBD,MAAS,aAET,gBAAAF;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAU;AAAA,YACX,UAAA;AAAA,UAAA;AAAA,UAFM,YAAYG,CAAK;AAAA,QAAA,IAS1B,gBAAAH;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAS,MAAMP,EAAaS,CAAI;AAAA,YAChC,WAAWH;AAAA,cACT;AAAA,cACA;AAAA,cACAG,MAASlB,IACL,8BACA;AAAA,YAAA;AAAA,YAEN,gBAAckB,MAASlB,IAAc,SAAS;AAAA,YAE7C,UAAAkB;AAAA,UAAA;AAAA,UAZIA;AAAA,QAAA,CAeV;AAAA,QAED,gBAAAF;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,SAASH;AAAA,YACT,UAAUb,MAAgBC;AAAA,YAC1B,WAAWc;AAAA,cACT;AAAA,cACA;AAAA,cACA;AAAA,YAAA;AAAA,YAEF,cAAW;AAAA,YAEX,UAAA,gBAAAC,EAACI,GAAA,EAAiB,WAAU,UAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MACxC;AAAA,IAAA;AAAA,EAAA;AAGN;"}
|
package/dist/index45.js
ADDED
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
import { jsx as r, jsxs as a } from "react/jsx-runtime";
|
|
2
|
+
import { cn as n } from "./index3.js";
|
|
3
|
+
const i = ({ children: e, className: t }) => /* @__PURE__ */ r(
|
|
4
|
+
"div",
|
|
5
|
+
{
|
|
6
|
+
className: n(
|
|
7
|
+
"border border-slate-200 rounded-2xl p-6 bg-white relative",
|
|
8
|
+
t
|
|
9
|
+
),
|
|
10
|
+
children: e
|
|
11
|
+
}
|
|
12
|
+
), m = ({ children: e, className: t }) => /* @__PURE__ */ r(
|
|
13
|
+
"div",
|
|
14
|
+
{
|
|
15
|
+
className: n(
|
|
16
|
+
"flex justify-between items-center mb-5",
|
|
17
|
+
t
|
|
18
|
+
),
|
|
19
|
+
children: e
|
|
20
|
+
}
|
|
21
|
+
), d = ({ children: e, badge: t, className: s }) => /* @__PURE__ */ a("div", { className: n("flex items-center gap-3", s), children: [
|
|
22
|
+
/* @__PURE__ */ r("h2", { className: "text-lg font-semibold text-primary-500 m-0", children: e }),
|
|
23
|
+
t
|
|
24
|
+
] }), p = ({ children: e, onClick: t, disabled: s, className: o }) => /* @__PURE__ */ r(
|
|
25
|
+
"button",
|
|
26
|
+
{
|
|
27
|
+
type: "button",
|
|
28
|
+
onClick: t,
|
|
29
|
+
disabled: s,
|
|
30
|
+
className: n(
|
|
31
|
+
"bg-transparent border-none p-0",
|
|
32
|
+
"flex items-center gap-1.5",
|
|
33
|
+
"cursor-pointer text-primary-500",
|
|
34
|
+
"text-sm font-semibold",
|
|
35
|
+
"transition-opacity hover:opacity-70",
|
|
36
|
+
"disabled:opacity-40 disabled:cursor-not-allowed",
|
|
37
|
+
o
|
|
38
|
+
),
|
|
39
|
+
children: e
|
|
40
|
+
}
|
|
41
|
+
), x = ({ children: e, className: t }) => /* @__PURE__ */ r("div", { className: t, children: e }), b = ({ children: e, className: t }) => /* @__PURE__ */ r(
|
|
42
|
+
"div",
|
|
43
|
+
{
|
|
44
|
+
className: n(
|
|
45
|
+
"border-t border-slate-100 pt-3 mt-4 text-center",
|
|
46
|
+
t
|
|
47
|
+
),
|
|
48
|
+
children: e
|
|
49
|
+
}
|
|
50
|
+
), u = ({ message: e, action: t, className: s }) => /* @__PURE__ */ a(
|
|
51
|
+
"div",
|
|
52
|
+
{
|
|
53
|
+
className: n(
|
|
54
|
+
"flex flex-col items-center justify-center py-8 text-center",
|
|
55
|
+
s
|
|
56
|
+
),
|
|
57
|
+
children: [
|
|
58
|
+
/* @__PURE__ */ r("p", { className: "text-sm text-slate-500 mb-4", children: e }),
|
|
59
|
+
t
|
|
60
|
+
]
|
|
61
|
+
}
|
|
62
|
+
);
|
|
63
|
+
export {
|
|
64
|
+
i as Panel,
|
|
65
|
+
p as PanelAction,
|
|
66
|
+
x as PanelBody,
|
|
67
|
+
u as PanelEmptyState,
|
|
68
|
+
b as PanelFooter,
|
|
69
|
+
m as PanelHeader,
|
|
70
|
+
d as PanelTitle
|
|
71
|
+
};
|
|
72
|
+
//# sourceMappingURL=index45.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index45.js","sources":["../src/components/Panel/Panel.tsx"],"sourcesContent":["import { type ReactNode } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface PanelProps {\n children: ReactNode\n className?: string\n}\n\nexport const Panel = ({ children, className }: PanelProps) => {\n return (\n <div\n className={cn(\n 'border border-slate-200 rounded-2xl p-6 bg-white relative',\n className\n )}\n >\n {children}\n </div>\n )\n}\n\nexport interface PanelHeaderProps {\n children: ReactNode\n className?: string\n}\n\nexport const PanelHeader = ({ children, className }: PanelHeaderProps) => {\n return (\n <div\n className={cn(\n 'flex justify-between items-center mb-5',\n className\n )}\n >\n {children}\n </div>\n )\n}\n\nexport interface PanelTitleProps {\n children: ReactNode\n badge?: ReactNode\n className?: string\n}\n\nexport const PanelTitle = ({ children, badge, className }: PanelTitleProps) => {\n return (\n <div className={cn('flex items-center gap-3', className)}>\n <h2 className=\"text-lg font-semibold text-primary-500 m-0\">\n {children}\n </h2>\n {badge}\n </div>\n )\n}\n\nexport interface PanelActionProps {\n children: ReactNode\n onClick?: () => void\n disabled?: boolean\n className?: string\n}\n\nexport const PanelAction = ({ children, onClick, disabled, className }: PanelActionProps) => {\n return (\n <button\n type=\"button\"\n onClick={onClick}\n disabled={disabled}\n className={cn(\n 'bg-transparent border-none p-0',\n 'flex items-center gap-1.5',\n 'cursor-pointer text-primary-500',\n 'text-sm font-semibold',\n 'transition-opacity hover:opacity-70',\n 'disabled:opacity-40 disabled:cursor-not-allowed',\n className\n )}\n >\n {children}\n </button>\n )\n}\n\nexport interface PanelBodyProps {\n children: ReactNode\n className?: string\n}\n\nexport const PanelBody = ({ children, className }: PanelBodyProps) => {\n return (\n <div className={className}>\n {children}\n </div>\n )\n}\n\nexport interface PanelFooterProps {\n children: ReactNode\n className?: string\n}\n\nexport const PanelFooter = ({ children, className }: PanelFooterProps) => {\n return (\n <div\n className={cn(\n 'border-t border-slate-100 pt-3 mt-4 text-center',\n className\n )}\n >\n {children}\n </div>\n )\n}\n\nexport interface PanelEmptyStateProps {\n message: string\n action?: ReactNode\n className?: string\n}\n\nexport const PanelEmptyState = ({ message, action, className }: PanelEmptyStateProps) => {\n return (\n <div\n className={cn(\n 'flex flex-col items-center justify-center py-8 text-center',\n className\n )}\n >\n <p className=\"text-sm text-slate-500 mb-4\">{message}</p>\n {action}\n </div>\n )\n}\n"],"names":["Panel","children","className","jsx","cn","PanelHeader","PanelTitle","badge","PanelAction","onClick","disabled","PanelBody","PanelFooter","PanelEmptyState","message","action","jsxs"],"mappings":";;AAQO,MAAMA,IAAQ,CAAC,EAAE,UAAAC,GAAU,WAAAC,QAE9B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACAF;AAAA,IAAA;AAAA,IAGD,UAAAD;AAAA,EAAA;AAAA,GAUMI,IAAc,CAAC,EAAE,UAAAJ,GAAU,WAAAC,QAEpC,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACAF;AAAA,IAAA;AAAA,IAGD,UAAAD;AAAA,EAAA;AAAA,GAWMK,IAAa,CAAC,EAAE,UAAAL,GAAU,OAAAM,GAAO,WAAAL,0BAEzC,OAAA,EAAI,WAAWE,EAAG,2BAA2BF,CAAS,GACrD,UAAA;AAAA,EAAA,gBAAAC,EAAC,MAAA,EAAG,WAAU,8CACX,UAAAF,EAAA,CACH;AAAA,EACCM;AAAA,GACH,GAWSC,IAAc,CAAC,EAAE,UAAAP,GAAU,SAAAQ,GAAS,UAAAC,GAAU,WAAAR,QAEvD,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,SAAAM;AAAA,IACA,UAAAC;AAAA,IACA,WAAWN;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACAF;AAAA,IAAA;AAAA,IAGD,UAAAD;AAAA,EAAA;AAAA,GAUMU,IAAY,CAAC,EAAE,UAAAV,GAAU,WAAAC,QAElC,gBAAAC,EAAC,OAAA,EAAI,WAAAD,GACF,UAAAD,EAAA,CACH,GASSW,IAAc,CAAC,EAAE,UAAAX,GAAU,WAAAC,QAEpC,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACAF;AAAA,IAAA;AAAA,IAGD,UAAAD;AAAA,EAAA;AAAA,GAWMY,IAAkB,CAAC,EAAE,SAAAC,GAAS,QAAAC,GAAQ,WAAAb,QAE/C,gBAAAc;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWZ;AAAA,MACT;AAAA,MACAF;AAAA,IAAA;AAAA,IAGF,UAAA;AAAA,MAAA,gBAAAC,EAAC,KAAA,EAAE,WAAU,+BAA+B,UAAAW,GAAQ;AAAA,MACnDC;AAAA,IAAA;AAAA,EAAA;AAAA;"}
|
package/dist/index46.js
ADDED
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import { jsx as e, jsxs as n, Fragment as p } from "react/jsx-runtime";
|
|
2
|
+
import { useState as g } from "react";
|
|
3
|
+
import { cn as v } from "./index3.js";
|
|
4
|
+
import { EmptyData as x } from "./index27.js";
|
|
5
|
+
import { Dialog as w, DialogPanel as N } from "@headlessui/react";
|
|
6
|
+
import { XMarkIcon as C, TrashIcon as y, ChevronLeftIcon as k, ChevronRightIcon as I } from "@heroicons/react/24/outline";
|
|
7
|
+
const T = ({
|
|
8
|
+
images: t,
|
|
9
|
+
columns: c = 4,
|
|
10
|
+
gap: u = 16,
|
|
11
|
+
emptyMessage: d = "To add images, upload them directly or import from another source.",
|
|
12
|
+
onDelete: a,
|
|
13
|
+
className: i
|
|
14
|
+
}) => {
|
|
15
|
+
const [l, r] = g(null), h = {
|
|
16
|
+
3: "grid-cols-3",
|
|
17
|
+
4: "grid-cols-4",
|
|
18
|
+
5: "grid-cols-5",
|
|
19
|
+
6: "grid-cols-6"
|
|
20
|
+
}, m = () => {
|
|
21
|
+
l !== null && l > 0 && r(l - 1);
|
|
22
|
+
}, f = () => {
|
|
23
|
+
l !== null && l < t.length - 1 && r(l + 1);
|
|
24
|
+
}, b = () => {
|
|
25
|
+
l !== null && a && (a(t[l], l), t.length === 1 ? r(null) : l >= t.length - 1 && r(t.length - 2));
|
|
26
|
+
};
|
|
27
|
+
return t.length === 0 ? /* @__PURE__ */ e(
|
|
28
|
+
x,
|
|
29
|
+
{
|
|
30
|
+
fullBlock: !0,
|
|
31
|
+
message: d,
|
|
32
|
+
className: i
|
|
33
|
+
}
|
|
34
|
+
) : /* @__PURE__ */ n(p, { children: [
|
|
35
|
+
/* @__PURE__ */ e(
|
|
36
|
+
"div",
|
|
37
|
+
{
|
|
38
|
+
className: v("grid", h[c], i),
|
|
39
|
+
style: { gap: `${u}px` },
|
|
40
|
+
children: t.map((o, s) => /* @__PURE__ */ e(
|
|
41
|
+
"div",
|
|
42
|
+
{
|
|
43
|
+
className: "aspect-square rounded-lg overflow-hidden cursor-pointer bg-slate-200 hover:opacity-90 transition-opacity",
|
|
44
|
+
onClick: () => r(s),
|
|
45
|
+
children: /* @__PURE__ */ e(
|
|
46
|
+
"img",
|
|
47
|
+
{
|
|
48
|
+
src: o.url,
|
|
49
|
+
alt: o.alt || `Image ${s + 1}`,
|
|
50
|
+
className: "w-full h-full object-cover"
|
|
51
|
+
}
|
|
52
|
+
)
|
|
53
|
+
},
|
|
54
|
+
o.id || o.url
|
|
55
|
+
))
|
|
56
|
+
}
|
|
57
|
+
),
|
|
58
|
+
/* @__PURE__ */ n(
|
|
59
|
+
w,
|
|
60
|
+
{
|
|
61
|
+
open: l !== null,
|
|
62
|
+
onClose: () => r(null),
|
|
63
|
+
className: "relative z-50",
|
|
64
|
+
children: [
|
|
65
|
+
/* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black", "aria-hidden": "true" }),
|
|
66
|
+
/* @__PURE__ */ e("div", { className: "fixed inset-0 flex items-center justify-center", children: /* @__PURE__ */ n(N, { className: "relative w-full h-full flex items-center justify-center", children: [
|
|
67
|
+
/* @__PURE__ */ e(
|
|
68
|
+
"button",
|
|
69
|
+
{
|
|
70
|
+
onClick: () => r(null),
|
|
71
|
+
className: "absolute top-8 left-8 p-2 rounded-full bg-white hover:bg-slate-100 transition-colors z-10",
|
|
72
|
+
"aria-label": "Close preview",
|
|
73
|
+
children: /* @__PURE__ */ e(C, { className: "w-6 h-6 text-slate-700" })
|
|
74
|
+
}
|
|
75
|
+
),
|
|
76
|
+
a && /* @__PURE__ */ e(
|
|
77
|
+
"button",
|
|
78
|
+
{
|
|
79
|
+
onClick: b,
|
|
80
|
+
className: "absolute top-8 right-8 p-2 rounded-full bg-white hover:bg-red-50 transition-colors z-10",
|
|
81
|
+
"aria-label": "Delete image",
|
|
82
|
+
children: /* @__PURE__ */ e(y, { className: "w-6 h-6 text-red-500" })
|
|
83
|
+
}
|
|
84
|
+
),
|
|
85
|
+
l !== null && l > 0 && /* @__PURE__ */ e(
|
|
86
|
+
"button",
|
|
87
|
+
{
|
|
88
|
+
onClick: m,
|
|
89
|
+
className: "absolute left-8 p-3 rounded-full bg-white/80 hover:bg-white transition-colors z-10",
|
|
90
|
+
"aria-label": "Previous image",
|
|
91
|
+
children: /* @__PURE__ */ e(k, { className: "w-6 h-6 text-slate-700" })
|
|
92
|
+
}
|
|
93
|
+
),
|
|
94
|
+
l !== null && l < t.length - 1 && /* @__PURE__ */ e(
|
|
95
|
+
"button",
|
|
96
|
+
{
|
|
97
|
+
onClick: f,
|
|
98
|
+
className: "absolute right-8 p-3 rounded-full bg-white/80 hover:bg-white transition-colors z-10",
|
|
99
|
+
"aria-label": "Next image",
|
|
100
|
+
children: /* @__PURE__ */ e(I, { className: "w-6 h-6 text-slate-700" })
|
|
101
|
+
}
|
|
102
|
+
),
|
|
103
|
+
l !== null && /* @__PURE__ */ e(
|
|
104
|
+
"img",
|
|
105
|
+
{
|
|
106
|
+
src: t[l].url,
|
|
107
|
+
alt: t[l].alt || `Image ${l + 1}`,
|
|
108
|
+
className: "max-w-full max-h-full object-contain"
|
|
109
|
+
}
|
|
110
|
+
),
|
|
111
|
+
l !== null && /* @__PURE__ */ n("div", { className: "absolute bottom-8 left-1/2 -translate-x-1/2 px-4 py-2 rounded-full bg-white/80 text-sm font-medium", children: [
|
|
112
|
+
l + 1,
|
|
113
|
+
" / ",
|
|
114
|
+
t.length
|
|
115
|
+
] })
|
|
116
|
+
] }) })
|
|
117
|
+
]
|
|
118
|
+
}
|
|
119
|
+
)
|
|
120
|
+
] });
|
|
121
|
+
};
|
|
122
|
+
export {
|
|
123
|
+
T as PhotoLibrary
|
|
124
|
+
};
|
|
125
|
+
//# sourceMappingURL=index46.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index46.js","sources":["../src/components/PhotoLibrary/PhotoLibrary.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { cn } from '@/lib/utils'\nimport { EmptyData } from '../EmptyData/EmptyData'\nimport { Dialog, DialogPanel } from '@headlessui/react'\nimport { XMarkIcon, ChevronLeftIcon, ChevronRightIcon, TrashIcon } from '@heroicons/react/24/outline'\n\nexport interface PhotoLibraryImage {\n url: string\n alt?: string\n id?: string\n}\n\nexport interface PhotoLibraryProps {\n images: PhotoLibraryImage[]\n columns?: 3 | 4 | 5 | 6\n gap?: number\n emptyMessage?: string\n onDelete?: (image: PhotoLibraryImage, index: number) => void\n className?: string\n}\n\nexport const PhotoLibrary = ({\n images,\n columns = 4,\n gap = 16,\n emptyMessage = 'To add images, upload them directly or import from another source.',\n onDelete,\n className,\n}: PhotoLibraryProps) => {\n const [previewIndex, setPreviewIndex] = useState<number | null>(null)\n\n const columnClasses = {\n 3: 'grid-cols-3',\n 4: 'grid-cols-4',\n 5: 'grid-cols-5',\n 6: 'grid-cols-6',\n }\n\n const handlePrevious = () => {\n if (previewIndex !== null && previewIndex > 0) {\n setPreviewIndex(previewIndex - 1)\n }\n }\n\n const handleNext = () => {\n if (previewIndex !== null && previewIndex < images.length - 1) {\n setPreviewIndex(previewIndex + 1)\n }\n }\n\n const handleDelete = () => {\n if (previewIndex !== null && onDelete) {\n onDelete(images[previewIndex], previewIndex)\n if (images.length === 1) {\n setPreviewIndex(null)\n } else if (previewIndex >= images.length - 1) {\n setPreviewIndex(images.length - 2)\n }\n }\n }\n\n if (images.length === 0) {\n return (\n <EmptyData\n fullBlock\n message={emptyMessage}\n className={className}\n />\n )\n }\n\n return (\n <>\n <div\n className={cn('grid', columnClasses[columns], className)}\n style={{ gap: `${gap}px` }}\n >\n {images.map((image, index) => (\n <div\n key={image.id || image.url}\n className=\"aspect-square rounded-lg overflow-hidden cursor-pointer bg-slate-200 hover:opacity-90 transition-opacity\"\n onClick={() => setPreviewIndex(index)}\n >\n <img\n src={image.url}\n alt={image.alt || `Image ${index + 1}`}\n className=\"w-full h-full object-cover\"\n />\n </div>\n ))}\n </div>\n\n {/* Preview Modal */}\n <Dialog\n open={previewIndex !== null}\n onClose={() => setPreviewIndex(null)}\n className=\"relative z-50\"\n >\n <div className=\"fixed inset-0 bg-black\" aria-hidden=\"true\" />\n\n <div className=\"fixed inset-0 flex items-center justify-center\">\n <DialogPanel className=\"relative w-full h-full flex items-center justify-center\">\n {/* Close button */}\n <button\n onClick={() => setPreviewIndex(null)}\n className=\"absolute top-8 left-8 p-2 rounded-full bg-white hover:bg-slate-100 transition-colors z-10\"\n aria-label=\"Close preview\"\n >\n <XMarkIcon className=\"w-6 h-6 text-slate-700\" />\n </button>\n\n {/* Delete button */}\n {onDelete && (\n <button\n onClick={handleDelete}\n className=\"absolute top-8 right-8 p-2 rounded-full bg-white hover:bg-red-50 transition-colors z-10\"\n aria-label=\"Delete image\"\n >\n <TrashIcon className=\"w-6 h-6 text-red-500\" />\n </button>\n )}\n\n {/* Navigation */}\n {previewIndex !== null && previewIndex > 0 && (\n <button\n onClick={handlePrevious}\n className=\"absolute left-8 p-3 rounded-full bg-white/80 hover:bg-white transition-colors z-10\"\n aria-label=\"Previous image\"\n >\n <ChevronLeftIcon className=\"w-6 h-6 text-slate-700\" />\n </button>\n )}\n\n {previewIndex !== null && previewIndex < images.length - 1 && (\n <button\n onClick={handleNext}\n className=\"absolute right-8 p-3 rounded-full bg-white/80 hover:bg-white transition-colors z-10\"\n aria-label=\"Next image\"\n >\n <ChevronRightIcon className=\"w-6 h-6 text-slate-700\" />\n </button>\n )}\n\n {/* Image */}\n {previewIndex !== null && (\n <img\n src={images[previewIndex].url}\n alt={images[previewIndex].alt || `Image ${previewIndex + 1}`}\n className=\"max-w-full max-h-full object-contain\"\n />\n )}\n\n {/* Counter */}\n {previewIndex !== null && (\n <div className=\"absolute bottom-8 left-1/2 -translate-x-1/2 px-4 py-2 rounded-full bg-white/80 text-sm font-medium\">\n {previewIndex + 1} / {images.length}\n </div>\n )}\n </DialogPanel>\n </div>\n </Dialog>\n </>\n )\n}\n"],"names":["PhotoLibrary","images","columns","gap","emptyMessage","onDelete","className","previewIndex","setPreviewIndex","useState","columnClasses","handlePrevious","handleNext","handleDelete","jsx","EmptyData","jsxs","Fragment","cn","image","index","Dialog","DialogPanel","XMarkIcon","TrashIcon","ChevronLeftIcon","ChevronRightIcon"],"mappings":"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"}
|
package/dist/index47.js
ADDED
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { jsx as m } from "react/jsx-runtime";
|
|
2
|
+
import { cn as o } from "./index3.js";
|
|
3
|
+
const p = {
|
|
4
|
+
default: "bg-slate-100 text-slate-700",
|
|
5
|
+
primary: "bg-primary-500 text-white",
|
|
6
|
+
success: "bg-green-100 text-green-700",
|
|
7
|
+
warning: "bg-amber-100 text-amber-700",
|
|
8
|
+
danger: "bg-red-100 text-red-700",
|
|
9
|
+
info: "bg-blue-100 text-blue-700"
|
|
10
|
+
}, x = {
|
|
11
|
+
sm: "px-2 py-0.5 text-xs",
|
|
12
|
+
md: "px-2.5 py-1 text-sm",
|
|
13
|
+
lg: "px-3 py-1.5 text-base"
|
|
14
|
+
}, y = ({
|
|
15
|
+
label: n,
|
|
16
|
+
variant: i = "default",
|
|
17
|
+
size: a = "md",
|
|
18
|
+
className: l,
|
|
19
|
+
onClick: e,
|
|
20
|
+
backgroundColor: t,
|
|
21
|
+
textColor: r
|
|
22
|
+
}) => {
|
|
23
|
+
const s = t || r ? { backgroundColor: t, color: r } : void 0;
|
|
24
|
+
return /* @__PURE__ */ m(
|
|
25
|
+
"span",
|
|
26
|
+
{
|
|
27
|
+
onClick: e,
|
|
28
|
+
className: o(
|
|
29
|
+
"inline-flex items-center rounded-full font-medium whitespace-nowrap",
|
|
30
|
+
!s && p[i],
|
|
31
|
+
x[a],
|
|
32
|
+
e && "cursor-pointer hover:opacity-80 transition-opacity",
|
|
33
|
+
l
|
|
34
|
+
),
|
|
35
|
+
style: s,
|
|
36
|
+
children: n
|
|
37
|
+
}
|
|
38
|
+
);
|
|
39
|
+
};
|
|
40
|
+
export {
|
|
41
|
+
y as Pill
|
|
42
|
+
};
|
|
43
|
+
//# sourceMappingURL=index47.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index47.js","sources":["../src/components/Pill/Pill.tsx"],"sourcesContent":["import { type ReactNode } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface PillProps {\n label: ReactNode\n variant?: 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info'\n size?: 'sm' | 'md' | 'lg'\n className?: string\n onClick?: (event: React.MouseEvent) => void\n backgroundColor?: string\n textColor?: string\n}\n\nconst variantStyles = {\n default: 'bg-slate-100 text-slate-700',\n primary: 'bg-primary-500 text-white',\n success: 'bg-green-100 text-green-700',\n warning: 'bg-amber-100 text-amber-700',\n danger: 'bg-red-100 text-red-700',\n info: 'bg-blue-100 text-blue-700',\n}\n\nconst sizeStyles = {\n sm: 'px-2 py-0.5 text-xs',\n md: 'px-2.5 py-1 text-sm',\n lg: 'px-3 py-1.5 text-base',\n}\n\nexport const Pill = ({\n label,\n variant = 'default',\n size = 'md',\n className,\n onClick,\n backgroundColor,\n textColor,\n}: PillProps) => {\n const customStyles = backgroundColor || textColor\n ? { backgroundColor, color: textColor }\n : undefined\n\n return (\n <span\n onClick={onClick}\n className={cn(\n 'inline-flex items-center rounded-full font-medium whitespace-nowrap',\n !customStyles && variantStyles[variant],\n sizeStyles[size],\n onClick && 'cursor-pointer hover:opacity-80 transition-opacity',\n className\n )}\n style={customStyles}\n >\n {label}\n </span>\n )\n}\n"],"names":["variantStyles","sizeStyles","Pill","label","variant","size","className","onClick","backgroundColor","textColor","customStyles","jsx","cn"],"mappings":";;AAaA,MAAMA,IAAgB;AAAA,EACpB,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AACR,GAEMC,IAAa;AAAA,EACjB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAO,CAAC;AAAA,EACnB,OAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AACF,MAAiB;AACf,QAAMC,IAAeF,KAAmBC,IACpC,EAAE,iBAAAD,GAAiB,OAAOC,MAC1B;AAEJ,SACE,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,SAAAJ;AAAA,MACA,WAAWK;AAAA,QACT;AAAA,QACA,CAACF,KAAgBV,EAAcI,CAAO;AAAA,QACtCH,EAAWI,CAAI;AAAA,QACfE,KAAW;AAAA,QACXD;AAAA,MAAA;AAAA,MAEF,OAAOI;AAAA,MAEN,UAAAP;AAAA,IAAA;AAAA,EAAA;AAGP;"}
|