@ktnpm_devops/react-component 0.3.0 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (248) hide show
  1. package/dist/index.cjs +24 -20
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.ts +4 -0
  4. package/dist/index.d.ts.map +1 -1
  5. package/dist/index.js +24 -20
  6. package/dist/index.js.map +1 -1
  7. package/dist/index10.cjs +2 -2
  8. package/dist/index10.js +2 -2
  9. package/dist/index11.cjs +2 -2
  10. package/dist/index11.js +2 -2
  11. package/dist/index12.cjs +2 -2
  12. package/dist/index12.js +2 -2
  13. package/dist/index13.cjs +2 -2
  14. package/dist/index13.js +2 -2
  15. package/dist/index14.cjs +3 -3
  16. package/dist/index14.js +3 -3
  17. package/dist/index15.cjs +2 -2
  18. package/dist/index15.js +2 -2
  19. package/dist/index16.cjs +38 -85
  20. package/dist/index16.cjs.map +1 -1
  21. package/dist/index16.js +40 -87
  22. package/dist/index16.js.map +1 -1
  23. package/dist/index17.cjs +85 -153
  24. package/dist/index17.cjs.map +1 -1
  25. package/dist/index17.js +87 -155
  26. package/dist/index17.js.map +1 -1
  27. package/dist/index18.cjs +150 -128
  28. package/dist/index18.cjs.map +1 -1
  29. package/dist/index18.js +150 -128
  30. package/dist/index18.js.map +1 -1
  31. package/dist/index19.cjs +121 -106
  32. package/dist/index19.cjs.map +1 -1
  33. package/dist/index19.js +122 -107
  34. package/dist/index19.js.map +1 -1
  35. package/dist/index20.cjs +121 -17
  36. package/dist/index20.cjs.map +1 -1
  37. package/dist/index20.js +121 -17
  38. package/dist/index20.js.map +1 -1
  39. package/dist/index21.cjs +17 -8
  40. package/dist/index21.cjs.map +1 -1
  41. package/dist/index21.js +18 -9
  42. package/dist/index21.js.map +1 -1
  43. package/dist/index22.cjs +7 -130
  44. package/dist/index22.cjs.map +1 -1
  45. package/dist/index22.js +9 -132
  46. package/dist/index22.js.map +1 -1
  47. package/dist/index23.cjs +128 -35
  48. package/dist/index23.cjs.map +1 -1
  49. package/dist/index23.js +129 -36
  50. package/dist/index23.js.map +1 -1
  51. package/dist/index24.cjs +36 -222
  52. package/dist/index24.cjs.map +1 -1
  53. package/dist/index24.js +37 -223
  54. package/dist/index24.js.map +1 -1
  55. package/dist/index25.cjs +218 -28
  56. package/dist/index25.cjs.map +1 -1
  57. package/dist/index25.js +220 -30
  58. package/dist/index25.js.map +1 -1
  59. package/dist/index26.cjs +29 -73
  60. package/dist/index26.cjs.map +1 -1
  61. package/dist/index26.js +31 -75
  62. package/dist/index26.js.map +1 -1
  63. package/dist/index27.cjs +69 -144
  64. package/dist/index27.cjs.map +1 -1
  65. package/dist/index27.js +70 -145
  66. package/dist/index27.js.map +1 -1
  67. package/dist/index28.cjs +57 -6
  68. package/dist/index28.cjs.map +1 -1
  69. package/dist/index28.js +57 -6
  70. package/dist/index28.js.map +1 -1
  71. package/dist/index29.cjs +152 -16
  72. package/dist/index29.cjs.map +1 -1
  73. package/dist/index29.js +152 -16
  74. package/dist/index29.js.map +1 -1
  75. package/dist/index30.cjs +7 -76
  76. package/dist/index30.cjs.map +1 -1
  77. package/dist/index30.js +9 -78
  78. package/dist/index30.js.map +1 -1
  79. package/dist/index31.cjs +17 -143
  80. package/dist/index31.cjs.map +1 -1
  81. package/dist/index31.js +17 -143
  82. package/dist/index31.js.map +1 -1
  83. package/dist/index32.cjs +69 -97
  84. package/dist/index32.cjs.map +1 -1
  85. package/dist/index32.js +71 -99
  86. package/dist/index32.js.map +1 -1
  87. package/dist/index33.cjs +143 -6
  88. package/dist/index33.cjs.map +1 -1
  89. package/dist/index33.js +144 -7
  90. package/dist/index33.js.map +1 -1
  91. package/dist/index34.cjs +74 -185
  92. package/dist/index34.cjs.map +1 -1
  93. package/dist/index34.js +67 -178
  94. package/dist/index34.js.map +1 -1
  95. package/dist/index35.cjs +6 -8
  96. package/dist/index35.cjs.map +1 -1
  97. package/dist/index35.js +6 -8
  98. package/dist/index35.js.map +1 -1
  99. package/dist/index36.cjs +216 -14
  100. package/dist/index36.cjs.map +1 -1
  101. package/dist/index36.js +215 -13
  102. package/dist/index36.js.map +1 -1
  103. package/dist/index37.cjs +10 -10
  104. package/dist/index37.cjs.map +1 -1
  105. package/dist/index37.js +9 -9
  106. package/dist/index37.js.map +1 -1
  107. package/dist/index38.cjs +15 -15
  108. package/dist/index38.cjs.map +1 -1
  109. package/dist/index38.js +15 -15
  110. package/dist/index38.js.map +1 -1
  111. package/dist/index39.cjs +27 -67
  112. package/dist/index39.cjs.map +1 -1
  113. package/dist/index39.js +26 -66
  114. package/dist/index39.js.map +1 -1
  115. package/dist/index40.cjs +64 -34
  116. package/dist/index40.cjs.map +1 -1
  117. package/dist/index40.js +64 -34
  118. package/dist/index40.js.map +1 -1
  119. package/dist/index41.cjs +10 -19
  120. package/dist/index41.cjs.map +1 -1
  121. package/dist/index41.js +10 -19
  122. package/dist/index41.js.map +1 -1
  123. package/dist/index42.cjs +15 -48
  124. package/dist/index42.cjs.map +1 -1
  125. package/dist/index42.js +16 -49
  126. package/dist/index42.js.map +1 -1
  127. package/dist/index43.cjs +2 -14
  128. package/dist/index43.cjs.map +1 -1
  129. package/dist/index43.js +2 -14
  130. package/dist/index43.js.map +1 -1
  131. package/dist/index44.cjs +3 -30
  132. package/dist/index44.cjs.map +1 -1
  133. package/dist/index44.js +3 -30
  134. package/dist/index44.js.map +1 -1
  135. package/dist/index45.cjs +67 -18
  136. package/dist/index45.cjs.map +1 -1
  137. package/dist/index45.js +66 -17
  138. package/dist/index45.js.map +1 -1
  139. package/dist/index46.cjs +13 -13
  140. package/dist/index46.js +14 -14
  141. package/dist/index47.cjs +53 -2
  142. package/dist/index47.cjs.map +1 -1
  143. package/dist/index47.js +54 -3
  144. package/dist/index47.js.map +1 -1
  145. package/dist/index48.cjs +35 -2
  146. package/dist/index48.cjs.map +1 -1
  147. package/dist/index48.js +36 -3
  148. package/dist/index48.js.map +1 -1
  149. package/dist/index49.cjs +50 -2
  150. package/dist/index49.cjs.map +1 -1
  151. package/dist/index49.js +51 -3
  152. package/dist/index49.js.map +1 -1
  153. package/dist/index50.cjs +16 -34
  154. package/dist/index50.cjs.map +1 -1
  155. package/dist/index50.js +16 -34
  156. package/dist/index50.js.map +1 -1
  157. package/dist/index51.cjs +29 -50
  158. package/dist/index51.cjs.map +1 -1
  159. package/dist/index51.js +29 -50
  160. package/dist/index51.js.map +1 -1
  161. package/dist/index52.cjs +13 -16
  162. package/dist/index52.cjs.map +1 -1
  163. package/dist/index52.js +14 -17
  164. package/dist/index52.js.map +1 -1
  165. package/dist/index53.cjs +8 -35
  166. package/dist/index53.cjs.map +1 -1
  167. package/dist/index53.js +9 -36
  168. package/dist/index53.js.map +1 -1
  169. package/dist/index54.cjs +2 -53
  170. package/dist/index54.cjs.map +1 -1
  171. package/dist/index54.js +3 -54
  172. package/dist/index54.js.map +1 -1
  173. package/dist/index55.cjs +7 -134
  174. package/dist/index55.cjs.map +1 -1
  175. package/dist/index55.js +6 -133
  176. package/dist/index55.js.map +1 -1
  177. package/dist/index56.cjs +15 -36
  178. package/dist/index56.cjs.map +1 -1
  179. package/dist/index56.js +16 -37
  180. package/dist/index56.js.map +1 -1
  181. package/dist/index57.cjs +5 -29
  182. package/dist/index57.cjs.map +1 -1
  183. package/dist/index57.js +6 -30
  184. package/dist/index57.js.map +1 -1
  185. package/dist/index58.cjs +79 -22
  186. package/dist/index58.cjs.map +1 -1
  187. package/dist/index58.js +79 -22
  188. package/dist/index58.js.map +1 -1
  189. package/dist/index59.cjs +10 -10
  190. package/dist/index59.js +11 -11
  191. package/dist/index60.cjs +28 -19
  192. package/dist/index60.cjs.map +1 -1
  193. package/dist/index60.js +29 -20
  194. package/dist/index60.js.map +1 -1
  195. package/dist/index61.cjs +31 -76
  196. package/dist/index61.cjs.map +1 -1
  197. package/dist/index61.js +31 -76
  198. package/dist/index61.js.map +1 -1
  199. package/dist/index62.cjs +16 -37
  200. package/dist/index62.cjs.map +1 -1
  201. package/dist/index62.js +16 -37
  202. package/dist/index62.js.map +1 -1
  203. package/dist/index63.cjs +37 -16
  204. package/dist/index63.cjs.map +1 -1
  205. package/dist/index63.js +37 -16
  206. package/dist/index63.js.map +1 -1
  207. package/dist/index64.cjs +52 -16
  208. package/dist/index64.cjs.map +1 -1
  209. package/dist/index64.js +52 -16
  210. package/dist/index64.js.map +1 -1
  211. package/dist/index65.cjs +13 -10
  212. package/dist/index65.cjs.map +1 -1
  213. package/dist/index65.js +14 -11
  214. package/dist/index65.js.map +1 -1
  215. package/dist/index66.cjs +24 -0
  216. package/dist/index66.cjs.map +1 -0
  217. package/dist/index66.js +24 -0
  218. package/dist/index66.js.map +1 -0
  219. package/dist/index67.cjs +45 -0
  220. package/dist/index67.cjs.map +1 -0
  221. package/dist/index67.js +45 -0
  222. package/dist/index67.js.map +1 -0
  223. package/dist/index68.cjs +136 -0
  224. package/dist/index68.cjs.map +1 -0
  225. package/dist/index68.js +136 -0
  226. package/dist/index68.js.map +1 -0
  227. package/dist/index69.cjs +48 -0
  228. package/dist/index69.cjs.map +1 -0
  229. package/dist/index69.js +48 -0
  230. package/dist/index69.js.map +1 -0
  231. package/dist/index9.cjs +2 -2
  232. package/dist/index9.js +2 -2
  233. package/dist/primitives/Col/Col.d.ts +4 -0
  234. package/dist/primitives/Col/Col.d.ts.map +1 -0
  235. package/dist/primitives/Col/Col.types.d.ts +13 -0
  236. package/dist/primitives/Col/Col.types.d.ts.map +1 -0
  237. package/dist/primitives/Col/index.d.ts +3 -0
  238. package/dist/primitives/Col/index.d.ts.map +1 -0
  239. package/dist/primitives/Row/Row.d.ts +4 -0
  240. package/dist/primitives/Row/Row.d.ts.map +1 -0
  241. package/dist/primitives/Row/Row.types.d.ts +16 -0
  242. package/dist/primitives/Row/Row.types.d.ts.map +1 -0
  243. package/dist/primitives/Row/index.d.ts +3 -0
  244. package/dist/primitives/Row/index.d.ts.map +1 -0
  245. package/dist/style.css +41 -0
  246. package/dist/styles.cjs +1 -0
  247. package/dist/styles.mjs +1 -0
  248. package/package.json +9 -3
@@ -1 +1 @@
1
- {"version":3,"file":"index19.js","sources":["../src/composites/CustomRangePicker/CustomRangePicker.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, useCallback } from 'react';\nimport clsx from 'clsx';\nimport { useClickOutside } from '../../hooks/useClickOutside';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { formatLocalISOString } from '../../utils/format';\nimport styles from './CustomRangePicker.module.css';\n\nexport interface CustomRangePickerProps {\n /** Start of the current range (ISO string). */\n from?: string;\n /** End of the current range (ISO string). */\n to?: string;\n /** Called when user applies a valid range. */\n onApply: (range: { from: string; to: string }) => void;\n}\n\nconst formatInputValue = (iso?: string): string => {\n if (!iso) return '';\n const date = new Date(iso);\n if (Number.isNaN(date.getTime())) return '';\n const y = date.getFullYear();\n const m = `${date.getMonth() + 1}`.padStart(2, '0');\n const d = `${date.getDate()}`.padStart(2, '0');\n const h = `${date.getHours()}`.padStart(2, '0');\n const min = `${date.getMinutes()}`.padStart(2, '0');\n return `${y}-${m}-${d}T${h}:${min}`;\n};\n\nconst toLocalTimestamp = (value: string): string | null => {\n if (!value) return null;\n const date = new Date(value);\n if (Number.isNaN(date.getTime())) return null;\n return formatLocalISOString(date);\n};\n\nexport const CustomRangePicker = ({ from, to, onApply }: CustomRangePickerProps) => {\n const [isOpen, setIsOpen] = useState(false);\n const [startValue, setStartValue] = useState(() => formatInputValue(from));\n const [endValue, setEndValue] = useState(() => formatInputValue(to));\n const [error, setError] = useState<string | null>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n\n const isActive = Boolean(from && to);\n\n const close = useCallback(() => setIsOpen(false), []);\n useClickOutside(containerRef, close);\n useEscapeKey(close, isOpen);\n\n useEffect(() => {\n if (!isOpen) return;\n setStartValue(formatInputValue(from));\n setEndValue(formatInputValue(to));\n setError(null);\n }, [from, to, isOpen]);\n\n const summary = useMemo(() => {\n if (!from || !to) return null;\n const s = new Date(from);\n const e = new Date(to);\n if (Number.isNaN(s.getTime()) || Number.isNaN(e.getTime())) return null;\n const fmt = new Intl.DateTimeFormat(undefined, {\n year: 'numeric', month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit',\n });\n return `${fmt.format(s)} – ${fmt.format(e)}`;\n }, [from, to]);\n\n const handleApply = () => {\n const startIso = toLocalTimestamp(startValue);\n const endIso = toLocalTimestamp(endValue);\n if (!startIso || !endIso) {\n setError('Both start and end date are required.');\n return;\n }\n if (startIso >= endIso) {\n setError('End of range must be after the start.');\n return;\n }\n onApply({ from: startIso, to: endIso });\n setIsOpen(false);\n };\n\n const handleCancel = () => {\n setStartValue(formatInputValue(from));\n setEndValue(formatInputValue(to));\n setError(null);\n setIsOpen(false);\n };\n\n return (\n <div className={styles.root} ref={containerRef}>\n <button\n type=\"button\"\n className={clsx(styles.chip, { [styles.active]: isActive })}\n onClick={() => setIsOpen((v) => !v)}\n >\n Custom\n </button>\n {summary && <span className={styles.summary}>{summary}</span>}\n\n {isOpen && (\n <div className={styles.popover} role=\"dialog\" aria-modal=\"false\">\n <header className={styles.popoverHeader}>\n <h4>Custom Time Range</h4>\n </header>\n <div className={styles.fields}>\n <label className={styles.field}>\n <span>Start</span>\n <input\n type=\"datetime-local\"\n value={startValue}\n onChange={(e) => setStartValue(e.target.value)}\n max={endValue || undefined}\n />\n </label>\n <label className={styles.field}>\n <span>End</span>\n <input\n type=\"datetime-local\"\n value={endValue}\n onChange={(e) => setEndValue(e.target.value)}\n min={startValue || undefined}\n />\n </label>\n </div>\n {error && <p className={styles.error}>{error}</p>}\n <footer className={styles.actions}>\n <button type=\"button\" className={styles.btnGhost} onClick={handleCancel}>\n Cancel\n </button>\n <button type=\"button\" className={styles.btnPrimary} onClick={handleApply}>\n Apply\n </button>\n </footer>\n </div>\n )}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index19.js","sources":["../src/charts/CountersAnalysisCard/CountersAnalysisCard.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport clsx from 'clsx';\nimport type { CountersAnalysisCardProps } from './CountersAnalysisCard.types';\nimport type { DistinctCounterRow } from '../../types/chart.types';\nimport { COUNTERS_PAGE_SIZE } from '../../constants';\nimport { CounterTimeseriesChart } from '../CounterTimeseriesChart';\nimport styles from './CountersAnalysisCard.module.css';\n\nconst COLUMN_HEADERS: { key: keyof DistinctCounterRow; label: string }[] = [\n { key: 'counter', label: 'Counter' },\n { key: 'nodeType', label: 'Node Type' },\n { key: 'bureauName', label: 'Bureau' },\n { key: 'objectType', label: 'Object Type' },\n { key: 'objectValue', label: 'Object Value' },\n { key: 'anomalyName', label: 'Anomaly' },\n { key: 'distinctTimestamps', label: 'Timestamps' },\n];\n\nconst isRowMatch = (a: DistinctCounterRow, b: DistinctCounterRow): boolean =>\n a.counter === b.counter &&\n a.nodeType === b.nodeType &&\n a.bureauName === b.bureauName &&\n a.objectType === b.objectType &&\n a.objectValue === b.objectValue &&\n a.anomalyName === b.anomalyName;\n\nexport const CountersAnalysisCard = ({\n title,\n isLoading,\n error,\n onRetry,\n onChartReady,\n actions,\n className,\n rows,\n selectedRow,\n onSelectRow,\n timeseriesData,\n timeseriesLoading,\n timePeriod = '7d',\n onTimePeriodChange,\n pageSize = COUNTERS_PAGE_SIZE,\n}: CountersAnalysisCardProps) => {\n const [currentPage, setCurrentPage] = useState(0);\n\n const totalPages = Math.max(1, Math.ceil(rows.length / pageSize));\n\n const paginatedRows = useMemo(\n () => rows.slice(currentPage * pageSize, (currentPage + 1) * pageSize),\n [rows, currentPage, pageSize],\n );\n\n const handlePrevious = () => {\n setCurrentPage((prev) => Math.max(0, prev - 1));\n };\n\n const handleNext = () => {\n setCurrentPage((prev) => Math.min(totalPages - 1, prev + 1));\n };\n\n if (isLoading) {\n return (\n <div className={clsx(styles.root, className)}>\n <header className={styles.header}>\n <h2 className={styles.title}>{title}</h2>\n </header>\n <div className={styles.loading}>Loading...</div>\n </div>\n );\n }\n\n if (error) {\n return (\n <div className={clsx(styles.root, className)}>\n <header className={styles.header}>\n <h2 className={styles.title}>{title}</h2>\n </header>\n <div className={styles.error}>\n <span>{error}</span>\n {onRetry && (\n <button type=\"button\" className={styles.retryButton} onClick={onRetry}>\n Retry\n </button>\n )}\n </div>\n </div>\n );\n }\n\n if (rows.length === 0) {\n return (\n <div className={clsx(styles.root, className)}>\n <header className={styles.header}>\n <h2 className={styles.title}>{title}</h2>\n {actions && <div className={styles.headerActions}>{actions}</div>}\n </header>\n <div className={styles.empty}>No counters available</div>\n </div>\n );\n }\n\n return (\n <div className={clsx(styles.root, className)}>\n <header className={styles.header}>\n <h2 className={styles.title}>{title}</h2>\n {actions && <div className={styles.headerActions}>{actions}</div>}\n </header>\n\n <div className={styles.splitContainer}>\n <div className={styles.tablePanel}>\n <table className={styles.table}>\n <thead>\n <tr>\n {COLUMN_HEADERS.map(({ key, label }) => (\n <th key={key} scope=\"col\">\n {label}\n </th>\n ))}\n </tr>\n </thead>\n <tbody>\n {paginatedRows.map((row, index) => {\n const isSelected = selectedRow != null && isRowMatch(row, selectedRow);\n return (\n <tr\n key={`${row.counter}-${row.nodeType}-${row.objectValue}-${index}`}\n className={clsx(styles.tableRow, {\n [styles.tableRowSelected]: isSelected,\n })}\n aria-selected={isSelected}\n onClick={() => onSelectRow?.(row)}\n >\n {COLUMN_HEADERS.map(({ key }) => (\n <td key={key}>{String(row[key] ?? '')}</td>\n ))}\n </tr>\n );\n })}\n </tbody>\n </table>\n\n {totalPages > 1 && (\n <div className={styles.pagination}>\n <button\n type=\"button\"\n className={styles.paginationButton}\n disabled={currentPage === 0}\n onClick={handlePrevious}\n >\n Previous\n </button>\n <span className={styles.paginationInfo}>\n Page {currentPage + 1} of {totalPages}\n </span>\n <button\n type=\"button\"\n className={styles.paginationButton}\n disabled={currentPage >= totalPages - 1}\n onClick={handleNext}\n >\n Next\n </button>\n </div>\n )}\n </div>\n\n <div className={styles.chartPanel}>\n {selectedRow ? (\n <CounterTimeseriesChart\n data={timeseriesData ?? []}\n isLoading={timeseriesLoading}\n timeRange={timePeriod as string as import('../../types/chart.types').TimeRangeOption}\n onTimeRangeChange={onTimePeriodChange as unknown as ((range: import('../../types/chart.types').TimeRangeOption) => void) | undefined}\n onChartReady={onChartReady}\n />\n ) : (\n <div className={styles.placeholder}>Select a counter to view timeseries</div>\n )}\n </div>\n </div>\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
package/dist/index20.cjs CHANGED
@@ -1,21 +1,125 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const jsxRuntime = require("react/jsx-runtime");
4
- const clsx = require("./index36.cjs");
5
- const DashboardLayout_module = require("./index63.cjs");
6
- const DashboardLayout = ({
7
- sidebar,
8
- filterBar,
9
- children,
10
- sidebarCollapsed = false,
11
- className
12
- }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx(DashboardLayout_module.default.root, className), children: [
13
- sidebar && /* @__PURE__ */ jsxRuntime.jsx("aside", { className: clsx.clsx(DashboardLayout_module.default.sidebar, { [DashboardLayout_module.default.sidebarCollapsed]: sidebarCollapsed }), children: sidebar }),
14
- /* @__PURE__ */ jsxRuntime.jsxs("main", { className: DashboardLayout_module.default.main, children: [
15
- filterBar && /* @__PURE__ */ jsxRuntime.jsx("div", { className: DashboardLayout_module.default.filterBar, children: filterBar }),
16
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: DashboardLayout_module.default.content, children })
17
- ] })
18
- ] });
19
- DashboardLayout.displayName = "DashboardLayout";
20
- exports.DashboardLayout = DashboardLayout;
4
+ const react = require("react");
5
+ const clsx = require("./index38.cjs");
6
+ const useClickOutside = require("./index4.cjs");
7
+ const useEscapeKey = require("./index5.cjs");
8
+ const format = require("./index7.cjs");
9
+ const CustomRangePicker_module = require("./index61.cjs");
10
+ const formatInputValue = (iso) => {
11
+ if (!iso) return "";
12
+ const date = new Date(iso);
13
+ if (Number.isNaN(date.getTime())) return "";
14
+ const y = date.getFullYear();
15
+ const m = `${date.getMonth() + 1}`.padStart(2, "0");
16
+ const d = `${date.getDate()}`.padStart(2, "0");
17
+ const h = `${date.getHours()}`.padStart(2, "0");
18
+ const min = `${date.getMinutes()}`.padStart(2, "0");
19
+ return `${y}-${m}-${d}T${h}:${min}`;
20
+ };
21
+ const toLocalTimestamp = (value) => {
22
+ if (!value) return null;
23
+ const date = new Date(value);
24
+ if (Number.isNaN(date.getTime())) return null;
25
+ return format.formatLocalISOString(date);
26
+ };
27
+ const CustomRangePicker = ({ from, to, onApply }) => {
28
+ const [isOpen, setIsOpen] = react.useState(false);
29
+ const [startValue, setStartValue] = react.useState(() => formatInputValue(from));
30
+ const [endValue, setEndValue] = react.useState(() => formatInputValue(to));
31
+ const [error, setError] = react.useState(null);
32
+ const containerRef = react.useRef(null);
33
+ const isActive = Boolean(from && to);
34
+ const close = react.useCallback(() => setIsOpen(false), []);
35
+ useClickOutside.useClickOutside(containerRef, close);
36
+ useEscapeKey.useEscapeKey(close, isOpen);
37
+ react.useEffect(() => {
38
+ if (!isOpen) return;
39
+ setStartValue(formatInputValue(from));
40
+ setEndValue(formatInputValue(to));
41
+ setError(null);
42
+ }, [from, to, isOpen]);
43
+ const summary = react.useMemo(() => {
44
+ if (!from || !to) return null;
45
+ const s = new Date(from);
46
+ const e = new Date(to);
47
+ if (Number.isNaN(s.getTime()) || Number.isNaN(e.getTime())) return null;
48
+ const fmt = new Intl.DateTimeFormat(void 0, {
49
+ year: "numeric",
50
+ month: "short",
51
+ day: "numeric",
52
+ hour: "2-digit",
53
+ minute: "2-digit"
54
+ });
55
+ return `${fmt.format(s)} – ${fmt.format(e)}`;
56
+ }, [from, to]);
57
+ const handleApply = () => {
58
+ const startIso = toLocalTimestamp(startValue);
59
+ const endIso = toLocalTimestamp(endValue);
60
+ if (!startIso || !endIso) {
61
+ setError("Both start and end date are required.");
62
+ return;
63
+ }
64
+ if (startIso >= endIso) {
65
+ setError("End of range must be after the start.");
66
+ return;
67
+ }
68
+ onApply({ from: startIso, to: endIso });
69
+ setIsOpen(false);
70
+ };
71
+ const handleCancel = () => {
72
+ setStartValue(formatInputValue(from));
73
+ setEndValue(formatInputValue(to));
74
+ setError(null);
75
+ setIsOpen(false);
76
+ };
77
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: CustomRangePicker_module.default.root, ref: containerRef, children: [
78
+ /* @__PURE__ */ jsxRuntime.jsx(
79
+ "button",
80
+ {
81
+ type: "button",
82
+ className: clsx.clsx(CustomRangePicker_module.default.chip, { [CustomRangePicker_module.default.active]: isActive }),
83
+ onClick: () => setIsOpen((v) => !v),
84
+ children: "Custom"
85
+ }
86
+ ),
87
+ summary && /* @__PURE__ */ jsxRuntime.jsx("span", { className: CustomRangePicker_module.default.summary, children: summary }),
88
+ isOpen && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: CustomRangePicker_module.default.popover, role: "dialog", "aria-modal": "false", children: [
89
+ /* @__PURE__ */ jsxRuntime.jsx("header", { className: CustomRangePicker_module.default.popoverHeader, children: /* @__PURE__ */ jsxRuntime.jsx("h4", { children: "Custom Time Range" }) }),
90
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: CustomRangePicker_module.default.fields, children: [
91
+ /* @__PURE__ */ jsxRuntime.jsxs("label", { className: CustomRangePicker_module.default.field, children: [
92
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Start" }),
93
+ /* @__PURE__ */ jsxRuntime.jsx(
94
+ "input",
95
+ {
96
+ type: "datetime-local",
97
+ value: startValue,
98
+ onChange: (e) => setStartValue(e.target.value),
99
+ max: endValue || void 0
100
+ }
101
+ )
102
+ ] }),
103
+ /* @__PURE__ */ jsxRuntime.jsxs("label", { className: CustomRangePicker_module.default.field, children: [
104
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "End" }),
105
+ /* @__PURE__ */ jsxRuntime.jsx(
106
+ "input",
107
+ {
108
+ type: "datetime-local",
109
+ value: endValue,
110
+ onChange: (e) => setEndValue(e.target.value),
111
+ min: startValue || void 0
112
+ }
113
+ )
114
+ ] })
115
+ ] }),
116
+ error && /* @__PURE__ */ jsxRuntime.jsx("p", { className: CustomRangePicker_module.default.error, children: error }),
117
+ /* @__PURE__ */ jsxRuntime.jsxs("footer", { className: CustomRangePicker_module.default.actions, children: [
118
+ /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: CustomRangePicker_module.default.btnGhost, onClick: handleCancel, children: "Cancel" }),
119
+ /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: CustomRangePicker_module.default.btnPrimary, onClick: handleApply, children: "Apply" })
120
+ ] })
121
+ ] })
122
+ ] });
123
+ };
124
+ exports.CustomRangePicker = CustomRangePicker;
21
125
  //# sourceMappingURL=index20.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index20.cjs","sources":["../src/layouts/DashboardLayout/DashboardLayout.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { DashboardLayoutProps } from './DashboardLayout.types';\nimport styles from './DashboardLayout.module.css';\n\nexport const DashboardLayout = ({\n sidebar,\n filterBar,\n children,\n sidebarCollapsed = false,\n className,\n}: DashboardLayoutProps) => (\n <div className={clsx(styles.root, className)}>\n {sidebar && (\n <aside className={clsx(styles.sidebar, { [styles.sidebarCollapsed]: sidebarCollapsed })}>\n {sidebar}\n </aside>\n )}\n <main className={styles.main}>\n {filterBar && <div className={styles.filterBar}>{filterBar}</div>}\n <div className={styles.content}>{children}</div>\n </main>\n </div>\n);\n\nDashboardLayout.displayName = 'DashboardLayout';\n"],"names":["clsx","styles","jsx","jsxs"],"mappings":";;;;;AAIO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,sCACG,OAAA,EAAI,WAAWA,KAAAA,KAAKC,uBAAAA,QAAO,MAAM,SAAS,GACxC,UAAA;AAAA,EAAA,WACCC,2BAAAA,IAAC,SAAA,EAAM,WAAWF,KAAAA,KAAKC,uBAAAA,QAAO,SAAS,EAAE,CAACA,uBAAAA,QAAO,gBAAgB,GAAG,iBAAA,CAAkB,GACnF,UAAA,SACH;AAAA,EAEFE,2BAAAA,KAAC,QAAA,EAAK,WAAWF,uBAAAA,QAAO,MACrB,UAAA;AAAA,IAAA,aAAaC,2BAAAA,IAAC,OAAA,EAAI,WAAWD,uBAAAA,QAAO,WAAY,UAAA,WAAU;AAAA,IAC3DC,2BAAAA,IAAC,OAAA,EAAI,WAAWD,uBAAAA,QAAO,SAAU,SAAA,CAAS;AAAA,EAAA,EAAA,CAC5C;AAAA,EAAA,CACF;AAGF,gBAAgB,cAAc;;"}
1
+ {"version":3,"file":"index20.cjs","sources":["../src/composites/CustomRangePicker/CustomRangePicker.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, useCallback } from 'react';\nimport clsx from 'clsx';\nimport { useClickOutside } from '../../hooks/useClickOutside';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { formatLocalISOString } from '../../utils/format';\nimport styles from './CustomRangePicker.module.css';\n\nexport interface CustomRangePickerProps {\n /** Start of the current range (ISO string). */\n from?: string;\n /** End of the current range (ISO string). */\n to?: string;\n /** Called when user applies a valid range. */\n onApply: (range: { from: string; to: string }) => void;\n}\n\nconst formatInputValue = (iso?: string): string => {\n if (!iso) return '';\n const date = new Date(iso);\n if (Number.isNaN(date.getTime())) return '';\n const y = date.getFullYear();\n const m = `${date.getMonth() + 1}`.padStart(2, '0');\n const d = `${date.getDate()}`.padStart(2, '0');\n const h = `${date.getHours()}`.padStart(2, '0');\n const min = `${date.getMinutes()}`.padStart(2, '0');\n return `${y}-${m}-${d}T${h}:${min}`;\n};\n\nconst toLocalTimestamp = (value: string): string | null => {\n if (!value) return null;\n const date = new Date(value);\n if (Number.isNaN(date.getTime())) return null;\n return formatLocalISOString(date);\n};\n\nexport const CustomRangePicker = ({ from, to, onApply }: CustomRangePickerProps) => {\n const [isOpen, setIsOpen] = useState(false);\n const [startValue, setStartValue] = useState(() => formatInputValue(from));\n const [endValue, setEndValue] = useState(() => formatInputValue(to));\n const [error, setError] = useState<string | null>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n\n const isActive = Boolean(from && to);\n\n const close = useCallback(() => setIsOpen(false), []);\n useClickOutside(containerRef, close);\n useEscapeKey(close, isOpen);\n\n useEffect(() => {\n if (!isOpen) return;\n setStartValue(formatInputValue(from));\n setEndValue(formatInputValue(to));\n setError(null);\n }, [from, to, isOpen]);\n\n const summary = useMemo(() => {\n if (!from || !to) return null;\n const s = new Date(from);\n const e = new Date(to);\n if (Number.isNaN(s.getTime()) || Number.isNaN(e.getTime())) return null;\n const fmt = new Intl.DateTimeFormat(undefined, {\n year: 'numeric', month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit',\n });\n return `${fmt.format(s)} – ${fmt.format(e)}`;\n }, [from, to]);\n\n const handleApply = () => {\n const startIso = toLocalTimestamp(startValue);\n const endIso = toLocalTimestamp(endValue);\n if (!startIso || !endIso) {\n setError('Both start and end date are required.');\n return;\n }\n if (startIso >= endIso) {\n setError('End of range must be after the start.');\n return;\n }\n onApply({ from: startIso, to: endIso });\n setIsOpen(false);\n };\n\n const handleCancel = () => {\n setStartValue(formatInputValue(from));\n setEndValue(formatInputValue(to));\n setError(null);\n setIsOpen(false);\n };\n\n return (\n <div className={styles.root} ref={containerRef}>\n <button\n type=\"button\"\n className={clsx(styles.chip, { [styles.active]: isActive })}\n onClick={() => setIsOpen((v) => !v)}\n >\n Custom\n </button>\n {summary && <span className={styles.summary}>{summary}</span>}\n\n {isOpen && (\n <div className={styles.popover} role=\"dialog\" aria-modal=\"false\">\n <header className={styles.popoverHeader}>\n <h4>Custom Time Range</h4>\n </header>\n <div className={styles.fields}>\n <label className={styles.field}>\n <span>Start</span>\n <input\n type=\"datetime-local\"\n value={startValue}\n onChange={(e) => setStartValue(e.target.value)}\n max={endValue || undefined}\n />\n </label>\n <label className={styles.field}>\n <span>End</span>\n <input\n type=\"datetime-local\"\n value={endValue}\n onChange={(e) => setEndValue(e.target.value)}\n min={startValue || undefined}\n />\n </label>\n </div>\n {error && <p className={styles.error}>{error}</p>}\n <footer className={styles.actions}>\n <button type=\"button\" className={styles.btnGhost} onClick={handleCancel}>\n Cancel\n </button>\n <button type=\"button\" className={styles.btnPrimary} onClick={handleApply}>\n Apply\n </button>\n </footer>\n </div>\n )}\n </div>\n );\n};\n"],"names":["formatLocalISOString","useState","useRef","useCallback","useClickOutside","useEscapeKey","useEffect","useMemo","styles","jsx","clsx","jsxs"],"mappings":";;;;;;;;;AAgBA,MAAM,mBAAmB,CAAC,QAAyB;AACjD,MAAI,CAAC,IAAK,QAAO;AACjB,QAAM,OAAO,IAAI,KAAK,GAAG;AACzB,MAAI,OAAO,MAAM,KAAK,QAAA,CAAS,EAAG,QAAO;AACzC,QAAM,IAAI,KAAK,YAAA;AACf,QAAM,IAAI,GAAG,KAAK,SAAA,IAAa,CAAC,GAAG,SAAS,GAAG,GAAG;AAClD,QAAM,IAAI,GAAG,KAAK,QAAA,CAAS,GAAG,SAAS,GAAG,GAAG;AAC7C,QAAM,IAAI,GAAG,KAAK,SAAA,CAAU,GAAG,SAAS,GAAG,GAAG;AAC9C,QAAM,MAAM,GAAG,KAAK,WAAA,CAAY,GAAG,SAAS,GAAG,GAAG;AAClD,SAAO,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,GAAG;AACnC;AAEA,MAAM,mBAAmB,CAAC,UAAiC;AACzD,MAAI,CAAC,MAAO,QAAO;AACnB,QAAM,OAAO,IAAI,KAAK,KAAK;AAC3B,MAAI,OAAO,MAAM,KAAK,QAAA,CAAS,EAAG,QAAO;AACzC,SAAOA,OAAAA,qBAAqB,IAAI;AAClC;AAEO,MAAM,oBAAoB,CAAC,EAAE,MAAM,IAAI,cAAsC;AAClF,QAAM,CAAC,QAAQ,SAAS,IAAIC,MAAAA,SAAS,KAAK;AAC1C,QAAM,CAAC,YAAY,aAAa,IAAIA,MAAAA,SAAS,MAAM,iBAAiB,IAAI,CAAC;AACzE,QAAM,CAAC,UAAU,WAAW,IAAIA,MAAAA,SAAS,MAAM,iBAAiB,EAAE,CAAC;AACnE,QAAM,CAAC,OAAO,QAAQ,IAAIA,MAAAA,SAAwB,IAAI;AACtD,QAAM,eAAeC,MAAAA,OAAuB,IAAI;AAEhD,QAAM,WAAW,QAAQ,QAAQ,EAAE;AAEnC,QAAM,QAAQC,MAAAA,YAAY,MAAM,UAAU,KAAK,GAAG,CAAA,CAAE;AACpDC,kBAAAA,gBAAgB,cAAc,KAAK;AACnCC,eAAAA,aAAa,OAAO,MAAM;AAE1BC,QAAAA,UAAU,MAAM;AACd,QAAI,CAAC,OAAQ;AACb,kBAAc,iBAAiB,IAAI,CAAC;AACpC,gBAAY,iBAAiB,EAAE,CAAC;AAChC,aAAS,IAAI;AAAA,EACf,GAAG,CAAC,MAAM,IAAI,MAAM,CAAC;AAErB,QAAM,UAAUC,MAAAA,QAAQ,MAAM;AAC5B,QAAI,CAAC,QAAQ,CAAC,GAAI,QAAO;AACzB,UAAM,IAAI,IAAI,KAAK,IAAI;AACvB,UAAM,IAAI,IAAI,KAAK,EAAE;AACrB,QAAI,OAAO,MAAM,EAAE,QAAA,CAAS,KAAK,OAAO,MAAM,EAAE,QAAA,CAAS,EAAG,QAAO;AACnE,UAAM,MAAM,IAAI,KAAK,eAAe,QAAW;AAAA,MAC7C,MAAM;AAAA,MAAW,OAAO;AAAA,MAAS,KAAK;AAAA,MAAW,MAAM;AAAA,MAAW,QAAQ;AAAA,IAAA,CAC3E;AACD,WAAO,GAAG,IAAI,OAAO,CAAC,CAAC,MAAM,IAAI,OAAO,CAAC,CAAC;AAAA,EAC5C,GAAG,CAAC,MAAM,EAAE,CAAC;AAEb,QAAM,cAAc,MAAM;AACxB,UAAM,WAAW,iBAAiB,UAAU;AAC5C,UAAM,SAAS,iBAAiB,QAAQ;AACxC,QAAI,CAAC,YAAY,CAAC,QAAQ;AACxB,eAAS,uCAAuC;AAChD;AAAA,IACF;AACA,QAAI,YAAY,QAAQ;AACtB,eAAS,uCAAuC;AAChD;AAAA,IACF;AACA,YAAQ,EAAE,MAAM,UAAU,IAAI,QAAQ;AACtC,cAAU,KAAK;AAAA,EACjB;AAEA,QAAM,eAAe,MAAM;AACzB,kBAAc,iBAAiB,IAAI,CAAC;AACpC,gBAAY,iBAAiB,EAAE,CAAC;AAChC,aAAS,IAAI;AACb,cAAU,KAAK;AAAA,EACjB;AAEA,yCACG,OAAA,EAAI,WAAWC,yBAAAA,QAAO,MAAM,KAAK,cAChC,UAAA;AAAA,IAAAC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAWC,KAAAA,KAAKF,yBAAAA,QAAO,MAAM,EAAE,CAACA,iCAAO,MAAM,GAAG,UAAU;AAAA,QAC1D,SAAS,MAAM,UAAU,CAAC,MAAM,CAAC,CAAC;AAAA,QACnC,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAGA,WAAWC,2BAAAA,IAAC,QAAA,EAAK,WAAWD,yBAAAA,QAAO,SAAU,UAAA,SAAQ;AAAA,IAErD,0CACE,OAAA,EAAI,WAAWA,yBAAAA,QAAO,SAAS,MAAK,UAAS,cAAW,SACvD,UAAA;AAAA,MAAAC,2BAAAA,IAAC,YAAO,WAAWD,yBAAAA,QAAO,eACxB,UAAAC,2BAAAA,IAAC,MAAA,EAAG,+BAAiB,EAAA,CACvB;AAAA,MACAE,2BAAAA,KAAC,OAAA,EAAI,WAAWH,yBAAAA,QAAO,QACrB,UAAA;AAAA,QAAAG,2BAAAA,KAAC,SAAA,EAAM,WAAWH,yBAAAA,QAAO,OACvB,UAAA;AAAA,UAAAC,2BAAAA,IAAC,UAAK,UAAA,QAAA,CAAK;AAAA,UACXA,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,OAAO;AAAA,cACP,UAAU,CAAC,MAAM,cAAc,EAAE,OAAO,KAAK;AAAA,cAC7C,KAAK,YAAY;AAAA,YAAA;AAAA,UAAA;AAAA,QACnB,GACF;AAAA,QACAE,2BAAAA,KAAC,SAAA,EAAM,WAAWH,yBAAAA,QAAO,OACvB,UAAA;AAAA,UAAAC,2BAAAA,IAAC,UAAK,UAAA,MAAA,CAAG;AAAA,UACTA,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,OAAO;AAAA,cACP,UAAU,CAAC,MAAM,YAAY,EAAE,OAAO,KAAK;AAAA,cAC3C,KAAK,cAAc;AAAA,YAAA;AAAA,UAAA;AAAA,QACrB,EAAA,CACF;AAAA,MAAA,GACF;AAAA,MACC,SAASA,2BAAAA,IAAC,KAAA,EAAE,WAAWD,yBAAAA,QAAO,OAAQ,UAAA,OAAM;AAAA,MAC7CG,2BAAAA,KAAC,UAAA,EAAO,WAAWH,yBAAAA,QAAO,SACxB,UAAA;AAAA,QAAAC,2BAAAA,IAAC,UAAA,EAAO,MAAK,UAAS,WAAWD,iCAAO,UAAU,SAAS,cAAc,UAAA,SAAA,CAEzE;AAAA,QACAC,2BAAAA,IAAC,YAAO,MAAK,UAAS,WAAWD,iCAAO,YAAY,SAAS,aAAa,UAAA,QAAA,CAE1E;AAAA,MAAA,EAAA,CACF;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GAEJ;AAEJ;;"}
package/dist/index20.js CHANGED
@@ -1,21 +1,125 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import { clsx } from "./index36.js";
3
- import styles from "./index63.js";
4
- const DashboardLayout = ({
5
- sidebar,
6
- filterBar,
7
- children,
8
- sidebarCollapsed = false,
9
- className
10
- }) => /* @__PURE__ */ jsxs("div", { className: clsx(styles.root, className), children: [
11
- sidebar && /* @__PURE__ */ jsx("aside", { className: clsx(styles.sidebar, { [styles.sidebarCollapsed]: sidebarCollapsed }), children: sidebar }),
12
- /* @__PURE__ */ jsxs("main", { className: styles.main, children: [
13
- filterBar && /* @__PURE__ */ jsx("div", { className: styles.filterBar, children: filterBar }),
14
- /* @__PURE__ */ jsx("div", { className: styles.content, children })
15
- ] })
16
- ] });
17
- DashboardLayout.displayName = "DashboardLayout";
2
+ import { useState, useRef, useCallback, useEffect, useMemo } from "react";
3
+ import { clsx } from "./index38.js";
4
+ import { useClickOutside } from "./index4.js";
5
+ import { useEscapeKey } from "./index5.js";
6
+ import { formatLocalISOString } from "./index7.js";
7
+ import styles from "./index61.js";
8
+ const formatInputValue = (iso) => {
9
+ if (!iso) return "";
10
+ const date = new Date(iso);
11
+ if (Number.isNaN(date.getTime())) return "";
12
+ const y = date.getFullYear();
13
+ const m = `${date.getMonth() + 1}`.padStart(2, "0");
14
+ const d = `${date.getDate()}`.padStart(2, "0");
15
+ const h = `${date.getHours()}`.padStart(2, "0");
16
+ const min = `${date.getMinutes()}`.padStart(2, "0");
17
+ return `${y}-${m}-${d}T${h}:${min}`;
18
+ };
19
+ const toLocalTimestamp = (value) => {
20
+ if (!value) return null;
21
+ const date = new Date(value);
22
+ if (Number.isNaN(date.getTime())) return null;
23
+ return formatLocalISOString(date);
24
+ };
25
+ const CustomRangePicker = ({ from, to, onApply }) => {
26
+ const [isOpen, setIsOpen] = useState(false);
27
+ const [startValue, setStartValue] = useState(() => formatInputValue(from));
28
+ const [endValue, setEndValue] = useState(() => formatInputValue(to));
29
+ const [error, setError] = useState(null);
30
+ const containerRef = useRef(null);
31
+ const isActive = Boolean(from && to);
32
+ const close = useCallback(() => setIsOpen(false), []);
33
+ useClickOutside(containerRef, close);
34
+ useEscapeKey(close, isOpen);
35
+ useEffect(() => {
36
+ if (!isOpen) return;
37
+ setStartValue(formatInputValue(from));
38
+ setEndValue(formatInputValue(to));
39
+ setError(null);
40
+ }, [from, to, isOpen]);
41
+ const summary = useMemo(() => {
42
+ if (!from || !to) return null;
43
+ const s = new Date(from);
44
+ const e = new Date(to);
45
+ if (Number.isNaN(s.getTime()) || Number.isNaN(e.getTime())) return null;
46
+ const fmt = new Intl.DateTimeFormat(void 0, {
47
+ year: "numeric",
48
+ month: "short",
49
+ day: "numeric",
50
+ hour: "2-digit",
51
+ minute: "2-digit"
52
+ });
53
+ return `${fmt.format(s)} – ${fmt.format(e)}`;
54
+ }, [from, to]);
55
+ const handleApply = () => {
56
+ const startIso = toLocalTimestamp(startValue);
57
+ const endIso = toLocalTimestamp(endValue);
58
+ if (!startIso || !endIso) {
59
+ setError("Both start and end date are required.");
60
+ return;
61
+ }
62
+ if (startIso >= endIso) {
63
+ setError("End of range must be after the start.");
64
+ return;
65
+ }
66
+ onApply({ from: startIso, to: endIso });
67
+ setIsOpen(false);
68
+ };
69
+ const handleCancel = () => {
70
+ setStartValue(formatInputValue(from));
71
+ setEndValue(formatInputValue(to));
72
+ setError(null);
73
+ setIsOpen(false);
74
+ };
75
+ return /* @__PURE__ */ jsxs("div", { className: styles.root, ref: containerRef, children: [
76
+ /* @__PURE__ */ jsx(
77
+ "button",
78
+ {
79
+ type: "button",
80
+ className: clsx(styles.chip, { [styles.active]: isActive }),
81
+ onClick: () => setIsOpen((v) => !v),
82
+ children: "Custom"
83
+ }
84
+ ),
85
+ summary && /* @__PURE__ */ jsx("span", { className: styles.summary, children: summary }),
86
+ isOpen && /* @__PURE__ */ jsxs("div", { className: styles.popover, role: "dialog", "aria-modal": "false", children: [
87
+ /* @__PURE__ */ jsx("header", { className: styles.popoverHeader, children: /* @__PURE__ */ jsx("h4", { children: "Custom Time Range" }) }),
88
+ /* @__PURE__ */ jsxs("div", { className: styles.fields, children: [
89
+ /* @__PURE__ */ jsxs("label", { className: styles.field, children: [
90
+ /* @__PURE__ */ jsx("span", { children: "Start" }),
91
+ /* @__PURE__ */ jsx(
92
+ "input",
93
+ {
94
+ type: "datetime-local",
95
+ value: startValue,
96
+ onChange: (e) => setStartValue(e.target.value),
97
+ max: endValue || void 0
98
+ }
99
+ )
100
+ ] }),
101
+ /* @__PURE__ */ jsxs("label", { className: styles.field, children: [
102
+ /* @__PURE__ */ jsx("span", { children: "End" }),
103
+ /* @__PURE__ */ jsx(
104
+ "input",
105
+ {
106
+ type: "datetime-local",
107
+ value: endValue,
108
+ onChange: (e) => setEndValue(e.target.value),
109
+ min: startValue || void 0
110
+ }
111
+ )
112
+ ] })
113
+ ] }),
114
+ error && /* @__PURE__ */ jsx("p", { className: styles.error, children: error }),
115
+ /* @__PURE__ */ jsxs("footer", { className: styles.actions, children: [
116
+ /* @__PURE__ */ jsx("button", { type: "button", className: styles.btnGhost, onClick: handleCancel, children: "Cancel" }),
117
+ /* @__PURE__ */ jsx("button", { type: "button", className: styles.btnPrimary, onClick: handleApply, children: "Apply" })
118
+ ] })
119
+ ] })
120
+ ] });
121
+ };
18
122
  export {
19
- DashboardLayout
123
+ CustomRangePicker
20
124
  };
21
125
  //# sourceMappingURL=index20.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index20.js","sources":["../src/layouts/DashboardLayout/DashboardLayout.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { DashboardLayoutProps } from './DashboardLayout.types';\nimport styles from './DashboardLayout.module.css';\n\nexport const DashboardLayout = ({\n sidebar,\n filterBar,\n children,\n sidebarCollapsed = false,\n className,\n}: DashboardLayoutProps) => (\n <div className={clsx(styles.root, className)}>\n {sidebar && (\n <aside className={clsx(styles.sidebar, { [styles.sidebarCollapsed]: sidebarCollapsed })}>\n {sidebar}\n </aside>\n )}\n <main className={styles.main}>\n {filterBar && <div className={styles.filterBar}>{filterBar}</div>}\n <div className={styles.content}>{children}</div>\n </main>\n </div>\n);\n\nDashboardLayout.displayName = 'DashboardLayout';\n"],"names":[],"mappings":";;;AAIO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,2BACG,OAAA,EAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GACxC,UAAA;AAAA,EAAA,WACC,oBAAC,SAAA,EAAM,WAAW,KAAK,OAAO,SAAS,EAAE,CAAC,OAAO,gBAAgB,GAAG,iBAAA,CAAkB,GACnF,UAAA,SACH;AAAA,EAEF,qBAAC,QAAA,EAAK,WAAW,OAAO,MACrB,UAAA;AAAA,IAAA,aAAa,oBAAC,OAAA,EAAI,WAAW,OAAO,WAAY,UAAA,WAAU;AAAA,IAC3D,oBAAC,OAAA,EAAI,WAAW,OAAO,SAAU,SAAA,CAAS;AAAA,EAAA,EAAA,CAC5C;AAAA,EAAA,CACF;AAGF,gBAAgB,cAAc;"}
1
+ {"version":3,"file":"index20.js","sources":["../src/composites/CustomRangePicker/CustomRangePicker.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState, useCallback } from 'react';\nimport clsx from 'clsx';\nimport { useClickOutside } from '../../hooks/useClickOutside';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\nimport { formatLocalISOString } from '../../utils/format';\nimport styles from './CustomRangePicker.module.css';\n\nexport interface CustomRangePickerProps {\n /** Start of the current range (ISO string). */\n from?: string;\n /** End of the current range (ISO string). */\n to?: string;\n /** Called when user applies a valid range. */\n onApply: (range: { from: string; to: string }) => void;\n}\n\nconst formatInputValue = (iso?: string): string => {\n if (!iso) return '';\n const date = new Date(iso);\n if (Number.isNaN(date.getTime())) return '';\n const y = date.getFullYear();\n const m = `${date.getMonth() + 1}`.padStart(2, '0');\n const d = `${date.getDate()}`.padStart(2, '0');\n const h = `${date.getHours()}`.padStart(2, '0');\n const min = `${date.getMinutes()}`.padStart(2, '0');\n return `${y}-${m}-${d}T${h}:${min}`;\n};\n\nconst toLocalTimestamp = (value: string): string | null => {\n if (!value) return null;\n const date = new Date(value);\n if (Number.isNaN(date.getTime())) return null;\n return formatLocalISOString(date);\n};\n\nexport const CustomRangePicker = ({ from, to, onApply }: CustomRangePickerProps) => {\n const [isOpen, setIsOpen] = useState(false);\n const [startValue, setStartValue] = useState(() => formatInputValue(from));\n const [endValue, setEndValue] = useState(() => formatInputValue(to));\n const [error, setError] = useState<string | null>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n\n const isActive = Boolean(from && to);\n\n const close = useCallback(() => setIsOpen(false), []);\n useClickOutside(containerRef, close);\n useEscapeKey(close, isOpen);\n\n useEffect(() => {\n if (!isOpen) return;\n setStartValue(formatInputValue(from));\n setEndValue(formatInputValue(to));\n setError(null);\n }, [from, to, isOpen]);\n\n const summary = useMemo(() => {\n if (!from || !to) return null;\n const s = new Date(from);\n const e = new Date(to);\n if (Number.isNaN(s.getTime()) || Number.isNaN(e.getTime())) return null;\n const fmt = new Intl.DateTimeFormat(undefined, {\n year: 'numeric', month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit',\n });\n return `${fmt.format(s)} – ${fmt.format(e)}`;\n }, [from, to]);\n\n const handleApply = () => {\n const startIso = toLocalTimestamp(startValue);\n const endIso = toLocalTimestamp(endValue);\n if (!startIso || !endIso) {\n setError('Both start and end date are required.');\n return;\n }\n if (startIso >= endIso) {\n setError('End of range must be after the start.');\n return;\n }\n onApply({ from: startIso, to: endIso });\n setIsOpen(false);\n };\n\n const handleCancel = () => {\n setStartValue(formatInputValue(from));\n setEndValue(formatInputValue(to));\n setError(null);\n setIsOpen(false);\n };\n\n return (\n <div className={styles.root} ref={containerRef}>\n <button\n type=\"button\"\n className={clsx(styles.chip, { [styles.active]: isActive })}\n onClick={() => setIsOpen((v) => !v)}\n >\n Custom\n </button>\n {summary && <span className={styles.summary}>{summary}</span>}\n\n {isOpen && (\n <div className={styles.popover} role=\"dialog\" aria-modal=\"false\">\n <header className={styles.popoverHeader}>\n <h4>Custom Time Range</h4>\n </header>\n <div className={styles.fields}>\n <label className={styles.field}>\n <span>Start</span>\n <input\n type=\"datetime-local\"\n value={startValue}\n onChange={(e) => setStartValue(e.target.value)}\n max={endValue || undefined}\n />\n </label>\n <label className={styles.field}>\n <span>End</span>\n <input\n type=\"datetime-local\"\n value={endValue}\n onChange={(e) => setEndValue(e.target.value)}\n min={startValue || undefined}\n />\n </label>\n </div>\n {error && <p className={styles.error}>{error}</p>}\n <footer className={styles.actions}>\n <button type=\"button\" className={styles.btnGhost} onClick={handleCancel}>\n Cancel\n </button>\n <button type=\"button\" className={styles.btnPrimary} onClick={handleApply}>\n Apply\n </button>\n </footer>\n </div>\n )}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
package/dist/index21.cjs CHANGED
@@ -1,12 +1,21 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const jsxRuntime = require("react/jsx-runtime");
4
- const react = require("react");
5
- const clsx = require("./index36.cjs");
6
- const Input_module = require("./index47.cjs");
7
- const Input = react.forwardRef(
8
- ({ className, type = "text", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("input", { ref, type, className: clsx.clsx(Input_module.default.root, className), ...props })
9
- );
10
- Input.displayName = "Input";
11
- exports.Input = Input;
4
+ const clsx = require("./index38.cjs");
5
+ const DashboardLayout_module = require("./index62.cjs");
6
+ const DashboardLayout = ({
7
+ sidebar,
8
+ filterBar,
9
+ children,
10
+ sidebarCollapsed = false,
11
+ className
12
+ }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx(DashboardLayout_module.default.root, className), children: [
13
+ sidebar && /* @__PURE__ */ jsxRuntime.jsx("aside", { className: clsx.clsx(DashboardLayout_module.default.sidebar, { [DashboardLayout_module.default.sidebarCollapsed]: sidebarCollapsed }), children: sidebar }),
14
+ /* @__PURE__ */ jsxRuntime.jsxs("main", { className: DashboardLayout_module.default.main, children: [
15
+ filterBar && /* @__PURE__ */ jsxRuntime.jsx("div", { className: DashboardLayout_module.default.filterBar, children: filterBar }),
16
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: DashboardLayout_module.default.content, children })
17
+ ] })
18
+ ] });
19
+ DashboardLayout.displayName = "DashboardLayout";
20
+ exports.DashboardLayout = DashboardLayout;
12
21
  //# sourceMappingURL=index21.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index21.cjs","sources":["../src/primitives/Input/Input.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport clsx from 'clsx';\nimport styles from './Input.module.css';\n\nexport interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n ({ className, type = 'text', ...props }, ref) => (\n <input ref={ref} type={type} className={clsx(styles.root, className)} {...props} />\n ),\n);\n\nInput.displayName = 'Input';\n"],"names":["forwardRef","jsx","clsx","styles"],"mappings":";;;;;;AAMO,MAAM,QAAQA,MAAAA;AAAAA,EACnB,CAAC,EAAE,WAAW,OAAO,QAAQ,GAAG,SAAS,QACvCC,2BAAAA,IAAC,WAAM,KAAU,MAAY,WAAWC,UAAKC,aAAAA,QAAO,MAAM,SAAS,GAAI,GAAG,MAAA,CAAO;AAErF;AAEA,MAAM,cAAc;;"}
1
+ {"version":3,"file":"index21.cjs","sources":["../src/layouts/DashboardLayout/DashboardLayout.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { DashboardLayoutProps } from './DashboardLayout.types';\nimport styles from './DashboardLayout.module.css';\n\nexport const DashboardLayout = ({\n sidebar,\n filterBar,\n children,\n sidebarCollapsed = false,\n className,\n}: DashboardLayoutProps) => (\n <div className={clsx(styles.root, className)}>\n {sidebar && (\n <aside className={clsx(styles.sidebar, { [styles.sidebarCollapsed]: sidebarCollapsed })}>\n {sidebar}\n </aside>\n )}\n <main className={styles.main}>\n {filterBar && <div className={styles.filterBar}>{filterBar}</div>}\n <div className={styles.content}>{children}</div>\n </main>\n </div>\n);\n\nDashboardLayout.displayName = 'DashboardLayout';\n"],"names":["clsx","styles","jsx","jsxs"],"mappings":";;;;;AAIO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,sCACG,OAAA,EAAI,WAAWA,KAAAA,KAAKC,uBAAAA,QAAO,MAAM,SAAS,GACxC,UAAA;AAAA,EAAA,WACCC,2BAAAA,IAAC,SAAA,EAAM,WAAWF,KAAAA,KAAKC,uBAAAA,QAAO,SAAS,EAAE,CAACA,uBAAAA,QAAO,gBAAgB,GAAG,iBAAA,CAAkB,GACnF,UAAA,SACH;AAAA,EAEFE,2BAAAA,KAAC,QAAA,EAAK,WAAWF,uBAAAA,QAAO,MACrB,UAAA;AAAA,IAAA,aAAaC,2BAAAA,IAAC,OAAA,EAAI,WAAWD,uBAAAA,QAAO,WAAY,UAAA,WAAU;AAAA,IAC3DC,2BAAAA,IAAC,OAAA,EAAI,WAAWD,uBAAAA,QAAO,SAAU,SAAA,CAAS;AAAA,EAAA,EAAA,CAC5C;AAAA,EAAA,CACF;AAGF,gBAAgB,cAAc;;"}
package/dist/index21.js CHANGED
@@ -1,12 +1,21 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import { forwardRef } from "react";
3
- import { clsx } from "./index36.js";
4
- import styles from "./index47.js";
5
- const Input = forwardRef(
6
- ({ className, type = "text", ...props }, ref) => /* @__PURE__ */ jsx("input", { ref, type, className: clsx(styles.root, className), ...props })
7
- );
8
- Input.displayName = "Input";
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
+ import { clsx } from "./index38.js";
3
+ import styles from "./index62.js";
4
+ const DashboardLayout = ({
5
+ sidebar,
6
+ filterBar,
7
+ children,
8
+ sidebarCollapsed = false,
9
+ className
10
+ }) => /* @__PURE__ */ jsxs("div", { className: clsx(styles.root, className), children: [
11
+ sidebar && /* @__PURE__ */ jsx("aside", { className: clsx(styles.sidebar, { [styles.sidebarCollapsed]: sidebarCollapsed }), children: sidebar }),
12
+ /* @__PURE__ */ jsxs("main", { className: styles.main, children: [
13
+ filterBar && /* @__PURE__ */ jsx("div", { className: styles.filterBar, children: filterBar }),
14
+ /* @__PURE__ */ jsx("div", { className: styles.content, children })
15
+ ] })
16
+ ] });
17
+ DashboardLayout.displayName = "DashboardLayout";
9
18
  export {
10
- Input
19
+ DashboardLayout
11
20
  };
12
21
  //# sourceMappingURL=index21.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index21.js","sources":["../src/primitives/Input/Input.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport clsx from 'clsx';\nimport styles from './Input.module.css';\n\nexport interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(\n ({ className, type = 'text', ...props }, ref) => (\n <input ref={ref} type={type} className={clsx(styles.root, className)} {...props} />\n ),\n);\n\nInput.displayName = 'Input';\n"],"names":[],"mappings":";;;;AAMO,MAAM,QAAQ;AAAA,EACnB,CAAC,EAAE,WAAW,OAAO,QAAQ,GAAG,SAAS,QACvC,oBAAC,WAAM,KAAU,MAAY,WAAW,KAAK,OAAO,MAAM,SAAS,GAAI,GAAG,MAAA,CAAO;AAErF;AAEA,MAAM,cAAc;"}
1
+ {"version":3,"file":"index21.js","sources":["../src/layouts/DashboardLayout/DashboardLayout.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { DashboardLayoutProps } from './DashboardLayout.types';\nimport styles from './DashboardLayout.module.css';\n\nexport const DashboardLayout = ({\n sidebar,\n filterBar,\n children,\n sidebarCollapsed = false,\n className,\n}: DashboardLayoutProps) => (\n <div className={clsx(styles.root, className)}>\n {sidebar && (\n <aside className={clsx(styles.sidebar, { [styles.sidebarCollapsed]: sidebarCollapsed })}>\n {sidebar}\n </aside>\n )}\n <main className={styles.main}>\n {filterBar && <div className={styles.filterBar}>{filterBar}</div>}\n <div className={styles.content}>{children}</div>\n </main>\n </div>\n);\n\nDashboardLayout.displayName = 'DashboardLayout';\n"],"names":[],"mappings":";;;AAIO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA,mBAAmB;AAAA,EACnB;AACF,2BACG,OAAA,EAAI,WAAW,KAAK,OAAO,MAAM,SAAS,GACxC,UAAA;AAAA,EAAA,WACC,oBAAC,SAAA,EAAM,WAAW,KAAK,OAAO,SAAS,EAAE,CAAC,OAAO,gBAAgB,GAAG,iBAAA,CAAkB,GACnF,UAAA,SACH;AAAA,EAEF,qBAAC,QAAA,EAAK,WAAW,OAAO,MACrB,UAAA;AAAA,IAAA,aAAa,oBAAC,OAAA,EAAI,WAAW,OAAO,WAAY,UAAA,WAAU;AAAA,IAC3D,oBAAC,OAAA,EAAI,WAAW,OAAO,SAAU,SAAA,CAAS;AAAA,EAAA,EAAA,CAC5C;AAAA,EAAA,CACF;AAGF,gBAAgB,cAAc;"}