@jbpark/ui-kit 2.11.3 → 2.12.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/Button.mjs +1 -1
- package/dist/Button.mjs.map +1 -1
- package/dist/components/atoms/checkbox/checkbox.mjs +11 -1
- package/dist/components/atoms/checkbox/checkbox.mjs.map +1 -1
- package/dist/components/atoms/checkbox/group.d.mts +4 -2
- package/dist/components/atoms/checkbox/group.d.mts.map +1 -1
- package/dist/components/atoms/checkbox/group.mjs +3 -1
- package/dist/components/atoms/checkbox/group.mjs.map +1 -1
- package/dist/components/atoms/color-picker.mjs +8 -0
- package/dist/components/atoms/color-picker.mjs.map +1 -1
- package/dist/components/atoms/input/search.mjs +17 -9
- package/dist/components/atoms/input/search.mjs.map +1 -1
- package/dist/components/atoms/popover.d.mts +2 -1
- package/dist/components/atoms/popover.d.mts.map +1 -1
- package/dist/components/atoms/popover.mjs +2 -1
- package/dist/components/atoms/popover.mjs.map +1 -1
- package/dist/components/atoms/progress.d.mts +2 -1
- package/dist/components/atoms/progress.d.mts.map +1 -1
- package/dist/components/atoms/progress.mjs +2 -1
- package/dist/components/atoms/progress.mjs.map +1 -1
- package/dist/components/atoms/radio/group.d.mts +3 -2
- package/dist/components/atoms/radio/group.d.mts.map +1 -1
- package/dist/components/atoms/radio/group.mjs +3 -2
- package/dist/components/atoms/radio/group.mjs.map +1 -1
- package/dist/components/atoms/radio/radio.mjs +11 -1
- package/dist/components/atoms/radio/radio.mjs.map +1 -1
- package/dist/components/atoms/spin.d.mts +3 -1
- package/dist/components/atoms/spin.d.mts.map +1 -1
- package/dist/components/atoms/spin.mjs +19 -4
- package/dist/components/atoms/spin.mjs.map +1 -1
- package/dist/components/molecules/collapse.d.mts +3 -2
- package/dist/components/molecules/collapse.d.mts.map +1 -1
- package/dist/components/molecules/collapse.mjs +16 -20
- package/dist/components/molecules/collapse.mjs.map +1 -1
- package/dist/components/molecules/dropdown.d.mts +3 -1
- package/dist/components/molecules/dropdown.d.mts.map +1 -1
- package/dist/components/molecules/dropdown.mjs +15 -4
- package/dist/components/molecules/dropdown.mjs.map +1 -1
- package/dist/components/molecules/marquees/item.mjs +3 -2
- package/dist/components/molecules/marquees/item.mjs.map +1 -1
- package/dist/components/molecules/menu/item/item.mjs +27 -11
- package/dist/components/molecules/menu/item/item.mjs.map +1 -1
- package/dist/components/molecules/menu/menu.d.mts +1 -1
- package/dist/components/molecules/menu/menu.d.mts.map +1 -1
- package/dist/components/molecules/menu/menu.mjs +2 -1
- package/dist/components/molecules/menu/menu.mjs.map +1 -1
- package/dist/components/molecules/reveals/reveals.mjs +1 -2
- package/dist/components/molecules/reveals/reveals.mjs.map +1 -1
- package/dist/components/organisms/drawer.mjs +4 -1
- package/dist/components/organisms/drawer.mjs.map +1 -1
- package/dist/components/organisms/modal.d.mts.map +1 -1
- package/dist/components/organisms/modal.mjs +47 -19
- package/dist/components/organisms/modal.mjs.map +1 -1
- package/dist/core/badge.d.mts +1 -1
- package/dist/core/button.d.mts +2 -2
- package/dist/core/dialog.d.mts +1 -5
- package/dist/core/dialog.d.mts.map +1 -1
- package/dist/core/dialog.mjs +1 -2
- package/dist/core/dialog.mjs.map +1 -1
- package/dist/style.css +0 -3
- package/package.json +1 -1
- package/dist/enums.d.mts +0 -5
- package/dist/enums.d.mts.map +0 -1
- package/dist/enums.mjs +0 -13
- package/dist/enums.mjs.map +0 -1
|
@@ -13,9 +13,18 @@ import { v4 } from "uuid";
|
|
|
13
13
|
//#region src/components/organisms/modal.tsx
|
|
14
14
|
const { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } = dialog_exports;
|
|
15
15
|
const isBrowser = typeof window !== "undefined" && typeof document !== "undefined";
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
let
|
|
16
|
+
const containerStates = /* @__PURE__ */ new Map();
|
|
17
|
+
const getContainerState = (container) => {
|
|
18
|
+
let state = containerStates.get(container);
|
|
19
|
+
if (!state) {
|
|
20
|
+
state = {
|
|
21
|
+
stack: [],
|
|
22
|
+
update: null
|
|
23
|
+
};
|
|
24
|
+
containerStates.set(container, state);
|
|
25
|
+
}
|
|
26
|
+
return state;
|
|
27
|
+
};
|
|
19
28
|
const createModalRoot = (container) => {
|
|
20
29
|
if (!isBrowser) return null;
|
|
21
30
|
const targetContainer = container || document.body;
|
|
@@ -36,7 +45,7 @@ const Modal = ({ open = false, maskClosable = false, closable = false, closeIcon
|
|
|
36
45
|
return /* @__PURE__ */ jsx(Dialog, {
|
|
37
46
|
open,
|
|
38
47
|
onOpenChange: (open) => {
|
|
39
|
-
if (!open
|
|
48
|
+
if (!open) onCancel?.();
|
|
40
49
|
},
|
|
41
50
|
...props,
|
|
42
51
|
children: /* @__PURE__ */ jsxs(DialogContent, {
|
|
@@ -46,10 +55,12 @@ const Modal = ({ open = false, maskClosable = false, closable = false, closeIcon
|
|
|
46
55
|
mask: cn("bg-black/60", classNames?.mask)
|
|
47
56
|
},
|
|
48
57
|
style,
|
|
49
|
-
|
|
58
|
+
closable,
|
|
50
59
|
closeIcon,
|
|
51
60
|
container,
|
|
52
|
-
|
|
61
|
+
onPointerDownOutside: (event) => {
|
|
62
|
+
if (!maskClosable) event.preventDefault();
|
|
63
|
+
},
|
|
53
64
|
children: [
|
|
54
65
|
/* @__PURE__ */ jsxs(DialogHeader, {
|
|
55
66
|
className: cn(classNames?.header, !title && "hidden"),
|
|
@@ -127,15 +138,17 @@ const StaticModal = ({ type, title, content, okText = "OK", cancelText = "Cancel
|
|
|
127
138
|
children: content
|
|
128
139
|
}), createModalRoot(container));
|
|
129
140
|
};
|
|
130
|
-
const ModalStackRenderer = () => {
|
|
141
|
+
const ModalStackRenderer = ({ container }) => {
|
|
131
142
|
const [, forceUpdate] = useState({});
|
|
132
143
|
useEffect(() => {
|
|
133
|
-
|
|
144
|
+
const state = getContainerState(container);
|
|
145
|
+
state.update = () => forceUpdate({});
|
|
134
146
|
return () => {
|
|
135
|
-
|
|
147
|
+
state.update = null;
|
|
136
148
|
};
|
|
137
|
-
}, []);
|
|
138
|
-
|
|
149
|
+
}, [container]);
|
|
150
|
+
const { stack } = getContainerState(container);
|
|
151
|
+
return /* @__PURE__ */ jsx(Fragment$1, { children: stack.map(({ id, ...props }) => /* @__PURE__ */ jsx(StaticModal, {
|
|
139
152
|
id,
|
|
140
153
|
...props
|
|
141
154
|
}, id)) });
|
|
@@ -148,23 +161,38 @@ const renderModal = (props) => {
|
|
|
148
161
|
if (!modalRoots.has(targetContainer)) {
|
|
149
162
|
const root = createRoot(rootElement);
|
|
150
163
|
modalRoots.set(targetContainer, root);
|
|
151
|
-
root.render(/* @__PURE__ */ jsx(ModalStackRenderer, {}));
|
|
164
|
+
root.render(/* @__PURE__ */ jsx(ModalStackRenderer, { container: targetContainer }));
|
|
152
165
|
}
|
|
166
|
+
const state = getContainerState(targetContainer);
|
|
153
167
|
const id = props.id || v4();
|
|
154
|
-
|
|
168
|
+
state.stack.push({
|
|
155
169
|
...props,
|
|
156
170
|
id
|
|
157
171
|
});
|
|
158
|
-
|
|
172
|
+
state.update?.();
|
|
159
173
|
return id;
|
|
160
174
|
};
|
|
161
175
|
Modal.destroy = (id) => {
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
176
|
+
if (!id) {
|
|
177
|
+
containerStates.forEach((state) => {
|
|
178
|
+
state.stack = [];
|
|
179
|
+
state.update?.();
|
|
180
|
+
});
|
|
181
|
+
modalRoots.forEach((root) => root.unmount());
|
|
182
|
+
modalRoots.clear();
|
|
183
|
+
containerStates.clear();
|
|
184
|
+
return;
|
|
167
185
|
}
|
|
186
|
+
containerStates.forEach((state, container) => {
|
|
187
|
+
if (!state.stack.some((modal) => modal.id === id)) return;
|
|
188
|
+
state.stack = state.stack.filter((modal) => modal.id !== id);
|
|
189
|
+
state.update?.();
|
|
190
|
+
if (!state.stack.length) {
|
|
191
|
+
modalRoots.get(container)?.unmount();
|
|
192
|
+
modalRoots.delete(container);
|
|
193
|
+
containerStates.delete(container);
|
|
194
|
+
}
|
|
195
|
+
});
|
|
168
196
|
};
|
|
169
197
|
Modal.destroyAll = () => {
|
|
170
198
|
Modal.destroy();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modal.mjs","names":["dialog","uuid"],"sources":["../../../src/components/organisms/modal.tsx"],"sourcesContent":["'use client';\n\nimport React, { useEffect, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { Root, createRoot } from 'react-dom/client';\n\nimport {\n Check,\n CircleQuestionMark,\n Info,\n OctagonAlert,\n OctagonX,\n} from 'lucide-react';\nimport { v4 as uuid } from 'uuid';\n\nimport { dialog } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../atoms/button';\n\nconst {\n Dialog,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogTitle,\n} = dialog;\n\ninterface Props {\n open?: boolean;\n maskClosable?: boolean;\n closable?:\n | boolean\n | {\n closeIcon?: React.ReactNode;\n disabled?: boolean;\n };\n closeIcon?: React.ReactNode;\n title?: React.ReactNode;\n content?: React.ReactNode;\n footer?: React.ReactNode;\n className?: string;\n classNames?: {\n mask?: string;\n header?: string;\n body?: string;\n footer?: string;\n };\n style?: React.CSSProperties;\n okText?: string;\n cancelText?: string;\n container?: HTMLElement;\n children?: React.ReactNode;\n onOk?: () => void;\n onCancel?: () => void;\n}\n\ninterface StaticProps extends Props {\n type?: 'info' | 'success' | 'error' | 'warning' | 'confirm';\n id?: string;\n icon?: React.ReactNode;\n container?: HTMLElement;\n}\n\nconst isBrowser =\n typeof window !== 'undefined' && typeof document !== 'undefined';\n\nlet modalRoot: Root | null = null;\nlet modalStack: StaticProps[] = [];\nlet updateStack: (() => void) | null = null;\n\nconst createModalRoot = (container?: HTMLElement) => {\n if (!isBrowser) {\n return null;\n }\n\n const targetContainer = container || document.body;\n let rootEl = targetContainer.querySelector(\n '#modal-root',\n ) as HTMLElement | null;\n\n if (!rootEl) {\n rootEl = document.createElement('div');\n rootEl.setAttribute('id', 'modal-root');\n rootEl.setAttribute('role', 'dialog');\n rootEl.setAttribute('aria-modal', 'true');\n rootEl.style.zIndex = '10000';\n rootEl.style.position = 'absolute';\n targetContainer.appendChild(rootEl);\n }\n\n return rootEl;\n};\n\nconst Modal = ({\n open = false,\n maskClosable = false,\n closable = false,\n closeIcon,\n className,\n classNames,\n style,\n title,\n footer,\n container,\n children,\n okText = 'OK',\n cancelText = 'Cancel',\n onOk,\n onCancel,\n ...props\n}: Props) => {\n if (typeof window === 'undefined') {\n return null;\n }\n\n return (\n <Dialog\n open={open}\n onOpenChange={(open: boolean) => {\n if (!open && maskClosable) {\n onCancel?.();\n }\n }}\n {...props}\n >\n <DialogContent\n className={cn(\n 'rounded-lg p-4 max-sm:max-w-[80%]',\n 'border-none outline-none',\n className,\n )}\n classNames={{\n ...classNames,\n mask: cn('bg-black/60', classNames?.mask),\n }}\n style={style}\n showCloseButton={!!closable}\n closeIcon={closeIcon}\n container={container}\n onCancel={onCancel}\n >\n {/**\n * @todo [Dialog & AlertDialog] fix: can't get id correctly in shadow dom\n * @see https://github.com/radix-ui/primitives/pull/3384\n **/}\n <DialogHeader\n className={cn(\n classNames?.header,\n !title && 'hidden',\n //\n )}\n >\n <DialogTitle>{title}</DialogTitle>\n <DialogDescription className=\"hidden\" />\n </DialogHeader>\n <div className={cn('break-all', classNames?.body)}>{children}</div>\n {footer !== null && (\n <DialogFooter\n className={cn('flex-row justify-end gap-x-2', classNames?.footer)}\n >\n {footer || (\n <>\n <Button onClick={onOk}>{okText}</Button>\n <Button variant=\"outlined\" onClick={onCancel}>\n {cancelText}\n </Button>\n </>\n )}\n </DialogFooter>\n )}\n </DialogContent>\n </Dialog>\n );\n};\n\nconst STATIC_ICONS = {\n info: <Info className=\"text-blue-400\" />,\n success: <Check className=\"text-green-400\" />,\n error: <OctagonX className=\"text-red-400\" />,\n warning: <OctagonAlert className=\"text-yellow-400\" />,\n confirm: <CircleQuestionMark />,\n};\n\nconst StaticModal = ({\n type,\n title,\n content,\n okText = 'OK',\n cancelText = 'Cancel',\n id,\n container,\n icon,\n onOk,\n onCancel,\n ...props\n}: StaticProps) => {\n const [open, setOpen] = useState(true);\n\n const closeModal = (callback?: () => void) => {\n callback?.();\n setOpen(false);\n setTimeout(() => {\n Modal.destroy(id);\n }, 200);\n };\n\n const footer =\n type === 'confirm' ? (\n <div className=\"grid w-full grid-cols-5 gap-x-2\">\n <Button\n variant=\"outlined\"\n className=\"col-span-2\"\n onClick={() => closeModal(onCancel)}\n >\n {cancelText}\n </Button>\n <Button className=\"col-span-3\" onClick={() => closeModal(onOk)}>\n {okText}\n </Button>\n </div>\n ) : (\n <Button\n className={cn(\n 'grow',\n //\n )}\n onClick={() => closeModal(onOk)}\n >\n {okText}\n </Button>\n );\n\n if (!isBrowser) {\n return null;\n }\n\n return createPortal(\n <Modal\n open={open}\n footer={footer}\n className={cn(\n 'z-10000',\n 'box-content w-100',\n 'rounded-3xl p-4',\n 'gap-y-0',\n )}\n classNames={{\n mask: 'z-10000 bg-black/[.6]',\n body: cn(\n 'text-black-70 whitespace-pre-wrap text-center',\n content && 'mt-3',\n ),\n footer: 'mt-9',\n }}\n title={\n <p\n className={cn(\n 'text-center text-lg leading-normal whitespace-pre-wrap',\n 'flex items-center justify-center gap-x-2',\n //\n )}\n >\n {icon || (type && STATIC_ICONS[type])}\n {title}\n </p>\n }\n container={container}\n onCancel={() => closeModal(onOk)}\n {...props}\n >\n {content}\n </Modal>,\n createModalRoot(container)!,\n );\n};\n\nconst ModalStackRenderer = () => {\n const [, forceUpdate] = useState({});\n\n useEffect(() => {\n updateStack = () => forceUpdate({});\n return () => {\n updateStack = null;\n };\n }, []);\n\n return (\n <>\n {modalStack.map(({ id, ...props }) => (\n <StaticModal key={id} id={id} {...props} />\n ))}\n </>\n );\n};\n\nconst modalRoots = new Map<HTMLElement, Root>();\n\nconst renderModal = (props: StaticProps) => {\n if (!isBrowser) {\n return;\n }\n\n const targetContainer = props.container || document.body;\n const rootElement = createModalRoot(targetContainer)!;\n\n if (!modalRoots.has(targetContainer)) {\n const root = createRoot(rootElement);\n modalRoots.set(targetContainer, root);\n root.render(<ModalStackRenderer />);\n }\n\n const id = props.id || uuid();\n modalStack.push({ ...props, id });\n updateStack?.();\n\n return id;\n};\n\nModal.destroy = (id?: string) => {\n modalStack = id ? modalStack.filter(modal => modal.id !== id) : [];\n\n updateStack?.();\n\n if (!modalStack.length && modalRoot) {\n modalRoot.unmount();\n modalRoot = null;\n }\n};\n\nModal.destroyAll = () => {\n Modal.destroy();\n};\n\nModal.info = (props: StaticProps) => renderModal({ type: 'info', ...props });\nModal.success = (props: StaticProps) =>\n renderModal({ type: 'success', ...props });\nModal.error = (props: StaticProps) => renderModal({ type: 'error', ...props });\nModal.warning = (props: StaticProps) =>\n renderModal({ type: 'warning', ...props });\nModal.confirm = (props: StaticProps) =>\n renderModal({ type: 'confirm', ...props });\n\nexport default Modal;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"modal.mjs","names":["dialog","uuid"],"sources":["../../../src/components/organisms/modal.tsx"],"sourcesContent":["'use client';\n\nimport React, { useEffect, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { Root, createRoot } from 'react-dom/client';\n\nimport {\n Check,\n CircleQuestionMark,\n Info,\n OctagonAlert,\n OctagonX,\n} from 'lucide-react';\nimport { v4 as uuid } from 'uuid';\n\nimport { dialog } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../atoms/button';\n\nconst {\n Dialog,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogTitle,\n} = dialog;\n\ninterface Props {\n open?: boolean;\n maskClosable?: boolean;\n closable?:\n | boolean\n | {\n closeIcon?: React.ReactNode;\n disabled?: boolean;\n };\n closeIcon?: React.ReactNode;\n title?: React.ReactNode;\n content?: React.ReactNode;\n footer?: React.ReactNode;\n className?: string;\n classNames?: {\n mask?: string;\n header?: string;\n body?: string;\n footer?: string;\n };\n style?: React.CSSProperties;\n okText?: string;\n cancelText?: string;\n container?: HTMLElement;\n children?: React.ReactNode;\n onOk?: () => void;\n onCancel?: () => void;\n}\n\ninterface StaticProps extends Props {\n type?: 'info' | 'success' | 'error' | 'warning' | 'confirm';\n id?: string;\n icon?: React.ReactNode;\n container?: HTMLElement;\n}\n\nconst isBrowser =\n typeof window !== 'undefined' && typeof document !== 'undefined';\n\ntype ContainerState = {\n stack: StaticProps[];\n update: (() => void) | null;\n};\n\nconst containerStates = new Map<HTMLElement, ContainerState>();\n\nconst getContainerState = (container: HTMLElement): ContainerState => {\n let state = containerStates.get(container);\n\n if (!state) {\n state = { stack: [], update: null };\n containerStates.set(container, state);\n }\n\n return state;\n};\n\nconst createModalRoot = (container?: HTMLElement) => {\n if (!isBrowser) {\n return null;\n }\n\n const targetContainer = container || document.body;\n let rootEl = targetContainer.querySelector(\n '#modal-root',\n ) as HTMLElement | null;\n\n if (!rootEl) {\n rootEl = document.createElement('div');\n rootEl.setAttribute('id', 'modal-root');\n rootEl.setAttribute('role', 'dialog');\n rootEl.setAttribute('aria-modal', 'true');\n rootEl.style.zIndex = '10000';\n rootEl.style.position = 'absolute';\n targetContainer.appendChild(rootEl);\n }\n\n return rootEl;\n};\n\nconst Modal = ({\n open = false,\n maskClosable = false,\n closable = false,\n closeIcon,\n className,\n classNames,\n style,\n title,\n footer,\n container,\n children,\n okText = 'OK',\n cancelText = 'Cancel',\n onOk,\n onCancel,\n ...props\n}: Props) => {\n if (typeof window === 'undefined') {\n return null;\n }\n\n return (\n <Dialog\n open={open}\n onOpenChange={(open: boolean) => {\n if (!open) {\n onCancel?.();\n }\n }}\n {...props}\n >\n <DialogContent\n className={cn(\n 'rounded-lg p-4 max-sm:max-w-[80%]',\n 'border-none outline-none',\n className,\n )}\n classNames={{\n ...classNames,\n mask: cn('bg-black/60', classNames?.mask),\n }}\n style={style}\n closable={closable}\n closeIcon={closeIcon}\n container={container}\n onPointerDownOutside={event => {\n if (!maskClosable) {\n event.preventDefault();\n }\n }}\n >\n {/**\n * @todo [Dialog & AlertDialog] fix: can't get id correctly in shadow dom\n * @see https://github.com/radix-ui/primitives/pull/3384\n **/}\n <DialogHeader\n className={cn(\n classNames?.header,\n !title && 'hidden',\n //\n )}\n >\n <DialogTitle>{title}</DialogTitle>\n <DialogDescription className=\"hidden\" />\n </DialogHeader>\n <div className={cn('break-all', classNames?.body)}>{children}</div>\n {footer !== null && (\n <DialogFooter\n className={cn('flex-row justify-end gap-x-2', classNames?.footer)}\n >\n {footer || (\n <>\n <Button onClick={onOk}>{okText}</Button>\n <Button variant=\"outlined\" onClick={onCancel}>\n {cancelText}\n </Button>\n </>\n )}\n </DialogFooter>\n )}\n </DialogContent>\n </Dialog>\n );\n};\n\nconst STATIC_ICONS = {\n info: <Info className=\"text-blue-400\" />,\n success: <Check className=\"text-green-400\" />,\n error: <OctagonX className=\"text-red-400\" />,\n warning: <OctagonAlert className=\"text-yellow-400\" />,\n confirm: <CircleQuestionMark />,\n};\n\nconst StaticModal = ({\n type,\n title,\n content,\n okText = 'OK',\n cancelText = 'Cancel',\n id,\n container,\n icon,\n onOk,\n onCancel,\n ...props\n}: StaticProps) => {\n const [open, setOpen] = useState(true);\n\n const closeModal = (callback?: () => void) => {\n callback?.();\n setOpen(false);\n setTimeout(() => {\n Modal.destroy(id);\n }, 200);\n };\n\n const footer =\n type === 'confirm' ? (\n <div className=\"grid w-full grid-cols-5 gap-x-2\">\n <Button\n variant=\"outlined\"\n className=\"col-span-2\"\n onClick={() => closeModal(onCancel)}\n >\n {cancelText}\n </Button>\n <Button className=\"col-span-3\" onClick={() => closeModal(onOk)}>\n {okText}\n </Button>\n </div>\n ) : (\n <Button\n className={cn(\n 'grow',\n //\n )}\n onClick={() => closeModal(onOk)}\n >\n {okText}\n </Button>\n );\n\n if (!isBrowser) {\n return null;\n }\n\n return createPortal(\n <Modal\n open={open}\n footer={footer}\n className={cn(\n 'z-10000',\n 'box-content w-100',\n 'rounded-3xl p-4',\n 'gap-y-0',\n )}\n classNames={{\n mask: 'z-10000 bg-black/[.6]',\n body: cn(\n 'text-black-70 whitespace-pre-wrap text-center',\n content && 'mt-3',\n ),\n footer: 'mt-9',\n }}\n title={\n <p\n className={cn(\n 'text-center text-lg leading-normal whitespace-pre-wrap',\n 'flex items-center justify-center gap-x-2',\n //\n )}\n >\n {icon || (type && STATIC_ICONS[type])}\n {title}\n </p>\n }\n container={container}\n onCancel={() => closeModal(onOk)}\n {...props}\n >\n {content}\n </Modal>,\n createModalRoot(container)!,\n );\n};\n\nconst ModalStackRenderer = ({ container }: { container: HTMLElement }) => {\n const [, forceUpdate] = useState({});\n\n useEffect(() => {\n const state = getContainerState(container);\n state.update = () => forceUpdate({});\n return () => {\n state.update = null;\n };\n }, [container]);\n\n const { stack } = getContainerState(container);\n\n return (\n <>\n {stack.map(({ id, ...props }) => (\n <StaticModal key={id} id={id} {...props} />\n ))}\n </>\n );\n};\n\nconst modalRoots = new Map<HTMLElement, Root>();\n\nconst renderModal = (props: StaticProps) => {\n if (!isBrowser) {\n return;\n }\n\n const targetContainer = props.container || document.body;\n const rootElement = createModalRoot(targetContainer)!;\n\n if (!modalRoots.has(targetContainer)) {\n const root = createRoot(rootElement);\n modalRoots.set(targetContainer, root);\n root.render(<ModalStackRenderer container={targetContainer} />);\n }\n\n const state = getContainerState(targetContainer);\n const id = props.id || uuid();\n state.stack.push({ ...props, id });\n state.update?.();\n\n return id;\n};\n\nModal.destroy = (id?: string) => {\n if (!id) {\n containerStates.forEach(state => {\n state.stack = [];\n state.update?.();\n });\n modalRoots.forEach(root => root.unmount());\n modalRoots.clear();\n containerStates.clear();\n return;\n }\n\n containerStates.forEach((state, container) => {\n if (!state.stack.some(modal => modal.id === id)) {\n return;\n }\n\n state.stack = state.stack.filter(modal => modal.id !== id);\n state.update?.();\n\n if (!state.stack.length) {\n modalRoots.get(container)?.unmount();\n modalRoots.delete(container);\n containerStates.delete(container);\n }\n });\n};\n\nModal.destroyAll = () => {\n Modal.destroy();\n};\n\nModal.info = (props: StaticProps) => renderModal({ type: 'info', ...props });\nModal.success = (props: StaticProps) =>\n renderModal({ type: 'success', ...props });\nModal.error = (props: StaticProps) => renderModal({ type: 'error', ...props });\nModal.warning = (props: StaticProps) =>\n renderModal({ type: 'warning', ...props });\nModal.confirm = (props: StaticProps) =>\n renderModal({ type: 'confirm', ...props });\n\nexport default Modal;\n"],"mappings":"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"}
|
package/dist/core/badge.d.mts
CHANGED
|
@@ -8,7 +8,7 @@ declare namespace badge_d_exports {
|
|
|
8
8
|
export { Badge, Props, badgeVariants };
|
|
9
9
|
}
|
|
10
10
|
declare const badgeVariants: (props?: ({
|
|
11
|
-
variant?: "default" | "
|
|
11
|
+
variant?: "default" | "secondary" | "destructive" | "outline" | null | undefined;
|
|
12
12
|
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
13
13
|
type Props = React$1.ComponentProps<'span'> & VariantProps<typeof badgeVariants> & {
|
|
14
14
|
asChild?: boolean;
|
package/dist/core/button.d.mts
CHANGED
|
@@ -8,8 +8,8 @@ declare namespace button_d_exports {
|
|
|
8
8
|
export { Button, Props, buttonVariants };
|
|
9
9
|
}
|
|
10
10
|
declare const buttonVariants: (props?: ({
|
|
11
|
-
variant?: "link" | "default" | "
|
|
12
|
-
size?: "
|
|
11
|
+
variant?: "link" | "default" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
|
|
12
|
+
size?: "default" | "icon" | "xs" | "sm" | "lg" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
|
|
13
13
|
} & class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
14
14
|
type Props = React$1.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
|
|
15
15
|
asChild?: boolean;
|
package/dist/core/dialog.d.mts
CHANGED
|
@@ -29,7 +29,6 @@ interface CustomContentProps {
|
|
|
29
29
|
disabled?: boolean;
|
|
30
30
|
};
|
|
31
31
|
container?: HTMLElement;
|
|
32
|
-
onCancel?: () => void;
|
|
33
32
|
}
|
|
34
33
|
declare function DialogContent({
|
|
35
34
|
className,
|
|
@@ -38,11 +37,8 @@ declare function DialogContent({
|
|
|
38
37
|
closeIcon: _closeIcon,
|
|
39
38
|
closable,
|
|
40
39
|
container,
|
|
41
|
-
onCancel,
|
|
42
40
|
...props
|
|
43
|
-
}: React$1.ComponentProps<typeof DialogPrimitive.Content> &
|
|
44
|
-
showCloseButton?: boolean;
|
|
45
|
-
} & CustomContentProps): react_jsx_runtime0.JSX.Element;
|
|
41
|
+
}: React$1.ComponentProps<typeof DialogPrimitive.Content> & CustomContentProps): react_jsx_runtime0.JSX.Element;
|
|
46
42
|
declare function DialogHeader({
|
|
47
43
|
className,
|
|
48
44
|
...props
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.d.mts","names":[],"sources":["../../src/core/dialog.tsx"],"mappings":";;;;;;;;iBAWS,MAAA,CAAA;EAAA,GACJ;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,IAAA,IAAK,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAI3C,aAAA,CAAA;EAAA,GACJ;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,OAAA,IAAQ,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAI9C,YAAA,CAAA;EAAA,GACJ;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,MAAA,IAAO,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAI7C,WAAA,CAAA;EAAA,GACJ;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,KAAA,IAAM,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAI5C,aAAA,CAAA;EACP,SAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,OAAA,IAAQ,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,UAe7C,kBAAA;EACR,UAAA,GAAa,MAAA;EACb,SAAA,GAAY,OAAA,CAAM,SAAA;EAClB,QAAA;IAAuB,QAAA;EAAA;EACvB,SAAA,GAAY,WAAA;
|
|
1
|
+
{"version":3,"file":"dialog.d.mts","names":[],"sources":["../../src/core/dialog.tsx"],"mappings":";;;;;;;;iBAWS,MAAA,CAAA;EAAA,GACJ;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,IAAA,IAAK,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAI3C,aAAA,CAAA;EAAA,GACJ;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,OAAA,IAAQ,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAI9C,YAAA,CAAA;EAAA,GACJ;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,MAAA,IAAO,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAI7C,WAAA,CAAA;EAAA,GACJ;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,KAAA,IAAM,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAI5C,aAAA,CAAA;EACP,SAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,OAAA,IAAQ,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,UAe7C,kBAAA;EACR,UAAA,GAAa,MAAA;EACb,SAAA,GAAY,OAAA,CAAM,SAAA;EAClB,QAAA;IAAuB,QAAA;EAAA;EACvB,SAAA,GAAY,WAAA;AAAA;AAAA,iBAGL,aAAA,CAAA;EACP,SAAA;EACA,QAAA;EACA,UAAA;EACA,SAAA,EAAW,UAAA;EACX,QAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,OAAA,IAAW,kBAAA,GAAkB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAyCnE,YAAA,CAAA;EAAe,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAUjE,YAAA,CAAA;EACP,SAAA;EACA,eAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA;EACP,eAAA;AAAA,IACD,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAoBQ,WAAA,CAAA;EACP,SAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,KAAA,IAAM,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAU5C,iBAAA,CAAA;EACP,SAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA,QAAsB,eAAA,CAAgB,WAAA,IAAY,kBAAA,CAAA,GAAA,CAAA,OAAA"}
|
package/dist/core/dialog.mjs
CHANGED
|
@@ -54,12 +54,11 @@ function DialogOverlay({ className, ...props }) {
|
|
|
54
54
|
...props
|
|
55
55
|
});
|
|
56
56
|
}
|
|
57
|
-
function DialogContent({ className, children, classNames, closeIcon: _closeIcon, closable, container,
|
|
57
|
+
function DialogContent({ className, children, classNames, closeIcon: _closeIcon, closable, container, ...props }) {
|
|
58
58
|
const closeIcon = /* @__PURE__ */ jsxs(DialogPrimitive.Close, {
|
|
59
59
|
"data-slot": "dialog-close",
|
|
60
60
|
className: "ring-offset-background focus:ring-ring\n data-[state=open]:bg-accent data-[state=open]:text-muted-foreground\n absolute top-4 right-4 rounded-xs opacity-70 transition-opacity\n hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden\n disabled:pointer-events-none [&_svg]:pointer-events-none\n [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
61
61
|
disabled: typeof closable === "object" && closable.disabled,
|
|
62
|
-
onClick: onCancel,
|
|
63
62
|
children: [_closeIcon || /* @__PURE__ */ jsx(XIcon, {}), /* @__PURE__ */ jsx("span", {
|
|
64
63
|
className: "sr-only",
|
|
65
64
|
children: "Close"
|
package/dist/core/dialog.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.mjs","names":[],"sources":["../../src/core/dialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { XIcon } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../components/atoms/button';\n\nfunction Dialog({\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Root>) {\n return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />;\n}\n\nfunction DialogTrigger({\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />;\n}\n\nfunction DialogPortal({\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />;\n}\n\nfunction DialogClose({\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Close>) {\n return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />;\n}\n\nfunction DialogOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {\n return (\n <DialogPrimitive.Overlay\n data-slot=\"dialog-overlay\"\n className={cn(\n `data-[state=open]:animate-in data-[state=closed]:animate-out\n data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0\n z-50 bg-black/50`,\n className,\n )}\n {...props}\n />\n );\n}\n\ninterface CustomContentProps {\n classNames?: Record<string, string>;\n closeIcon?: React.ReactNode;\n closable?: boolean | { disabled?: boolean };\n container?: HTMLElement;\n
|
|
1
|
+
{"version":3,"file":"dialog.mjs","names":[],"sources":["../../src/core/dialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { XIcon } from 'lucide-react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Button from '../components/atoms/button';\n\nfunction Dialog({\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Root>) {\n return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />;\n}\n\nfunction DialogTrigger({\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />;\n}\n\nfunction DialogPortal({\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />;\n}\n\nfunction DialogClose({\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Close>) {\n return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />;\n}\n\nfunction DialogOverlay({\n className,\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Overlay>) {\n return (\n <DialogPrimitive.Overlay\n data-slot=\"dialog-overlay\"\n className={cn(\n `data-[state=open]:animate-in data-[state=closed]:animate-out\n data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0\n z-50 bg-black/50`,\n className,\n )}\n {...props}\n />\n );\n}\n\ninterface CustomContentProps {\n classNames?: Record<string, string>;\n closeIcon?: React.ReactNode;\n closable?: boolean | { disabled?: boolean };\n container?: HTMLElement;\n}\n\nfunction DialogContent({\n className,\n children,\n classNames,\n closeIcon: _closeIcon,\n closable,\n container,\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Content> & CustomContentProps) {\n const closeIcon = (\n <DialogPrimitive.Close\n data-slot=\"dialog-close\"\n className=\"ring-offset-background focus:ring-ring\n data-[state=open]:bg-accent data-[state=open]:text-muted-foreground\n absolute top-4 right-4 rounded-xs opacity-70 transition-opacity\n hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden\n disabled:pointer-events-none [&_svg]:pointer-events-none\n [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\"\n disabled={typeof closable === 'object' && closable.disabled}\n >\n {_closeIcon || <XIcon />}\n <span className=\"sr-only\">Close</span>\n </DialogPrimitive.Close>\n );\n\n return (\n <DialogPortal data-slot=\"dialog-portal\" container={container}>\n <DialogOverlay className={cn(classNames?.mask)} />\n <DialogPrimitive.Content\n data-slot=\"dialog-content\"\n className={cn(\n `bg-background data-[state=open]:animate-in\n data-[state=closed]:animate-out data-[state=closed]:fade-out-0\n data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95\n data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid\n w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%]\n gap-4 rounded-lg border p-6 shadow-lg duration-200 outline-none\n sm:max-w-lg`,\n className,\n )}\n {...props}\n >\n {children}\n {closable && closeIcon}\n </DialogPrimitive.Content>\n </DialogPortal>\n );\n}\n\nfunction DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"dialog-header\"\n className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n {...props}\n />\n );\n}\n\nfunction DialogFooter({\n className,\n showCloseButton = false,\n children,\n ...props\n}: React.ComponentProps<'div'> & {\n showCloseButton?: boolean;\n}) {\n return (\n <div\n data-slot=\"dialog-footer\"\n className={cn(\n 'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n className,\n )}\n {...props}\n >\n {children}\n {showCloseButton && (\n <DialogPrimitive.Close asChild>\n <Button variant=\"outlined\">Close</Button>\n </DialogPrimitive.Close>\n )}\n </div>\n );\n}\n\nfunction DialogTitle({\n className,\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Title>) {\n return (\n <DialogPrimitive.Title\n data-slot=\"dialog-title\"\n className={cn('text-lg leading-none font-semibold', className)}\n {...props}\n />\n );\n}\n\nfunction DialogDescription({\n className,\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Description>) {\n return (\n <DialogPrimitive.Description\n data-slot=\"dialog-description\"\n className={cn('text-muted-foreground text-sm', className)}\n {...props}\n />\n );\n}\n\nexport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n DialogTrigger,\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAWA,SAAS,OAAO,EACd,GAAG,SACiD;AACpD,QAAO,oBAAC,gBAAgB;EAAK,aAAU;EAAS,GAAI;GAAS;;AAG/D,SAAS,cAAc,EACrB,GAAG,SACoD;AACvD,QAAO,oBAAC,gBAAgB;EAAQ,aAAU;EAAiB,GAAI;GAAS;;AAG1E,SAAS,aAAa,EACpB,GAAG,SACmD;AACtD,QAAO,oBAAC,gBAAgB;EAAO,aAAU;EAAgB,GAAI;GAAS;;AAGxE,SAAS,YAAY,EACnB,GAAG,SACkD;AACrD,QAAO,oBAAC,gBAAgB;EAAM,aAAU;EAAe,GAAI;GAAS;;AAGtE,SAAS,cAAc,EACrB,WACA,GAAG,SACoD;AACvD,QACE,oBAAC,gBAAgB;EACf,aAAU;EACV,WAAW,GACT;;2BAGA,UACD;EACD,GAAI;GACJ;;AAWN,SAAS,cAAc,EACrB,WACA,UACA,YACA,WAAW,YACX,UACA,WACA,GAAG,SACyE;CAC5E,MAAM,YACJ,qBAAC,gBAAgB;EACf,aAAU;EACV,WAAU;EAMV,UAAU,OAAO,aAAa,YAAY,SAAS;aAElD,cAAc,oBAAC,UAAQ,EACxB,oBAAC;GAAK,WAAU;aAAU;IAAY;GAChB;AAG1B,QACE,qBAAC;EAAa,aAAU;EAA2B;aACjD,oBAAC,iBAAc,WAAW,GAAG,YAAY,KAAK,GAAI,EAClD,qBAAC,gBAAgB;GACf,aAAU;GACV,WAAW,GACT;;;;;;wBAOA,UACD;GACD,GAAI;cAEH,UACA,YAAY;IACW;GACb;;AAInB,SAAS,aAAa,EAAE,WAAW,GAAG,SAAsC;AAC1E,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GAAG,gDAAgD,UAAU;EACxE,GAAI;GACJ;;AAIN,SAAS,aAAa,EACpB,WACA,kBAAkB,OAClB,UACA,GAAG,SAGF;AACD,QACE,qBAAC;EACC,aAAU;EACV,WAAW,GACT,0DACA,UACD;EACD,GAAI;aAEH,UACA,mBACC,oBAAC,gBAAgB;GAAM;aACrB,oBAAC;IAAO,SAAQ;cAAW;KAAc;IACnB;GAEtB;;AAIV,SAAS,YAAY,EACnB,WACA,GAAG,SACkD;AACrD,QACE,oBAAC,gBAAgB;EACf,aAAU;EACV,WAAW,GAAG,sCAAsC,UAAU;EAC9D,GAAI;GACJ;;AAIN,SAAS,kBAAkB,EACzB,WACA,GAAG,SACwD;AAC3D,QACE,oBAAC,gBAAgB;EACf,aAAU;EACV,WAAW,GAAG,iCAAiC,UAAU;EACzD,GAAI;GACJ"}
|
package/dist/style.css
CHANGED
|
@@ -991,9 +991,6 @@
|
|
|
991
991
|
.bg-transparent {
|
|
992
992
|
background-color: transparent;
|
|
993
993
|
}
|
|
994
|
-
.bg-white {
|
|
995
|
-
background-color: var(--color-white);
|
|
996
|
-
}
|
|
997
994
|
.bg-yellow-500\/10 {
|
|
998
995
|
background-color: color-mix(in srgb, oklch(79.5% 0.184 86.047) 10%, transparent);
|
|
999
996
|
@supports (color: color-mix(in lab, red, red)) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jbpark/ui-kit",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.12.0",
|
|
4
4
|
"description": "Modern React UI component library built with TypeScript, Tailwind CSS, and Radix UI. Featuring atoms, molecules, organisms and layout templates for building beautiful interfaces.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
package/dist/enums.d.mts
DELETED
package/dist/enums.d.mts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"enums.d.mts","names":[],"sources":["../src/lib/enums/index.ts"],"mappings":";cAAa,WAAA,EAAa,MAAA"}
|
package/dist/enums.mjs
DELETED
package/dist/enums.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"enums.mjs","names":[],"sources":["../src/lib/enums/index.ts"],"sourcesContent":["export const TEXT_LEVELS: Record<string, string> = {\n 1: 'text-2xl',\n 2: 'text-xl',\n 3: 'text-lg',\n 4: 'text-base',\n 5: 'text-sm',\n 6: 'text-xs',\n};\n"],"mappings":";AAAA,MAAa,cAAsC;CACjD,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACJ"}
|