asterui 0.11.0 → 0.12.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.
- package/README.md +1 -103
- package/dist/components/Anchor.d.ts +45 -0
- package/dist/components/Diff.d.ts +12 -0
- package/dist/components/Form.d.ts +27 -2
- package/dist/components/Kbd.d.ts +8 -0
- package/dist/components/Radio.d.ts +7 -1
- package/dist/components/Status.d.ts +18 -0
- package/dist/components/TextRotate.d.ts +13 -0
- package/dist/index.d.ts +12 -2
- package/dist/index.js +210 -200
- package/dist/index.js.map +1 -1
- package/dist/index10.js +92 -30
- package/dist/index10.js.map +1 -1
- package/dist/index100.js +8 -5
- package/dist/index100.js.map +1 -1
- package/dist/index101.js +12 -41
- package/dist/index101.js.map +1 -1
- package/dist/index102.js +31 -2
- package/dist/index102.js.map +1 -1
- package/dist/index103.js +17 -6
- package/dist/index103.js.map +1 -1
- package/dist/index104.js +10788 -147
- package/dist/index104.js.map +1 -1
- package/dist/index105.js +5 -30
- package/dist/index105.js.map +1 -1
- package/dist/index106.js +39 -27
- package/dist/index106.js.map +1 -1
- package/dist/index108.js +6 -71
- package/dist/index108.js.map +1 -1
- package/dist/index109.js +147 -34
- package/dist/index109.js.map +1 -1
- package/dist/index11.js +28 -263
- package/dist/index11.js.map +1 -1
- package/dist/index110.js +28 -24
- package/dist/index110.js.map +1 -1
- package/dist/index111.js +28 -19
- package/dist/index111.js.map +1 -1
- package/dist/index112.js +2 -24
- package/dist/index112.js.map +1 -1
- package/dist/index113.js +71 -19
- package/dist/index113.js.map +1 -1
- package/dist/index114.js +33 -94
- package/dist/index114.js.map +1 -1
- package/dist/index115.js +24 -358
- package/dist/index115.js.map +1 -1
- package/dist/index116.js +19 -23
- package/dist/index116.js.map +1 -1
- package/dist/index117.js +22 -71
- package/dist/index117.js.map +1 -1
- package/dist/index118.js +17 -13
- package/dist/index118.js.map +1 -1
- package/dist/index119.js +91 -57
- package/dist/index119.js.map +1 -1
- package/dist/index12.js +259 -89
- package/dist/index12.js.map +1 -1
- package/dist/index120.js +357 -141
- package/dist/index120.js.map +1 -1
- package/dist/index121.js +25 -2
- package/dist/index121.js.map +1 -1
- package/dist/index122.js +70 -53
- package/dist/index122.js.map +1 -1
- package/dist/index123.js +16 -2
- package/dist/index123.js.map +1 -1
- package/dist/index124.js +66 -2
- package/dist/index124.js.map +1 -1
- package/dist/index125.js +144 -2
- package/dist/index125.js.map +1 -1
- package/dist/index126.js +2 -2
- package/dist/index127.js +56 -2
- package/dist/index127.js.map +1 -1
- package/dist/index13.js +90 -153
- package/dist/index13.js.map +1 -1
- package/dist/index130.js +2 -32
- package/dist/index130.js.map +1 -1
- package/dist/index132.js +2 -8
- package/dist/index132.js.map +1 -1
- package/dist/index133.js +2 -2
- package/dist/index134.js +2 -2
- package/dist/index135.js +2 -21
- package/dist/index135.js.map +1 -1
- package/dist/index136.js +32 -2
- package/dist/index136.js.map +1 -1
- package/dist/index137.js +2 -24
- package/dist/index137.js.map +1 -1
- package/dist/index138.js +7 -70
- package/dist/index138.js.map +1 -1
- package/dist/index139.js +2 -21
- package/dist/index139.js.map +1 -1
- package/dist/index14.js +154 -146
- package/dist/index14.js.map +1 -1
- package/dist/index140.js +2 -34
- package/dist/index140.js.map +1 -1
- package/dist/index141.js +20 -69
- package/dist/index141.js.map +1 -1
- package/dist/index142.js +2 -2
- package/dist/index143.js +24 -2
- package/dist/index143.js.map +1 -1
- package/dist/index144.js +70 -21
- package/dist/index144.js.map +1 -1
- package/dist/index145.js +21 -2
- package/dist/index145.js.map +1 -1
- package/dist/index146.js +34 -2
- package/dist/index146.js.map +1 -1
- package/dist/index147.js +70 -2
- package/dist/index147.js.map +1 -1
- package/dist/index148.js +2 -2
- package/dist/index149.js +21 -3
- package/dist/index149.js.map +1 -1
- package/dist/index15.js +150 -5
- package/dist/index15.js.map +1 -1
- package/dist/index150.js +5 -0
- package/dist/index150.js.map +1 -0
- package/dist/index151.js +5 -0
- package/dist/index151.js.map +1 -0
- package/dist/index152.js +5 -0
- package/dist/index152.js.map +1 -0
- package/dist/index153.js +5 -0
- package/dist/index153.js.map +1 -0
- package/dist/index154.js +7 -0
- package/dist/index154.js.map +1 -0
- package/dist/index16.js +5 -71
- package/dist/index16.js.map +1 -1
- package/dist/index17.js +71 -17
- package/dist/index17.js.map +1 -1
- package/dist/index18.js +15 -96
- package/dist/index18.js.map +1 -1
- package/dist/index19.js +89 -105
- package/dist/index19.js.map +1 -1
- package/dist/index20.js +107 -177
- package/dist/index20.js.map +1 -1
- package/dist/index21.js +181 -107
- package/dist/index21.js.map +1 -1
- package/dist/index22.js +107 -29
- package/dist/index22.js.map +1 -1
- package/dist/index23.js +19 -41
- package/dist/index23.js.map +1 -1
- package/dist/index24.js +31 -11
- package/dist/index24.js.map +1 -1
- package/dist/index25.js +41 -33
- package/dist/index25.js.map +1 -1
- package/dist/index26.js +12 -63
- package/dist/index26.js.map +1 -1
- package/dist/index27.js +33 -80
- package/dist/index27.js.map +1 -1
- package/dist/index28.js +63 -18
- package/dist/index28.js.map +1 -1
- package/dist/index29.js +78 -159
- package/dist/index29.js.map +1 -1
- package/dist/index3.js +96 -27
- package/dist/index3.js.map +1 -1
- package/dist/index30.js +16 -1080
- package/dist/index30.js.map +1 -1
- package/dist/index31.js +218 -16
- package/dist/index31.js.map +1 -1
- package/dist/index32.js +1081 -121
- package/dist/index32.js.map +1 -1
- package/dist/index33.js +17 -39
- package/dist/index33.js.map +1 -1
- package/dist/index34.js +121 -190
- package/dist/index34.js.map +1 -1
- package/dist/index35.js +37 -94
- package/dist/index35.js.map +1 -1
- package/dist/index36.js +186 -157
- package/dist/index36.js.map +1 -1
- package/dist/index37.js +89 -138
- package/dist/index37.js.map +1 -1
- package/dist/index38.js +161 -14
- package/dist/index38.js.map +1 -1
- package/dist/index39.js +146 -21
- package/dist/index39.js.map +1 -1
- package/dist/index4.js +26 -99
- package/dist/index4.js.map +1 -1
- package/dist/index40.js +12 -116
- package/dist/index40.js.map +1 -1
- package/dist/index41.js +18 -13
- package/dist/index41.js.map +1 -1
- package/dist/index42.js +21 -35
- package/dist/index42.js.map +1 -1
- package/dist/index43.js +117 -114
- package/dist/index43.js.map +1 -1
- package/dist/index44.js +13 -176
- package/dist/index44.js.map +1 -1
- package/dist/index45.js +34 -146
- package/dist/index45.js.map +1 -1
- package/dist/index46.js +116 -12
- package/dist/index46.js.map +1 -1
- package/dist/index47.js +176 -22
- package/dist/index47.js.map +1 -1
- package/dist/index48.js +147 -14
- package/dist/index48.js.map +1 -1
- package/dist/index49.js +10 -5
- package/dist/index49.js.map +1 -1
- package/dist/index5.js +100 -60
- package/dist/index5.js.map +1 -1
- package/dist/index50.js +21 -265
- package/dist/index50.js.map +1 -1
- package/dist/index51.js +10 -13
- package/dist/index51.js.map +1 -1
- package/dist/index52.js +7 -122
- package/dist/index52.js.map +1 -1
- package/dist/index53.js +262 -106
- package/dist/index53.js.map +1 -1
- package/dist/index54.js +14 -167
- package/dist/index54.js.map +1 -1
- package/dist/index55.js +121 -31
- package/dist/index55.js.map +1 -1
- package/dist/index56.js +107 -119
- package/dist/index56.js.map +1 -1
- package/dist/index57.js +161 -77
- package/dist/index57.js.map +1 -1
- package/dist/index58.js +31 -19
- package/dist/index58.js.map +1 -1
- package/dist/index59.js +117 -69
- package/dist/index59.js.map +1 -1
- package/dist/index6.js +61 -130
- package/dist/index6.js.map +1 -1
- package/dist/index60.js +82 -53
- package/dist/index60.js.map +1 -1
- package/dist/index61.js +19 -44
- package/dist/index61.js.map +1 -1
- package/dist/index62.js +70 -48
- package/dist/index62.js.map +1 -1
- package/dist/index63.js +55 -60
- package/dist/index63.js.map +1 -1
- package/dist/index64.js +39 -101
- package/dist/index64.js.map +1 -1
- package/dist/index65.js +52 -41
- package/dist/index65.js.map +1 -1
- package/dist/index66.js +58 -64
- package/dist/index66.js.map +1 -1
- package/dist/index67.js +105 -19
- package/dist/index67.js.map +1 -1
- package/dist/index68.js +41 -46
- package/dist/index68.js.map +1 -1
- package/dist/index69.js +63 -129
- package/dist/index69.js.map +1 -1
- package/dist/index7.js +130 -11
- package/dist/index7.js.map +1 -1
- package/dist/index70.js +19 -50
- package/dist/index70.js.map +1 -1
- package/dist/index71.js +46 -22
- package/dist/index71.js.map +1 -1
- package/dist/index72.js +134 -22
- package/dist/index72.js.map +1 -1
- package/dist/index73.js +51 -328
- package/dist/index73.js.map +1 -1
- package/dist/index74.js +19 -53
- package/dist/index74.js.map +1 -1
- package/dist/index75.js +31 -40
- package/dist/index75.js.map +1 -1
- package/dist/index76.js +22 -95
- package/dist/index76.js.map +1 -1
- package/dist/index77.js +311 -112
- package/dist/index77.js.map +1 -1
- package/dist/index78.js +52 -157
- package/dist/index78.js.map +1 -1
- package/dist/index79.js +40 -65
- package/dist/index79.js.map +1 -1
- package/dist/index8.js +11 -70
- package/dist/index8.js.map +1 -1
- package/dist/index80.js +23 -35
- package/dist/index80.js.map +1 -1
- package/dist/index81.js +88 -227
- package/dist/index81.js.map +1 -1
- package/dist/index82.js +130 -34
- package/dist/index82.js.map +1 -1
- package/dist/index83.js +153 -202
- package/dist/index83.js.map +1 -1
- package/dist/index84.js +61 -209
- package/dist/index84.js.map +1 -1
- package/dist/index85.js +34 -294
- package/dist/index85.js.map +1 -1
- package/dist/index86.js +228 -172
- package/dist/index86.js.map +1 -1
- package/dist/index87.js +32 -256
- package/dist/index87.js.map +1 -1
- package/dist/index88.js +208 -12
- package/dist/index88.js.map +1 -1
- package/dist/index89.js +209 -29
- package/dist/index89.js.map +1 -1
- package/dist/index9.js +69 -91
- package/dist/index9.js.map +1 -1
- package/dist/index90.js +294 -5
- package/dist/index90.js.map +1 -1
- package/dist/index91.js +176 -12
- package/dist/index91.js.map +1 -1
- package/dist/index92.js +256 -44
- package/dist/index92.js.map +1 -1
- package/dist/index93.js +13 -12
- package/dist/index93.js.map +1 -1
- package/dist/index94.js +32 -14
- package/dist/index94.js.map +1 -1
- package/dist/index95.js +5 -7
- package/dist/index95.js.map +1 -1
- package/dist/index96.js +13 -12
- package/dist/index96.js.map +1 -1
- package/dist/index97.js +42 -27
- package/dist/index97.js.map +1 -1
- package/dist/index98.js +11 -16
- package/dist/index98.js.map +1 -1
- package/dist/index99.js +12 -10790
- package/dist/index99.js.map +1 -1
- package/package.json +1 -1
package/dist/index54.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index54.js","sources":["../src/components/Pagination.tsx"],"sourcesContent":["import React from 'react'\n\nexport interface PaginationProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n current?: number\n defaultCurrent?: number\n total: number\n pageSize?: number\n defaultPageSize?: number\n pageSizeOptions?: number[]\n onChange?: (page: number, pageSize: number) => void\n onShowSizeChange?: (current: number, size: number) => void\n showSizeChanger?: boolean\n showQuickJumper?: boolean\n showTotal?: boolean | ((total: number, range: [number, number]) => React.ReactNode)\n simple?: boolean\n size?: 'xs' | 'sm' | 'md' | 'lg'\n disabled?: boolean\n}\n\nexport const Pagination: React.FC<PaginationProps> = ({\n current: controlledCurrent,\n defaultCurrent = 1,\n total,\n pageSize: controlledPageSize,\n defaultPageSize = 10,\n pageSizeOptions = [10, 20, 50, 100],\n onChange,\n onShowSizeChange,\n showSizeChanger = false,\n showQuickJumper = false,\n showTotal = false,\n simple = false,\n size = 'md',\n disabled = false,\n className = '',\n ...rest\n}) => {\n const [internalCurrent, setInternalCurrent] = React.useState(defaultCurrent)\n const [internalPageSize, setInternalPageSize] = React.useState(defaultPageSize)\n const [jumpPage, setJumpPage] = React.useState('')\n\n const current = controlledCurrent !== undefined ? controlledCurrent : internalCurrent\n const pageSize = controlledPageSize !== undefined ? controlledPageSize : internalPageSize\n const totalPages = Math.ceil(total / pageSize)\n\n const handlePageChange = (page: number) => {\n if (page < 1 || page > totalPages || disabled) return\n\n if (controlledCurrent === undefined) {\n setInternalCurrent(page)\n }\n onChange?.(page, pageSize)\n }\n\n const handlePageSizeChange = (newSize: number) => {\n const newTotalPages = Math.ceil(total / newSize)\n const newCurrent = current > newTotalPages ? newTotalPages : current\n\n if (controlledPageSize === undefined) {\n setInternalPageSize(newSize)\n }\n if (controlledCurrent === undefined && newCurrent !== current) {\n setInternalCurrent(newCurrent)\n }\n\n onShowSizeChange?.(newCurrent, newSize)\n onChange?.(newCurrent, newSize)\n }\n\n const handleJumpPage = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter') {\n const page = parseInt(jumpPage)\n if (!isNaN(page) && page >= 1 && page <= totalPages) {\n handlePageChange(page)\n setJumpPage('')\n }\n }\n }\n\n const getPageNumbers = (): (number | 'ellipsis')[] => {\n const pages: (number | 'ellipsis')[] = []\n const showPages = 7\n\n if (totalPages <= showPages) {\n for (let i = 1; i <= totalPages; i++) {\n pages.push(i)\n }\n } else {\n if (current <= 3) {\n for (let i = 1; i <= 5; i++) {\n pages.push(i)\n }\n pages.push('ellipsis')\n pages.push(totalPages)\n } else if (current >= totalPages - 2) {\n pages.push(1)\n pages.push('ellipsis')\n for (let i = totalPages - 4; i <= totalPages; i++) {\n pages.push(i)\n }\n } else {\n pages.push(1)\n pages.push('ellipsis')\n for (let i = current - 1; i <= current + 1; i++) {\n pages.push(i)\n }\n pages.push('ellipsis')\n pages.push(totalPages)\n }\n }\n\n return pages\n }\n\n const sizeClass = {\n xs: 'btn-xs',\n sm: 'btn-sm',\n md: '',\n lg: 'btn-lg',\n }[size]\n\n const range: [number, number] = [\n (current - 1) * pageSize + 1,\n Math.min(current * pageSize, total),\n ]\n\n if (simple) {\n return (\n <div className={`flex items-center gap-2 ${className}`} {...rest}>\n <button\n className={`btn btn-ghost ${sizeClass}`}\n onClick={() => handlePageChange(current - 1)}\n disabled={disabled || current === 1}\n >\n ‹\n </button>\n <span className=\"text-sm\">\n {current} / {totalPages}\n </span>\n <button\n className={`btn btn-ghost ${sizeClass}`}\n onClick={() => handlePageChange(current + 1)}\n disabled={disabled || current === totalPages}\n >\n ›\n </button>\n </div>\n )\n }\n\n return (\n <div className={`flex flex-wrap items-center gap-4 ${className}`} {...rest}>\n {/* Total */}\n {showTotal && (\n <div className=\"text-sm text-base-content/70\">\n {typeof showTotal === 'function'\n ? showTotal(total, range)\n : `Total ${total} items`}\n </div>\n )}\n\n {/* Page Size Changer */}\n {showSizeChanger && (\n <select\n className={`select select-bordered ${sizeClass}`}\n value={pageSize}\n onChange={(e) => handlePageSizeChange(Number(e.target.value))}\n disabled={disabled}\n >\n {pageSizeOptions.map((size) => (\n <option key={size} value={size}>\n {size} / page\n </option>\n ))}\n </select>\n )}\n\n {/* Pagination Controls */}\n <div className=\"join\">\n {/* First */}\n <button\n className={`join-item btn ${sizeClass}`}\n onClick={() => handlePageChange(1)}\n disabled={disabled || current === 1}\n title=\"First page\"\n >\n «\n </button>\n\n {/* Previous */}\n <button\n className={`join-item btn ${sizeClass}`}\n onClick={() => handlePageChange(current - 1)}\n disabled={disabled || current === 1}\n title=\"Previous page\"\n >\n ‹\n </button>\n\n {/* Page Numbers */}\n {getPageNumbers().map((page, index) => {\n if (page === 'ellipsis') {\n return (\n <button key={`ellipsis-${index}`} className={`join-item btn btn-disabled ${sizeClass}`}>\n ...\n </button>\n )\n }\n\n return (\n <button\n key={page}\n className={`join-item btn ${sizeClass} ${current === page ? 'btn-active' : ''}`}\n onClick={() => handlePageChange(page)}\n disabled={disabled}\n >\n {page}\n </button>\n )\n })}\n\n {/* Next */}\n <button\n className={`join-item btn ${sizeClass}`}\n onClick={() => handlePageChange(current + 1)}\n disabled={disabled || current === totalPages}\n title=\"Next page\"\n >\n ›\n </button>\n\n {/* Last */}\n <button\n className={`join-item btn ${sizeClass}`}\n onClick={() => handlePageChange(totalPages)}\n disabled={disabled || current === totalPages}\n title=\"Last page\"\n >\n »\n </button>\n </div>\n\n {/* Quick Jumper */}\n {showQuickJumper && (\n <div className=\"flex items-center gap-2\">\n <span className=\"text-sm\">Go to</span>\n <input\n type=\"number\"\n className={`input input-bordered w-16 ${sizeClass}`}\n min={1}\n max={totalPages}\n value={jumpPage}\n onChange={(e) => setJumpPage(e.target.value)}\n onKeyDown={handleJumpPage}\n disabled={disabled}\n placeholder={String(current)}\n />\n </div>\n )}\n </div>\n )\n}\n"],"names":["Pagination","controlledCurrent","defaultCurrent","total","controlledPageSize","defaultPageSize","pageSizeOptions","onChange","onShowSizeChange","showSizeChanger","showQuickJumper","showTotal","simple","size","disabled","className","rest","internalCurrent","setInternalCurrent","React","internalPageSize","setInternalPageSize","jumpPage","setJumpPage","current","pageSize","totalPages","handlePageChange","page","handlePageSizeChange","newSize","newTotalPages","newCurrent","handleJumpPage","getPageNumbers","pages","i","sizeClass","range","jsx","jsxs","index"],"mappings":";;AAmBO,MAAMA,IAAwC,CAAC;AAAA,EACpD,SAASC;AAAA,EACT,gBAAAC,IAAiB;AAAA,EACjB,OAAAC;AAAA,EACA,UAAUC;AAAA,EACV,iBAAAC,IAAkB;AAAA,EAClB,iBAAAC,IAAkB,CAAC,IAAI,IAAI,IAAI,GAAG;AAAA,EAClC,UAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,iBAAAC,IAAkB;AAAA,EAClB,WAAAC,IAAY;AAAA,EACZ,QAAAC,IAAS;AAAA,EACT,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAiBC,CAAkB,IAAIC,EAAM,SAASjB,CAAc,GACrE,CAACkB,GAAkBC,CAAmB,IAAIF,EAAM,SAASd,CAAe,GACxE,CAACiB,GAAUC,CAAW,IAAIJ,EAAM,SAAS,EAAE,GAE3CK,IAAUvB,MAAsB,SAAYA,IAAoBgB,GAChEQ,IAAWrB,MAAuB,SAAYA,IAAqBgB,GACnEM,IAAa,KAAK,KAAKvB,IAAQsB,CAAQ,GAEvCE,IAAmB,CAACC,MAAiB;AACzC,IAAIA,IAAO,KAAKA,IAAOF,KAAcZ,MAEjCb,MAAsB,UACxBiB,EAAmBU,CAAI,GAEzBrB,IAAWqB,GAAMH,CAAQ;AAAA,EAC3B,GAEMI,IAAuB,CAACC,MAAoB;AAChD,UAAMC,IAAgB,KAAK,KAAK5B,IAAQ2B,CAAO,GACzCE,IAAaR,IAAUO,IAAgBA,IAAgBP;AAE7D,IAAIpB,MAAuB,UACzBiB,EAAoBS,CAAO,GAEzB7B,MAAsB,UAAa+B,MAAeR,KACpDN,EAAmBc,CAAU,GAG/BxB,IAAmBwB,GAAYF,CAAO,GACtCvB,IAAWyB,GAAYF,CAAO;AAAA,EAChC,GAEMG,IAAiB,CAAC,MAA6C;AACnE,QAAI,EAAE,QAAQ,SAAS;AACrB,YAAML,IAAO,SAASN,CAAQ;AAC9B,MAAI,CAAC,MAAMM,CAAI,KAAKA,KAAQ,KAAKA,KAAQF,MACvCC,EAAiBC,CAAI,GACrBL,EAAY,EAAE;AAAA,IAElB;AAAA,EACF,GAEMW,IAAiB,MAA+B;AACpD,UAAMC,IAAiC,CAAA;AAGvC,QAAIT,KAAc;AAChB,eAASU,IAAI,GAAGA,KAAKV,GAAYU;AAC/B,QAAAD,EAAM,KAAKC,CAAC;AAAA,aAGVZ,KAAW,GAAG;AAChB,eAASY,IAAI,GAAGA,KAAK,GAAGA;AACtB,QAAAD,EAAM,KAAKC,CAAC;AAEd,MAAAD,EAAM,KAAK,UAAU,GACrBA,EAAM,KAAKT,CAAU;AAAA,IACvB,WAAWF,KAAWE,IAAa,GAAG;AACpC,MAAAS,EAAM,KAAK,CAAC,GACZA,EAAM,KAAK,UAAU;AACrB,eAASC,IAAIV,IAAa,GAAGU,KAAKV,GAAYU;AAC5C,QAAAD,EAAM,KAAKC,CAAC;AAAA,IAEhB,OAAO;AACL,MAAAD,EAAM,KAAK,CAAC,GACZA,EAAM,KAAK,UAAU;AACrB,eAASC,IAAIZ,IAAU,GAAGY,KAAKZ,IAAU,GAAGY;AAC1C,QAAAD,EAAM,KAAKC,CAAC;AAEd,MAAAD,EAAM,KAAK,UAAU,GACrBA,EAAM,KAAKT,CAAU;AAAA,IACvB;AAGF,WAAOS;AAAA,EACT,GAEME,IAAY;AAAA,IAChB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA,EACJxB,CAAI,GAEAyB,IAA0B;AAAA,KAC7Bd,IAAU,KAAKC,IAAW;AAAA,IAC3B,KAAK,IAAID,IAAUC,GAAUtB,CAAK;AAAA,EAAA;AAGpC,SAAIS,sBAEC,OAAA,EAAI,WAAW,2BAA2BG,CAAS,IAAK,GAAGC,GAC1D,UAAA;AAAA,IAAA,gBAAAuB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,iBAAiBF,CAAS;AAAA,QACrC,SAAS,MAAMV,EAAiBH,IAAU,CAAC;AAAA,QAC3C,UAAUV,KAAYU,MAAY;AAAA,QACnC,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAGD,gBAAAgB,EAAC,QAAA,EAAK,WAAU,WACb,UAAA;AAAA,MAAAhB;AAAA,MAAQ;AAAA,MAAIE;AAAA,IAAA,GACf;AAAA,IACA,gBAAAa;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,iBAAiBF,CAAS;AAAA,QACrC,SAAS,MAAMV,EAAiBH,IAAU,CAAC;AAAA,QAC3C,UAAUV,KAAYU,MAAYE;AAAA,QACnC,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED,GACF,sBAKD,OAAA,EAAI,WAAW,qCAAqCX,CAAS,IAAK,GAAGC,GAEnE,UAAA;AAAA,IAAAL,KACC,gBAAA4B,EAAC,OAAA,EAAI,WAAU,gCACZ,UAAA,OAAO5B,KAAc,aAClBA,EAAUR,GAAOmC,CAAK,IACtB,SAASnC,CAAK,UACpB;AAAA,IAIDM,KACC,gBAAA8B;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,0BAA0BF,CAAS;AAAA,QAC9C,OAAOZ;AAAA,QACP,UAAU,CAAC,MAAMI,EAAqB,OAAO,EAAE,OAAO,KAAK,CAAC;AAAA,QAC5D,UAAAf;AAAA,QAEC,YAAgB,IAAI,CAACD,MACpB,gBAAA2B,EAAC,UAAA,EAAkB,OAAO3B,GACvB,UAAA;AAAA,UAAAA;AAAAA,UAAK;AAAA,QAAA,EAAA,GADKA,CAEb,CACD;AAAA,MAAA;AAAA,IAAA;AAAA,IAKL,gBAAA2B,EAAC,OAAA,EAAI,WAAU,QAEb,UAAA;AAAA,MAAA,gBAAAD;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,iBAAiBF,CAAS;AAAA,UACrC,SAAS,MAAMV,EAAiB,CAAC;AAAA,UACjC,UAAUb,KAAYU,MAAY;AAAA,UAClC,OAAM;AAAA,UACP,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAKD,gBAAAe;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,iBAAiBF,CAAS;AAAA,UACrC,SAAS,MAAMV,EAAiBH,IAAU,CAAC;AAAA,UAC3C,UAAUV,KAAYU,MAAY;AAAA,UAClC,OAAM;AAAA,UACP,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAKAU,IAAiB,IAAI,CAACN,GAAMa,MACvBb,MAAS,aAET,gBAAAW,EAAC,YAAiC,WAAW,8BAA8BF,CAAS,IAAI,UAAA,MAAA,GAA3E,YAAYI,CAAK,EAE9B,IAKF,gBAAAF;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,WAAW,iBAAiBF,CAAS,IAAIb,MAAYI,IAAO,eAAe,EAAE;AAAA,UAC7E,SAAS,MAAMD,EAAiBC,CAAI;AAAA,UACpC,UAAAd;AAAA,UAEC,UAAAc;AAAA,QAAA;AAAA,QALIA;AAAA,MAAA,CAQV;AAAA,MAGD,gBAAAW;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,iBAAiBF,CAAS;AAAA,UACrC,SAAS,MAAMV,EAAiBH,IAAU,CAAC;AAAA,UAC3C,UAAUV,KAAYU,MAAYE;AAAA,UAClC,OAAM;AAAA,UACP,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAKD,gBAAAa;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,iBAAiBF,CAAS;AAAA,UACrC,SAAS,MAAMV,EAAiBD,CAAU;AAAA,UAC1C,UAAUZ,KAAYU,MAAYE;AAAA,UAClC,OAAM;AAAA,UACP,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAED,GACF;AAAA,IAGChB,KACC,gBAAA8B,EAAC,OAAA,EAAI,WAAU,2BACb,UAAA;AAAA,MAAA,gBAAAD,EAAC,QAAA,EAAK,WAAU,WAAU,UAAA,SAAK;AAAA,MAC/B,gBAAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAW,6BAA6BF,CAAS;AAAA,UACjD,KAAK;AAAA,UACL,KAAKX;AAAA,UACL,OAAOJ;AAAA,UACP,UAAU,CAAC,MAAMC,EAAY,EAAE,OAAO,KAAK;AAAA,UAC3C,WAAWU;AAAA,UACX,UAAAnB;AAAA,UACA,aAAa,OAAOU,CAAO;AAAA,QAAA;AAAA,MAAA;AAAA,IAC7B,EAAA,CACF;AAAA,EAAA,GAEJ;AAEJ;"}
|
|
1
|
+
{"version":3,"file":"index54.js","sources":["../src/components/Navbar.tsx"],"sourcesContent":["import React from 'react'\n\nexport interface NavbarProps extends React.HTMLAttributes<HTMLDivElement> {\n children?: React.ReactNode\n start?: React.ReactNode\n center?: React.ReactNode\n end?: React.ReactNode\n}\n\nexport const Navbar: React.FC<NavbarProps> = ({\n children,\n start,\n center,\n end,\n className = '',\n ...rest\n}) => {\n const navbarClasses = ['navbar bg-base-100', className]\n .filter(Boolean)\n .join(' ')\n\n if (children) {\n return <div className={navbarClasses} {...rest}>{children}</div>\n }\n\n return (\n <div className={navbarClasses} {...rest}>\n {start && <div className=\"navbar-start\">{start}</div>}\n {center && <div className=\"navbar-center\">{center}</div>}\n {end && <div className=\"navbar-end\">{end}</div>}\n </div>\n )\n}\n"],"names":["Navbar","children","start","center","end","className","rest","navbarClasses","jsxs","jsx"],"mappings":";AASO,MAAMA,IAAgC,CAAC;AAAA,EAC5C,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAgB,CAAC,sBAAsBF,CAAS,EACnD,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,SAAIJ,sBACM,OAAA,EAAI,WAAWM,GAAgB,GAAGD,GAAO,UAAAL,GAAS,IAI1D,gBAAAO,EAAC,OAAA,EAAI,WAAWD,GAAgB,GAAGD,GAChC,UAAA;AAAA,IAAAJ,KAAS,gBAAAO,EAAC,OAAA,EAAI,WAAU,gBAAgB,UAAAP,GAAM;AAAA,IAC9CC,KAAU,gBAAAM,EAAC,OAAA,EAAI,WAAU,iBAAiB,UAAAN,GAAO;AAAA,IACjDC,KAAO,gBAAAK,EAAC,OAAA,EAAI,WAAU,cAAc,UAAAL,EAAA,CAAI;AAAA,EAAA,GAC3C;AAEJ;"}
|
package/dist/index55.js
CHANGED
|
@@ -1,35 +1,125 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
1
|
+
import { jsx as i, Fragment as h, jsxs as l } from "react/jsx-runtime";
|
|
2
|
+
import { useState as u, useEffect as p } from "react";
|
|
3
|
+
import d from "react-dom/client";
|
|
4
|
+
class m {
|
|
5
|
+
notifications = [];
|
|
6
|
+
listeners = [];
|
|
7
|
+
container = null;
|
|
8
|
+
root = null;
|
|
9
|
+
idCounter = 0;
|
|
10
|
+
subscribe(t) {
|
|
11
|
+
return this.listeners.push(t), () => {
|
|
12
|
+
this.listeners = this.listeners.filter((o) => o !== t);
|
|
13
|
+
};
|
|
14
|
+
}
|
|
15
|
+
getNotifications() {
|
|
16
|
+
return this.notifications;
|
|
17
|
+
}
|
|
18
|
+
emit() {
|
|
19
|
+
this.listeners.forEach((t) => t());
|
|
20
|
+
}
|
|
21
|
+
ensureContainer() {
|
|
22
|
+
this.container || (this.container = document.createElement("div"), document.body.appendChild(this.container), this.root = d.createRoot(this.container), this.root.render(/* @__PURE__ */ i(f, { manager: this })));
|
|
23
|
+
}
|
|
24
|
+
open(t) {
|
|
25
|
+
this.ensureContainer();
|
|
26
|
+
const o = `notification-${++this.idCounter}`, s = {
|
|
27
|
+
...t,
|
|
28
|
+
id: o,
|
|
29
|
+
createdAt: Date.now(),
|
|
30
|
+
duration: t.duration ?? 4.5,
|
|
31
|
+
placement: t.placement ?? "topRight",
|
|
32
|
+
closable: t.closable ?? !0,
|
|
33
|
+
type: t.type ?? "info"
|
|
34
|
+
};
|
|
35
|
+
return this.notifications.push(s), this.emit(), s.duration && s.duration > 0 && setTimeout(() => {
|
|
36
|
+
this.close(o);
|
|
37
|
+
}, s.duration * 1e3), o;
|
|
38
|
+
}
|
|
39
|
+
close(t) {
|
|
40
|
+
const o = this.notifications.find((s) => s.id === t);
|
|
41
|
+
this.notifications = this.notifications.filter((s) => s.id !== t), this.emit(), o?.onClose && o.onClose();
|
|
42
|
+
}
|
|
43
|
+
success(t) {
|
|
44
|
+
return this.open({ ...t, type: "success" });
|
|
45
|
+
}
|
|
46
|
+
error(t) {
|
|
47
|
+
return this.open({ ...t, type: "error" });
|
|
48
|
+
}
|
|
49
|
+
info(t) {
|
|
50
|
+
return this.open({ ...t, type: "info" });
|
|
51
|
+
}
|
|
52
|
+
warning(t) {
|
|
53
|
+
return this.open({ ...t, type: "warning" });
|
|
54
|
+
}
|
|
55
|
+
destroy() {
|
|
56
|
+
this.notifications = [], this.emit();
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
function f({ manager: e }) {
|
|
60
|
+
const [, t] = u({});
|
|
61
|
+
p(() => e.subscribe(() => {
|
|
62
|
+
t({});
|
|
63
|
+
}), [e]);
|
|
64
|
+
const o = e.getNotifications(), s = {
|
|
65
|
+
topLeft: [],
|
|
66
|
+
topRight: [],
|
|
67
|
+
bottomLeft: [],
|
|
68
|
+
bottomRight: []
|
|
69
|
+
};
|
|
70
|
+
o.forEach((n) => {
|
|
71
|
+
s[n.placement].push(n);
|
|
72
|
+
});
|
|
73
|
+
const r = {
|
|
74
|
+
topRight: "toast toast-top toast-end",
|
|
75
|
+
topLeft: "toast toast-top toast-start",
|
|
76
|
+
bottomRight: "toast toast-bottom toast-end",
|
|
77
|
+
bottomLeft: "toast toast-bottom toast-start"
|
|
78
|
+
};
|
|
79
|
+
return /* @__PURE__ */ i(h, { children: Object.entries(s).map(([n, c]) => c.length === 0 ? null : /* @__PURE__ */ i("div", { className: r[n], children: c.map((a) => /* @__PURE__ */ i(
|
|
80
|
+
b,
|
|
81
|
+
{
|
|
82
|
+
notification: a,
|
|
83
|
+
onClose: () => e.close(a.id)
|
|
84
|
+
},
|
|
85
|
+
a.id
|
|
86
|
+
)) }, n)) });
|
|
87
|
+
}
|
|
88
|
+
function b({ notification: e, onClose: t }) {
|
|
9
89
|
const o = {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
},
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
90
|
+
success: "alert-success",
|
|
91
|
+
error: "alert-error",
|
|
92
|
+
info: "alert-info",
|
|
93
|
+
warning: "alert-warning"
|
|
94
|
+
}, s = () => {
|
|
95
|
+
e.onClick && e.onClick();
|
|
96
|
+
};
|
|
97
|
+
return /* @__PURE__ */ l(
|
|
98
|
+
"div",
|
|
99
|
+
{
|
|
100
|
+
className: `alert ${o[e.type]} shadow-lg cursor-pointer min-w-[300px] max-w-[400px]`,
|
|
101
|
+
onClick: s,
|
|
102
|
+
children: [
|
|
103
|
+
/* @__PURE__ */ l("div", { className: "flex-1", children: [
|
|
104
|
+
e.message && /* @__PURE__ */ i("div", { className: "font-bold", children: e.message }),
|
|
105
|
+
e.description && /* @__PURE__ */ i("div", { className: "text-sm", children: e.description })
|
|
106
|
+
] }),
|
|
107
|
+
e.closable && /* @__PURE__ */ i(
|
|
108
|
+
"button",
|
|
109
|
+
{
|
|
110
|
+
className: "btn btn-sm btn-ghost btn-circle",
|
|
111
|
+
onClick: (r) => {
|
|
112
|
+
r.stopPropagation(), t();
|
|
113
|
+
},
|
|
114
|
+
children: "✕"
|
|
115
|
+
}
|
|
116
|
+
)
|
|
117
|
+
]
|
|
118
|
+
}
|
|
119
|
+
);
|
|
120
|
+
}
|
|
121
|
+
const y = new m();
|
|
32
122
|
export {
|
|
33
|
-
|
|
123
|
+
y as notification
|
|
34
124
|
};
|
|
35
125
|
//# sourceMappingURL=index55.js.map
|
package/dist/index55.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index55.js","sources":["../src/components/
|
|
1
|
+
{"version":3,"file":"index55.js","sources":["../src/components/Notification.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react'\nimport ReactDOM from 'react-dom/client'\n\nexport type NotificationType = 'success' | 'info' | 'warning' | 'error'\nexport type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight'\n\nexport interface NotificationConfig {\n message: React.ReactNode\n description?: React.ReactNode\n type?: NotificationType\n duration?: number // in seconds, 0 = no auto close\n placement?: NotificationPlacement\n closable?: boolean\n onClick?: () => void\n onClose?: () => void\n}\n\ninterface NotificationItem extends NotificationConfig {\n id: string\n createdAt: number\n}\n\ntype Listener = () => void\n\nclass NotificationManager {\n private notifications: NotificationItem[] = []\n private listeners: Listener[] = []\n private container: HTMLDivElement | null = null\n private root: ReactDOM.Root | null = null\n private idCounter = 0\n\n subscribe(listener: Listener) {\n this.listeners.push(listener)\n return () => {\n this.listeners = this.listeners.filter((l) => l !== listener)\n }\n }\n\n getNotifications() {\n return this.notifications\n }\n\n private emit() {\n this.listeners.forEach((listener) => listener())\n }\n\n private ensureContainer() {\n if (!this.container) {\n this.container = document.createElement('div')\n document.body.appendChild(this.container)\n this.root = ReactDOM.createRoot(this.container)\n this.root.render(<NotificationContainer manager={this} />)\n }\n }\n\n open(config: NotificationConfig) {\n this.ensureContainer()\n\n const id = `notification-${++this.idCounter}`\n const notification: NotificationItem = {\n ...config,\n id,\n createdAt: Date.now(),\n duration: config.duration ?? 4.5,\n placement: config.placement ?? 'topRight',\n closable: config.closable ?? true,\n type: config.type ?? 'info',\n }\n\n this.notifications.push(notification)\n this.emit()\n\n // Auto-dismiss\n if (notification.duration && notification.duration > 0) {\n setTimeout(() => {\n this.close(id)\n }, notification.duration * 1000)\n }\n\n return id\n }\n\n close(id: string) {\n const notification = this.notifications.find((n) => n.id === id)\n this.notifications = this.notifications.filter((n) => n.id !== id)\n this.emit()\n\n if (notification?.onClose) {\n notification.onClose()\n }\n }\n\n success(config: Omit<NotificationConfig, 'type'>) {\n return this.open({ ...config, type: 'success' })\n }\n\n error(config: Omit<NotificationConfig, 'type'>) {\n return this.open({ ...config, type: 'error' })\n }\n\n info(config: Omit<NotificationConfig, 'type'>) {\n return this.open({ ...config, type: 'info' })\n }\n\n warning(config: Omit<NotificationConfig, 'type'>) {\n return this.open({ ...config, type: 'warning' })\n }\n\n destroy() {\n this.notifications = []\n this.emit()\n }\n}\n\ninterface NotificationContainerProps {\n manager: NotificationManager\n}\n\nfunction NotificationContainer({ manager }: NotificationContainerProps) {\n const [, forceUpdate] = useState({})\n\n useEffect(() => {\n const unsubscribe = manager.subscribe(() => {\n forceUpdate({})\n })\n return unsubscribe\n }, [manager])\n\n const notifications = manager.getNotifications()\n\n // Group by placement\n const grouped: Record<NotificationPlacement, NotificationItem[]> = {\n topLeft: [],\n topRight: [],\n bottomLeft: [],\n bottomRight: [],\n }\n\n notifications.forEach((notification) => {\n grouped[notification.placement!].push(notification)\n })\n\n const placementClasses: Record<NotificationPlacement, string> = {\n topRight: 'toast toast-top toast-end',\n topLeft: 'toast toast-top toast-start',\n bottomRight: 'toast toast-bottom toast-end',\n bottomLeft: 'toast toast-bottom toast-start',\n }\n\n return (\n <>\n {Object.entries(grouped).map(([placement, items]) => {\n if (items.length === 0) return null\n\n return (\n <div key={placement} className={placementClasses[placement as NotificationPlacement]}>\n {items.map((notification) => (\n <NotificationItem\n key={notification.id}\n notification={notification}\n onClose={() => manager.close(notification.id)}\n />\n ))}\n </div>\n )\n })}\n </>\n )\n}\n\ninterface NotificationItemProps {\n notification: NotificationItem\n onClose: () => void\n}\n\nfunction NotificationItem({ notification, onClose }: NotificationItemProps) {\n const alertTypeClasses: Record<NotificationType, string> = {\n success: 'alert-success',\n error: 'alert-error',\n info: 'alert-info',\n warning: 'alert-warning',\n }\n\n const handleClick = () => {\n if (notification.onClick) {\n notification.onClick()\n }\n }\n\n return (\n <div\n className={`alert ${alertTypeClasses[notification.type!]} shadow-lg cursor-pointer min-w-[300px] max-w-[400px]`}\n onClick={handleClick}\n >\n <div className=\"flex-1\">\n {notification.message && <div className=\"font-bold\">{notification.message}</div>}\n {notification.description && <div className=\"text-sm\">{notification.description}</div>}\n </div>\n {notification.closable && (\n <button\n className=\"btn btn-sm btn-ghost btn-circle\"\n onClick={(e) => {\n e.stopPropagation()\n onClose()\n }}\n >\n ✕\n </button>\n )}\n </div>\n )\n}\n\nexport const notification = new NotificationManager()\n"],"names":["NotificationManager","listener","l","ReactDOM","jsx","NotificationContainer","config","id","notification","n","manager","forceUpdate","useState","useEffect","notifications","grouped","placementClasses","Fragment","placement","items","NotificationItem","onClose","alertTypeClasses","handleClick","jsxs","e"],"mappings":"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"}
|
package/dist/index56.js
CHANGED
|
@@ -1,125 +1,113 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
1
|
+
import { jsx as v } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as L, useState as M, useRef as V, useImperativeHandle as Z, useEffect as j, useCallback as i } from "react";
|
|
3
|
+
const g = L(
|
|
4
|
+
({
|
|
5
|
+
length: s = 6,
|
|
6
|
+
value: p = "",
|
|
7
|
+
onChange: n,
|
|
8
|
+
onComplete: m,
|
|
9
|
+
size: k = "md",
|
|
10
|
+
type: f = "number",
|
|
11
|
+
mask: y = !1,
|
|
12
|
+
disabled: c = !1,
|
|
13
|
+
error: P = !1,
|
|
14
|
+
autoFocus: A = !1,
|
|
15
|
+
placeholder: b = "",
|
|
16
|
+
className: I = ""
|
|
17
|
+
}, R) => {
|
|
18
|
+
const [a, o] = M(() => {
|
|
19
|
+
const t = p.split("").slice(0, s);
|
|
20
|
+
return [...t, ...Array(s - t.length).fill("")];
|
|
21
|
+
}), u = V([]), x = {
|
|
22
|
+
xs: "input-xs w-8 h-8 text-sm",
|
|
23
|
+
sm: "input-sm w-10 h-10 text-base",
|
|
24
|
+
md: "w-12 h-12 text-lg",
|
|
25
|
+
lg: "input-lg w-14 h-14 text-xl",
|
|
26
|
+
xl: "w-16 h-16 text-2xl"
|
|
24
27
|
};
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
if (m) {
|
|
32
|
-
u(!0);
|
|
33
|
-
try {
|
|
34
|
-
await m(), o(!1);
|
|
35
|
-
} finally {
|
|
36
|
-
u(!1);
|
|
28
|
+
Z(R, () => ({
|
|
29
|
+
focus: () => {
|
|
30
|
+
u.current[0]?.focus();
|
|
31
|
+
},
|
|
32
|
+
clear: () => {
|
|
33
|
+
o(Array(s).fill("")), u.current[0]?.focus();
|
|
37
34
|
}
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
error: "btn-error",
|
|
59
|
-
info: "btn-info",
|
|
60
|
-
ghost: "btn-ghost"
|
|
61
|
-
}, b = (t) => I[t], A = /* @__PURE__ */ e(
|
|
62
|
-
"svg",
|
|
63
|
-
{
|
|
64
|
-
className: "w-5 h-5 text-warning",
|
|
65
|
-
fill: "none",
|
|
66
|
-
stroke: "currentColor",
|
|
67
|
-
viewBox: "0 0 24 24",
|
|
68
|
-
children: /* @__PURE__ */ e(
|
|
69
|
-
"path",
|
|
70
|
-
{
|
|
71
|
-
strokeLinecap: "round",
|
|
72
|
-
strokeLinejoin: "round",
|
|
73
|
-
strokeWidth: 2,
|
|
74
|
-
d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
|
|
35
|
+
})), j(() => {
|
|
36
|
+
A && u.current[0]?.focus();
|
|
37
|
+
}, [A]), j(() => {
|
|
38
|
+
const t = p.split("").slice(0, s);
|
|
39
|
+
o([...t, ...Array(s - t.length).fill("")]);
|
|
40
|
+
}, [p, s]);
|
|
41
|
+
const w = i(
|
|
42
|
+
(t, e) => {
|
|
43
|
+
if (c || f === "number" && !/^\d*$/.test(e) || f === "text" && !/^[a-zA-Z0-9]*$/.test(e)) return;
|
|
44
|
+
const r = [...a];
|
|
45
|
+
if (e.length > 1) {
|
|
46
|
+
const O = e.slice(0, s - t).split("");
|
|
47
|
+
O.forEach((K, $) => {
|
|
48
|
+
t + $ < s && (r[t + $] = K);
|
|
49
|
+
}), o(r);
|
|
50
|
+
const D = r.join("");
|
|
51
|
+
n?.(D);
|
|
52
|
+
const E = Math.min(t + O.length, s - 1);
|
|
53
|
+
u.current[E]?.focus(), D.length === s && m?.(D);
|
|
54
|
+
return;
|
|
75
55
|
}
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
}
|
|
56
|
+
r[t] = e, o(r);
|
|
57
|
+
const l = r.join("");
|
|
58
|
+
n?.(l), e && t < s - 1 && u.current[t + 1]?.focus(), l.length === s && !l.includes("") && m?.(l);
|
|
59
|
+
},
|
|
60
|
+
[a, s, f, c, n, m]
|
|
61
|
+
), z = i(
|
|
62
|
+
(t, e) => {
|
|
63
|
+
if (!c)
|
|
64
|
+
if (e.key === "Backspace") {
|
|
65
|
+
e.preventDefault();
|
|
66
|
+
const r = [...a];
|
|
67
|
+
a[t] ? (r[t] = "", o(r), n?.(r.join(""))) : t > 0 && (r[t - 1] = "", o(r), n?.(r.join("")), u.current[t - 1]?.focus());
|
|
68
|
+
} else e.key === "ArrowLeft" && t > 0 ? (e.preventDefault(), u.current[t - 1]?.focus()) : e.key === "ArrowRight" && t < s - 1 && (e.preventDefault(), u.current[t + 1]?.focus());
|
|
69
|
+
},
|
|
70
|
+
[a, s, c, n]
|
|
71
|
+
), N = i(
|
|
72
|
+
(t) => {
|
|
73
|
+
if (t.preventDefault(), c) return;
|
|
74
|
+
const e = t.clipboardData.getData("text"), r = f === "number" ? e.replace(/\D/g, "") : e.replace(/[^a-zA-Z0-9]/g, "");
|
|
75
|
+
r && w(0, r);
|
|
76
|
+
},
|
|
77
|
+
[f, c, w]
|
|
78
|
+
), T = i((t) => {
|
|
79
|
+
t.target.select();
|
|
80
|
+
}, []);
|
|
81
|
+
return /* @__PURE__ */ v("div", { className: `flex gap-2 ${I}`, children: a.map((t, e) => /* @__PURE__ */ v(
|
|
82
|
+
"input",
|
|
83
|
+
{
|
|
84
|
+
ref: (r) => {
|
|
85
|
+
u.current[e] = r;
|
|
86
|
+
},
|
|
87
|
+
type: y ? "password" : f === "number" ? "tel" : "text",
|
|
88
|
+
inputMode: f === "number" ? "numeric" : "text",
|
|
89
|
+
maxLength: 1,
|
|
90
|
+
value: t,
|
|
91
|
+
placeholder: b,
|
|
92
|
+
disabled: c,
|
|
93
|
+
onChange: (r) => w(e, r.target.value),
|
|
94
|
+
onKeyDown: (r) => z(e, r),
|
|
95
|
+
onPaste: N,
|
|
96
|
+
onFocus: T,
|
|
97
|
+
className: `
|
|
98
|
+
input input-bordered text-center font-mono
|
|
99
|
+
${x[k]}
|
|
100
|
+
${P ? "input-error" : ""}
|
|
101
|
+
${c ? "input-disabled opacity-50" : ""}
|
|
102
|
+
`,
|
|
103
|
+
"aria-label": `OTP digit ${e + 1}`
|
|
104
|
+
},
|
|
105
|
+
e
|
|
106
|
+
)) });
|
|
107
|
+
}
|
|
108
|
+
);
|
|
109
|
+
g.displayName = "OTPInput";
|
|
122
110
|
export {
|
|
123
|
-
|
|
111
|
+
g as OTPInput
|
|
124
112
|
};
|
|
125
113
|
//# sourceMappingURL=index56.js.map
|
package/dist/index56.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index56.js","sources":["../src/components/Popconfirm.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react'\n\nexport interface PopconfirmProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {\n children: React.ReactElement\n title: React.ReactNode\n description?: React.ReactNode\n onConfirm?: () => void | Promise<void>\n onCancel?: () => void\n okText?: string\n cancelText?: string\n okType?: 'primary' | 'secondary' | 'accent' | 'success' | 'warning' | 'error' | 'info'\n cancelType?: 'primary' | 'secondary' | 'accent' | 'success' | 'warning' | 'error' | 'info' | 'ghost'\n placement?: 'top' | 'bottom' | 'left' | 'right'\n disabled?: boolean\n icon?: React.ReactNode\n showCancel?: boolean\n}\n\nexport const Popconfirm: React.FC<PopconfirmProps> = ({\n children,\n title,\n description,\n onConfirm,\n onCancel,\n okText = 'OK',\n cancelText = 'Cancel',\n okType = 'primary',\n cancelType = 'ghost',\n placement = 'top',\n disabled = false,\n icon,\n showCancel = true,\n className,\n ...rest\n}) => {\n const [isOpen, setIsOpen] = useState(false)\n const [loading, setLoading] = useState(false)\n const containerRef = useRef<HTMLDivElement>(null)\n const popupRef = useRef<HTMLDivElement>(null)\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target as Node) &&\n popupRef.current &&\n !popupRef.current.contains(event.target as Node)\n ) {\n setIsOpen(false)\n }\n }\n\n if (isOpen) {\n document.addEventListener('mousedown', handleClickOutside)\n return () => document.removeEventListener('mousedown', handleClickOutside)\n }\n }, [isOpen])\n\n const handleTriggerClick = (e: React.MouseEvent) => {\n if (disabled) return\n e.stopPropagation()\n setIsOpen(!isOpen)\n }\n\n const handleConfirm = async () => {\n if (onConfirm) {\n setLoading(true)\n try {\n await onConfirm()\n setIsOpen(false)\n } finally {\n setLoading(false)\n }\n } else {\n setIsOpen(false)\n }\n }\n\n const handleCancel = () => {\n onCancel?.()\n setIsOpen(false)\n }\n\n const getPopupContainerClasses = () => {\n const positions = {\n top: 'bottom-full left-1/2 -translate-x-1/2 mb-3',\n bottom: 'top-full left-1/2 -translate-x-1/2 mt-3',\n left: 'right-full top-1/2 -translate-y-1/2 mr-3',\n right: 'left-full top-1/2 -translate-y-1/2 ml-3',\n }\n\n return `absolute z-50 ${positions[placement]}`\n }\n\n const getPopupClasses = () => {\n return 'bg-base-100 rounded-lg p-4 min-w-[200px] max-w-[300px] shadow-lg'\n }\n\n const getArrowClasses = () => {\n const base = 'absolute w-2.5 h-2.5 bg-base-100 rotate-45 shadow-lg'\n\n const positions = {\n top: 'bottom-[-5px] left-1/2 -translate-x-1/2',\n bottom: 'top-[-5px] left-1/2 -translate-x-1/2',\n left: 'right-[-5px] top-1/2 -translate-y-1/2',\n right: 'left-[-5px] top-1/2 -translate-y-1/2',\n }\n\n return `${base} ${positions[placement]}`\n }\n\n const buttonClasses = {\n primary: 'btn-primary',\n secondary: 'btn-secondary',\n accent: 'btn-accent',\n success: 'btn-success',\n warning: 'btn-warning',\n error: 'btn-error',\n info: 'btn-info',\n ghost: 'btn-ghost',\n } as const\n\n const getButtonClass = (type: keyof typeof buttonClasses) => {\n return buttonClasses[type]\n }\n\n const defaultIcon = (\n <svg\n className=\"w-5 h-5 text-warning\"\n fill=\"none\"\n stroke=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <path\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n />\n </svg>\n )\n\n return (\n <div ref={containerRef} className={`relative inline-block ${className || ''}`} data-state={isOpen ? 'open' : 'closed'} {...rest}>\n {React.cloneElement(children, {\n onClick: (e: React.MouseEvent) => {\n handleTriggerClick(e)\n const originalOnClick = (children.props as any)?.onClick\n if (originalOnClick) {\n originalOnClick(e)\n }\n },\n } as any)}\n\n {isOpen && (\n <div className={getPopupContainerClasses()}>\n <div ref={popupRef} className={getPopupClasses()}>\n <div className=\"flex gap-3 relative z-10\">\n <div className=\"flex-shrink-0 mt-0.5\">\n {icon !== undefined ? icon : defaultIcon}\n </div>\n <div className=\"flex-1\">\n <div className=\"font-semibold text-base-content mb-1\">{title}</div>\n {description && (\n <div className=\"text-sm text-base-content/70 mb-3\">{description}</div>\n )}\n <div className=\"flex justify-end gap-2 mt-3\">\n {showCancel && (\n <button\n className={`btn btn-sm ${getButtonClass(cancelType)}`}\n onClick={handleCancel}\n disabled={loading}\n >\n {cancelText}\n </button>\n )}\n <button\n className={`btn btn-sm ${getButtonClass(okType)}`}\n onClick={handleConfirm}\n disabled={loading}\n >\n {loading && <span className=\"loading loading-spinner loading-xs\"></span>}\n {okText}\n </button>\n </div>\n </div>\n </div>\n <div className={getArrowClasses()} />\n </div>\n </div>\n )}\n </div>\n )\n}\n"],"names":["Popconfirm","children","title","description","onConfirm","onCancel","okText","cancelText","okType","cancelType","placement","disabled","icon","showCancel","className","rest","isOpen","setIsOpen","useState","loading","setLoading","containerRef","useRef","popupRef","useEffect","handleClickOutside","event","handleTriggerClick","e","handleConfirm","handleCancel","getPopupContainerClasses","getPopupClasses","getArrowClasses","buttonClasses","getButtonClass","type","defaultIcon","jsx","jsxs","React","originalOnClick"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index56.js","sources":["../src/components/OTPInput.tsx"],"sourcesContent":["import React, { useRef, useState, useEffect, useCallback, forwardRef, useImperativeHandle } from 'react'\n\nexport interface OTPInputProps {\n /** Number of input fields */\n length?: number\n /** Current value */\n value?: string\n /** Callback when value changes */\n onChange?: (value: string) => void\n /** Callback when all fields are filled */\n onComplete?: (value: string) => void\n /** Input size */\n size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'\n /** Input type - number only or alphanumeric */\n type?: 'number' | 'text'\n /** Mask input (show dots instead of characters) */\n mask?: boolean\n /** Disabled state */\n disabled?: boolean\n /** Error state */\n error?: boolean\n /** Auto focus first input on mount */\n autoFocus?: boolean\n /** Placeholder character */\n placeholder?: string\n /** Additional CSS classes */\n className?: string\n}\n\nexport interface OTPInputRef {\n focus: () => void\n clear: () => void\n}\n\nexport const OTPInput = forwardRef<OTPInputRef, OTPInputProps>(\n (\n {\n length = 6,\n value = '',\n onChange,\n onComplete,\n size = 'md',\n type = 'number',\n mask = false,\n disabled = false,\n error = false,\n autoFocus = false,\n placeholder = '',\n className = '',\n },\n ref\n ) => {\n const [otp, setOtp] = useState<string[]>(() => {\n const initial = value.split('').slice(0, length)\n return [...initial, ...Array(length - initial.length).fill('')]\n })\n\n const inputRefs = useRef<(HTMLInputElement | null)[]>([])\n\n const sizeClasses = {\n xs: 'input-xs w-8 h-8 text-sm',\n sm: 'input-sm w-10 h-10 text-base',\n md: 'w-12 h-12 text-lg',\n lg: 'input-lg w-14 h-14 text-xl',\n xl: 'w-16 h-16 text-2xl',\n }\n\n useImperativeHandle(ref, () => ({\n focus: () => {\n inputRefs.current[0]?.focus()\n },\n clear: () => {\n setOtp(Array(length).fill(''))\n inputRefs.current[0]?.focus()\n },\n }))\n\n useEffect(() => {\n if (autoFocus) {\n inputRefs.current[0]?.focus()\n }\n }, [autoFocus])\n\n useEffect(() => {\n const newOtp = value.split('').slice(0, length)\n setOtp([...newOtp, ...Array(length - newOtp.length).fill('')])\n }, [value, length])\n\n const handleChange = useCallback(\n (index: number, char: string) => {\n if (disabled) return\n\n // Validate input\n if (type === 'number' && !/^\\d*$/.test(char)) return\n if (type === 'text' && !/^[a-zA-Z0-9]*$/.test(char)) return\n\n const newOtp = [...otp]\n\n // Handle paste of multiple characters\n if (char.length > 1) {\n const chars = char.slice(0, length - index).split('')\n chars.forEach((c, i) => {\n if (index + i < length) {\n newOtp[index + i] = c\n }\n })\n setOtp(newOtp)\n\n const newValue = newOtp.join('')\n onChange?.(newValue)\n\n // Focus appropriate field\n const nextIndex = Math.min(index + chars.length, length - 1)\n inputRefs.current[nextIndex]?.focus()\n\n if (newValue.length === length) {\n onComplete?.(newValue)\n }\n return\n }\n\n // Single character\n newOtp[index] = char\n setOtp(newOtp)\n\n const newValue = newOtp.join('')\n onChange?.(newValue)\n\n // Move to next input\n if (char && index < length - 1) {\n inputRefs.current[index + 1]?.focus()\n }\n\n if (newValue.length === length && !newValue.includes('')) {\n onComplete?.(newValue)\n }\n },\n [otp, length, type, disabled, onChange, onComplete]\n )\n\n const handleKeyDown = useCallback(\n (index: number, e: React.KeyboardEvent<HTMLInputElement>) => {\n if (disabled) return\n\n if (e.key === 'Backspace') {\n e.preventDefault()\n const newOtp = [...otp]\n\n if (otp[index]) {\n // Clear current field\n newOtp[index] = ''\n setOtp(newOtp)\n onChange?.(newOtp.join(''))\n } else if (index > 0) {\n // Move to previous field and clear it\n newOtp[index - 1] = ''\n setOtp(newOtp)\n onChange?.(newOtp.join(''))\n inputRefs.current[index - 1]?.focus()\n }\n } else if (e.key === 'ArrowLeft' && index > 0) {\n e.preventDefault()\n inputRefs.current[index - 1]?.focus()\n } else if (e.key === 'ArrowRight' && index < length - 1) {\n e.preventDefault()\n inputRefs.current[index + 1]?.focus()\n }\n },\n [otp, length, disabled, onChange]\n )\n\n const handlePaste = useCallback(\n (e: React.ClipboardEvent) => {\n e.preventDefault()\n if (disabled) return\n\n const pastedData = e.clipboardData.getData('text')\n const filteredData =\n type === 'number'\n ? pastedData.replace(/\\D/g, '')\n : pastedData.replace(/[^a-zA-Z0-9]/g, '')\n\n if (filteredData) {\n handleChange(0, filteredData)\n }\n },\n [type, disabled, handleChange]\n )\n\n const handleFocus = useCallback((e: React.FocusEvent<HTMLInputElement>) => {\n e.target.select()\n }, [])\n\n return (\n <div className={`flex gap-2 ${className}`}>\n {otp.map((digit, index) => (\n <input\n key={index}\n ref={(el) => {\n inputRefs.current[index] = el\n }}\n type={mask ? 'password' : type === 'number' ? 'tel' : 'text'}\n inputMode={type === 'number' ? 'numeric' : 'text'}\n maxLength={1}\n value={digit}\n placeholder={placeholder}\n disabled={disabled}\n onChange={(e) => handleChange(index, e.target.value)}\n onKeyDown={(e) => handleKeyDown(index, e)}\n onPaste={handlePaste}\n onFocus={handleFocus}\n className={`\n input input-bordered text-center font-mono\n ${sizeClasses[size]}\n ${error ? 'input-error' : ''}\n ${disabled ? 'input-disabled opacity-50' : ''}\n `}\n aria-label={`OTP digit ${index + 1}`}\n />\n ))}\n </div>\n )\n }\n)\n\nOTPInput.displayName = 'OTPInput'\n"],"names":["OTPInput","forwardRef","length","value","onChange","onComplete","size","type","mask","disabled","error","autoFocus","placeholder","className","ref","otp","setOtp","useState","initial","inputRefs","useRef","sizeClasses","useImperativeHandle","useEffect","newOtp","handleChange","useCallback","index","char","chars","c","i","newValue","nextIndex","handleKeyDown","handlePaste","e","pastedData","filteredData","handleFocus","jsx","digit","el"],"mappings":"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"}
|