@indielayer/ui 2.0.0 → 2.1.0

package/lib/themes/base/styles.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "\n@layer base {\n  html {\n    color: #111827;\n    background-color: white;\n  }\n\n  html.dark {\n    color: #f3f4f6;\n    background-color: #111827;\n  }\n\n  body {\n    font-size: 14px;\n  }\n\n  *,\n  ::before,\n  ::after {\n    border-color: #e5e7eb;\n  }\n\n  .dark *,\n  .dark ::before,\n  .dark ::after {\n    border-color: #374151;\n  }\n\n  .dark {\n    input[type=\"time\"]::-webkit-calendar-picker-indicator{\n      filter: invert(100%);\n    }\n  }\n}\n\n:root {\n  --font-family-sans: Inter, -apple-system, BlinkMacSystemFont, ui-sans-serif, system-ui, sans-serif;\n  --font-family-mono: ui-monospace, monospace;\n  --border-color: 226, 232, 240;\n  --primary-color-50: 236, 253, 245;\n  --primary-color-100: 209, 250, 229;\n  --primary-color-200: 167, 243, 208;\n  --primary-color-300: 110, 231, 183;\n  --primary-color-400: 52, 211, 153;\n  --primary-color-500: 16, 185, 129;\n  --primary-color-600: 5, 150, 105;\n  --primary-color-700: 4, 120, 87;\n  --primary-color-800: 6, 95, 70;\n  --primary-color-900: 6, 78, 59;\n  --primary-color-950: 2, 44, 34;\n  --secondary-color-50: 248, 250, 252;\n  --secondary-color-100: 241, 245, 249;\n  --secondary-color-200: 226, 232, 240;\n  --secondary-color-300: 203, 213, 225;\n  --secondary-color-400: 148, 163, 184;\n  --secondary-color-500: 100, 116, 139;\n  --secondary-color-600: 71, 85, 105;\n  --secondary-color-700: 51, 65, 85;\n  --secondary-color-800: 30, 41, 59;\n  --secondary-color-900: 15, 23, 42;\n  --secondary-color-950: 2, 6, 23;\n  --success-color-50: 240, 253, 244;\n  --success-color-100: 220, 252, 231;\n  --success-color-200: 187, 247, 208;\n  --success-color-300: 134, 239, 172;\n  --success-color-400: 74, 222, 128;\n  --success-color-500: 34, 197, 94;\n  --success-color-600: 22, 163, 74;\n  --success-color-700: 21, 128, 61;\n  --success-color-800: 22, 101, 52;\n  --success-color-900: 20, 83, 45;\n  --success-color-950: 5, 46, 22;\n  --warning-color-50: 254, 252, 232;\n  --warning-color-100: 254, 249, 195;\n  --warning-color-200: 254, 240, 138;\n  --warning-color-300: 253, 224, 71;\n  --warning-color-400: 250, 204, 21;\n  --warning-color-500: 234, 179, 8;\n  --warning-color-600: 202, 138, 4;\n  --warning-color-700: 161, 98, 7;\n  --warning-color-800: 133, 77, 14;\n  --warning-color-900: 113, 63, 18;\n  --warning-color-950: 66, 32, 6;\n  --error-color-50: 254, 242, 242;\n  --error-color-100: 254, 226, 226;\n  --error-color-200: 254, 202, 202;\n  --error-color-300: 252, 165, 165;\n  --error-color-400: 248, 113, 113;\n  --error-color-500: 239, 68, 68;\n  --error-color-600: 220, 38, 38;\n  --error-color-700: 185, 28, 28;\n  --error-color-800: 153, 27, 27;\n  --error-color-900: 127, 29, 29;\n  --error-color-950: 69, 10, 10;\n}\n";
+declare const _default: "\n@layer base {\n  html {\n    color: #111827;\n    background-color: white;\n    color-scheme: light;\n  }\n\n  html.dark {\n    color: #f3f4f6;\n    background-color: #111827;\n  }\n\n  body {\n    font-size: 14px;\n  }\n\n  *,\n  ::before,\n  ::after {\n    border-color: #e5e7eb;\n  }\n\n  .dark *,\n  .dark ::before,\n  .dark ::after {\n    border-color: #374151;\n  }\n\n  .dark {\n    color-scheme: dark;\n  }\n}\n\n:root {\n  --font-family-sans: Inter, -apple-system, BlinkMacSystemFont, ui-sans-serif, system-ui, sans-serif;\n  --font-family-mono: ui-monospace, monospace;\n  --border-color: 226, 232, 240;\n  --primary-color-50: 236, 253, 245;\n  --primary-color-100: 209, 250, 229;\n  --primary-color-200: 167, 243, 208;\n  --primary-color-300: 110, 231, 183;\n  --primary-color-400: 52, 211, 153;\n  --primary-color-500: 16, 185, 129;\n  --primary-color-600: 5, 150, 105;\n  --primary-color-700: 4, 120, 87;\n  --primary-color-800: 6, 95, 70;\n  --primary-color-900: 6, 78, 59;\n  --primary-color-950: 2, 44, 34;\n  --secondary-color-50: 248, 250, 252;\n  --secondary-color-100: 241, 245, 249;\n  --secondary-color-200: 226, 232, 240;\n  --secondary-color-300: 203, 213, 225;\n  --secondary-color-400: 148, 163, 184;\n  --secondary-color-500: 100, 116, 139;\n  --secondary-color-600: 71, 85, 105;\n  --secondary-color-700: 51, 65, 85;\n  --secondary-color-800: 30, 41, 59;\n  --secondary-color-900: 15, 23, 42;\n  --secondary-color-950: 2, 6, 23;\n  --success-color-50: 240, 253, 244;\n  --success-color-100: 220, 252, 231;\n  --success-color-200: 187, 247, 208;\n  --success-color-300: 134, 239, 172;\n  --success-color-400: 74, 222, 128;\n  --success-color-500: 34, 197, 94;\n  --success-color-600: 22, 163, 74;\n  --success-color-700: 21, 128, 61;\n  --success-color-800: 22, 101, 52;\n  --success-color-900: 20, 83, 45;\n  --success-color-950: 5, 46, 22;\n  --warning-color-50: 254, 252, 232;\n  --warning-color-100: 254, 249, 195;\n  --warning-color-200: 254, 240, 138;\n  --warning-color-300: 253, 224, 71;\n  --warning-color-400: 250, 204, 21;\n  --warning-color-500: 234, 179, 8;\n  --warning-color-600: 202, 138, 4;\n  --warning-color-700: 161, 98, 7;\n  --warning-color-800: 133, 77, 14;\n  --warning-color-900: 113, 63, 18;\n  --warning-color-950: 66, 32, 6;\n  --error-color-50: 254, 242, 242;\n  --error-color-100: 254, 226, 226;\n  --error-color-200: 254, 202, 202;\n  --error-color-300: 252, 165, 165;\n  --error-color-400: 248, 113, 113;\n  --error-color-500: 239, 68, 68;\n  --error-color-600: 220, 38, 38;\n  --error-color-700: 185, 28, 28;\n  --error-color-800: 153, 27, 27;\n  --error-color-900: 127, 29, 29;\n  --error-color-950: 69, 10, 10;\n}\n";
 export default _default;

package/lib/themes/base/styles.js

@@ -1,4 +1,4 @@
 //#region src/themes/base/styles.ts
-var e = "\n@layer base {\n  html {\n    color: #111827;\n    background-color: white;\n  }\n\n  html.dark {\n    color: #f3f4f6;\n    background-color: #111827;\n  }\n\n  body {\n    font-size: 14px;\n  }\n\n  *,\n  ::before,\n  ::after {\n    border-color: #e5e7eb;\n  }\n\n  .dark *,\n  .dark ::before,\n  .dark ::after {\n    border-color: #374151;\n  }\n\n  .dark {\n    input[type=\"time\"]::-webkit-calendar-picker-indicator{\n      filter: invert(100%);\n    }\n  }\n}\n\n:root {\n  --font-family-sans: Inter, -apple-system, BlinkMacSystemFont, ui-sans-serif, system-ui, sans-serif;\n  --font-family-mono: ui-monospace, monospace;\n  --border-color: 226, 232, 240;\n  --primary-color-50: 236, 253, 245;\n  --primary-color-100: 209, 250, 229;\n  --primary-color-200: 167, 243, 208;\n  --primary-color-300: 110, 231, 183;\n  --primary-color-400: 52, 211, 153;\n  --primary-color-500: 16, 185, 129;\n  --primary-color-600: 5, 150, 105;\n  --primary-color-700: 4, 120, 87;\n  --primary-color-800: 6, 95, 70;\n  --primary-color-900: 6, 78, 59;\n  --primary-color-950: 2, 44, 34;\n  --secondary-color-50: 248, 250, 252;\n  --secondary-color-100: 241, 245, 249;\n  --secondary-color-200: 226, 232, 240;\n  --secondary-color-300: 203, 213, 225;\n  --secondary-color-400: 148, 163, 184;\n  --secondary-color-500: 100, 116, 139;\n  --secondary-color-600: 71, 85, 105;\n  --secondary-color-700: 51, 65, 85;\n  --secondary-color-800: 30, 41, 59;\n  --secondary-color-900: 15, 23, 42;\n  --secondary-color-950: 2, 6, 23;\n  --success-color-50: 240, 253, 244;\n  --success-color-100: 220, 252, 231;\n  --success-color-200: 187, 247, 208;\n  --success-color-300: 134, 239, 172;\n  --success-color-400: 74, 222, 128;\n  --success-color-500: 34, 197, 94;\n  --success-color-600: 22, 163, 74;\n  --success-color-700: 21, 128, 61;\n  --success-color-800: 22, 101, 52;\n  --success-color-900: 20, 83, 45;\n  --success-color-950: 5, 46, 22;\n  --warning-color-50: 254, 252, 232;\n  --warning-color-100: 254, 249, 195;\n  --warning-color-200: 254, 240, 138;\n  --warning-color-300: 253, 224, 71;\n  --warning-color-400: 250, 204, 21;\n  --warning-color-500: 234, 179, 8;\n  --warning-color-600: 202, 138, 4;\n  --warning-color-700: 161, 98, 7;\n  --warning-color-800: 133, 77, 14;\n  --warning-color-900: 113, 63, 18;\n  --warning-color-950: 66, 32, 6;\n  --error-color-50: 254, 242, 242;\n  --error-color-100: 254, 226, 226;\n  --error-color-200: 254, 202, 202;\n  --error-color-300: 252, 165, 165;\n  --error-color-400: 248, 113, 113;\n  --error-color-500: 239, 68, 68;\n  --error-color-600: 220, 38, 38;\n  --error-color-700: 185, 28, 28;\n  --error-color-800: 153, 27, 27;\n  --error-color-900: 127, 29, 29;\n  --error-color-950: 69, 10, 10;\n}\n";
+var e = "\n@layer base {\n  html {\n    color: #111827;\n    background-color: white;\n    color-scheme: light;\n  }\n\n  html.dark {\n    color: #f3f4f6;\n    background-color: #111827;\n  }\n\n  body {\n    font-size: 14px;\n  }\n\n  *,\n  ::before,\n  ::after {\n    border-color: #e5e7eb;\n  }\n\n  .dark *,\n  .dark ::before,\n  .dark ::after {\n    border-color: #374151;\n  }\n\n  .dark {\n    color-scheme: dark;\n  }\n}\n\n:root {\n  --font-family-sans: Inter, -apple-system, BlinkMacSystemFont, ui-sans-serif, system-ui, sans-serif;\n  --font-family-mono: ui-monospace, monospace;\n  --border-color: 226, 232, 240;\n  --primary-color-50: 236, 253, 245;\n  --primary-color-100: 209, 250, 229;\n  --primary-color-200: 167, 243, 208;\n  --primary-color-300: 110, 231, 183;\n  --primary-color-400: 52, 211, 153;\n  --primary-color-500: 16, 185, 129;\n  --primary-color-600: 5, 150, 105;\n  --primary-color-700: 4, 120, 87;\n  --primary-color-800: 6, 95, 70;\n  --primary-color-900: 6, 78, 59;\n  --primary-color-950: 2, 44, 34;\n  --secondary-color-50: 248, 250, 252;\n  --secondary-color-100: 241, 245, 249;\n  --secondary-color-200: 226, 232, 240;\n  --secondary-color-300: 203, 213, 225;\n  --secondary-color-400: 148, 163, 184;\n  --secondary-color-500: 100, 116, 139;\n  --secondary-color-600: 71, 85, 105;\n  --secondary-color-700: 51, 65, 85;\n  --secondary-color-800: 30, 41, 59;\n  --secondary-color-900: 15, 23, 42;\n  --secondary-color-950: 2, 6, 23;\n  --success-color-50: 240, 253, 244;\n  --success-color-100: 220, 252, 231;\n  --success-color-200: 187, 247, 208;\n  --success-color-300: 134, 239, 172;\n  --success-color-400: 74, 222, 128;\n  --success-color-500: 34, 197, 94;\n  --success-color-600: 22, 163, 74;\n  --success-color-700: 21, 128, 61;\n  --success-color-800: 22, 101, 52;\n  --success-color-900: 20, 83, 45;\n  --success-color-950: 5, 46, 22;\n  --warning-color-50: 254, 252, 232;\n  --warning-color-100: 254, 249, 195;\n  --warning-color-200: 254, 240, 138;\n  --warning-color-300: 253, 224, 71;\n  --warning-color-400: 250, 204, 21;\n  --warning-color-500: 234, 179, 8;\n  --warning-color-600: 202, 138, 4;\n  --warning-color-700: 161, 98, 7;\n  --warning-color-800: 133, 77, 14;\n  --warning-color-900: 113, 63, 18;\n  --warning-color-950: 66, 32, 6;\n  --error-color-50: 254, 242, 242;\n  --error-color-100: 254, 226, 226;\n  --error-color-200: 254, 202, 202;\n  --error-color-300: 252, 165, 165;\n  --error-color-400: 248, 113, 113;\n  --error-color-500: 239, 68, 68;\n  --error-color-600: 220, 38, 38;\n  --error-color-700: 185, 28, 28;\n  --error-color-800: 153, 27, 27;\n  --error-color-900: 127, 29, 29;\n  --error-color-950: 69, 10, 10;\n}\n";
 //#endregion
 export { e as default };

package/lib/themes/carbon/styles.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "\n@layer base {\n  html {\n    color: #111827;\n    background-color: white;\n  }\n\n  html.dark {\n    color: #f3f4f6;\n    background-color: #111827;\n  }\n\n  *,\n  ::before,\n  ::after {\n    border-color: #e5e7eb;\n  }\n\n  .dark *,\n  .dark ::before,\n  .dark ::after {\n    border-color: #374151;\n  }\n\n  .dark {\n    input[type=\"time\"]::-webkit-calendar-picker-indicator{\n      filter: invert(100%);\n    }\n  }\n}\n\n:root {\n  --font-family-sans: \"IBM Plex Sans\", \"Helvetica Neue\", arial, sans-serif;\n  --font-family-mono: \"IBM Plex Mono\", \"Menlo\", \"DejaVu Sans Mono\", \"Bitstream Vera Sans Mono\", courier, monospace;\n  --border-color: 226, 232, 240;\n  --primary-color-50: 236, 253, 245;\n  --primary-color-100: 209, 250, 229;\n  --primary-color-200: 167, 243, 208;\n  --primary-color-300: 110, 231, 183;\n  --primary-color-400: 52, 211, 153;\n  --primary-color-500: 16, 185, 129;\n  --primary-color-600: 5, 150, 105;\n  --primary-color-700: 4, 120, 87;\n  --primary-color-800: 6, 95, 70;\n  --primary-color-900: 6, 78, 59;\n  --primary-color-950: 2, 44, 34;\n  --secondary-color-50: 248, 250, 252;\n  --secondary-color-100: 241, 245, 249;\n  --secondary-color-200: 226, 232, 240;\n  --secondary-color-300: 203, 213, 225;\n  --secondary-color-400: 148, 163, 184;\n  --secondary-color-500: 100, 116, 139;\n  --secondary-color-600: 71, 85, 105;\n  --secondary-color-700: 51, 65, 85;\n  --secondary-color-800: 30, 41, 59;\n  --secondary-color-900: 15, 23, 42;\n  --secondary-color-950: 2, 6, 23;\n  --success-color-50: 240, 253, 244;\n  --success-color-100: 220, 252, 231;\n  --success-color-200: 187, 247, 208;\n  --success-color-300: 134, 239, 172;\n  --success-color-400: 74, 222, 128;\n  --success-color-500: 34, 197, 94;\n  --success-color-600: 22, 163, 74;\n  --success-color-700: 21, 128, 61;\n  --success-color-800: 22, 101, 52;\n  --success-color-900: 20, 83, 45;\n  --success-color-950: 5, 46, 22;\n  --warning-color-50: 254, 252, 232;\n  --warning-color-100: 254, 249, 195;\n  --warning-color-200: 254, 240, 138;\n  --warning-color-300: 253, 224, 71;\n  --warning-color-400: 250, 204, 21;\n  --warning-color-500: 234, 179, 8;\n  --warning-color-600: 202, 138, 4;\n  --warning-color-700: 161, 98, 7;\n  --warning-color-800: 133, 77, 14;\n  --warning-color-900: 113, 63, 18;\n  --warning-color-950: 66, 32, 6;\n  --error-color-50: 254, 242, 242;\n  --error-color-100: 254, 226, 226;\n  --error-color-200: 254, 202, 202;\n  --error-color-300: 252, 165, 165;\n  --error-color-400: 248, 113, 113;\n  --error-color-500: 239, 68, 68;\n  --error-color-600: 220, 38, 38;\n  --error-color-700: 185, 28, 28;\n  --error-color-800: 153, 27, 27;\n  --error-color-900: 127, 29, 29;\n  --error-color-950: 69, 10, 10;\n}\n";
+declare const _default: "\n@layer base {\n  html {\n    color: #111827;\n    background-color: white;\n    color-scheme: light;\n  }\n\n  html.dark {\n    color: #f3f4f6;\n    background-color: #111827;\n  }\n\n  *,\n  ::before,\n  ::after {\n    border-color: #e5e7eb;\n  }\n\n  .dark *,\n  .dark ::before,\n  .dark ::after {\n    border-color: #374151;\n  }\n\n  .dark {\n    color-scheme: dark;\n  }\n}\n\n:root {\n  --font-family-sans: \"IBM Plex Sans\", \"Helvetica Neue\", arial, sans-serif;\n  --font-family-mono: \"IBM Plex Mono\", \"Menlo\", \"DejaVu Sans Mono\", \"Bitstream Vera Sans Mono\", courier, monospace;\n  --border-color: 226, 232, 240;\n  --primary-color-50: 236, 253, 245;\n  --primary-color-100: 209, 250, 229;\n  --primary-color-200: 167, 243, 208;\n  --primary-color-300: 110, 231, 183;\n  --primary-color-400: 52, 211, 153;\n  --primary-color-500: 16, 185, 129;\n  --primary-color-600: 5, 150, 105;\n  --primary-color-700: 4, 120, 87;\n  --primary-color-800: 6, 95, 70;\n  --primary-color-900: 6, 78, 59;\n  --primary-color-950: 2, 44, 34;\n  --secondary-color-50: 248, 250, 252;\n  --secondary-color-100: 241, 245, 249;\n  --secondary-color-200: 226, 232, 240;\n  --secondary-color-300: 203, 213, 225;\n  --secondary-color-400: 148, 163, 184;\n  --secondary-color-500: 100, 116, 139;\n  --secondary-color-600: 71, 85, 105;\n  --secondary-color-700: 51, 65, 85;\n  --secondary-color-800: 30, 41, 59;\n  --secondary-color-900: 15, 23, 42;\n  --secondary-color-950: 2, 6, 23;\n  --success-color-50: 240, 253, 244;\n  --success-color-100: 220, 252, 231;\n  --success-color-200: 187, 247, 208;\n  --success-color-300: 134, 239, 172;\n  --success-color-400: 74, 222, 128;\n  --success-color-500: 34, 197, 94;\n  --success-color-600: 22, 163, 74;\n  --success-color-700: 21, 128, 61;\n  --success-color-800: 22, 101, 52;\n  --success-color-900: 20, 83, 45;\n  --success-color-950: 5, 46, 22;\n  --warning-color-50: 254, 252, 232;\n  --warning-color-100: 254, 249, 195;\n  --warning-color-200: 254, 240, 138;\n  --warning-color-300: 253, 224, 71;\n  --warning-color-400: 250, 204, 21;\n  --warning-color-500: 234, 179, 8;\n  --warning-color-600: 202, 138, 4;\n  --warning-color-700: 161, 98, 7;\n  --warning-color-800: 133, 77, 14;\n  --warning-color-900: 113, 63, 18;\n  --warning-color-950: 66, 32, 6;\n  --error-color-50: 254, 242, 242;\n  --error-color-100: 254, 226, 226;\n  --error-color-200: 254, 202, 202;\n  --error-color-300: 252, 165, 165;\n  --error-color-400: 248, 113, 113;\n  --error-color-500: 239, 68, 68;\n  --error-color-600: 220, 38, 38;\n  --error-color-700: 185, 28, 28;\n  --error-color-800: 153, 27, 27;\n  --error-color-900: 127, 29, 29;\n  --error-color-950: 69, 10, 10;\n}\n";
 export default _default;

package/lib/themes/carbon/styles.js

@@ -1,4 +1,4 @@
 //#region src/themes/carbon/styles.ts
-var e = "\n@layer base {\n  html {\n    color: #111827;\n    background-color: white;\n  }\n\n  html.dark {\n    color: #f3f4f6;\n    background-color: #111827;\n  }\n\n  *,\n  ::before,\n  ::after {\n    border-color: #e5e7eb;\n  }\n\n  .dark *,\n  .dark ::before,\n  .dark ::after {\n    border-color: #374151;\n  }\n\n  .dark {\n    input[type=\"time\"]::-webkit-calendar-picker-indicator{\n      filter: invert(100%);\n    }\n  }\n}\n\n:root {\n  --font-family-sans: \"IBM Plex Sans\", \"Helvetica Neue\", arial, sans-serif;\n  --font-family-mono: \"IBM Plex Mono\", \"Menlo\", \"DejaVu Sans Mono\", \"Bitstream Vera Sans Mono\", courier, monospace;\n  --border-color: 226, 232, 240;\n  --primary-color-50: 236, 253, 245;\n  --primary-color-100: 209, 250, 229;\n  --primary-color-200: 167, 243, 208;\n  --primary-color-300: 110, 231, 183;\n  --primary-color-400: 52, 211, 153;\n  --primary-color-500: 16, 185, 129;\n  --primary-color-600: 5, 150, 105;\n  --primary-color-700: 4, 120, 87;\n  --primary-color-800: 6, 95, 70;\n  --primary-color-900: 6, 78, 59;\n  --primary-color-950: 2, 44, 34;\n  --secondary-color-50: 248, 250, 252;\n  --secondary-color-100: 241, 245, 249;\n  --secondary-color-200: 226, 232, 240;\n  --secondary-color-300: 203, 213, 225;\n  --secondary-color-400: 148, 163, 184;\n  --secondary-color-500: 100, 116, 139;\n  --secondary-color-600: 71, 85, 105;\n  --secondary-color-700: 51, 65, 85;\n  --secondary-color-800: 30, 41, 59;\n  --secondary-color-900: 15, 23, 42;\n  --secondary-color-950: 2, 6, 23;\n  --success-color-50: 240, 253, 244;\n  --success-color-100: 220, 252, 231;\n  --success-color-200: 187, 247, 208;\n  --success-color-300: 134, 239, 172;\n  --success-color-400: 74, 222, 128;\n  --success-color-500: 34, 197, 94;\n  --success-color-600: 22, 163, 74;\n  --success-color-700: 21, 128, 61;\n  --success-color-800: 22, 101, 52;\n  --success-color-900: 20, 83, 45;\n  --success-color-950: 5, 46, 22;\n  --warning-color-50: 254, 252, 232;\n  --warning-color-100: 254, 249, 195;\n  --warning-color-200: 254, 240, 138;\n  --warning-color-300: 253, 224, 71;\n  --warning-color-400: 250, 204, 21;\n  --warning-color-500: 234, 179, 8;\n  --warning-color-600: 202, 138, 4;\n  --warning-color-700: 161, 98, 7;\n  --warning-color-800: 133, 77, 14;\n  --warning-color-900: 113, 63, 18;\n  --warning-color-950: 66, 32, 6;\n  --error-color-50: 254, 242, 242;\n  --error-color-100: 254, 226, 226;\n  --error-color-200: 254, 202, 202;\n  --error-color-300: 252, 165, 165;\n  --error-color-400: 248, 113, 113;\n  --error-color-500: 239, 68, 68;\n  --error-color-600: 220, 38, 38;\n  --error-color-700: 185, 28, 28;\n  --error-color-800: 153, 27, 27;\n  --error-color-900: 127, 29, 29;\n  --error-color-950: 69, 10, 10;\n}\n";
+var e = "\n@layer base {\n  html {\n    color: #111827;\n    background-color: white;\n    color-scheme: light;\n  }\n\n  html.dark {\n    color: #f3f4f6;\n    background-color: #111827;\n  }\n\n  *,\n  ::before,\n  ::after {\n    border-color: #e5e7eb;\n  }\n\n  .dark *,\n  .dark ::before,\n  .dark ::after {\n    border-color: #374151;\n  }\n\n  .dark {\n    color-scheme: dark;\n  }\n}\n\n:root {\n  --font-family-sans: \"IBM Plex Sans\", \"Helvetica Neue\", arial, sans-serif;\n  --font-family-mono: \"IBM Plex Mono\", \"Menlo\", \"DejaVu Sans Mono\", \"Bitstream Vera Sans Mono\", courier, monospace;\n  --border-color: 226, 232, 240;\n  --primary-color-50: 236, 253, 245;\n  --primary-color-100: 209, 250, 229;\n  --primary-color-200: 167, 243, 208;\n  --primary-color-300: 110, 231, 183;\n  --primary-color-400: 52, 211, 153;\n  --primary-color-500: 16, 185, 129;\n  --primary-color-600: 5, 150, 105;\n  --primary-color-700: 4, 120, 87;\n  --primary-color-800: 6, 95, 70;\n  --primary-color-900: 6, 78, 59;\n  --primary-color-950: 2, 44, 34;\n  --secondary-color-50: 248, 250, 252;\n  --secondary-color-100: 241, 245, 249;\n  --secondary-color-200: 226, 232, 240;\n  --secondary-color-300: 203, 213, 225;\n  --secondary-color-400: 148, 163, 184;\n  --secondary-color-500: 100, 116, 139;\n  --secondary-color-600: 71, 85, 105;\n  --secondary-color-700: 51, 65, 85;\n  --secondary-color-800: 30, 41, 59;\n  --secondary-color-900: 15, 23, 42;\n  --secondary-color-950: 2, 6, 23;\n  --success-color-50: 240, 253, 244;\n  --success-color-100: 220, 252, 231;\n  --success-color-200: 187, 247, 208;\n  --success-color-300: 134, 239, 172;\n  --success-color-400: 74, 222, 128;\n  --success-color-500: 34, 197, 94;\n  --success-color-600: 22, 163, 74;\n  --success-color-700: 21, 128, 61;\n  --success-color-800: 22, 101, 52;\n  --success-color-900: 20, 83, 45;\n  --success-color-950: 5, 46, 22;\n  --warning-color-50: 254, 252, 232;\n  --warning-color-100: 254, 249, 195;\n  --warning-color-200: 254, 240, 138;\n  --warning-color-300: 253, 224, 71;\n  --warning-color-400: 250, 204, 21;\n  --warning-color-500: 234, 179, 8;\n  --warning-color-600: 202, 138, 4;\n  --warning-color-700: 161, 98, 7;\n  --warning-color-800: 133, 77, 14;\n  --warning-color-900: 113, 63, 18;\n  --warning-color-950: 66, 32, 6;\n  --error-color-50: 254, 242, 242;\n  --error-color-100: 254, 226, 226;\n  --error-color-200: 254, 202, 202;\n  --error-color-300: 252, 165, 165;\n  --error-color-400: 248, 113, 113;\n  --error-color-500: 239, 68, 68;\n  --error-color-600: 220, 38, 38;\n  --error-color-700: 185, 28, 28;\n  --error-color-800: 153, 27, 27;\n  --error-color-900: 127, 29, 29;\n  --error-color-950: 69, 10, 10;\n}\n";
 //#endregion
 export { e as default };

package/lib/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "2.0.0";
+declare const _default: "2.1.0";
 export default _default;

package/lib/version.js

@@ -1,4 +1,4 @@
 //#region src/version.ts
-var e = "2.0.0";
+var e = "2.1.0";
 //#endregion
 export { e as default };

package/lib/virtual/components/infiniteLoader/InfiniteLoader.vue.d.ts

@@ -1,40 +1,51 @@
+import type { PropType } from 'vue';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     isRowLoaded: {
-        type: import("vue").PropType<(index: number) => boolean>;
-        required: true;
+        type: PropType<(index: number) => boolean>;
+        required: boolean;
+        description: string;
     };
     loadMoreRows: {
-        type: import("vue").PropType<(startIndex: number, stopIndex: number) => Promise<void>>;
-        required: true;
+        type: PropType<(startIndex: number, stopIndex: number) => Promise<void>>;
+        required: boolean;
+        description: string;
     };
     minimumBatchSize: {
-        type: import("vue").PropType<number>;
+        type: NumberConstructor;
+        description: string;
     };
     threshold: {
-        type: import("vue").PropType<number>;
+        type: NumberConstructor;
+        description: string;
     };
     rowCount: {
-        type: import("vue").PropType<number>;
-        required: true;
+        type: NumberConstructor;
+        required: boolean;
+        description: string;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     isRowLoaded: {
-        type: import("vue").PropType<(index: number) => boolean>;
-        required: true;
+        type: PropType<(index: number) => boolean>;
+        required: boolean;
+        description: string;
     };
     loadMoreRows: {
-        type: import("vue").PropType<(startIndex: number, stopIndex: number) => Promise<void>>;
-        required: true;
+        type: PropType<(startIndex: number, stopIndex: number) => Promise<void>>;
+        required: boolean;
+        description: string;
     };
     minimumBatchSize: {
-        type: import("vue").PropType<number>;
+        type: NumberConstructor;
+        description: string;
     };
     threshold: {
-        type: import("vue").PropType<number>;
+        type: NumberConstructor;
+        description: string;
     };
     rowCount: {
-        type: import("vue").PropType<number>;
-        required: true;
+        type: NumberConstructor;
+        required: boolean;
+        description: string;
     };
 }>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
     default?(_: {

package/lib/virtual/components/infiniteLoader/InfiniteLoader.vue_vue_type_script_setup_true_lang.js

@@ -1,13 +1,33 @@
 import { useInfiniteLoader as e } from "../../composables/infinite-loader/useInfiniteLoader.js";
 import { defineComponent as t, renderSlot as n, unref as r } from "vue";
+//#region src/virtual/components/infiniteLoader/InfiniteLoader.vue?vue&type=script&setup=true&lang.ts
 var i = /* @__PURE__ */ t({
 	name: "XInfiniteLoader",
+	docs: { slots: { default: "Render prop slot; receives `onRowsRendered` to wire into a virtual list." } },
 	props: {
-		isRowLoaded: { type: Function },
-		loadMoreRows: { type: Function },
-		minimumBatchSize: {},
-		threshold: {},
-		rowCount: {}
+		isRowLoaded: {
+			type: Function,
+			required: !0,
+			description: "Returns whether the row at the given index is already loaded."
+		},
+		loadMoreRows: {
+			type: Function,
+			required: !0,
+			description: "Loads more rows for the given index range; resolve when finished."
+		},
+		minimumBatchSize: {
+			type: Number,
+			description: "Minimum rows to request per load (default 10). Batches HTTP fetches."
+		},
+		threshold: {
+			type: Number,
+			description: "Prefetch when the user scrolls within this many rows of unloaded data (default 15)."
+		},
+		rowCount: {
+			type: Number,
+			required: !0,
+			description: "Total row count; may be an upper bound if the true size is unknown."
+		}
 	},
 	setup(t) {
 		let { onRowsRendered: i } = e(t);

package/lib/virtual/components/virtualGrid/VirtualGrid.vue.d.ts

@@ -1,59 +1,40 @@
-import { type CSSProperties } from 'vue';
+import { type CSSProperties, type PropType } from 'vue';
 import type { Align } from '../../types';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    tag: {
-        type: import("vue").PropType<keyof HTMLElementTagNameMap>;
-        default: string;
-    };
-    dir: {
-        type: import("vue").PropType<"rtl" | "ltr" | "auto">;
+    cellProps: {
+        type: PropType<Record<string, unknown>>;
+        description: string;
     };
     class: {
-        type: import("vue").PropType<string>;
-    };
-    style: {
-        type: import("vue").PropType<CSSProperties>;
-    };
-    onResize: {
-        type: import("vue").PropType<(size: {
-            height: number;
-            width: number;
-        }, prevSize: {
-            height: number;
-            width: number;
-        }) => void>;
+        type: StringConstructor;
+        description: string;
     };
     columnCount: {
-        type: import("vue").PropType<number>;
-        required: true;
+        type: NumberConstructor;
+        required: boolean;
+        description: string;
     };
     columnWidth: {
-        type: import("vue").PropType<string | number | ((index: number, cellProps: Record<string, unknown>) => number)>;
-        required: true;
-    };
-    rowCount: {
-        type: import("vue").PropType<number>;
-        required: true;
-    };
-    overscanCount: {
-        type: import("vue").PropType<number>;
-        default: number;
-    };
-    cellProps: {
-        type: import("vue").PropType<{
-            [x: string]: unknown;
-        }>;
+        type: PropType<string | number | ((index: number, cellProps: Record<string, unknown>) => number)>;
+        required: boolean;
+        description: string;
     };
     defaultHeight: {
-        type: import("vue").PropType<number>;
+        type: NumberConstructor;
         default: number;
+        description: string;
     };
     defaultWidth: {
-        type: import("vue").PropType<number>;
+        type: NumberConstructor;
         default: number;
+        description: string;
+    };
+    dir: {
+        type: PropType<"rtl" | "ltr" | "auto">;
+        description: string;
     };
     onCellsRendered: {
-        type: import("vue").PropType<(visibleCells: {
+        type: PropType<(visibleCells: {
             columnStartIndex: number;
             columnStopIndex: number;
             rowStartIndex: number;
@@ -64,10 +45,41 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
             rowStartIndex: number;
             rowStopIndex: number;
         }) => void>;
+        description: string;
+    };
+    onResize: {
+        type: PropType<(size: {
+            height: number;
+            width: number;
+        }, prevSize: {
+            height: number;
+            width: number;
+        }) => void>;
+        description: string;
+    };
+    overscanCount: {
+        type: NumberConstructor;
+        default: number;
+        description: string;
+    };
+    rowCount: {
+        type: NumberConstructor;
+        required: boolean;
+        description: string;
     };
     rowHeight: {
-        type: import("vue").PropType<string | number | ((index: number, cellProps: Record<string, unknown>) => number)>;
-        required: true;
+        type: PropType<string | number | ((index: number, cellProps: Record<string, unknown>) => number)>;
+        required: boolean;
+        description: string;
+    };
+    style: {
+        type: PropType<CSSProperties>;
+        description: string;
+    };
+    tag: {
+        type: PropType<keyof HTMLElementTagNameMap>;
+        default: string;
+        description: string;
     };
 }>, {
     element: HTMLDivElement | null;
@@ -89,59 +101,40 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
         index: number;
     }): void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    tag: {
-        type: import("vue").PropType<keyof HTMLElementTagNameMap>;
-        default: string;
-    };
-    dir: {
-        type: import("vue").PropType<"rtl" | "ltr" | "auto">;
+    cellProps: {
+        type: PropType<Record<string, unknown>>;
+        description: string;
     };
     class: {
-        type: import("vue").PropType<string>;
-    };
-    style: {
-        type: import("vue").PropType<CSSProperties>;
-    };
-    onResize: {
-        type: import("vue").PropType<(size: {
-            height: number;
-            width: number;
-        }, prevSize: {
-            height: number;
-            width: number;
-        }) => void>;
+        type: StringConstructor;
+        description: string;
     };
     columnCount: {
-        type: import("vue").PropType<number>;
-        required: true;
+        type: NumberConstructor;
+        required: boolean;
+        description: string;
     };
     columnWidth: {
-        type: import("vue").PropType<string | number | ((index: number, cellProps: Record<string, unknown>) => number)>;
-        required: true;
-    };
-    rowCount: {
-        type: import("vue").PropType<number>;
-        required: true;
-    };
-    overscanCount: {
-        type: import("vue").PropType<number>;
-        default: number;
-    };
-    cellProps: {
-        type: import("vue").PropType<{
-            [x: string]: unknown;
-        }>;
+        type: PropType<string | number | ((index: number, cellProps: Record<string, unknown>) => number)>;
+        required: boolean;
+        description: string;
     };
     defaultHeight: {
-        type: import("vue").PropType<number>;
+        type: NumberConstructor;
         default: number;
+        description: string;
     };
     defaultWidth: {
-        type: import("vue").PropType<number>;
+        type: NumberConstructor;
         default: number;
+        description: string;
+    };
+    dir: {
+        type: PropType<"rtl" | "ltr" | "auto">;
+        description: string;
     };
     onCellsRendered: {
-        type: import("vue").PropType<(visibleCells: {
+        type: PropType<(visibleCells: {
             columnStartIndex: number;
             columnStopIndex: number;
             rowStartIndex: number;
@@ -152,10 +145,41 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
             rowStartIndex: number;
             rowStopIndex: number;
         }) => void>;
+        description: string;
+    };
+    onResize: {
+        type: PropType<(size: {
+            height: number;
+            width: number;
+        }, prevSize: {
+            height: number;
+            width: number;
+        }) => void>;
+        description: string;
+    };
+    overscanCount: {
+        type: NumberConstructor;
+        default: number;
+        description: string;
+    };
+    rowCount: {
+        type: NumberConstructor;
+        required: boolean;
+        description: string;
     };
     rowHeight: {
-        type: import("vue").PropType<string | number | ((index: number, cellProps: Record<string, unknown>) => number)>;
-        required: true;
+        type: PropType<string | number | ((index: number, cellProps: Record<string, unknown>) => number)>;
+        required: boolean;
+        description: string;
+    };
+    style: {
+        type: PropType<CSSProperties>;
+        description: string;
+    };
+    tag: {
+        type: PropType<keyof HTMLElementTagNameMap>;
+        default: string;
+        description: string;
     };
 }>> & Readonly<{}>, {
     tag: keyof HTMLElementTagNameMap;
@@ -171,9 +195,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
             'aria-colindex': number;
             role: 'gridcell';
         };
-        props: {
-            [x: string]: unknown;
-        } & Record<string, unknown>;
+        props: Record<string, unknown>;
     }): any;
     default?(_: {}): any;
 }>;

package/lib/virtual/components/virtualGrid/VirtualGrid.vue_vue_type_script_setup_true_lang.js

@@ -4,21 +4,91 @@ import { Fragment as n, computed as r, createBlock as i, createElementBlock as a
 //#region src/virtual/components/virtualGrid/VirtualGrid.vue?vue&type=script&setup=true&lang.ts
 var v = ["aria-rowindex"], y = /* @__PURE__ */ s({
 	name: "XVirtualGrid",
+	docs: {
+		slots: {
+			cell: "Render a single cell. Receives columnIndex, rowIndex, style, ariaAttributes, and props.",
+			default: "Optional content rendered after the virtualized cells."
+		},
+		methods: {
+			scrollToCell: "Scroll so the given cell (row and column) is visible.",
+			scrollToColumn: "Scroll so the given column index is visible.",
+			scrollToRow: "Scroll so the given row index is visible.",
+			element: "Root HTML element when mounted, otherwise null."
+		}
+	},
 	props: {
-		cellProps: {},
-		class: {},
-		columnCount: {},
-		columnWidth: {},
-		defaultHeight: { default: 0 },
-		defaultWidth: { default: 0 },
-		dir: {},
-		onCellsRendered: {},
-		onResize: {},
-		overscanCount: { default: 3 },
-		rowCount: {},
-		rowHeight: {},
-		style: {},
-		tag: { default: "div" }
+		cellProps: {
+			type: Object,
+			description: "Extra props passed to the cell slot as `props`."
+		},
+		class: {
+			type: String,
+			description: "CSS class name on the root element."
+		},
+		columnCount: {
+			type: Number,
+			required: !0,
+			description: "Total number of columns in the grid."
+		},
+		columnWidth: {
+			type: [
+				Number,
+				String,
+				Function
+			],
+			required: !0,
+			description: "Column width as px, percent string, or a function of index."
+		},
+		defaultHeight: {
+			type: Number,
+			default: 0,
+			description: "Initial grid height before measure; important for SSR."
+		},
+		defaultWidth: {
+			type: Number,
+			default: 0,
+			description: "Initial grid width before measure; important for SSR."
+		},
+		dir: {
+			type: String,
+			description: "Text directionality for cell layout (ltr, rtl, or auto)."
+		},
+		onCellsRendered: {
+			type: Function,
+			description: "Called when the visible or overscan cell range changes."
+		},
+		onResize: {
+			type: Function,
+			description: "Called when the grid root resizes."
+		},
+		overscanCount: {
+			type: Number,
+			default: 3,
+			description: "Extra rows/columns rendered outside the visible area."
+		},
+		rowCount: {
+			type: Number,
+			required: !0,
+			description: "Total number of rows in the grid."
+		},
+		rowHeight: {
+			type: [
+				Number,
+				String,
+				Function
+			],
+			required: !0,
+			description: "Row height as px, percent string, or a function of index."
+		},
+		style: {
+			type: Object,
+			description: "Inline styles; the grid fills the size defined here."
+		},
+		tag: {
+			type: String,
+			default: "div",
+			description: "Root element tag."
+		}
 	},
 	setup(s, { expose: y }) {
 		let b = s, x = d(null), S = r(() => b.cellProps || {}), C = e(x, b.dir), { getCellBounds: w, getEstimatedSize: T, startIndexOverscan: E, startIndexVisible: D, scrollToIndex: O, stopIndexOverscan: k, stopIndexVisible: A } = t({
@@ -31,7 +101,7 @@ var v = ["aria-rowindex"], y = /* @__PURE__ */ s({
 			itemProps: S.value,
 			itemSize: b.columnWidth,
 			onResize: b.onResize,
-			overscanCount: b.overscanCount
+			overscanCount: b.overscanCount ?? 3
 		}), { getCellBounds: j, getEstimatedSize: M, startIndexOverscan: N, startIndexVisible: P, scrollToIndex: F, stopIndexOverscan: I, stopIndexVisible: L } = t({
 			containerElement: x,
 			containerStyle: b.style,
@@ -41,7 +111,7 @@ var v = ["aria-rowindex"], y = /* @__PURE__ */ s({
 			itemProps: S.value,
 			itemSize: b.rowHeight,
 			onResize: b.onResize,
-			overscanCount: b.overscanCount
+			overscanCount: b.overscanCount ?? 3
 		});
 		y({
 			get element() {
@@ -140,7 +210,7 @@ var v = ["aria-rowindex"], y = /* @__PURE__ */ s({
 			}
 			return e;
 		});
-		return (e, t) => (u(), i(m(s.tag), {
+		return (e, t) => (u(), i(m(e.tag), {
 			ref_key: "element",
 			ref: x,
 			class: c(e.$props.class),
@@ -150,12 +220,12 @@ var v = ["aria-rowindex"], y = /* @__PURE__ */ s({
 				maxWidth: "100%",
 				flexGrow: 1,
 				overflow: "auto",
-				...s.style
+				...e.style
 			}),
-			dir: s.dir,
+			dir: e.dir,
 			role: "grid",
-			"aria-colcount": s.columnCount,
-			"aria-rowcount": s.rowCount
+			"aria-colcount": e.columnCount,
+			"aria-rowcount": e.rowCount
 		}, {
 			default: _(() => [
 				(u(!0), a(n, null, f(R.value, (t) => (u(), a("div", {