solid-tom-ui 1.0.5 → 1.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (69) hide show
  1. package/README.md +246 -237
  2. package/dist/README.md +246 -0
  3. package/dist/components/avatar/avatar.js.map +1 -1
  4. package/dist/components/badge/badge.js.map +1 -1
  5. package/dist/components/breadcrumb/breadcrumb.js.map +1 -1
  6. package/dist/components/button/button.js.map +1 -1
  7. package/dist/components/carousel/carousel.js.map +1 -1
  8. package/dist/components/chat-bubble/chatBubble.js.map +1 -1
  9. package/dist/components/checkbox/checkbox.js.map +1 -1
  10. package/dist/components/collapse/collapse.js.map +1 -1
  11. package/dist/components/context-menu/context-menu.js.map +1 -1
  12. package/dist/components/context-menu/context-menu.store.js.map +1 -1
  13. package/dist/components/divider/divider.js.map +1 -1
  14. package/dist/components/dropdown/dropdown.js.map +1 -1
  15. package/dist/components/dropdown/dropdown.store.js.map +1 -1
  16. package/dist/components/float-button/float-button.js.map +1 -1
  17. package/dist/components/hover-3d-image/hover-3d-image.js.map +1 -1
  18. package/dist/components/image-preview/image-preview.js.map +1 -1
  19. package/dist/components/input/input.js.map +1 -1
  20. package/dist/components/input/input.utils.js.map +1 -1
  21. package/dist/components/input/variants/input-color.js.map +1 -1
  22. package/dist/components/input/variants/input-date.js.map +1 -1
  23. package/dist/components/input/variants/input-number.js.map +1 -1
  24. package/dist/components/input/variants/input-otp.js.map +1 -1
  25. package/dist/components/input/variants/input-password.js.map +1 -1
  26. package/dist/components/input/variants/input-radio.js.map +1 -1
  27. package/dist/components/input/variants/input-range.js.map +1 -1
  28. package/dist/components/input/variants/input-text.js.map +1 -1
  29. package/dist/components/input/variants/input-textarea.js.map +1 -1
  30. package/dist/components/loading/loading.js.map +1 -1
  31. package/dist/components/mansory/mansory.js.map +1 -1
  32. package/dist/components/menu/menu.js.map +1 -1
  33. package/dist/components/modal/modal.js.map +1 -1
  34. package/dist/components/modal/modalContext.js.map +1 -1
  35. package/dist/components/pagination/pagination.js.map +1 -1
  36. package/dist/components/progress-bar/progress-bar.js.map +1 -1
  37. package/dist/components/qr-code/qr-code.js.map +1 -1
  38. package/dist/components/select/select.js.map +1 -1
  39. package/dist/components/select-zone/select-zone.js.map +1 -1
  40. package/dist/components/skeleton/skeleton.js.map +1 -1
  41. package/dist/components/slider/slider.js.map +1 -1
  42. package/dist/components/splitter/splitter.js.map +1 -1
  43. package/dist/components/steps/steps.js.map +1 -1
  44. package/dist/components/swap/swap.js.map +1 -1
  45. package/dist/components/switch/switch.js.map +1 -1
  46. package/dist/components/tab/tab.js.map +1 -1
  47. package/dist/components/table/table.js.map +1 -1
  48. package/dist/components/timeline/timeline.js.map +1 -1
  49. package/dist/components/toast/icons/ErrorIcon.js.map +1 -1
  50. package/dist/components/toast/icons/IconCircle.js.map +1 -1
  51. package/dist/components/toast/icons/InfoIcon.js.map +1 -1
  52. package/dist/components/toast/icons/LoaderIcon.js.map +1 -1
  53. package/dist/components/toast/icons/SuccessIcon.js.map +1 -1
  54. package/dist/components/toast/icons/WarningIcon.js.map +1 -1
  55. package/dist/components/toast/toast.js.map +1 -1
  56. package/dist/components/toast/toast.store.js.map +1 -1
  57. package/dist/components/tooltip/tooltip.js.map +1 -1
  58. package/dist/components/tour/tour.js.map +1 -1
  59. package/dist/components/upload/upload.js.map +1 -1
  60. package/dist/components/z-index/z-index.context.js.map +1 -1
  61. package/dist/components/z-index/z-index.js.map +1 -1
  62. package/dist/components/z-index/z-index.store.js.map +1 -1
  63. package/dist/components/z-index/z-index.types.js.map +1 -1
  64. package/dist/package.json +39 -0
  65. package/dist/utils/cn.js.map +1 -1
  66. package/dist/utils/element-tracker.js.map +1 -1
  67. package/dist/utils/helper.js.map +1 -1
  68. package/dist/utils/hoc.js.map +1 -1
  69. package/package.json +38 -32
@@ -1 +1 @@
1
- {"version":3,"file":"element-tracker.js","names":[],"sources":["../../src/utils/element-tracker.ts"],"sourcesContent":["/**\n * element-tracker.ts\n *\n * Singleton global tracker để theo dõi vị trí và kích thước của một element.\n * Dùng chung cho các component như NewDropdown (blockScroll=false), Tooltip, Popover...\n *\n * Cơ chế:\n * - ResizeObserver: phát hiện element thay đổi kích thước.\n * - scroll event (capture, passive): phát hiện scroll ở bất kỳ container nào.\n * Chỉ đăng ký 1 listener duy nhất trên window; tự tháo khi không còn element nào.\n * - IntersectionObserver: phát hiện trigger đi vào/ra viewport để cập nhật rect.\n *\n * Mỗi element chỉ được track bởi 1 callback tại một thời điểm.\n * Gọi `untrackElement(el)` để dừng theo dõi và giải phóng bộ nhớ.\n */\n\nexport type TrackedRect = {\n top: number;\n left: number;\n width: number;\n height: number;\n};\n\ntype TrackCallback = (rect: TrackedRect) => void;\n\n// ── Singleton state ──────────────────────────────────────────────────────────\n\nconst callbacks = new Map<Element, TrackCallback>();\n\n// ResizeObserver: fires khi target thay đổi kích thước\nconst resizeObserver = new ResizeObserver(entries => {\n for (const entry of entries) {\n const cb = callbacks.get(entry.target);\n if (cb) cb(getRect(entry.target));\n }\n});\n\n// IntersectionObserver: bắt khi trigger đi vào/ra viewport (bị scroll ra khỏi tầm nhìn)\nconst intersectionObserver = new IntersectionObserver(\n entries => {\n for (const entry of entries) {\n const cb = callbacks.get(entry.target);\n if (cb) cb(getRect(entry.target));\n }\n },\n { threshold: [0, 1] },\n);\n\n// scroll listener dùng chung — capture phase để bắt scroll ở mọi container\n// rAF dedup: gộp tất cả scroll events trong cùng 1 frame thành 1 lần getBoundingClientRect\nlet rafId = 0;\n\nconst onScroll = () => {\n if (rafId) return; // frame đã pending → bỏ qua, tránh gọi getBoundingClientRect nhiều lần/frame\n rafId = requestAnimationFrame(() => {\n rafId = 0;\n callbacks.forEach((cb, el) => cb(getRect(el)));\n });\n};\nlet scrollListenerAttached = false;\n\nfunction attachScrollListener() {\n if (!scrollListenerAttached) {\n window.addEventListener('scroll', onScroll, { passive: true, capture: true });\n scrollListenerAttached = true;\n }\n}\n\nfunction detachScrollListener() {\n if (scrollListenerAttached && callbacks.size === 0) {\n window.removeEventListener('scroll', onScroll, { capture: true });\n scrollListenerAttached = false;\n if (rafId) {\n cancelAnimationFrame(rafId);\n rafId = 0;\n }\n }\n}\n\nfunction getRect(el: Element): TrackedRect {\n const r = el.getBoundingClientRect();\n return { top: r.top, left: r.left, width: r.width, height: r.height };\n}\n\n// ── Public API ───────────────────────────────────────────────────────────────\n\n/**\n * Bắt đầu theo dõi vị trí của `el`.\n * `callback` sẽ được gọi ngay lập tức với rect hiện tại,\n * và mỗi khi el thay đổi kích thước hoặc scroll.\n */\nexport function trackElement(el: Element, callback: TrackCallback): void {\n callbacks.set(el, callback);\n resizeObserver.observe(el);\n intersectionObserver.observe(el);\n attachScrollListener();\n // Gọi ngay để caller có rect ban đầu\n callback(getRect(el));\n}\n\n/**\n * Dừng theo dõi `el` và giải phóng bộ nhớ.\n */\nexport function untrackElement(el: Element): void {\n callbacks.delete(el);\n resizeObserver.unobserve(el);\n intersectionObserver.unobserve(el);\n detachScrollListener();\n}\n"],"mappings":"AA2BA,IAAM,EAAY,IAAI,IAGhB,EAAiB,IAAI,eAAe,GAAW,CACnD,IAAK,IAAM,KAAS,EAAS,CAC3B,IAAM,EAAK,EAAU,IAAI,EAAM,OAAO,CAClC,GAAI,EAAG,EAAQ,EAAM,OAAO,CAAC,GAEnC,CAGI,EAAuB,IAAI,qBAC/B,GAAW,CACT,IAAK,IAAM,KAAS,EAAS,CAC3B,IAAM,EAAK,EAAU,IAAI,EAAM,OAAO,CAClC,GAAI,EAAG,EAAQ,EAAM,OAAO,CAAC,GAGrC,CAAE,UAAW,CAAC,EAAG,EAAE,CAAE,CACtB,CAIG,EAAQ,EAEN,MAAiB,CACjB,AACJ,IAAQ,0BAA4B,CAClC,EAAQ,EACR,EAAU,SAAS,EAAI,IAAO,EAAG,EAAQ,EAAG,CAAC,CAAC,EAC9C,EAEA,EAAyB,GAE7B,SAAS,GAAuB,CAC9B,AAEE,KADA,OAAO,iBAAiB,SAAU,EAAU,CAAE,QAAS,GAAM,QAAS,GAAM,CAAC,CACpD,IAI7B,SAAS,GAAuB,CAC1B,GAA0B,EAAU,OAAS,IAC/C,OAAO,oBAAoB,SAAU,EAAU,CAAE,QAAS,GAAM,CAAC,CACjE,EAAyB,GACzB,AAEE,KADA,qBAAqB,EAAM,CACnB,IAKd,SAAS,EAAQ,EAA0B,CACzC,IAAM,EAAI,EAAG,uBAAuB,CACpC,MAAO,CAAE,IAAK,EAAE,IAAK,KAAM,EAAE,KAAM,MAAO,EAAE,MAAO,OAAQ,EAAE,OAAQ,CAUvE,SAAgB,EAAa,EAAa,EAA+B,CACvE,EAAU,IAAI,EAAI,EAAS,CAC3B,EAAe,QAAQ,EAAG,CAC1B,EAAqB,QAAQ,EAAG,CAChC,GAAsB,CAEtB,EAAS,EAAQ,EAAG,CAAC,CAMvB,SAAgB,EAAe,EAAmB,CAChD,EAAU,OAAO,EAAG,CACpB,EAAe,UAAU,EAAG,CAC5B,EAAqB,UAAU,EAAG,CAClC,GAAsB"}
1
+ {"version":3,"file":"element-tracker.js","names":[],"sources":["../../src/utils/element-tracker.ts"],"sourcesContent":["/**\r\n * element-tracker.ts\r\n *\r\n * Singleton global tracker để theo dõi vị trí và kích thước của một element.\r\n * Dùng chung cho các component như NewDropdown (blockScroll=false), Tooltip, Popover...\r\n *\r\n * Cơ chế:\r\n * - ResizeObserver: phát hiện element thay đổi kích thước.\r\n * - scroll event (capture, passive): phát hiện scroll ở bất kỳ container nào.\r\n * Chỉ đăng ký 1 listener duy nhất trên window; tự tháo khi không còn element nào.\r\n * - IntersectionObserver: phát hiện trigger đi vào/ra viewport để cập nhật rect.\r\n *\r\n * Mỗi element chỉ được track bởi 1 callback tại một thời điểm.\r\n * Gọi `untrackElement(el)` để dừng theo dõi và giải phóng bộ nhớ.\r\n */\r\n\r\nexport type TrackedRect = {\r\n top: number;\r\n left: number;\r\n width: number;\r\n height: number;\r\n};\r\n\r\ntype TrackCallback = (rect: TrackedRect) => void;\r\n\r\n// ── Singleton state ──────────────────────────────────────────────────────────\r\n\r\nconst callbacks = new Map<Element, TrackCallback>();\r\n\r\n// ResizeObserver: fires khi target thay đổi kích thước\r\nconst resizeObserver = new ResizeObserver(entries => {\r\n for (const entry of entries) {\r\n const cb = callbacks.get(entry.target);\r\n if (cb) cb(getRect(entry.target));\r\n }\r\n});\r\n\r\n// IntersectionObserver: bắt khi trigger đi vào/ra viewport (bị scroll ra khỏi tầm nhìn)\r\nconst intersectionObserver = new IntersectionObserver(\r\n entries => {\r\n for (const entry of entries) {\r\n const cb = callbacks.get(entry.target);\r\n if (cb) cb(getRect(entry.target));\r\n }\r\n },\r\n { threshold: [0, 1] },\r\n);\r\n\r\n// scroll listener dùng chung — capture phase để bắt scroll ở mọi container\r\n// rAF dedup: gộp tất cả scroll events trong cùng 1 frame thành 1 lần getBoundingClientRect\r\nlet rafId = 0;\r\n\r\nconst onScroll = () => {\r\n if (rafId) return; // frame đã pending → bỏ qua, tránh gọi getBoundingClientRect nhiều lần/frame\r\n rafId = requestAnimationFrame(() => {\r\n rafId = 0;\r\n callbacks.forEach((cb, el) => cb(getRect(el)));\r\n });\r\n};\r\nlet scrollListenerAttached = false;\r\n\r\nfunction attachScrollListener() {\r\n if (!scrollListenerAttached) {\r\n window.addEventListener('scroll', onScroll, { passive: true, capture: true });\r\n scrollListenerAttached = true;\r\n }\r\n}\r\n\r\nfunction detachScrollListener() {\r\n if (scrollListenerAttached && callbacks.size === 0) {\r\n window.removeEventListener('scroll', onScroll, { capture: true });\r\n scrollListenerAttached = false;\r\n if (rafId) {\r\n cancelAnimationFrame(rafId);\r\n rafId = 0;\r\n }\r\n }\r\n}\r\n\r\nfunction getRect(el: Element): TrackedRect {\r\n const r = el.getBoundingClientRect();\r\n return { top: r.top, left: r.left, width: r.width, height: r.height };\r\n}\r\n\r\n// ── Public API ───────────────────────────────────────────────────────────────\r\n\r\n/**\r\n * Bắt đầu theo dõi vị trí của `el`.\r\n * `callback` sẽ được gọi ngay lập tức với rect hiện tại,\r\n * và mỗi khi el thay đổi kích thước hoặc scroll.\r\n */\r\nexport function trackElement(el: Element, callback: TrackCallback): void {\r\n callbacks.set(el, callback);\r\n resizeObserver.observe(el);\r\n intersectionObserver.observe(el);\r\n attachScrollListener();\r\n // Gọi ngay để caller có rect ban đầu\r\n callback(getRect(el));\r\n}\r\n\r\n/**\r\n * Dừng theo dõi `el` và giải phóng bộ nhớ.\r\n */\r\nexport function untrackElement(el: Element): void {\r\n callbacks.delete(el);\r\n resizeObserver.unobserve(el);\r\n intersectionObserver.unobserve(el);\r\n detachScrollListener();\r\n}\r\n"],"mappings":"AA2BA,IAAM,EAAY,IAAI,IAGhB,EAAiB,IAAI,eAAe,GAAW,CACnD,IAAK,IAAM,KAAS,EAAS,CAC3B,IAAM,EAAK,EAAU,IAAI,EAAM,OAAO,CAClC,GAAI,EAAG,EAAQ,EAAM,OAAO,CAAC,GAEnC,CAGI,EAAuB,IAAI,qBAC/B,GAAW,CACT,IAAK,IAAM,KAAS,EAAS,CAC3B,IAAM,EAAK,EAAU,IAAI,EAAM,OAAO,CAClC,GAAI,EAAG,EAAQ,EAAM,OAAO,CAAC,GAGrC,CAAE,UAAW,CAAC,EAAG,EAAE,CAAE,CACtB,CAIG,EAAQ,EAEN,MAAiB,CACjB,AACJ,IAAQ,0BAA4B,CAClC,EAAQ,EACR,EAAU,SAAS,EAAI,IAAO,EAAG,EAAQ,EAAG,CAAC,CAAC,EAC9C,EAEA,EAAyB,GAE7B,SAAS,GAAuB,CAC9B,AAEE,KADA,OAAO,iBAAiB,SAAU,EAAU,CAAE,QAAS,GAAM,QAAS,GAAM,CAAC,CACpD,IAI7B,SAAS,GAAuB,CAC1B,GAA0B,EAAU,OAAS,IAC/C,OAAO,oBAAoB,SAAU,EAAU,CAAE,QAAS,GAAM,CAAC,CACjE,EAAyB,GACzB,AAEE,KADA,qBAAqB,EAAM,CACnB,IAKd,SAAS,EAAQ,EAA0B,CACzC,IAAM,EAAI,EAAG,uBAAuB,CACpC,MAAO,CAAE,IAAK,EAAE,IAAK,KAAM,EAAE,KAAM,MAAO,EAAE,MAAO,OAAQ,EAAE,OAAQ,CAUvE,SAAgB,EAAa,EAAa,EAA+B,CACvE,EAAU,IAAI,EAAI,EAAS,CAC3B,EAAe,QAAQ,EAAG,CAC1B,EAAqB,QAAQ,EAAG,CAChC,GAAsB,CAEtB,EAAS,EAAQ,EAAG,CAAC,CAMvB,SAAgB,EAAe,EAAmB,CAChD,EAAU,OAAO,EAAG,CACpB,EAAe,UAAU,EAAG,CAC5B,EAAqB,UAAU,EAAG,CAClC,GAAsB"}
@@ -1 +1 @@
1
- {"version":3,"file":"helper.js","names":[],"sources":["../../src/utils/helper.ts"],"sourcesContent":["import { BaseColorProps } from '@/type';\nimport { JSX } from 'solid-js';\n\ntype TimingFunction =\n | 'ease'\n | 'ease-in'\n | 'ease-out'\n | 'ease-in-out'\n | 'linear'\n | 'step-start'\n | 'step-end'\n | `steps(${number}, ${'start' | 'end'})`\n | `cubic-bezier(${number}, ${number}, ${number}, ${number})`;\n\ntype AnimationDirection = 'normal' | 'reverse' | 'alternate' | 'alternate-reverse';\ntype FillMode = 'none' | 'forwards' | 'backwards' | 'both';\ntype PlayState = 'running' | 'paused';\ntype TimeUnit = `${number}s` | `${number}ms`;\ntype IterationCount = number | 'infinite';\n\nexport interface AnimationConfig {\n name: string;\n duration?: TimeUnit;\n timingFunction?: TimingFunction;\n delay?: TimeUnit;\n iterationCount?: IterationCount;\n direction?: AnimationDirection;\n fillMode?: FillMode;\n playState?: PlayState;\n}\nconst DEFAULT_VALUES = {\n duration: '1s',\n timingFunction: 'ease',\n delay: '0s',\n iterationCount: 1,\n direction: 'normal',\n fillMode: 'none',\n playState: 'running',\n} as const;\nexport function renderCSSAnimation(config: AnimationConfig): string {\n const {\n name,\n duration = DEFAULT_VALUES.duration,\n timingFunction = DEFAULT_VALUES.timingFunction,\n delay = DEFAULT_VALUES.delay,\n iterationCount = DEFAULT_VALUES.iterationCount,\n direction = DEFAULT_VALUES.direction,\n fillMode = DEFAULT_VALUES.fillMode,\n playState = DEFAULT_VALUES.playState,\n } = config;\n\n return `${name} ${duration} ${timingFunction} ${delay} ${iterationCount} ${direction} ${fillMode} ${playState}`;\n}\nexport function createThrottle<T extends (...args: any[]) => void>(\n fn: T,\n delay: number,\n): T & { cancel: () => void } {\n let lastCall = 0;\n let timer: ReturnType<typeof setTimeout> | null = null;\n const throttled = (...args: Parameters<T>) => {\n const now = Date.now();\n const remaining = delay - (now - lastCall);\n if (timer) {\n clearTimeout(timer);\n timer = null;\n }\n if (remaining <= 0) {\n lastCall = now;\n fn(...args);\n } else {\n timer = setTimeout(() => {\n lastCall = Date.now();\n timer = null;\n fn(...args);\n }, remaining);\n }\n };\n throttled.cancel = () => {\n if (timer) {\n clearTimeout(timer);\n timer = null;\n }\n };\n return throttled as T & { cancel: () => void };\n}\nconst generateRandomHexColor = (): string => {\n const randomColor = Math.floor(Math.random() * 16777215).toString(16);\n return `#${randomColor.padStart(6, '0')}`;\n};\n\nexport function normalizeHexColor(value: string | undefined): string {\n if (!value) return generateRandomHexColor();\n let hex = value.trim().replace(/^#/, '');\n if (hex.length === 3) {\n hex = hex\n .split('')\n .map(char => char + char)\n .join('');\n }\n\n return `#${hex.toLowerCase()}`;\n}\nexport function getColor(color?: BaseColorProps | string, defaultColor?: string) {\n switch (color) {\n case 'primary':\n return 'color-primary';\n case 'neutral':\n return 'color-neutral';\n case 'secondary':\n return 'color-secondary';\n case 'accent':\n return 'color-accent';\n case 'info':\n return 'color-info';\n case 'success':\n return 'color-success';\n case 'warning':\n return 'color-warning';\n case 'error':\n return 'color-error';\n default:\n return defaultColor ?? '';\n }\n}\n\nconst lastValuesByKey = new Map<string, any>();\n\nexport function getRandomElement<T>(arr: T[], uniqueId: string): T {\n if (arr.length === 1) return arr[0];\n const lastValue = lastValuesByKey.get(uniqueId);\n let newValue: T;\n do {\n newValue = arr[Math.floor(Math.random() * arr.length)];\n } while (newValue === lastValue && arr.length > 1);\n\n lastValuesByKey.set(uniqueId, newValue);\n return newValue;\n}\nexport const genSVGCubicBezier: (\n keySplines: string,\n) => Pick<\n JSX.AnimateSVGAttributes<SVGAnimateElement>,\n 'calcMode' | 'keyTimes' | 'keySplines'\n> = keySplines => ({\n calcMode: 'spline',\n keyTimes: '0; 1',\n keySplines: keySplines,\n});\n\nexport type Image = Omit<JSX.ImgHTMLAttributes<HTMLImageElement>, 'src'> & { src: string };\n\nexport function toMarkdownCode(code: string, lang = 'tsx'): string {\n return `\\`\\`\\`${lang}\\n${code}\\n\\`\\`\\``;\n}\n"],"mappings":"AA8BA,IAAM,EAAiB,CACrB,SAAU,KACV,eAAgB,OAChB,MAAO,KACP,eAAgB,EAChB,UAAW,SACX,SAAU,OACV,UAAW,UACZ,CACD,SAAgB,EAAmB,EAAiC,CAClE,GAAM,CACJ,OACA,WAAW,EAAe,SAC1B,iBAAiB,EAAe,eAChC,QAAQ,EAAe,MACvB,iBAAiB,EAAe,eAChC,YAAY,EAAe,UAC3B,WAAW,EAAe,SAC1B,YAAY,EAAe,WACzB,EAEJ,MAAO,GAAG,EAAK,GAAG,EAAS,GAAG,EAAe,GAAG,EAAM,GAAG,EAAe,GAAG,EAAU,GAAG,EAAS,GAAG,IAEtG,SAAgB,EACd,EACA,EAC4B,CAC5B,IAAI,EAAW,EACX,EAA8C,KAC5C,GAAa,GAAG,IAAwB,CAC5C,IAAM,EAAM,KAAK,KAAK,CAChB,EAAY,GAAS,EAAM,GACjC,AAEE,KADA,aAAa,EAAM,CACX,MAEN,GAAa,GACf,EAAW,EACX,EAAG,GAAG,EAAK,EAEX,EAAQ,eAAiB,CACvB,EAAW,KAAK,KAAK,CACrB,EAAQ,KACR,EAAG,GAAG,EAAK,EACV,EAAU,EASjB,MANA,GAAU,WAAe,CACvB,AAEE,KADA,aAAa,EAAM,CACX,OAGL,EAET,IAAM,MAEG,IADa,KAAK,MAAM,KAAK,QAAQ,CAAG,SAAS,CAAC,SAAS,GAAG,CAC9C,SAAS,EAAG,IAAI,GAGzC,SAAgB,EAAkB,EAAmC,CACnE,GAAI,CAAC,EAAO,OAAO,GAAwB,CAC3C,IAAI,EAAM,EAAM,MAAM,CAAC,QAAQ,KAAM,GAAG,CAQxC,OAPI,EAAI,SAAW,IACjB,EAAM,EACH,MAAM,GAAG,CACT,IAAI,GAAQ,EAAO,EAAK,CACxB,KAAK,GAAG,EAGN,IAAI,EAAI,aAAa,GAE9B,SAAgB,EAAS,EAAiC,EAAuB,CAC/E,OAAQ,EAAR,CACE,IAAK,UACH,MAAO,gBACT,IAAK,UACH,MAAO,gBACT,IAAK,YACH,MAAO,kBACT,IAAK,SACH,MAAO,eACT,IAAK,OACH,MAAO,aACT,IAAK,UACH,MAAO,gBACT,IAAK,UACH,MAAO,gBACT,IAAK,QACH,MAAO,cACT,QACE,OAAO,GAAgB,IAiB7B,IAAa,EAKT,IAAe,CACjB,SAAU,SACV,SAAU,OACE,aACb"}
1
+ {"version":3,"file":"helper.js","names":[],"sources":["../../src/utils/helper.ts"],"sourcesContent":["import { BaseColorProps } from '@/type';\r\nimport { JSX } from 'solid-js';\r\n\r\ntype TimingFunction =\r\n | 'ease'\r\n | 'ease-in'\r\n | 'ease-out'\r\n | 'ease-in-out'\r\n | 'linear'\r\n | 'step-start'\r\n | 'step-end'\r\n | `steps(${number}, ${'start' | 'end'})`\r\n | `cubic-bezier(${number}, ${number}, ${number}, ${number})`;\r\n\r\ntype AnimationDirection = 'normal' | 'reverse' | 'alternate' | 'alternate-reverse';\r\ntype FillMode = 'none' | 'forwards' | 'backwards' | 'both';\r\ntype PlayState = 'running' | 'paused';\r\ntype TimeUnit = `${number}s` | `${number}ms`;\r\ntype IterationCount = number | 'infinite';\r\n\r\nexport interface AnimationConfig {\r\n name: string;\r\n duration?: TimeUnit;\r\n timingFunction?: TimingFunction;\r\n delay?: TimeUnit;\r\n iterationCount?: IterationCount;\r\n direction?: AnimationDirection;\r\n fillMode?: FillMode;\r\n playState?: PlayState;\r\n}\r\nconst DEFAULT_VALUES = {\r\n duration: '1s',\r\n timingFunction: 'ease',\r\n delay: '0s',\r\n iterationCount: 1,\r\n direction: 'normal',\r\n fillMode: 'none',\r\n playState: 'running',\r\n} as const;\r\nexport function renderCSSAnimation(config: AnimationConfig): string {\r\n const {\r\n name,\r\n duration = DEFAULT_VALUES.duration,\r\n timingFunction = DEFAULT_VALUES.timingFunction,\r\n delay = DEFAULT_VALUES.delay,\r\n iterationCount = DEFAULT_VALUES.iterationCount,\r\n direction = DEFAULT_VALUES.direction,\r\n fillMode = DEFAULT_VALUES.fillMode,\r\n playState = DEFAULT_VALUES.playState,\r\n } = config;\r\n\r\n return `${name} ${duration} ${timingFunction} ${delay} ${iterationCount} ${direction} ${fillMode} ${playState}`;\r\n}\r\nexport function createThrottle<T extends (...args: any[]) => void>(\r\n fn: T,\r\n delay: number,\r\n): T & { cancel: () => void } {\r\n let lastCall = 0;\r\n let timer: ReturnType<typeof setTimeout> | null = null;\r\n const throttled = (...args: Parameters<T>) => {\r\n const now = Date.now();\r\n const remaining = delay - (now - lastCall);\r\n if (timer) {\r\n clearTimeout(timer);\r\n timer = null;\r\n }\r\n if (remaining <= 0) {\r\n lastCall = now;\r\n fn(...args);\r\n } else {\r\n timer = setTimeout(() => {\r\n lastCall = Date.now();\r\n timer = null;\r\n fn(...args);\r\n }, remaining);\r\n }\r\n };\r\n throttled.cancel = () => {\r\n if (timer) {\r\n clearTimeout(timer);\r\n timer = null;\r\n }\r\n };\r\n return throttled as T & { cancel: () => void };\r\n}\r\nconst generateRandomHexColor = (): string => {\r\n const randomColor = Math.floor(Math.random() * 16777215).toString(16);\r\n return `#${randomColor.padStart(6, '0')}`;\r\n};\r\n\r\nexport function normalizeHexColor(value: string | undefined): string {\r\n if (!value) return generateRandomHexColor();\r\n let hex = value.trim().replace(/^#/, '');\r\n if (hex.length === 3) {\r\n hex = hex\r\n .split('')\r\n .map(char => char + char)\r\n .join('');\r\n }\r\n\r\n return `#${hex.toLowerCase()}`;\r\n}\r\nexport function getColor(color?: BaseColorProps | string, defaultColor?: string) {\r\n switch (color) {\r\n case 'primary':\r\n return 'color-primary';\r\n case 'neutral':\r\n return 'color-neutral';\r\n case 'secondary':\r\n return 'color-secondary';\r\n case 'accent':\r\n return 'color-accent';\r\n case 'info':\r\n return 'color-info';\r\n case 'success':\r\n return 'color-success';\r\n case 'warning':\r\n return 'color-warning';\r\n case 'error':\r\n return 'color-error';\r\n default:\r\n return defaultColor ?? '';\r\n }\r\n}\r\n\r\nconst lastValuesByKey = new Map<string, any>();\r\n\r\nexport function getRandomElement<T>(arr: T[], uniqueId: string): T {\r\n if (arr.length === 1) return arr[0];\r\n const lastValue = lastValuesByKey.get(uniqueId);\r\n let newValue: T;\r\n do {\r\n newValue = arr[Math.floor(Math.random() * arr.length)];\r\n } while (newValue === lastValue && arr.length > 1);\r\n\r\n lastValuesByKey.set(uniqueId, newValue);\r\n return newValue;\r\n}\r\nexport const genSVGCubicBezier: (\r\n keySplines: string,\r\n) => Pick<\r\n JSX.AnimateSVGAttributes<SVGAnimateElement>,\r\n 'calcMode' | 'keyTimes' | 'keySplines'\r\n> = keySplines => ({\r\n calcMode: 'spline',\r\n keyTimes: '0; 1',\r\n keySplines: keySplines,\r\n});\r\n\r\nexport type Image = Omit<JSX.ImgHTMLAttributes<HTMLImageElement>, 'src'> & { src: string };\r\n\r\nexport function toMarkdownCode(code: string, lang = 'tsx'): string {\r\n return `\\`\\`\\`${lang}\\n${code}\\n\\`\\`\\``;\r\n}\r\n"],"mappings":"AA8BA,IAAM,EAAiB,CACrB,SAAU,KACV,eAAgB,OAChB,MAAO,KACP,eAAgB,EAChB,UAAW,SACX,SAAU,OACV,UAAW,UACZ,CACD,SAAgB,EAAmB,EAAiC,CAClE,GAAM,CACJ,OACA,WAAW,EAAe,SAC1B,iBAAiB,EAAe,eAChC,QAAQ,EAAe,MACvB,iBAAiB,EAAe,eAChC,YAAY,EAAe,UAC3B,WAAW,EAAe,SAC1B,YAAY,EAAe,WACzB,EAEJ,MAAO,GAAG,EAAK,GAAG,EAAS,GAAG,EAAe,GAAG,EAAM,GAAG,EAAe,GAAG,EAAU,GAAG,EAAS,GAAG,IAEtG,SAAgB,EACd,EACA,EAC4B,CAC5B,IAAI,EAAW,EACX,EAA8C,KAC5C,GAAa,GAAG,IAAwB,CAC5C,IAAM,EAAM,KAAK,KAAK,CAChB,EAAY,GAAS,EAAM,GACjC,AAEE,KADA,aAAa,EAAM,CACX,MAEN,GAAa,GACf,EAAW,EACX,EAAG,GAAG,EAAK,EAEX,EAAQ,eAAiB,CACvB,EAAW,KAAK,KAAK,CACrB,EAAQ,KACR,EAAG,GAAG,EAAK,EACV,EAAU,EASjB,MANA,GAAU,WAAe,CACvB,AAEE,KADA,aAAa,EAAM,CACX,OAGL,EAET,IAAM,MAEG,IADa,KAAK,MAAM,KAAK,QAAQ,CAAG,SAAS,CAAC,SAAS,GAAG,CAC9C,SAAS,EAAG,IAAI,GAGzC,SAAgB,EAAkB,EAAmC,CACnE,GAAI,CAAC,EAAO,OAAO,GAAwB,CAC3C,IAAI,EAAM,EAAM,MAAM,CAAC,QAAQ,KAAM,GAAG,CAQxC,OAPI,EAAI,SAAW,IACjB,EAAM,EACH,MAAM,GAAG,CACT,IAAI,GAAQ,EAAO,EAAK,CACxB,KAAK,GAAG,EAGN,IAAI,EAAI,aAAa,GAE9B,SAAgB,EAAS,EAAiC,EAAuB,CAC/E,OAAQ,EAAR,CACE,IAAK,UACH,MAAO,gBACT,IAAK,UACH,MAAO,gBACT,IAAK,YACH,MAAO,kBACT,IAAK,SACH,MAAO,eACT,IAAK,OACH,MAAO,aACT,IAAK,UACH,MAAO,gBACT,IAAK,UACH,MAAO,gBACT,IAAK,QACH,MAAO,cACT,QACE,OAAO,GAAgB,IAiB7B,IAAa,EAKT,IAAe,CACjB,SAAU,SACV,SAAU,OACE,aACb"}
@@ -1 +1 @@
1
- {"version":3,"file":"hoc.js","names":["Component","Show","ConditionalRenderConfig","preRender","P","when","conditionalRender","Record","Comp","configKey","p","whenValue","_$createComponent","keyed","children"],"sources":["../../src/utils/hoc.tsx"],"sourcesContent":["import { Component, Show } from 'solid-js';\n\ntype ConditionalRenderConfig<P> = {\n preRender: keyof P;\n when?: keyof P;\n};\n/*\npreRender sẽ tạo ra DOM ngay lập tức bất kể when có true hay false\n Mặc định false\n*/\nexport function conditionalRender<P extends Record<string, any>>(\n Comp: Component<P>,\n configKey: ConditionalRenderConfig<P>,\n) {\n return (p: P) => {\n const preRender = () => p[configKey.preRender] ?? false;\n const whenValue = () => (configKey?.when ? (p[configKey.when] ?? true) : true);\n\n return preRender() ? (\n <Comp {...p} />\n ) : (\n <Show when={whenValue()} keyed>\n <Comp {...p} />\n </Show>\n );\n };\n}\n"],"mappings":"+EAUA,SAAgBM,EACdE,EACAC,EACA,CACA,MAAQC,IAAS,CACf,IAAMP,MAAkBO,EAAED,EAAUN,YAAc,GAC5CQ,MAAmBF,GAAWJ,KAAQK,EAAED,EAAUJ,OAAS,GAAQ,GAEzE,OAAOF,GAAW,CAAAS,EACfJ,EAASE,EAAC,CAAAE,EAEVX,EAAI,CAAA,IAACI,MAAI,CAAA,OAAEM,GAAW,EAAEE,MAAK,GAAA,IAAAC,UAAA,CAAA,OAAAF,EAC3BJ,EAASE,EAAC,EAAA,CAEd"}
1
+ {"version":3,"file":"hoc.js","names":["Component","Show","ConditionalRenderConfig","preRender","P","when","conditionalRender","Record","Comp","configKey","p","whenValue","_$createComponent","keyed","children"],"sources":["../../src/utils/hoc.tsx"],"sourcesContent":["import { Component, Show } from 'solid-js';\r\n\r\ntype ConditionalRenderConfig<P> = {\r\n preRender: keyof P;\r\n when?: keyof P;\r\n};\r\n/*\r\npreRender sẽ tạo ra DOM ngay lập tức bất kể when có true hay false\r\n Mặc định false\r\n*/\r\nexport function conditionalRender<P extends Record<string, any>>(\r\n Comp: Component<P>,\r\n configKey: ConditionalRenderConfig<P>,\r\n) {\r\n return (p: P) => {\r\n const preRender = () => p[configKey.preRender] ?? false;\r\n const whenValue = () => (configKey?.when ? (p[configKey.when] ?? true) : true);\r\n\r\n return preRender() ? (\r\n <Comp {...p} />\r\n ) : (\r\n <Show when={whenValue()} keyed>\r\n <Comp {...p} />\r\n </Show>\r\n );\r\n };\r\n}\r\n"],"mappings":"+EAUA,SAAgBM,EACdE,EACAC,EACA,CACA,MAAQC,IAAS,CACf,IAAMP,MAAkBO,EAAED,EAAUN,YAAc,GAC5CQ,MAAmBF,GAAWJ,KAAQK,EAAED,EAAUJ,OAAS,GAAQ,GAEzE,OAAOF,GAAW,CAAAS,EACfJ,EAASE,EAAC,CAAAE,EAEVX,EAAI,CAAA,IAACI,MAAI,CAAA,OAAEM,GAAW,EAAEE,MAAK,GAAA,IAAAC,UAAA,CAAA,OAAAF,EAC3BJ,EAASE,EAAC,EAAA,CAEd"}
package/package.json CHANGED
@@ -1,10 +1,10 @@
1
1
  {
2
2
  "name": "solid-tom-ui",
3
- "version": "1.0.5",
3
+ "version": "1.0.6",
4
4
  "description": "SolidJS UI component library (Ant Design–inspired, Tailwind CSS + DaisyUI)",
5
- "homepage": "https://solid-tom-ui.netlify.app/",
6
5
  "type": "module",
7
6
  "license": "MIT",
7
+ "author": "Truong Tom",
8
8
  "keywords": [
9
9
  "solidjs",
10
10
  "ui",
@@ -30,39 +30,16 @@
30
30
  "sideEffects": [
31
31
  "**/*.css"
32
32
  ],
33
- "scripts": {
34
- "start": "vite",
35
- "dev": "vite",
36
- "build": "vite build",
37
- "build:lib": "vite build --config vite.config.lib.ts && node scripts/build-css.js",
38
- "build:lib:watch": "vite build --config vite.config.lib.ts --watch",
39
- "dev:link": "npm run build:lib && cd ../solid_test_02 && pnpm install",
40
- "link:local": "cd ../solid_test_02 && pnpm add solid-tom-ui@file:../solid_ui --save",
41
- "link:npm": "cd ../solid_test_02 && pnpm add solid-tom-ui@latest --save",
42
- "prepublishOnly": "npm run build:lib",
43
- "serve": "vite preview",
44
- "server": "bun src/server/index.ts",
45
- "test": "vitest",
46
- "test:ui": "vitest --ui",
47
- "test:run": "vitest run",
48
- "test:coverage": "vitest run --coverage",
49
- "tsc": "tsc --noEmit",
50
- "tsc:lib": "tsc --project tsconfig.lib.json --noEmit",
51
- "format": "prettier --write \"src/**/*.{js,jsx,ts,tsx,json,css,scss,md,astro,html,mdx}\"",
52
- "format:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx,json,css,scss,md,astro,html,mdx}\"",
53
- "clear:comment": "python src/utils/minify.py",
54
- "extract": "npx tsx src/utils/extractor.ts",
55
- "sb": "storybook dev -p 6006 --no-open",
56
- "build-sb": "storybook build && node scripts/zip-sb.js",
57
- "release:patch": "npm version patch && npm publish",
58
- "release:minor": "npm version minor && npm publish",
59
- "release:major": "npm version major && npm publish"
60
- },
61
33
  "peerDependencies": {
62
34
  "@tanstack/solid-table": ">=8.0.0",
35
+ "@tanstack/solid-virtual": ">=3.0.0",
36
+ "class-variance-authority": ">=0.7.0",
37
+ "clsx": ">=2.0.0",
63
38
  "imask": ">=7.0.0",
39
+ "lucide-solid": ">=0.400.0",
64
40
  "qrcode": ">=1.5.0",
65
- "solid-js": ">=1.8.0"
41
+ "solid-js": ">=1.8.0",
42
+ "tailwind-merge": ">=3.0.0"
66
43
  },
67
44
  "devDependencies": {
68
45
  "@chromatic-com/storybook": "^5.1.0",
@@ -117,5 +94,34 @@
117
94
  "sucrase": "^3.35.1",
118
95
  "tailwind-merge": "^3.5.0",
119
96
  "tailwindcss": "^4.2.2"
97
+ },
98
+ "scripts": {
99
+ "start": "vite",
100
+ "dev": "vite",
101
+ "build": "vite build",
102
+ "build:lib": "vite build --config vite.config.lib.ts && node scripts/build-css.js",
103
+ "build:lib:watch": "vite build --config vite.config.lib.ts --watch",
104
+ "dev:link": "npm run build:lib && cd ../solid_test_02 && pnpm add solid-tom-ui@file:../solid_ui/dist --save",
105
+ "link:local": "npm run build:lib && cd ../solid_test_02 && pnpm add solid-tom-ui@file:../solid_ui/dist --save",
106
+ "link:npm": "cd ../solid_test_02 && pnpm add solid-tom-ui@latest --save",
107
+ "serve": "vite preview",
108
+ "server": "bun src/server/index.ts",
109
+ "test": "vitest",
110
+ "test:ui": "vitest --ui",
111
+ "test:run": "vitest run",
112
+ "test:coverage": "vitest run --coverage",
113
+ "tsc": "tsc --noEmit",
114
+ "tsc:lib": "tsc --project tsconfig.lib.json --noEmit",
115
+ "format": "prettier --write \"src/**/*.{js,jsx,ts,tsx,json,css,scss,md,astro,html,mdx}\"",
116
+ "format:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx,json,css,scss,md,astro,html,mdx}\"",
117
+ "clear:comment": "python src/utils/minify.py",
118
+ "extract": "npx tsx src/utils/extractor.ts",
119
+ "sb": "storybook dev -p 6006 --no-open",
120
+ "build-sb": "storybook build && node scripts/zip-sb.js",
121
+ "release:patch": "npm version patch && npm run build:lib && npm publish dist --access public",
122
+ "release:minor": "npm version minor && npm run build:lib && npm publish dist --access public",
123
+ "release:major": "npm version major && npm run build:lib && npm publish dist --access public",
124
+ "release:github": "node scripts/release-github.js",
125
+ "release:github:copy-only": "node scripts/release-github.js --no-build"
120
126
  }
121
- }
127
+ }