smartsell-ui-kit 0.1.3 → 0.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -21,7 +21,7 @@ function styleInject(css, { insertAt } = {}) {
21
21
  }
22
22
 
23
23
  // src/styles/ui-kit.css
24
- styleInject('.ui-kit-sr-only {\n position: absolute;\n height: 1px;\n width: 1px;\n overflow: hidden;\n white-space: nowrap;\n border-width: 0px;\n padding: 0px;\n clip: rect(0, 0, 0, 0);\n margin: -1px;\n}\n.pointer-events-none {\n pointer-events: none;\n}\n.pointer-events-auto {\n pointer-events: auto;\n}\n.visible {\n visibility: visible;\n}\n.fixed {\n position: fixed;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.sticky {\n position: sticky;\n}\n.inset-0 {\n inset: 0px;\n}\n.inset-y-0 {\n top: 0px;\n bottom: 0px;\n}\n.left-0 {\n left: 0px;\n}\n.right-0 {\n right: 0px;\n}\n.top-1\\/2 {\n top: 50%;\n}\n.z-30 {\n z-index: 30;\n}\n.z-\\[70\\] {\n z-index: 70;\n}\n.m-0 {\n margin: 0px;\n}\n.mb-\\[18px\\] {\n margin-bottom: 18px;\n}\n.ml-1 {\n margin-left: 0.25rem;\n}\n.ml-4 {\n margin-left: 1rem;\n}\n.mr-1 {\n margin-right: 0.25rem;\n}\n.mt-0 {\n margin-top: 0px;\n}\n.mt-1 {\n margin-top: 0.25rem;\n}\n.mt-px {\n margin-top: 1px;\n}\n.box-border {\n box-sizing: border-box;\n}\n.block {\n display: block;\n}\n.inline {\n display: inline;\n}\n.flex {\n display: flex;\n}\n.inline-flex {\n display: inline-flex;\n}\n.table {\n display: table;\n}\n.grid {\n display: grid;\n}\n.hidden {\n display: none;\n}\n.h-14 {\n height: 3.5rem;\n}\n.h-2 {\n height: 0.5rem;\n}\n.h-5 {\n height: 1.25rem;\n}\n.h-\\[30px\\] {\n height: 30px;\n}\n.h-\\[34px\\] {\n height: 34px;\n}\n.h-\\[38px\\] {\n height: 38px;\n}\n.h-\\[42px\\] {\n height: 42px;\n}\n.h-\\[52px\\] {\n height: 52px;\n}\n.h-full {\n height: 100%;\n}\n.max-h-\\[280px\\] {\n max-height: 280px;\n}\n.min-h-0 {\n min-height: 0px;\n}\n.min-h-20 {\n min-height: 5rem;\n}\n.w-14 {\n width: 3.5rem;\n}\n.w-2 {\n width: 0.5rem;\n}\n.w-5 {\n width: 1.25rem;\n}\n.w-\\[25px\\] {\n width: 25px;\n}\n.w-\\[30px\\] {\n width: 30px;\n}\n.w-\\[52px\\] {\n width: 52px;\n}\n.w-auto {\n width: auto;\n}\n.w-fit {\n width: -moz-fit-content;\n width: fit-content;\n}\n.w-full {\n width: 100%;\n}\n.min-w-0 {\n min-width: 0px;\n}\n.min-w-full {\n min-width: 100%;\n}\n.max-w-fit {\n max-width: -moz-fit-content;\n max-width: fit-content;\n}\n.max-w-full {\n max-width: 100%;\n}\n.max-w-none {\n max-width: none;\n}\n.flex-1 {\n flex: 1 1 0%;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.border-separate {\n border-collapse: separate;\n}\n.border-spacing-0 {\n --tw-border-spacing-x: 0px;\n --tw-border-spacing-y: 0px;\n border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);\n}\n.-translate-y-1\\/2 {\n --tw-translate-y: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.cursor-default {\n cursor: default;\n}\n.cursor-not-allowed {\n cursor: not-allowed;\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.cursor-text {\n cursor: text;\n}\n.select-none {\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n}\n.resize-y {\n resize: vertical;\n}\n.resize {\n resize: both;\n}\n.appearance-none {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n}\n.flex-col {\n flex-direction: column;\n}\n.flex-wrap {\n flex-wrap: wrap;\n}\n.items-start {\n align-items: flex-start;\n}\n.items-center {\n align-items: center;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-between {\n justify-content: space-between;\n}\n.gap-0 {\n gap: 0px;\n}\n.gap-1 {\n gap: 0.25rem;\n}\n.gap-1\\.5 {\n gap: 0.375rem;\n}\n.gap-2 {\n gap: 0.5rem;\n}\n.gap-2\\.5 {\n gap: 0.625rem;\n}\n.gap-3 {\n gap: 0.75rem;\n}\n.gap-3\\.5 {\n gap: 0.875rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.self-stretch {\n align-self: stretch;\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-x-auto {\n overflow-x: auto;\n}\n.overflow-y-auto {\n overflow-y: auto;\n}\n.overflow-x-hidden {\n overflow-x: hidden;\n}\n.overflow-y-hidden {\n overflow-y: hidden;\n}\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.text-ellipsis {\n text-overflow: ellipsis;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.rounded-2xl {\n border-radius: 1rem;\n}\n.rounded-\\[0\\.4rem\\] {\n border-radius: 0.4rem;\n}\n.rounded-\\[11px\\] {\n border-radius: 11px;\n}\n.rounded-\\[14px\\] {\n border-radius: 14px;\n}\n.rounded-\\[20px\\] {\n border-radius: 20px;\n}\n.rounded-\\[24px\\] {\n border-radius: 24px;\n}\n.rounded-\\[28px\\] {\n border-radius: 28px;\n}\n.rounded-\\[30px\\] {\n border-radius: 30px;\n}\n.rounded-full {\n border-radius: 9999px;\n}\n.rounded-none {\n border-radius: 0px;\n}\n.rounded-xl {\n border-radius: 0.75rem;\n}\n.border {\n border-width: 1px;\n}\n.border-0 {\n border-width: 0px;\n}\n.border-2 {\n border-width: 2px;\n}\n.border-b {\n border-bottom-width: 1px;\n}\n.border-t {\n border-top-width: 1px;\n}\n.border-solid {\n border-style: solid;\n}\n.border-\\[var\\(--theme-negative\\)\\] {\n border-color: var(--theme-negative);\n}\n.border-\\[var\\(--theme-primary\\)\\] {\n border-color: var(--theme-primary);\n}\n.border-\\[var\\(--theme-textLight\\)\\] {\n border-color: var(--theme-textLight);\n}\n.border-\\[var\\(--ui-kit-accent\\)\\] {\n border-color: var(--ui-kit-accent);\n}\n.border-\\[var\\(--ui-kit-modal-primary\\)\\] {\n border-color: var(--ui-kit-modal-primary);\n}\n.border-transparent {\n border-color: transparent;\n}\n.bg-\\[color-mix\\(in_srgb\\,var\\(--ui-kit-accent\\)_24\\%\\,transparent\\)\\] {\n background-color: color-mix(in srgb, var(--ui-kit-accent) 24%, transparent);\n}\n.bg-\\[var\\(--theme-primary\\)\\] {\n background-color: var(--theme-primary);\n}\n.bg-\\[var\\(--theme-surface\\)\\] {\n background-color: var(--theme-surface);\n}\n.bg-\\[var\\(--theme-text\\)\\] {\n background-color: var(--theme-text);\n}\n.bg-\\[var\\(--ui-kit-accent\\)\\] {\n background-color: var(--ui-kit-accent);\n}\n.bg-\\[var\\(--ui-kit-modal-busy-overlay\\)\\] {\n background-color: var(--ui-kit-modal-busy-overlay);\n}\n.bg-\\[var\\(--ui-kit-modal-primary\\)\\] {\n background-color: var(--ui-kit-modal-primary);\n}\n.bg-\\[var\\(--ui-kit-select-option-hover-bg\\)\\] {\n background-color: var(--ui-kit-select-option-hover-bg);\n}\n.bg-\\[var\\(--ui-kit-select-option-selected-bg\\)\\] {\n background-color: var(--ui-kit-select-option-selected-bg);\n}\n.bg-\\[var\\(--ui-kit-surface-raised\\)\\] {\n background-color: var(--ui-kit-surface-raised);\n}\n.bg-transparent {\n background-color: transparent;\n}\n.bg-\\[linear-gradient\\(180deg\\,var\\(--ui-kit-modal-surface-raised\\)\\,var\\(--ui-kit-modal-surface\\)\\)\\] {\n background-image:\n linear-gradient(\n 180deg,\n var(--ui-kit-modal-surface-raised),\n var(--ui-kit-modal-surface));\n}\n.p-0 {\n padding: 0px;\n}\n.p-0\\.5 {\n padding: 0.125rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.p-6 {\n padding: 1.5rem;\n}\n.p-\\[18px\\] {\n padding: 18px;\n}\n.px-1 {\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.px-5 {\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n}\n.px-\\[1\\.15rem\\] {\n padding-left: 1.15rem;\n padding-right: 1.15rem;\n}\n.px-\\[10px\\] {\n padding-left: 10px;\n padding-right: 10px;\n}\n.px-\\[11px\\] {\n padding-left: 11px;\n padding-right: 11px;\n}\n.px-\\[13px\\] {\n padding-left: 13px;\n padding-right: 13px;\n}\n.px-\\[14px\\] {\n padding-left: 14px;\n padding-right: 14px;\n}\n.px-\\[18px\\] {\n padding-left: 18px;\n padding-right: 18px;\n}\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n}\n.py-\\[0\\.9rem\\] {\n padding-top: 0.9rem;\n padding-bottom: 0.9rem;\n}\n.py-\\[10px\\] {\n padding-top: 10px;\n padding-bottom: 10px;\n}\n.py-\\[11px\\] {\n padding-top: 11px;\n padding-bottom: 11px;\n}\n.py-\\[14px\\] {\n padding-top: 14px;\n padding-bottom: 14px;\n}\n.py-\\[18px\\] {\n padding-top: 18px;\n padding-bottom: 18px;\n}\n.py-\\[7px\\] {\n padding-top: 7px;\n padding-bottom: 7px;\n}\n.py-\\[9px\\] {\n padding-top: 9px;\n padding-bottom: 9px;\n}\n.pb-0\\.5 {\n padding-bottom: 0.125rem;\n}\n.pb-1 {\n padding-bottom: 0.25rem;\n}\n.pb-3 {\n padding-bottom: 0.75rem;\n}\n.pb-4 {\n padding-bottom: 1rem;\n}\n.pb-\\[10px\\] {\n padding-bottom: 10px;\n}\n.pl-6 {\n padding-left: 1.5rem;\n}\n.pr-6 {\n padding-right: 1.5rem;\n}\n.pt-1 {\n padding-top: 0.25rem;\n}\n.pt-1\\.5 {\n padding-top: 0.375rem;\n}\n.pt-2\\.5 {\n padding-top: 0.625rem;\n}\n.pt-3 {\n padding-top: 0.75rem;\n}\n.pt-\\[18px\\] {\n padding-top: 18px;\n}\n.text-left {\n text-align: left;\n}\n.text-center {\n text-align: center;\n}\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.text-\\[1\\.05rem\\] {\n font-size: 1.05rem;\n}\n.text-\\[10px\\] {\n font-size: 10px;\n}\n.text-\\[11px\\] {\n font-size: 11px;\n}\n.text-\\[13px\\] {\n font-size: 13px;\n}\n.text-\\[15px\\] {\n font-size: 15px;\n}\n.text-\\[18px\\] {\n font-size: 18px;\n}\n.text-\\[20px\\] {\n font-size: 20px;\n}\n.text-\\[24px\\] {\n font-size: 24px;\n}\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.font-bold {\n font-weight: 700;\n}\n.font-extrabold {\n font-weight: 800;\n}\n.font-normal {\n font-weight: 400;\n}\n.font-semibold {\n font-weight: 600;\n}\n.uppercase {\n text-transform: uppercase;\n}\n.leading-4 {\n line-height: 1rem;\n}\n.leading-\\[1\\.15\\] {\n line-height: 1.15;\n}\n.leading-\\[1\\.1\\] {\n line-height: 1.1;\n}\n.leading-\\[1\\.25\\] {\n line-height: 1.25;\n}\n.leading-\\[1\\.2\\] {\n line-height: 1.2;\n}\n.leading-\\[1\\.45\\] {\n line-height: 1.45;\n}\n.leading-\\[1\\.4\\] {\n line-height: 1.4;\n}\n.leading-\\[18px\\] {\n line-height: 18px;\n}\n.leading-none {\n line-height: 1;\n}\n.tracking-\\[0\\.01em\\] {\n letter-spacing: 0.01em;\n}\n.tracking-\\[0\\.06em\\] {\n letter-spacing: 0.06em;\n}\n.tracking-\\[0\\.08em\\] {\n letter-spacing: 0.08em;\n}\n.tracking-\\[0\\.16em\\] {\n letter-spacing: 0.16em;\n}\n.text-\\[var\\(--theme-negative\\)\\] {\n color: var(--theme-negative);\n}\n.text-\\[var\\(--theme-onPrimary\\)\\] {\n color: var(--theme-onPrimary);\n}\n.text-\\[var\\(--theme-primary\\)\\] {\n color: var(--theme-primary);\n}\n.text-\\[var\\(--theme-text\\)\\] {\n color: var(--theme-text);\n}\n.text-\\[var\\(--theme-textLight\\)\\] {\n color: var(--theme-textLight);\n}\n.text-\\[var\\(--ui-kit-accent\\)\\] {\n color: var(--ui-kit-accent);\n}\n.text-\\[var\\(--ui-kit-modal-on-primary\\)\\] {\n color: var(--ui-kit-modal-on-primary);\n}\n.text-\\[var\\(--ui-kit-modal-primary\\)\\] {\n color: var(--ui-kit-modal-primary);\n}\n.text-\\[var\\(--ui-kit-modal-text\\)\\] {\n color: var(--ui-kit-modal-text);\n}\n.text-\\[var\\(--ui-kit-muted-text\\)\\] {\n color: var(--ui-kit-muted-text);\n}\n.text-\\[var\\(--ui-kit-placeholder\\)\\] {\n color: var(--ui-kit-placeholder);\n}\n.text-\\[var\\(--ui-kit-select-indicator-disabled\\)\\] {\n color: var(--ui-kit-select-indicator-disabled);\n}\n.text-\\[var\\(--ui-kit-select-muted\\)\\] {\n color: var(--ui-kit-select-muted);\n}\n.text-\\[var\\(--ui-kit-select-option-disabled\\)\\] {\n color: var(--ui-kit-select-option-disabled);\n}\n.text-\\[var\\(--ui-kit-select-placeholder\\)\\] {\n color: var(--ui-kit-select-placeholder);\n}\n.opacity-0 {\n opacity: 0;\n}\n.opacity-100 {\n opacity: 1;\n}\n.opacity-45 {\n opacity: 0.45;\n}\n.opacity-80 {\n opacity: 0.8;\n}\n.opacity-\\[0\\.38\\] {\n opacity: 0.38;\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.shadow-\\[0_0_0_3px_var\\(--ui-kit-focus-ring\\)\\] {\n --tw-shadow: 0 0 0 3px var(--ui-kit-focus-ring);\n --tw-shadow-colored: 0 0 0 3px var(--tw-shadow-color);\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.shadow-\\[0px_4px_5px_var\\(--theme-shadow\\)\\] {\n --tw-shadow: 0px 4px 5px var(--theme-shadow);\n --tw-shadow-colored: 0px 4px 5px var(--tw-shadow-color);\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.shadow-\\[var\\(--ui-kit-modal-button-shadow-contained\\)\\] {\n --tw-shadow-color: var(--ui-kit-modal-button-shadow-contained);\n --tw-shadow: var(--tw-shadow-colored);\n}\n.shadow-\\[var\\(--ui-kit-modal-button-shadow-outlined\\)\\] {\n --tw-shadow-color: var(--ui-kit-modal-button-shadow-outlined);\n --tw-shadow: var(--tw-shadow-colored);\n}\n.shadow-\\[var\\(--ui-kit-modal-control-shadow\\)\\] {\n --tw-shadow-color: var(--ui-kit-modal-control-shadow);\n --tw-shadow: var(--tw-shadow-colored);\n}\n.outline-none {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.outline {\n outline-style: solid;\n}\n.saturate-0 {\n --tw-saturate: saturate(0);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.saturate-100 {\n --tw-saturate: saturate(1);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.saturate-\\[0\\.8\\] {\n --tw-saturate: saturate(0.8);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.filter {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.backdrop-blur-\\[2px\\] {\n --tw-backdrop-blur: blur(2px);\n backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n}\n.backdrop-blur-\\[8px\\] {\n --tw-backdrop-blur: blur(8px);\n backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n}\n.transition {\n transition-property:\n color,\n background-color,\n border-color,\n text-decoration-color,\n fill,\n stroke,\n opacity,\n box-shadow,\n transform,\n filter,\n backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-\\[background-color\\,color\\] {\n transition-property: background-color, color;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-\\[border-color\\,box-shadow\\,background-color\\] {\n transition-property:\n border-color,\n box-shadow,\n background-color;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-\\[opacity\\,filter\\] {\n transition-property: opacity, filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-\\[transform\\,color\\] {\n transition-property: transform, color;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-opacity {\n transition-property: opacity;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-shadow {\n transition-property: box-shadow;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.duration-150 {\n transition-duration: 150ms;\n}\n.duration-300 {\n transition-duration: 300ms;\n}\n.\\[background\\:var\\(--ui-kit-card-bg\\)\\] {\n background: var(--ui-kit-card-bg);\n}\n.\\[border-color\\:var\\(--ui-kit-card-border\\)\\] {\n border-color: var(--ui-kit-card-border);\n}\n.\\[grid-template-columns\\:repeat\\(auto-fit\\,minmax\\(120px\\,1fr\\)\\)\\] {\n grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));\n}\n:root {\n --ui-kit-font-family:\n "Lato",\n system-ui,\n sans-serif;\n}\n.ui-kit-root {\n font-family: var(--ui-kit-font-family);\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n.ui-kit-root :is(button, input, textarea, select, option) {\n font-family: var(--ui-kit-font-family);\n}\n.placeholder\\:text-\\[var\\(--ui-kit-placeholder\\)\\]::-moz-placeholder {\n color: var(--ui-kit-placeholder);\n}\n.placeholder\\:text-\\[var\\(--ui-kit-placeholder\\)\\]::placeholder {\n color: var(--ui-kit-placeholder);\n}\n.hover\\:-translate-y-\\[0\\.5px\\]:hover {\n --tw-translate-y: -0.5px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.hover\\:border-\\[var\\(--theme-primaryDark\\)\\]:hover {\n border-color: var(--theme-primaryDark);\n}\n.hover\\:border-\\[var\\(--ui-kit-button-ghost-border\\)\\]:hover {\n border-color: var(--ui-kit-button-ghost-border);\n}\n.hover\\:bg-\\[var\\(--theme-primary\\)\\]:hover {\n background-color: var(--theme-primary);\n}\n.hover\\:bg-\\[var\\(--theme-primaryDark\\)\\]:hover {\n background-color: var(--theme-primaryDark);\n}\n.hover\\:bg-\\[var\\(--ui-kit-button-outline-hover\\)\\]:hover {\n background-color: var(--ui-kit-button-outline-hover);\n}\n.hover\\:text-\\[var\\(--theme-onPrimary\\)\\]:hover {\n color: var(--theme-onPrimary);\n}\n.hover\\:shadow-\\[0px_4px_5px_var\\(--theme-shadow\\)\\]:hover {\n --tw-shadow: 0px 4px 5px var(--theme-shadow);\n --tw-shadow-colored: 0px 4px 5px var(--tw-shadow-color);\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.active\\:translate-y-px:active {\n --tw-translate-y: 1px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.active\\:scale-\\[0\\.985\\]:active {\n --tw-scale-x: 0.985;\n --tw-scale-y: 0.985;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.active\\:border-\\[var\\(--ui-kit-button-ghost-border\\)\\]:active {\n border-color: var(--ui-kit-button-ghost-border);\n}\n.active\\:bg-\\[var\\(--theme-primary\\)\\]:active {\n background-color: var(--theme-primary);\n}\n.active\\:bg-\\[var\\(--ui-kit-button-outline-active\\)\\]:active {\n background-color: var(--ui-kit-button-outline-active);\n}\n.active\\:text-\\[var\\(--theme-onPrimary\\)\\]:active {\n color: var(--theme-onPrimary);\n}\n.active\\:shadow-\\[0px_4px_5px_var\\(--theme-shadow\\)\\]:active {\n --tw-shadow: 0px 4px 5px var(--theme-shadow);\n --tw-shadow-colored: 0px 4px 5px var(--tw-shadow-color);\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.disabled\\:translate-y-0:disabled {\n --tw-translate-y: 0px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.disabled\\:scale-100:disabled {\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n}\n');
24
+ styleInject('.ui-kit-sr-only {\n position: absolute;\n height: 1px;\n width: 1px;\n overflow: hidden;\n white-space: nowrap;\n border-width: 0px;\n padding: 0px;\n clip: rect(0, 0, 0, 0);\n margin: -1px;\n}\n.pointer-events-none {\n pointer-events: none;\n}\n.pointer-events-auto {\n pointer-events: auto;\n}\n.visible {\n visibility: visible;\n}\n.fixed {\n position: fixed;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.sticky {\n position: sticky;\n}\n.inset-0 {\n inset: 0px;\n}\n.inset-y-0 {\n top: 0px;\n bottom: 0px;\n}\n.left-0 {\n left: 0px;\n}\n.right-0 {\n right: 0px;\n}\n.top-1\\/2 {\n top: 50%;\n}\n.z-30 {\n z-index: 30;\n}\n.z-\\[70\\] {\n z-index: 70;\n}\n.m-0 {\n margin: 0px;\n}\n.mb-\\[18px\\] {\n margin-bottom: 18px;\n}\n.ml-1 {\n margin-left: 0.25rem;\n}\n.ml-4 {\n margin-left: 1rem;\n}\n.mr-1 {\n margin-right: 0.25rem;\n}\n.mt-0 {\n margin-top: 0px;\n}\n.mt-1 {\n margin-top: 0.25rem;\n}\n.mt-px {\n margin-top: 1px;\n}\n.box-border {\n box-sizing: border-box;\n}\n.block {\n display: block;\n}\n.inline {\n display: inline;\n}\n.flex {\n display: flex;\n}\n.inline-flex {\n display: inline-flex;\n}\n.table {\n display: table;\n}\n.grid {\n display: grid;\n}\n.hidden {\n display: none;\n}\n.h-14 {\n height: 3.5rem;\n}\n.h-2 {\n height: 0.5rem;\n}\n.h-5 {\n height: 1.25rem;\n}\n.h-\\[30px\\] {\n height: 30px;\n}\n.h-\\[34px\\] {\n height: 34px;\n}\n.h-\\[38px\\] {\n height: 38px;\n}\n.h-\\[42px\\] {\n height: 42px;\n}\n.h-\\[52px\\] {\n height: 52px;\n}\n.h-full {\n height: 100%;\n}\n.max-h-\\[280px\\] {\n max-height: 280px;\n}\n.min-h-0 {\n min-height: 0px;\n}\n.min-h-20 {\n min-height: 5rem;\n}\n.w-14 {\n width: 3.5rem;\n}\n.w-2 {\n width: 0.5rem;\n}\n.w-5 {\n width: 1.25rem;\n}\n.w-\\[25px\\] {\n width: 25px;\n}\n.w-\\[30px\\] {\n width: 30px;\n}\n.w-\\[52px\\] {\n width: 52px;\n}\n.w-auto {\n width: auto;\n}\n.w-fit {\n width: -moz-fit-content;\n width: fit-content;\n}\n.w-full {\n width: 100%;\n}\n.min-w-0 {\n min-width: 0px;\n}\n.min-w-full {\n min-width: 100%;\n}\n.max-w-fit {\n max-width: -moz-fit-content;\n max-width: fit-content;\n}\n.max-w-full {\n max-width: 100%;\n}\n.max-w-none {\n max-width: none;\n}\n.flex-1 {\n flex: 1 1 0%;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.border-separate {\n border-collapse: separate;\n}\n.border-spacing-0 {\n --tw-border-spacing-x: 0px;\n --tw-border-spacing-y: 0px;\n border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);\n}\n.-translate-y-1\\/2 {\n --tw-translate-y: -50%;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.cursor-default {\n cursor: default;\n}\n.cursor-not-allowed {\n cursor: not-allowed;\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.cursor-text {\n cursor: text;\n}\n.select-none {\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n}\n.resize-y {\n resize: vertical;\n}\n.resize {\n resize: both;\n}\n.appearance-none {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n}\n.flex-col {\n flex-direction: column;\n}\n.flex-wrap {\n flex-wrap: wrap;\n}\n.items-start {\n align-items: flex-start;\n}\n.items-center {\n align-items: center;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-between {\n justify-content: space-between;\n}\n.gap-0 {\n gap: 0px;\n}\n.gap-1 {\n gap: 0.25rem;\n}\n.gap-1\\.5 {\n gap: 0.375rem;\n}\n.gap-2 {\n gap: 0.5rem;\n}\n.gap-2\\.5 {\n gap: 0.625rem;\n}\n.gap-3 {\n gap: 0.75rem;\n}\n.gap-3\\.5 {\n gap: 0.875rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.self-stretch {\n align-self: stretch;\n}\n.overflow-auto {\n overflow: auto;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-x-auto {\n overflow-x: auto;\n}\n.overflow-y-auto {\n overflow-y: auto;\n}\n.overflow-x-hidden {\n overflow-x: hidden;\n}\n.overflow-y-hidden {\n overflow-y: hidden;\n}\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.text-ellipsis {\n text-overflow: ellipsis;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.rounded-2xl {\n border-radius: 1rem;\n}\n.rounded-\\[0\\.4rem\\] {\n border-radius: 0.4rem;\n}\n.rounded-\\[11px\\] {\n border-radius: 11px;\n}\n.rounded-\\[14px\\] {\n border-radius: 14px;\n}\n.rounded-\\[20px\\] {\n border-radius: 20px;\n}\n.rounded-\\[24px\\] {\n border-radius: 24px;\n}\n.rounded-\\[28px\\] {\n border-radius: 28px;\n}\n.rounded-\\[30px\\] {\n border-radius: 30px;\n}\n.rounded-full {\n border-radius: 9999px;\n}\n.rounded-none {\n border-radius: 0px;\n}\n.rounded-xl {\n border-radius: 0.75rem;\n}\n.border {\n border-width: 1px;\n}\n.border-0 {\n border-width: 0px;\n}\n.border-2 {\n border-width: 2px;\n}\n.border-b {\n border-bottom-width: 1px;\n}\n.border-t {\n border-top-width: 1px;\n}\n.border-solid {\n border-style: solid;\n}\n.border-\\[var\\(--theme-negative\\)\\] {\n border-color: var(--theme-negative);\n}\n.border-\\[var\\(--theme-primary\\)\\] {\n border-color: var(--theme-primary);\n}\n.border-\\[var\\(--theme-secondary\\)\\] {\n border-color: var(--theme-secondary);\n}\n.border-\\[var\\(--theme-textLight\\)\\] {\n border-color: var(--theme-textLight);\n}\n.border-\\[var\\(--ui-kit-accent\\)\\] {\n border-color: var(--ui-kit-accent);\n}\n.border-transparent {\n border-color: transparent;\n}\n.bg-\\[color-mix\\(in_srgb\\,var\\(--ui-kit-accent\\)_24\\%\\,transparent\\)\\] {\n background-color: color-mix(in srgb, var(--ui-kit-accent) 24%, transparent);\n}\n.bg-\\[var\\(--theme-primary\\)\\] {\n background-color: var(--theme-primary);\n}\n.bg-\\[var\\(--theme-surface\\)\\] {\n background-color: var(--theme-surface);\n}\n.bg-\\[var\\(--theme-text\\)\\] {\n background-color: var(--theme-text);\n}\n.bg-\\[var\\(--ui-kit-accent\\)\\] {\n background-color: var(--ui-kit-accent);\n}\n.bg-transparent {\n background-color: transparent;\n}\n.p-0 {\n padding: 0px;\n}\n.p-0\\.5 {\n padding: 0.125rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.p-6 {\n padding: 1.5rem;\n}\n.p-\\[18px\\] {\n padding: 18px;\n}\n.px-1 {\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.px-5 {\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n}\n.px-\\[1\\.15rem\\] {\n padding-left: 1.15rem;\n padding-right: 1.15rem;\n}\n.px-\\[10px\\] {\n padding-left: 10px;\n padding-right: 10px;\n}\n.px-\\[11px\\] {\n padding-left: 11px;\n padding-right: 11px;\n}\n.px-\\[13px\\] {\n padding-left: 13px;\n padding-right: 13px;\n}\n.px-\\[14px\\] {\n padding-left: 14px;\n padding-right: 14px;\n}\n.px-\\[18px\\] {\n padding-left: 18px;\n padding-right: 18px;\n}\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\n.py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n}\n.py-\\[0\\.9rem\\] {\n padding-top: 0.9rem;\n padding-bottom: 0.9rem;\n}\n.py-\\[10px\\] {\n padding-top: 10px;\n padding-bottom: 10px;\n}\n.py-\\[11px\\] {\n padding-top: 11px;\n padding-bottom: 11px;\n}\n.py-\\[14px\\] {\n padding-top: 14px;\n padding-bottom: 14px;\n}\n.py-\\[18px\\] {\n padding-top: 18px;\n padding-bottom: 18px;\n}\n.py-\\[7px\\] {\n padding-top: 7px;\n padding-bottom: 7px;\n}\n.py-\\[9px\\] {\n padding-top: 9px;\n padding-bottom: 9px;\n}\n.pb-0\\.5 {\n padding-bottom: 0.125rem;\n}\n.pb-1 {\n padding-bottom: 0.25rem;\n}\n.pb-3 {\n padding-bottom: 0.75rem;\n}\n.pb-4 {\n padding-bottom: 1rem;\n}\n.pb-\\[10px\\] {\n padding-bottom: 10px;\n}\n.pl-6 {\n padding-left: 1.5rem;\n}\n.pr-6 {\n padding-right: 1.5rem;\n}\n.pt-1 {\n padding-top: 0.25rem;\n}\n.pt-1\\.5 {\n padding-top: 0.375rem;\n}\n.pt-2\\.5 {\n padding-top: 0.625rem;\n}\n.pt-3 {\n padding-top: 0.75rem;\n}\n.pt-\\[18px\\] {\n padding-top: 18px;\n}\n.text-left {\n text-align: left;\n}\n.text-center {\n text-align: center;\n}\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\n.text-\\[1\\.05rem\\] {\n font-size: 1.05rem;\n}\n.text-\\[10px\\] {\n font-size: 10px;\n}\n.text-\\[11px\\] {\n font-size: 11px;\n}\n.text-\\[13px\\] {\n font-size: 13px;\n}\n.text-\\[15px\\] {\n font-size: 15px;\n}\n.text-\\[18px\\] {\n font-size: 18px;\n}\n.text-\\[20px\\] {\n font-size: 20px;\n}\n.text-\\[24px\\] {\n font-size: 24px;\n}\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.font-bold {\n font-weight: 700;\n}\n.font-extrabold {\n font-weight: 800;\n}\n.font-normal {\n font-weight: 400;\n}\n.font-semibold {\n font-weight: 600;\n}\n.uppercase {\n text-transform: uppercase;\n}\n.leading-4 {\n line-height: 1rem;\n}\n.leading-\\[1\\.15\\] {\n line-height: 1.15;\n}\n.leading-\\[1\\.1\\] {\n line-height: 1.1;\n}\n.leading-\\[1\\.25\\] {\n line-height: 1.25;\n}\n.leading-\\[1\\.2\\] {\n line-height: 1.2;\n}\n.leading-\\[1\\.45\\] {\n line-height: 1.45;\n}\n.leading-\\[1\\.4\\] {\n line-height: 1.4;\n}\n.leading-\\[18px\\] {\n line-height: 18px;\n}\n.leading-none {\n line-height: 1;\n}\n.tracking-\\[0\\.01em\\] {\n letter-spacing: 0.01em;\n}\n.tracking-\\[0\\.06em\\] {\n letter-spacing: 0.06em;\n}\n.tracking-\\[0\\.08em\\] {\n letter-spacing: 0.08em;\n}\n.tracking-\\[0\\.16em\\] {\n letter-spacing: 0.16em;\n}\n.text-\\[var\\(--theme-negative\\)\\] {\n color: var(--theme-negative);\n}\n.text-\\[var\\(--theme-onPrimary\\)\\] {\n color: var(--theme-onPrimary);\n}\n.text-\\[var\\(--theme-primary\\)\\] {\n color: var(--theme-primary);\n}\n.text-\\[var\\(--theme-secondary\\)\\] {\n color: var(--theme-secondary);\n}\n.text-\\[var\\(--theme-text\\)\\] {\n color: var(--theme-text);\n}\n.text-\\[var\\(--theme-textLight\\)\\] {\n color: var(--theme-textLight);\n}\n.text-\\[var\\(--ui-kit-accent\\)\\] {\n color: var(--ui-kit-accent);\n}\n.opacity-0 {\n opacity: 0;\n}\n.opacity-100 {\n opacity: 1;\n}\n.opacity-45 {\n opacity: 0.45;\n}\n.opacity-70 {\n opacity: 0.7;\n}\n.opacity-80 {\n opacity: 0.8;\n}\n.opacity-\\[0\\.38\\] {\n opacity: 0.38;\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.shadow-\\[0px_4px_5px_var\\(--theme-shadow\\)\\] {\n --tw-shadow: 0px 4px 5px var(--theme-shadow);\n --tw-shadow-colored: 0px 4px 5px var(--tw-shadow-color);\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.shadow-none {\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.outline-none {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.outline {\n outline-style: solid;\n}\n.saturate-0 {\n --tw-saturate: saturate(0);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.saturate-100 {\n --tw-saturate: saturate(1);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.saturate-\\[0\\.8\\] {\n --tw-saturate: saturate(0.8);\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.filter {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.backdrop-blur-\\[2px\\] {\n --tw-backdrop-blur: blur(2px);\n backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n}\n.backdrop-blur-\\[8px\\] {\n --tw-backdrop-blur: blur(8px);\n backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n}\n.transition {\n transition-property:\n color,\n background-color,\n border-color,\n text-decoration-color,\n fill,\n stroke,\n opacity,\n box-shadow,\n transform,\n filter,\n backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-\\[background-color\\,color\\] {\n transition-property: background-color, color;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-\\[border-color\\,box-shadow\\,background-color\\] {\n transition-property:\n border-color,\n box-shadow,\n background-color;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-\\[opacity\\,filter\\] {\n transition-property: opacity, filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-\\[transform\\,color\\] {\n transition-property: transform, color;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-opacity {\n transition-property: opacity;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.duration-150 {\n transition-duration: 150ms;\n}\n.duration-300 {\n transition-duration: 300ms;\n}\n.\\[grid-template-columns\\:repeat\\(auto-fit\\,minmax\\(120px\\,1fr\\)\\)\\] {\n grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));\n}\n:root {\n --ui-kit-font-family:\n "Lato",\n system-ui,\n sans-serif;\n}\n.ui-kit-root {\n font-family: var(--ui-kit-font-family);\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n.ui-kit-root :is(button, input, textarea, select, option) {\n font-family: var(--ui-kit-font-family);\n}\n.placeholder\\:text-\\[var\\(--theme-textLight\\)\\]::-moz-placeholder {\n color: var(--theme-textLight);\n}\n.placeholder\\:text-\\[var\\(--theme-textLight\\)\\]::placeholder {\n color: var(--theme-textLight);\n}\n.placeholder\\:opacity-100::-moz-placeholder {\n opacity: 1;\n}\n.placeholder\\:opacity-100::placeholder {\n opacity: 1;\n}\n.hover\\:-translate-y-\\[0\\.5px\\]:hover {\n --tw-translate-y: -0.5px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.hover\\:border-\\[var\\(--theme-primary\\)\\]:hover {\n border-color: var(--theme-primary);\n}\n.hover\\:border-\\[var\\(--theme-primaryDark\\)\\]:hover {\n border-color: var(--theme-primaryDark);\n}\n.hover\\:bg-\\[var\\(--theme-primary\\)\\]:hover {\n background-color: var(--theme-primary);\n}\n.hover\\:bg-\\[var\\(--theme-primaryDark\\)\\]:hover {\n background-color: var(--theme-primaryDark);\n}\n.hover\\:bg-\\[var\\(--theme-surface\\)\\]:hover {\n background-color: var(--theme-surface);\n}\n.hover\\:text-\\[var\\(--theme-onPrimary\\)\\]:hover {\n color: var(--theme-onPrimary);\n}\n.hover\\:shadow-\\[0px_4px_5px_var\\(--theme-shadow\\)\\]:hover {\n --tw-shadow: 0px 4px 5px var(--theme-shadow);\n --tw-shadow-colored: 0px 4px 5px var(--tw-shadow-color);\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.active\\:translate-y-px:active {\n --tw-translate-y: 1px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.active\\:scale-\\[0\\.985\\]:active {\n --tw-scale-x: 0.985;\n --tw-scale-y: 0.985;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.active\\:border-\\[var\\(--theme-primary\\)\\]:active {\n border-color: var(--theme-primary);\n}\n.active\\:bg-\\[var\\(--theme-primary\\)\\]:active {\n background-color: var(--theme-primary);\n}\n.active\\:bg-\\[var\\(--theme-secondary\\)\\]:active {\n background-color: var(--theme-secondary);\n}\n.active\\:text-\\[var\\(--theme-onPrimary\\)\\]:active {\n color: var(--theme-onPrimary);\n}\n.active\\:shadow-\\[0px_4px_5px_var\\(--theme-shadow\\)\\]:active {\n --tw-shadow: 0px 4px 5px var(--theme-shadow);\n --tw-shadow-colored: 0px 4px 5px var(--tw-shadow-color);\n box-shadow:\n var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000),\n var(--tw-shadow);\n}\n.disabled\\:translate-y-0:disabled {\n --tw-translate-y: 0px;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.disabled\\:scale-100:disabled {\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n}\n');
25
25
 
26
26
  // node_modules/@fontsource/lato/files/lato-latin-400-normal.woff
27
27
  var lato_latin_400_normal_default = "data:font/woff;base64,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";
@@ -108,21 +108,12 @@ var cx = (...values) => {
108
108
  };
109
109
  var UI_KIT_ROOT_CLASSNAME = "ui-kit-root";
110
110
 
111
- // src/foundation/color.ts
112
- function withAlpha(hex, alpha) {
113
- const normalized = hex.replace("#", "").trim();
114
- const value = normalized.length === 3 ? normalized.split("").map((char) => char + char).join("") : normalized;
115
- const red = Number.parseInt(value.slice(0, 2), 16);
116
- const green = Number.parseInt(value.slice(2, 4), 16);
117
- const blue = Number.parseInt(value.slice(4, 6), 16);
118
- return `rgba(${red}, ${green}, ${blue}, ${alpha})`;
119
- }
120
-
121
111
  // src/foundation/componentState.ts
122
112
  var DISABLED_COMPONENT_OPACITY = 0.5;
123
113
  var DISABLED_FIELD_OPACITY = 0.7;
124
114
 
125
115
  // src/foundation/controlSize.ts
116
+ var CONTROL_LEADING_ICON_SHIFT = 5;
126
117
  var CONTROL_METRICS_BY_SIZE = {
127
118
  sm: {
128
119
  height: 30,
@@ -156,22 +147,20 @@ var CONTROL_METRICS_BY_SIZE = {
156
147
  }
157
148
  };
158
149
  var getControlMetrics = (size) => CONTROL_METRICS_BY_SIZE[size];
150
+ var getControlLeadingIconInset = (size) => {
151
+ const metrics = getControlMetrics(size);
152
+ return Math.round(metrics.paddingX / 2) + CONTROL_LEADING_ICON_SHIFT;
153
+ };
154
+ var getControlLeadingAdornmentWidth = (size, iconSize) => {
155
+ return getControlLeadingIconInset(size) + iconSize;
156
+ };
159
157
  var getSelectIndicatorOffset = (size) => getControlMetrics(size).selectIndicatorOffset;
160
158
 
161
159
  // src/foundation/shadow.ts
162
- var LIGHT_SHADOW = "#B8B8B8";
163
- var DARK_SHADOW = "#181818";
164
- function getComponentShadow(theme) {
165
- var _a;
166
- const colors = theme.colors;
167
- const fallbackShadow = `${theme.title}`.toUpperCase() === "DARK" ? DARK_SHADOW : LIGHT_SHADOW;
168
- const shadowColor = (_a = colors.shadow) != null ? _a : fallbackShadow;
169
- return `${shadowColor} 0px 4px 5px`;
170
- }
171
160
  function getInsetBorderShadow(borderColor, options = {}) {
172
161
  const {
173
162
  outerShadow,
174
- componentShadow = "var(--ui-kit-component-shadow)",
163
+ componentShadow = "0px 4px 5px var(--theme-shadow)",
175
164
  insetWidth = 1
176
165
  } = options;
177
166
  return [
@@ -260,29 +249,14 @@ var ROOT_THEME_VARIABLES = [
260
249
  ["--theme-onPrimary", "onPrimary"],
261
250
  ["--theme-onSecondary", "onSecondary"]
262
251
  ];
263
- var syncUiKitThemeVariables = (tokens) => {
252
+ var syncUiKitThemeVariables = (theme) => {
264
253
  if (typeof document === "undefined") {
265
254
  return;
266
255
  }
267
256
  const rootStyle = document.documentElement.style;
268
257
  ROOT_THEME_VARIABLES.forEach(([variableName, colorName]) => {
269
- rootStyle.setProperty(variableName, tokens.theme.colors[colorName]);
258
+ rootStyle.setProperty(variableName, theme.colors[colorName]);
270
259
  });
271
- rootStyle.setProperty("--ui-kit-border-soft", tokens.borderSoft);
272
- rootStyle.setProperty("--ui-kit-border-strong", tokens.borderStrong);
273
- rootStyle.setProperty("--ui-kit-surface-muted", tokens.surfaceMuted);
274
- rootStyle.setProperty("--ui-kit-surface-raised", tokens.surfaceRaised);
275
- rootStyle.setProperty("--ui-kit-overlay", tokens.overlay);
276
- rootStyle.setProperty("--ui-kit-focus-ring", tokens.focusRing);
277
- rootStyle.setProperty("--ui-kit-muted-text", tokens.mutedText);
278
- rootStyle.setProperty("--ui-kit-component-shadow", getComponentShadow(tokens.theme));
279
- rootStyle.setProperty("--ui-kit-card-bg", withAlpha(tokens.theme.colors.background, 0.7));
280
- rootStyle.setProperty("--ui-kit-card-border", withAlpha(tokens.theme.colors.text, 0.5));
281
- rootStyle.setProperty("--ui-kit-button-outline-hover", withAlpha(tokens.theme.colors.text, 0.08));
282
- rootStyle.setProperty("--ui-kit-button-outline-active", withAlpha(tokens.theme.colors.text, 0.14));
283
- rootStyle.setProperty("--ui-kit-button-ghost-border", withAlpha(tokens.theme.colors.primary, 0.5));
284
- rootStyle.setProperty("--ui-kit-placeholder", withAlpha(tokens.theme.colors.text, 0.5));
285
- rootStyle.setProperty("--ui-kit-negative-soft", withAlpha(tokens.theme.colors.negative, 0.12));
286
260
  };
287
261
  function normalizeUiKitTheme(theme) {
288
262
  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
@@ -316,26 +290,13 @@ function normalizeUiKitTheme(theme) {
316
290
  color: normalizedColors
317
291
  };
318
292
  }
319
- function createUiKitThemeTokens(themeSource) {
320
- const theme = normalizeUiKitTheme(themeSource);
321
- return {
322
- theme,
323
- borderSoft: withAlpha(theme.colors.text, 0.1),
324
- borderStrong: withAlpha(theme.colors.text, 0.16),
325
- surfaceMuted: withAlpha(theme.colors.text, 0.04),
326
- surfaceRaised: withAlpha(theme.colors.surface, 0.94),
327
- overlay: withAlpha("#030712", 0.62),
328
- focusRing: withAlpha(theme.colors.primary, 0.22),
329
- mutedText: withAlpha(theme.colors.text, 0.72)
330
- };
331
- }
332
293
  function useUiKitTheme() {
333
294
  const activeTheme = useThemeValue();
334
- const tokens = useMemo(() => createUiKitThemeTokens(activeTheme), [activeTheme]);
295
+ const theme = useMemo(() => normalizeUiKitTheme(activeTheme), [activeTheme]);
335
296
  useEffect(() => {
336
- syncUiKitThemeVariables(tokens);
337
- }, [tokens]);
338
- return tokens;
297
+ syncUiKitThemeVariables(theme);
298
+ }, [theme]);
299
+ return theme;
339
300
  }
340
301
 
341
302
  // src/components/Button.tsx
@@ -363,10 +324,10 @@ var BUTTON_VARIANT_CLASSNAMES = {
363
324
  "text-[var(--theme-text)]",
364
325
  "shadow-[0px_4px_5px_var(--theme-shadow)]",
365
326
  "hover:-translate-y-[0.5px]",
366
- "hover:bg-[var(--ui-kit-button-outline-hover)]",
327
+ "hover:bg-[var(--theme-surface)]",
367
328
  "active:translate-y-px",
368
329
  "active:scale-[0.985]",
369
- "active:bg-[var(--ui-kit-button-outline-active)]"
330
+ "active:bg-[var(--theme-secondary)]"
370
331
  ].join(" "),
371
332
  ghost: [
372
333
  "border-transparent",
@@ -374,13 +335,13 @@ var BUTTON_VARIANT_CLASSNAMES = {
374
335
  "text-[var(--theme-text)]",
375
336
  "shadow-none",
376
337
  "hover:-translate-y-[0.5px]",
377
- "hover:border-[var(--ui-kit-button-ghost-border)]",
338
+ "hover:border-[var(--theme-primary)]",
378
339
  "hover:bg-[var(--theme-primary)]",
379
340
  "hover:text-[var(--theme-onPrimary)]",
380
341
  "hover:shadow-[0px_4px_5px_var(--theme-shadow)]",
381
342
  "active:translate-y-px",
382
343
  "active:scale-[0.985]",
383
- "active:border-[var(--ui-kit-button-ghost-border)]",
344
+ "active:border-[var(--theme-primary)]",
384
345
  "active:bg-[var(--theme-primary)]",
385
346
  "active:text-[var(--theme-onPrimary)]",
386
347
  "active:shadow-[0px_4px_5px_var(--theme-shadow)]"
@@ -443,10 +404,8 @@ function Card({
443
404
  ...rest,
444
405
  className: cx(
445
406
  UI_KIT_ROOT_CLASSNAME,
446
- "rounded-[28px] border text-[var(--theme-text)]",
407
+ "rounded-[28px] border border-[var(--theme-secondary)] bg-[var(--theme-surface)] text-[var(--theme-text)]",
447
408
  "shadow-[0px_4px_5px_var(--theme-shadow)]",
448
- "[background:var(--ui-kit-card-bg)]",
449
- "[border-color:var(--ui-kit-card-border)]",
450
409
  padded && "p-6",
451
410
  className
452
411
  ),
@@ -475,7 +434,7 @@ function CardSmall({
475
434
  style,
476
435
  ...rest
477
436
  }) {
478
- const { theme } = useUiKitTheme();
437
+ const theme = useUiKitTheme();
479
438
  const accentColor = color != null ? color : theme.colors.primary;
480
439
  return /* @__PURE__ */ jsxs3(
481
440
  "div",
@@ -485,7 +444,7 @@ function CardSmall({
485
444
  UI_KIT_ROOT_CLASSNAME,
486
445
  "relative flex min-h-20 items-center gap-4 overflow-hidden",
487
446
  "rounded-2xl border border-solid border-[var(--ui-kit-accent)]",
488
- "bg-[var(--ui-kit-surface-raised)] pl-6 pr-6 text-[var(--theme-text)]",
447
+ "bg-[var(--theme-surface)] pl-6 pr-6 text-[var(--theme-text)]",
489
448
  "shadow-[0px_4px_5px_var(--theme-shadow)]",
490
449
  className
491
450
  ),
@@ -571,7 +530,7 @@ function CheckboxIndicator({
571
530
  uncheckedBackgroundColor,
572
531
  style
573
532
  }) {
574
- const { theme } = useUiKitTheme();
533
+ const theme = useUiKitTheme();
575
534
  const isActive = checked || indeterminate;
576
535
  const resolvedCheckedColor = checkedColor != null ? checkedColor : theme.colors.textLight;
577
536
  const resolvedIconColor = iconColor != null ? iconColor : theme.colors.surface;
@@ -621,7 +580,8 @@ function Checkbox({
621
580
  onBlur,
622
581
  ...rest
623
582
  }) {
624
- const { theme, mutedText } = useUiKitTheme();
583
+ const theme = useUiKitTheme();
584
+ const mutedText = theme.colors.textLight;
625
585
  const indicatorSize = getCheckboxSize(controlSize);
626
586
  const hasLabel = hasNodeContent(label);
627
587
  const hasHint = hasNodeContent(hint);
@@ -629,7 +589,6 @@ function Checkbox({
629
589
  const hasSecondaryContent = hasLabel && hasHint;
630
590
  const resolvedId = id != null ? id : `ss-checkbox-${useId().replace(/:/g, "")}`;
631
591
  const inputRef = useRef(null);
632
- const [isFocused, setIsFocused] = useState(false);
633
592
  const [internalChecked, setInternalChecked] = useState(Boolean(defaultChecked));
634
593
  const isControlled = checked !== void 0;
635
594
  const resolvedChecked = isControlled ? Boolean(checked) : internalChecked;
@@ -661,9 +620,7 @@ function Checkbox({
661
620
  {
662
621
  className: cx(
663
622
  "relative inline-flex shrink-0 items-center justify-center rounded-full p-0.5",
664
- hasSecondaryContent ? "mt-px" : "mt-0",
665
- "transition-shadow duration-150",
666
- isFocused ? "shadow-[0_0_0_3px_var(--ui-kit-focus-ring)]" : "shadow-none"
623
+ hasSecondaryContent ? "mt-px" : "mt-0"
667
624
  ),
668
625
  children: [
669
626
  /* @__PURE__ */ jsx3(
@@ -683,11 +640,9 @@ function Checkbox({
683
640
  onChange == null ? void 0 : onChange(event);
684
641
  },
685
642
  onFocus: (event) => {
686
- setIsFocused(true);
687
643
  onFocus == null ? void 0 : onFocus(event);
688
644
  },
689
645
  onBlur: (event) => {
690
- setIsFocused(false);
691
646
  onBlur == null ? void 0 : onBlur(event);
692
647
  },
693
648
  className: cx(
@@ -705,7 +660,7 @@ function Checkbox({
705
660
  size: indicatorSize,
706
661
  checkedColor: theme.colors.primary,
707
662
  iconColor: theme.colors.onPrimary,
708
- uncheckedBorderColor: withAlpha(theme.colors.text, 0.24),
663
+ uncheckedBorderColor: theme.colors.text,
709
664
  uncheckedBackgroundColor: theme.colors.surface,
710
665
  style: disabled ? { opacity: 1 } : void 0
711
666
  }
@@ -725,7 +680,7 @@ function Checkbox({
725
680
  label,
726
681
  required ? /* @__PURE__ */ jsx3("span", { className: "ml-1 text-[var(--theme-negative)]", children: "*" }) : null
727
682
  ] }) : null,
728
- hint ? /* @__PURE__ */ jsx3("span", { className: "text-[13px] leading-[1.45] text-[var(--ui-kit-muted-text)]", children: hint }) : null,
683
+ hint ? /* @__PURE__ */ jsx3("span", { className: "text-[13px] leading-[1.45] text-[var(--theme-textLight)]", children: hint }) : null,
729
684
  error ? /* @__PURE__ */ jsx3("span", { className: "text-[13px] font-semibold leading-[1.45] text-[var(--theme-negative)]", children: error }) : null
730
685
  ]
731
686
  }
@@ -743,29 +698,25 @@ import { useMemo as useMemo3 } from "react";
743
698
  // src/components/Modal.tsx
744
699
  import { useEffect as useEffect3, useMemo as useMemo2, useState as useState2 } from "react";
745
700
  import { jsx as jsx4, jsxs as jsxs5 } from "react/jsx-runtime";
746
- var isUiKitThemeTokens = (theme) => {
747
- return Boolean(theme && typeof theme === "object" && "theme" in theme);
701
+ var isUiKitTheme = (theme) => {
702
+ return Boolean(theme && typeof theme === "object" && "title" in theme && "color" in theme);
748
703
  };
749
- var withResolvedModalColors = (theme) => ({
750
- ...theme,
751
- colors: theme.theme.colors
752
- });
753
704
  var resolveTheme = (baseTheme, themeOverride) => {
754
- if (isUiKitThemeTokens(themeOverride)) {
755
- return withResolvedModalColors(themeOverride);
705
+ if (isUiKitTheme(themeOverride)) {
706
+ return themeOverride;
756
707
  }
757
708
  if (!(themeOverride == null ? void 0 : themeOverride.colors)) {
758
- return withResolvedModalColors(baseTheme);
709
+ return baseTheme;
759
710
  }
760
711
  const colors = {
761
- ...baseTheme.theme.colors,
712
+ ...baseTheme.colors,
762
713
  ...themeOverride.colors
763
714
  };
764
- return withResolvedModalColors(createUiKitThemeTokens({
765
- ...baseTheme.theme,
715
+ return normalizeUiKitTheme({
716
+ ...baseTheme,
766
717
  colors,
767
718
  color: colors
768
- }));
719
+ });
769
720
  };
770
721
  var normalizeWidth = (maxWidth) => {
771
722
  if (typeof maxWidth === "number") {
@@ -789,8 +740,7 @@ var createTitleId = (title) => {
789
740
  return "smartsell-modal-dialog";
790
741
  };
791
742
  function ModalActionButton({
792
- action,
793
- theme
743
+ action
794
744
  }) {
795
745
  var _a, _b;
796
746
  const {
@@ -805,12 +755,12 @@ function ModalActionButton({
805
755
  "m-0 text-center font-bold leading-[1.2]",
806
756
  appearance === "link" ? "p-0 text-[1.05rem]" : "px-[1.15rem] py-[0.9rem] text-[1.05rem]",
807
757
  disabled ? "cursor-not-allowed saturate-0" : "cursor-pointer",
808
- appearance === "text" && "border border-transparent bg-transparent text-[var(--ui-kit-modal-primary)] shadow-none",
809
- appearance === "link" && "border-0 bg-transparent text-[var(--ui-kit-modal-primary)] shadow-none",
810
- appearance === "outlined" && "border-2 border-[var(--ui-kit-modal-primary)] bg-transparent",
811
- appearance === "outlined" && "text-[var(--ui-kit-modal-primary)] shadow-[var(--ui-kit-modal-button-shadow-outlined)]",
812
- appearance === "contained" && "border border-transparent bg-[var(--ui-kit-modal-primary)]",
813
- appearance === "contained" && "text-[var(--ui-kit-modal-on-primary)] shadow-[var(--ui-kit-modal-button-shadow-contained)]"
758
+ appearance === "text" && "border border-transparent bg-transparent text-[var(--theme-primary)] shadow-none",
759
+ appearance === "link" && "border-0 bg-transparent text-[var(--theme-primary)] shadow-none",
760
+ appearance === "outlined" && "border-2 border-[var(--theme-primary)] bg-transparent",
761
+ appearance === "outlined" && "text-[var(--theme-primary)]",
762
+ appearance === "contained" && "border border-transparent bg-[var(--theme-primary)]",
763
+ appearance === "contained" && "text-[var(--theme-onPrimary)]"
814
764
  );
815
765
  return /* @__PURE__ */ jsx4(
816
766
  "div",
@@ -828,7 +778,10 @@ function ModalActionButton({
828
778
  onClick: disabled ? void 0 : onClick,
829
779
  disabled,
830
780
  className: buttonClassName,
831
- style: { opacity: disabled ? DISABLED_COMPONENT_OPACITY : 1 },
781
+ style: {
782
+ opacity: disabled ? DISABLED_COMPONENT_OPACITY : 1,
783
+ boxShadow: appearance === "text" || appearance === "link" ? "none" : "0 14px 28px var(--theme-shadow)"
784
+ },
832
785
  children: label
833
786
  }
834
787
  )
@@ -845,8 +798,8 @@ function ModalBusyIndicator({
845
798
  role: "status",
846
799
  className: "relative inline-flex h-14 w-14 items-center justify-center rounded-full",
847
800
  style: {
848
- backgroundColor: withAlpha(theme.colors.surface, 0.88),
849
- boxShadow: `0 18px 36px ${withAlpha(theme.colors.text, 0.08)}`
801
+ backgroundColor: theme.colors.surface,
802
+ boxShadow: `0 18px 36px ${theme.colors.shadow}`
850
803
  },
851
804
  children: [
852
805
  /* @__PURE__ */ jsx4("span", { className: "ui-kit-sr-only", children: "Loading" }),
@@ -857,7 +810,7 @@ function ModalBusyIndicator({
857
810
  cx: "20",
858
811
  cy: "20",
859
812
  r: "16",
860
- stroke: withAlpha(theme.colors.text, 0.12),
813
+ stroke: theme.colors.textLight,
861
814
  strokeWidth: "4"
862
815
  }
863
816
  ),
@@ -940,24 +893,22 @@ function UnifiedModal({
940
893
  const inheritedTheme = useUiKitTheme();
941
894
  const modalTheme = useMemo2(() => resolveTheme(inheritedTheme, theme), [inheritedTheme, theme]);
942
895
  const modalShadow = useMemo2(() => {
943
- return `0 34px 80px ${withAlpha(modalTheme.theme.colors.shadow, 0.28)}`;
944
- }, [modalTheme.theme.colors.shadow]);
945
- const controlShadow = useMemo2(() => getComponentShadow(modalTheme.theme), [modalTheme.theme]);
946
- const modalVariables = useMemo2(() => ({
947
- "--ui-kit-modal-overlay": modalTheme.overlay,
948
- "--ui-kit-modal-surface": modalTheme.colors.surface,
949
- "--ui-kit-modal-surface-raised": modalTheme.surfaceRaised,
950
- "--ui-kit-modal-text": modalTheme.colors.text,
951
- "--ui-kit-modal-border-soft": modalTheme.borderSoft,
952
- "--ui-kit-modal-divider": withAlpha(modalTheme.colors.text, 0.06),
953
- "--ui-kit-modal-primary": modalTheme.colors.primary,
954
- "--ui-kit-modal-on-primary": modalTheme.colors.onPrimary,
955
- "--ui-kit-modal-shadow": modalShadow,
956
- "--ui-kit-modal-control-shadow": controlShadow,
957
- "--ui-kit-modal-busy-overlay": withAlpha(modalTheme.colors.surface, 0.58),
958
- "--ui-kit-modal-button-shadow-outlined": `0 14px 28px ${withAlpha(modalTheme.colors.text, 0.08)}`,
959
- "--ui-kit-modal-button-shadow-contained": `0 14px 28px ${withAlpha(modalTheme.colors.primary, 0.22)}`
960
- }), [controlShadow, modalShadow, modalTheme]);
896
+ return `0 34px 80px ${modalTheme.colors.shadow}`;
897
+ }, [modalTheme.colors.shadow]);
898
+ const controlShadow = "0px 4px 5px var(--theme-shadow)";
899
+ const modalThemeVariables = useMemo2(() => ({
900
+ "--theme-background": modalTheme.colors.background,
901
+ "--theme-surface": modalTheme.colors.surface,
902
+ "--theme-text": modalTheme.colors.text,
903
+ "--theme-textLight": modalTheme.colors.textLight,
904
+ "--theme-primary": modalTheme.colors.primary,
905
+ "--theme-onPrimary": modalTheme.colors.onPrimary,
906
+ "--theme-secondary": modalTheme.colors.secondary,
907
+ "--theme-onSecondary": modalTheme.colors.onSecondary,
908
+ "--theme-negative": modalTheme.colors.negative,
909
+ "--theme-warning": modalTheme.colors.warning,
910
+ "--theme-shadow": modalTheme.colors.shadow
911
+ }), [modalTheme]);
961
912
  const [isMaximized, setIsMaximized] = useState2(maximized != null ? maximized : false);
962
913
  const titleId = useMemo2(() => createTitleId(title), [title]);
963
914
  const shouldDisableDismiss = disableDismiss || isBusy;
@@ -994,7 +945,7 @@ function UnifiedModal({
994
945
  "h2",
995
946
  {
996
947
  id: titleId,
997
- className: "m-0 text-2xl font-extrabold leading-[1.1] text-[var(--ui-kit-modal-text)]",
948
+ className: "m-0 text-2xl font-extrabold leading-[1.1] text-[var(--theme-text)]",
998
949
  children: title
999
950
  }
1000
951
  ) : null;
@@ -1004,8 +955,7 @@ function UnifiedModal({
1004
955
  footerContent = /* @__PURE__ */ jsx4(
1005
956
  ModalActionButton,
1006
957
  {
1007
- action: { ...closeAction, disabled: closeAction.disabled || isBusy },
1008
- theme: modalTheme
958
+ action: { ...closeAction, disabled: closeAction.disabled || isBusy }
1009
959
  }
1010
960
  );
1011
961
  } else {
@@ -1038,8 +988,7 @@ function UnifiedModal({
1038
988
  footerContent = resolvedActions.length > 0 ? resolvedActions.map((action, index) => /* @__PURE__ */ jsx4(
1039
989
  ModalActionButton,
1040
990
  {
1041
- action,
1042
- theme: modalTheme
991
+ action
1043
992
  },
1044
993
  `modal-action-${index}`
1045
994
  )) : void 0;
@@ -1061,17 +1010,17 @@ function UnifiedModal({
1061
1010
  },
1062
1011
  className: cx(UI_KIT_ROOT_CLASSNAME, "fixed inset-0 z-[70] flex items-center justify-center backdrop-blur-[8px]"),
1063
1012
  style: {
1064
- ...modalVariables,
1013
+ ...modalThemeVariables,
1065
1014
  padding: isMaximized ? 0 : 16,
1066
- backgroundColor: "var(--ui-kit-modal-overlay)"
1015
+ backgroundColor: modalTheme.colors.shadow
1067
1016
  },
1068
1017
  children: /* @__PURE__ */ jsxs5(
1069
1018
  "div",
1070
1019
  {
1071
1020
  className: cx(
1072
1021
  "relative flex flex-col overflow-hidden border",
1073
- "bg-[linear-gradient(180deg,var(--ui-kit-modal-surface-raised),var(--ui-kit-modal-surface))]",
1074
- "text-[var(--ui-kit-modal-text)]",
1022
+ "bg-[var(--theme-surface)]",
1023
+ "text-[var(--theme-text)]",
1075
1024
  isMaximized ? "rounded-none" : "rounded-[30px]"
1076
1025
  ),
1077
1026
  style: {
@@ -1080,8 +1029,8 @@ function UnifiedModal({
1080
1029
  height: isMaximized ? "100vh" : void 0,
1081
1030
  maxHeight: isMaximized ? "100vh" : "calc(100vh - 32px)",
1082
1031
  minWidth: isMaximized ? "100vw" : 300,
1083
- borderColor: "var(--ui-kit-modal-border-soft)",
1084
- boxShadow: "var(--ui-kit-modal-shadow)",
1032
+ borderColor: modalTheme.colors.secondary,
1033
+ boxShadow: modalShadow,
1085
1034
  ...contentStyle
1086
1035
  },
1087
1036
  children: [
@@ -1089,7 +1038,7 @@ function UnifiedModal({
1089
1038
  "div",
1090
1039
  {
1091
1040
  className: "flex items-start justify-between gap-3 border-b px-5 pb-3 pt-[18px]",
1092
- style: { borderColor: "var(--ui-kit-modal-divider)" },
1041
+ style: { borderColor: modalTheme.colors.secondary },
1093
1042
  children: [
1094
1043
  /* @__PURE__ */ jsx4(
1095
1044
  "div",
@@ -1109,8 +1058,8 @@ function UnifiedModal({
1109
1058
  title: isMaximized ? "Minimize" : "Maximize",
1110
1059
  type: "button",
1111
1060
  onClick: () => setIsMaximized((current) => !current),
1112
- className: "m-0 inline-flex h-[30px] w-[30px] shrink-0 cursor-pointer appearance-none items-center justify-center rounded-full border bg-transparent p-0 text-[var(--ui-kit-modal-text)] leading-none shadow-[var(--ui-kit-modal-control-shadow)]",
1113
- style: { borderColor: "var(--ui-kit-modal-border-soft)" },
1061
+ className: "m-0 inline-flex h-[30px] w-[30px] shrink-0 cursor-pointer appearance-none items-center justify-center rounded-full border bg-transparent p-0 text-[var(--theme-text)] leading-none",
1062
+ style: { borderColor: modalTheme.colors.secondary, boxShadow: controlShadow },
1114
1063
  children: isMaximized ? /* @__PURE__ */ jsx4(MinimizeIcon, {}) : /* @__PURE__ */ jsx4(MaximizeIcon, {})
1115
1064
  }
1116
1065
  ) : null,
@@ -1122,12 +1071,12 @@ function UnifiedModal({
1122
1071
  onClick: shouldDisableDismiss ? void 0 : onClose,
1123
1072
  className: cx(
1124
1073
  "flex h-[30px] w-[30px] items-center justify-center rounded-full border",
1125
- "bg-transparent text-[20px] font-bold text-[var(--ui-kit-modal-text)]",
1126
- "shadow-[var(--ui-kit-modal-control-shadow)]",
1074
+ "bg-transparent text-[20px] font-bold text-[var(--theme-text)]",
1127
1075
  shouldDisableDismiss ? "cursor-not-allowed" : "cursor-pointer"
1128
1076
  ),
1129
1077
  style: {
1130
- borderColor: "var(--ui-kit-modal-border-soft)",
1078
+ borderColor: modalTheme.colors.secondary,
1079
+ boxShadow: controlShadow,
1131
1080
  opacity: shouldDisableDismiss ? DISABLED_COMPONENT_OPACITY : 1
1132
1081
  },
1133
1082
  children: "\xD7"
@@ -1156,7 +1105,8 @@ function UnifiedModal({
1156
1105
  isBusy ? /* @__PURE__ */ jsx4(
1157
1106
  "div",
1158
1107
  {
1159
- className: "absolute inset-0 flex items-center justify-center bg-[var(--ui-kit-modal-busy-overlay)] backdrop-blur-[2px]",
1108
+ className: "absolute inset-0 flex items-center justify-center backdrop-blur-[2px]",
1109
+ style: { backgroundColor: modalTheme.colors.background },
1160
1110
  children: /* @__PURE__ */ jsx4(ModalBusyIndicator, { theme: modalTheme })
1161
1111
  }
1162
1112
  ) : null
@@ -1167,7 +1117,7 @@ function UnifiedModal({
1167
1117
  "div",
1168
1118
  {
1169
1119
  className: "flex justify-end gap-2.5 border-t px-5 pb-4 pt-3",
1170
- style: { borderColor: "var(--ui-kit-modal-divider)" },
1120
+ style: { borderColor: modalTheme.colors.secondary },
1171
1121
  children: footerContent
1172
1122
  }
1173
1123
  ) : null
@@ -1313,6 +1263,218 @@ var FIELD_PADDING_X_CLASSNAMES = {
1313
1263
  lg: "px-4"
1314
1264
  };
1315
1265
  var getPasswordToggleMetrics = (size) => PASSWORD_TOGGLE_METRICS_BY_SIZE[size];
1266
+ var LOGIN_VALIDATION_ERROR = "Spaces are not allowed.";
1267
+ var EMAIL_VALIDATION_ERROR = "Enter a valid email address.";
1268
+ var EMAIL_VALUE_PATTERN = /^[^\s@]+@[^\s@]+$/;
1269
+ var SPACE_PATTERN = /\s/;
1270
+ var isRenderableNode = (node) => node !== null && node !== void 0 && node !== false;
1271
+ var getInputValidationError = (type, value) => {
1272
+ if (!value) {
1273
+ return void 0;
1274
+ }
1275
+ if (type === "login") {
1276
+ return SPACE_PATTERN.test(value) ? LOGIN_VALIDATION_ERROR : void 0;
1277
+ }
1278
+ if (type === "email") {
1279
+ return EMAIL_VALUE_PATTERN.test(value) ? void 0 : EMAIL_VALIDATION_ERROR;
1280
+ }
1281
+ return void 0;
1282
+ };
1283
+ function EmailIcon({ size }) {
1284
+ return /* @__PURE__ */ jsxs7("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
1285
+ /* @__PURE__ */ jsx6(
1286
+ "path",
1287
+ {
1288
+ d: "M3.75 6.25A1.875 1.875 0 0 1 5.625 4.375h8.75A1.875 1.875 0 0 1 16.25 6.25v7.5a1.875 1.875 0 0 1-1.875 1.875h-8.75A1.875 1.875 0 0 1 3.75 13.75v-7.5Z",
1289
+ stroke: "currentColor",
1290
+ strokeWidth: "1.6",
1291
+ strokeLinecap: "round",
1292
+ strokeLinejoin: "round"
1293
+ }
1294
+ ),
1295
+ /* @__PURE__ */ jsx6(
1296
+ "path",
1297
+ {
1298
+ d: "M4.375 6.25 10 10.625l5.625-4.375",
1299
+ stroke: "currentColor",
1300
+ strokeWidth: "1.6",
1301
+ strokeLinecap: "round",
1302
+ strokeLinejoin: "round"
1303
+ }
1304
+ )
1305
+ ] });
1306
+ }
1307
+ function LoginIcon({ size }) {
1308
+ return /* @__PURE__ */ jsxs7("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
1309
+ /* @__PURE__ */ jsx6("circle", { cx: "10", cy: "6.25", r: "3", stroke: "currentColor", strokeWidth: "1.6" }),
1310
+ /* @__PURE__ */ jsx6(
1311
+ "path",
1312
+ {
1313
+ d: "M4.75 16a5.25 5.25 0 0 1 10.5 0",
1314
+ stroke: "currentColor",
1315
+ strokeWidth: "1.6",
1316
+ strokeLinecap: "round"
1317
+ }
1318
+ )
1319
+ ] });
1320
+ }
1321
+ function FileIcon({ size, selected }) {
1322
+ return /* @__PURE__ */ jsx6("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: selected ? /* @__PURE__ */ jsxs7(Fragment2, { children: [
1323
+ /* @__PURE__ */ jsx6(
1324
+ "path",
1325
+ {
1326
+ d: "M5.5 6.25h9",
1327
+ stroke: "currentColor",
1328
+ strokeWidth: "1.6",
1329
+ strokeLinecap: "round"
1330
+ }
1331
+ ),
1332
+ /* @__PURE__ */ jsx6(
1333
+ "path",
1334
+ {
1335
+ d: "M7.25 6.25V5.25A1.5 1.5 0 0 1 8.75 3.75h2.5a1.5 1.5 0 0 1 1.5 1.5v1",
1336
+ stroke: "currentColor",
1337
+ strokeWidth: "1.6",
1338
+ strokeLinecap: "round",
1339
+ strokeLinejoin: "round"
1340
+ }
1341
+ ),
1342
+ /* @__PURE__ */ jsx6(
1343
+ "path",
1344
+ {
1345
+ d: "M7.75 8.25v5.5",
1346
+ stroke: "currentColor",
1347
+ strokeWidth: "1.6",
1348
+ strokeLinecap: "round"
1349
+ }
1350
+ ),
1351
+ /* @__PURE__ */ jsx6(
1352
+ "path",
1353
+ {
1354
+ d: "M10 8.25v5.5",
1355
+ stroke: "currentColor",
1356
+ strokeWidth: "1.6",
1357
+ strokeLinecap: "round"
1358
+ }
1359
+ ),
1360
+ /* @__PURE__ */ jsx6(
1361
+ "path",
1362
+ {
1363
+ d: "M12.25 8.25v5.5",
1364
+ stroke: "currentColor",
1365
+ strokeWidth: "1.6",
1366
+ strokeLinecap: "round"
1367
+ }
1368
+ ),
1369
+ /* @__PURE__ */ jsx6(
1370
+ "path",
1371
+ {
1372
+ d: "M6.75 6.25l.5 8a1.5 1.5 0 0 0 1.497 1.406h2.506A1.5 1.5 0 0 0 12.75 14.25l.5-8",
1373
+ stroke: "currentColor",
1374
+ strokeWidth: "1.6",
1375
+ strokeLinecap: "round",
1376
+ strokeLinejoin: "round"
1377
+ }
1378
+ )
1379
+ ] }) : /* @__PURE__ */ jsxs7(Fragment2, { children: [
1380
+ /* @__PURE__ */ jsx6(
1381
+ "path",
1382
+ {
1383
+ d: "M6.25 2.5h5.652l4.348 4.348V15A2.5 2.5 0 0 1 13.75 17.5h-7.5A2.5 2.5 0 0 1 3.75 15V5A2.5 2.5 0 0 1 6.25 2.5Z",
1384
+ stroke: "currentColor",
1385
+ strokeWidth: "1.6",
1386
+ strokeLinecap: "round",
1387
+ strokeLinejoin: "round"
1388
+ }
1389
+ ),
1390
+ /* @__PURE__ */ jsx6(
1391
+ "path",
1392
+ {
1393
+ d: "M11.875 2.75V6.25H15.375",
1394
+ stroke: "currentColor",
1395
+ strokeWidth: "1.6",
1396
+ strokeLinecap: "round",
1397
+ strokeLinejoin: "round"
1398
+ }
1399
+ ),
1400
+ /* @__PURE__ */ jsx6(
1401
+ "path",
1402
+ {
1403
+ d: "M7.5 10h5",
1404
+ stroke: "currentColor",
1405
+ strokeWidth: "1.6",
1406
+ strokeLinecap: "round"
1407
+ }
1408
+ ),
1409
+ /* @__PURE__ */ jsx6(
1410
+ "path",
1411
+ {
1412
+ d: "M7.5 13h5",
1413
+ stroke: "currentColor",
1414
+ strokeWidth: "1.6",
1415
+ strokeLinecap: "round"
1416
+ }
1417
+ )
1418
+ ] }) });
1419
+ }
1420
+ function PasswordVisibleIcon({ size }) {
1421
+ return /* @__PURE__ */ jsxs7("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
1422
+ /* @__PURE__ */ jsx6(
1423
+ "path",
1424
+ {
1425
+ d: "M6.75 8V6.75A3.25 3.25 0 0 1 12.262 4.415",
1426
+ stroke: "currentColor",
1427
+ strokeWidth: "1.8",
1428
+ strokeLinecap: "round",
1429
+ strokeLinejoin: "round"
1430
+ }
1431
+ ),
1432
+ /* @__PURE__ */ jsx6(
1433
+ "path",
1434
+ {
1435
+ d: "M6 8.25h8a1.75 1.75 0 0 1 1.75 1.75V14A1.75 1.75 0 0 1 14 15.75H6A1.75 1.75 0 0 1 4.25 14V10A1.75 1.75 0 0 1 6 8.25Z",
1436
+ stroke: "currentColor",
1437
+ strokeWidth: "1.8",
1438
+ strokeLinecap: "round",
1439
+ strokeLinejoin: "round"
1440
+ }
1441
+ ),
1442
+ /* @__PURE__ */ jsx6(
1443
+ "path",
1444
+ {
1445
+ d: "M10 11.25v1.5",
1446
+ stroke: "currentColor",
1447
+ strokeWidth: "1.8",
1448
+ strokeLinecap: "round"
1449
+ }
1450
+ )
1451
+ ] });
1452
+ }
1453
+ function PasswordHiddenIcon({ size }) {
1454
+ return /* @__PURE__ */ jsxs7("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
1455
+ /* @__PURE__ */ jsx6(
1456
+ "path",
1457
+ {
1458
+ d: "M6.75 8V6.75A3.25 3.25 0 1 1 13.25 6.75V8",
1459
+ stroke: "currentColor",
1460
+ strokeWidth: "1.8",
1461
+ strokeLinecap: "round",
1462
+ strokeLinejoin: "round"
1463
+ }
1464
+ ),
1465
+ /* @__PURE__ */ jsx6(
1466
+ "path",
1467
+ {
1468
+ d: "M6 8.25h8a1.75 1.75 0 0 1 1.75 1.75V14A1.75 1.75 0 0 1 14 15.75H6A1.75 1.75 0 0 1 4.25 14V10A1.75 1.75 0 0 1 6 8.25Z",
1469
+ stroke: "currentColor",
1470
+ strokeWidth: "1.8",
1471
+ strokeLinecap: "round",
1472
+ strokeLinejoin: "round"
1473
+ }
1474
+ ),
1475
+ /* @__PURE__ */ jsx6("path", { d: "M10 11.25v1.5", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round" })
1476
+ ] });
1477
+ }
1316
1478
  function ControlFrame({
1317
1479
  label,
1318
1480
  hint,
@@ -1341,7 +1503,7 @@ function ControlFrame({
1341
1503
  ]
1342
1504
  }
1343
1505
  ) : null,
1344
- hint ? /* @__PURE__ */ jsx6("span", { className: "text-[13px] leading-[1.45] text-[var(--ui-kit-muted-text)]", children: hint }) : null
1506
+ hint ? /* @__PURE__ */ jsx6("span", { className: "text-[13px] leading-[1.45] text-[var(--theme-textLight)]", children: hint }) : null
1345
1507
  ] }) : null,
1346
1508
  children,
1347
1509
  error ? /* @__PURE__ */ jsx6("span", { className: "text-[13px] font-semibold leading-[1.45] text-[var(--theme-negative)]", children: error }) : null
@@ -1353,7 +1515,7 @@ function ControlFrame({
1353
1515
  label,
1354
1516
  required ? /* @__PURE__ */ jsx6("span", { className: "ml-1 text-[var(--theme-negative)]", children: "*" }) : null
1355
1517
  ] }) : null,
1356
- hint ? /* @__PURE__ */ jsx6("span", { className: "text-[13px] leading-[1.45] text-[var(--ui-kit-muted-text)]", children: hint }) : null
1518
+ hint ? /* @__PURE__ */ jsx6("span", { className: "text-[13px] leading-[1.45] text-[var(--theme-textLight)]", children: hint }) : null
1357
1519
  ] }) : null,
1358
1520
  children,
1359
1521
  error ? /* @__PURE__ */ jsx6("span", { className: "text-[13px] font-semibold leading-[1.45] text-[var(--theme-negative)]", children: error }) : null
@@ -1367,6 +1529,7 @@ function Input({
1367
1529
  className,
1368
1530
  showPasswordToggle = true,
1369
1531
  fileButtonLabel,
1532
+ icon,
1370
1533
  id,
1371
1534
  disabled,
1372
1535
  placeholder,
@@ -1383,36 +1546,57 @@ function Input({
1383
1546
  const fileInputRef = useRef2(null);
1384
1547
  const [isPasswordVisible, setIsPasswordVisible] = useState3(false);
1385
1548
  const [selectedFileNames, setSelectedFileNames] = useState3([]);
1549
+ const [validationError, setValidationError] = useState3();
1386
1550
  const isPasswordField = type === "password";
1387
1551
  const isEmailField = type === "email";
1552
+ const isLoginField = type === "login";
1388
1553
  const isFileField = type === "file";
1389
1554
  const canTogglePasswordVisibility = isPasswordField && showPasswordToggle;
1390
- const resolvedType = canTogglePasswordVisibility ? isPasswordVisible ? "text" : "password" : type;
1555
+ const resolvedType = isLoginField ? "text" : canTogglePasswordVisibility ? isPasswordVisible ? "text" : "password" : type;
1391
1556
  useEffect4(() => {
1392
1557
  if (!isFileField) {
1393
1558
  setSelectedFileNames([]);
1394
1559
  }
1395
1560
  }, [isFileField]);
1561
+ useEffect4(() => {
1562
+ if (!isEmailField && !isLoginField) {
1563
+ setValidationError(void 0);
1564
+ }
1565
+ }, [isEmailField, isLoginField]);
1566
+ useEffect4(() => {
1567
+ if (typeof rest.value !== "string") {
1568
+ return;
1569
+ }
1570
+ setValidationError(getInputValidationError(type, rest.value));
1571
+ }, [rest.value, type]);
1396
1572
  const hasFileButtonLabel = typeof fileButtonLabel === "string" ? fileButtonLabel.trim().length > 0 : fileButtonLabel != null;
1397
1573
  const hasSelectedFiles = selectedFileNames.length > 0;
1398
1574
  const showUploadLabel = hasFileButtonLabel && !hasSelectedFiles;
1399
1575
  const passwordLockIconSize = passwordToggleMetrics.iconSize + 2;
1400
1576
  const leadingContentGap = Math.max(0, Math.round(controlMetrics.paddingX / 3));
1577
+ const leadingIconInset = getControlLeadingIconInset(controlSize);
1578
+ const hasExternalError = error !== void 0 && error !== null && error !== "";
1579
+ const resolvedError = hasExternalError ? error : validationError;
1580
+ const hasResolvedError = resolvedError !== void 0 && resolvedError !== null && resolvedError !== "";
1401
1581
  const fileSelectionText = selectedFileNames.length === 0 ? placeholder != null ? placeholder : "" : selectedFileNames.length === 1 ? selectedFileNames[0] : `${selectedFileNames.length} files selected`;
1402
1582
  const fileIconSize = Math.max(controlMetrics.fontSize + 3, 16);
1403
- const fileTriggerWidth = controlMetrics.paddingX + fileIconSize;
1404
- const emailAdornmentWidth = controlMetrics.paddingX + fileIconSize;
1405
- const passwordAdornmentWidth = controlMetrics.paddingX + passwordLockIconSize;
1406
- const disabledFieldStyle = disabled ? { opacity: DISABLED_FIELD_OPACITY } : {};
1583
+ const fileTriggerWidth = getControlLeadingAdornmentWidth(controlSize, fileIconSize);
1584
+ const leadingAdornmentWidth = getControlLeadingAdornmentWidth(controlSize, fileIconSize);
1585
+ const passwordAdornmentWidth = getControlLeadingAdornmentWidth(controlSize, passwordLockIconSize);
1586
+ const defaultLeadingIcon = isEmailField ? /* @__PURE__ */ jsx6(EmailIcon, { size: fileIconSize }) : isLoginField ? /* @__PURE__ */ jsx6(LoginIcon, { size: fileIconSize }) : null;
1587
+ const resolvedLeadingIcon = icon != null ? icon : defaultLeadingIcon;
1588
+ const hasLeadingIcon = isRenderableNode(resolvedLeadingIcon);
1589
+ const resolvedFileIcon = icon != null ? icon : /* @__PURE__ */ jsx6(FileIcon, { size: fileIconSize, selected: hasSelectedFiles });
1590
+ const resolvedPasswordIcon = icon != null ? icon : isPasswordVisible ? /* @__PURE__ */ jsx6(PasswordVisibleIcon, { size: passwordLockIconSize }) : /* @__PURE__ */ jsx6(PasswordHiddenIcon, { size: passwordLockIconSize });
1407
1591
  const fieldBaseClassName = cx(
1408
1592
  UI_KIT_ROOT_CLASSNAME,
1409
1593
  "w-full box-border rounded-2xl border border-solid bg-[var(--theme-surface)]",
1410
1594
  "text-[var(--theme-text)] outline-none transition-[border-color,box-shadow,background-color]",
1411
- "duration-150 placeholder:text-[var(--ui-kit-placeholder)]",
1595
+ "duration-150 placeholder:text-[var(--theme-textLight)]",
1412
1596
  FIELD_HEIGHT_CLASSNAMES[controlSize],
1413
1597
  FIELD_TEXT_CLASSNAMES[controlSize],
1414
- error ? "border-[var(--theme-negative)]" : "border-[var(--theme-textLight)]",
1415
- disabled ? "cursor-not-allowed" : "cursor-text"
1598
+ hasResolvedError ? "border-[var(--theme-negative)]" : "border-[var(--theme-textLight)]",
1599
+ disabled ? "cursor-not-allowed opacity-70" : "cursor-text"
1416
1600
  );
1417
1601
  const adornedFieldClassName = cx(
1418
1602
  UI_KIT_ROOT_CLASSNAME,
@@ -1422,16 +1606,22 @@ function Input({
1422
1606
  "shadow-[0px_4px_5px_var(--theme-shadow)]",
1423
1607
  FIELD_HEIGHT_CLASSNAMES[controlSize],
1424
1608
  FIELD_TEXT_CLASSNAMES[controlSize],
1425
- error ? "border-[var(--theme-negative)]" : "border-[var(--theme-textLight)]",
1426
- disabled ? "cursor-not-allowed" : null
1609
+ hasResolvedError ? "border-[var(--theme-negative)]" : "border-[var(--theme-textLight)]",
1610
+ disabled ? "opacity-70" : null
1427
1611
  );
1428
1612
  const adornedInputClassName = cx(
1429
1613
  "h-full min-w-0 flex-1 border-0 bg-transparent text-[var(--theme-text)] outline-none",
1430
- "placeholder:text-[var(--ui-kit-placeholder)]",
1614
+ "placeholder:text-[var(--theme-textLight)]",
1431
1615
  FIELD_TEXT_CLASSNAMES[controlSize],
1432
1616
  disabled ? "cursor-not-allowed" : "cursor-text"
1433
1617
  );
1434
- const adornmentColorClassName = error ? "text-[var(--theme-negative)]" : "text-[var(--theme-textLight)]";
1618
+ const adornmentColorClassName = hasResolvedError ? "text-[var(--theme-negative)]" : "text-[var(--theme-textLight)]";
1619
+ const handleValidatedInputChange = (event) => {
1620
+ if (isEmailField || isLoginField) {
1621
+ setValidationError(getInputValidationError(type, event.target.value));
1622
+ }
1623
+ onChange == null ? void 0 : onChange(event);
1624
+ };
1435
1625
  const openFilePicker = () => {
1436
1626
  var _a;
1437
1627
  if (disabled) {
@@ -1473,7 +1663,7 @@ function Input({
1473
1663
  disabled ? "cursor-not-allowed" : "cursor-pointer",
1474
1664
  className
1475
1665
  ),
1476
- style: { ...style, ...disabledFieldStyle },
1666
+ style,
1477
1667
  children: [
1478
1668
  /* @__PURE__ */ jsxs7(
1479
1669
  "button",
@@ -1493,7 +1683,12 @@ function Input({
1493
1683
  style: {
1494
1684
  gap: showUploadLabel ? leadingContentGap : 0,
1495
1685
  width: showUploadLabel ? void 0 : fileTriggerWidth,
1496
- padding: showUploadLabel ? `0 ${controlMetrics.buttonPaddingX}px 0 ${Math.max(8, Math.round(controlMetrics.paddingX / 2))}px` : 0
1686
+ boxSizing: "border-box",
1687
+ justifyContent: "flex-start",
1688
+ paddingTop: 0,
1689
+ paddingRight: showUploadLabel ? controlMetrics.buttonPaddingX : 0,
1690
+ paddingBottom: 0,
1691
+ paddingLeft: leadingIconInset
1497
1692
  },
1498
1693
  children: [
1499
1694
  /* @__PURE__ */ jsx6(
@@ -1504,103 +1699,7 @@ function Input({
1504
1699
  adornmentColorClassName
1505
1700
  ),
1506
1701
  "aria-hidden": "true",
1507
- children: /* @__PURE__ */ jsx6("svg", { width: fileIconSize, height: fileIconSize, viewBox: "0 0 20 20", fill: "none", children: hasSelectedFiles ? /* @__PURE__ */ jsxs7(Fragment2, { children: [
1508
- /* @__PURE__ */ jsx6(
1509
- "path",
1510
- {
1511
- d: "M5.5 6.25h9",
1512
- stroke: "currentColor",
1513
- strokeWidth: "1.6",
1514
- strokeLinecap: "round"
1515
- }
1516
- ),
1517
- /* @__PURE__ */ jsx6(
1518
- "path",
1519
- {
1520
- d: "M7.25 6.25V5.25A1.5 1.5 0 0 1 8.75 3.75h2.5a1.5 1.5 0 0 1 1.5 1.5v1",
1521
- stroke: "currentColor",
1522
- strokeWidth: "1.6",
1523
- strokeLinecap: "round",
1524
- strokeLinejoin: "round"
1525
- }
1526
- ),
1527
- /* @__PURE__ */ jsx6(
1528
- "path",
1529
- {
1530
- d: "M7.75 8.25v5.5",
1531
- stroke: "currentColor",
1532
- strokeWidth: "1.6",
1533
- strokeLinecap: "round"
1534
- }
1535
- ),
1536
- /* @__PURE__ */ jsx6(
1537
- "path",
1538
- {
1539
- d: "M10 8.25v5.5",
1540
- stroke: "currentColor",
1541
- strokeWidth: "1.6",
1542
- strokeLinecap: "round"
1543
- }
1544
- ),
1545
- /* @__PURE__ */ jsx6(
1546
- "path",
1547
- {
1548
- d: "M12.25 8.25v5.5",
1549
- stroke: "currentColor",
1550
- strokeWidth: "1.6",
1551
- strokeLinecap: "round"
1552
- }
1553
- ),
1554
- /* @__PURE__ */ jsx6(
1555
- "path",
1556
- {
1557
- d: "M6.75 6.25l.5 8a1.5 1.5 0 0 0 1.497 1.406h2.506A1.5 1.5 0 0 0 12.75 14.25l.5-8",
1558
- stroke: "currentColor",
1559
- strokeWidth: "1.6",
1560
- strokeLinecap: "round",
1561
- strokeLinejoin: "round"
1562
- }
1563
- )
1564
- ] }) : /* @__PURE__ */ jsxs7(Fragment2, { children: [
1565
- /* @__PURE__ */ jsx6(
1566
- "path",
1567
- {
1568
- d: "M6.25 2.5h5.652l4.348 4.348V15A2.5 2.5 0 0 1 13.75 17.5h-7.5A2.5 2.5 0 0 1 3.75 15V5A2.5 2.5 0 0 1 6.25 2.5Z",
1569
- stroke: "currentColor",
1570
- strokeWidth: "1.6",
1571
- strokeLinecap: "round",
1572
- strokeLinejoin: "round"
1573
- }
1574
- ),
1575
- /* @__PURE__ */ jsx6(
1576
- "path",
1577
- {
1578
- d: "M11.875 2.75V6.25H15.375",
1579
- stroke: "currentColor",
1580
- strokeWidth: "1.6",
1581
- strokeLinecap: "round",
1582
- strokeLinejoin: "round"
1583
- }
1584
- ),
1585
- /* @__PURE__ */ jsx6(
1586
- "path",
1587
- {
1588
- d: "M7.5 10h5",
1589
- stroke: "currentColor",
1590
- strokeWidth: "1.6",
1591
- strokeLinecap: "round"
1592
- }
1593
- ),
1594
- /* @__PURE__ */ jsx6(
1595
- "path",
1596
- {
1597
- d: "M7.5 13h5",
1598
- stroke: "currentColor",
1599
- strokeWidth: "1.6",
1600
- strokeLinecap: "round"
1601
- }
1602
- )
1603
- ] }) })
1702
+ children: resolvedFileIcon
1604
1703
  }
1605
1704
  ),
1606
1705
  showUploadLabel ? fileButtonLabel : null
@@ -1626,7 +1725,7 @@ function Input({
1626
1725
  className: cx(
1627
1726
  "flex h-full min-w-0 flex-1 items-center overflow-hidden text-ellipsis whitespace-nowrap",
1628
1727
  FIELD_TEXT_CLASSNAMES[controlSize],
1629
- hasSelectedFiles ? "text-[var(--theme-text)]" : "text-[var(--ui-kit-placeholder)]"
1728
+ hasSelectedFiles ? "text-[var(--theme-text)]" : "text-[var(--theme-textLight)]"
1630
1729
  ),
1631
1730
  style: { padding: `0 ${controlMetrics.paddingX}px 0 ${leadingContentGap}px` },
1632
1731
  children: fileSelectionText
@@ -1637,43 +1736,38 @@ function Input({
1637
1736
  ]
1638
1737
  }
1639
1738
  )
1640
- ] }) : isEmailField ? /* @__PURE__ */ jsxs7(
1739
+ ] }) : canTogglePasswordVisibility ? /* @__PURE__ */ jsxs7(
1641
1740
  "div",
1642
1741
  {
1643
1742
  className: cx(adornedFieldClassName, className),
1644
- style: { ...style, ...disabledFieldStyle },
1743
+ style,
1645
1744
  children: [
1646
1745
  /* @__PURE__ */ jsx6(
1647
- "span",
1746
+ "button",
1648
1747
  {
1748
+ type: "button",
1749
+ "aria-label": isPasswordVisible ? "Hide password" : "Show password",
1750
+ "aria-pressed": isPasswordVisible,
1751
+ disabled,
1752
+ onMouseDown: (event) => {
1753
+ event.preventDefault();
1754
+ },
1755
+ onClick: () => {
1756
+ setIsPasswordVisible((currentValue) => !currentValue);
1757
+ },
1649
1758
  className: cx(
1650
- "inline-flex shrink-0 self-stretch items-center justify-center bg-transparent",
1651
- adornmentColorClassName
1759
+ "inline-flex shrink-0 self-stretch items-center justify-center border-0",
1760
+ "bg-transparent p-0 appearance-none",
1761
+ adornmentColorClassName,
1762
+ disabled ? "cursor-not-allowed" : "cursor-pointer"
1652
1763
  ),
1653
- style: { width: emailAdornmentWidth },
1654
- "aria-hidden": "true",
1655
- children: /* @__PURE__ */ jsxs7("svg", { width: fileIconSize, height: fileIconSize, viewBox: "0 0 20 20", fill: "none", children: [
1656
- /* @__PURE__ */ jsx6(
1657
- "path",
1658
- {
1659
- d: "M3.75 6.25A1.875 1.875 0 0 1 5.625 4.375h8.75A1.875 1.875 0 0 1 16.25 6.25v7.5a1.875 1.875 0 0 1-1.875 1.875h-8.75A1.875 1.875 0 0 1 3.75 13.75v-7.5Z",
1660
- stroke: "currentColor",
1661
- strokeWidth: "1.6",
1662
- strokeLinecap: "round",
1663
- strokeLinejoin: "round"
1664
- }
1665
- ),
1666
- /* @__PURE__ */ jsx6(
1667
- "path",
1668
- {
1669
- d: "M4.375 6.25 10 10.625l5.625-4.375",
1670
- stroke: "currentColor",
1671
- strokeWidth: "1.6",
1672
- strokeLinecap: "round",
1673
- strokeLinejoin: "round"
1674
- }
1675
- )
1676
- ] })
1764
+ style: {
1765
+ width: passwordAdornmentWidth,
1766
+ boxSizing: "border-box",
1767
+ justifyContent: "flex-start",
1768
+ paddingLeft: leadingIconInset
1769
+ },
1770
+ children: resolvedPasswordIcon
1677
1771
  }
1678
1772
  ),
1679
1773
  /* @__PURE__ */ jsx6(
@@ -1684,112 +1778,35 @@ function Input({
1684
1778
  placeholder,
1685
1779
  type: resolvedType,
1686
1780
  disabled,
1687
- onChange,
1781
+ onChange: handleValidatedInputChange,
1688
1782
  className: cx(adornedInputClassName, className),
1783
+ "aria-invalid": hasResolvedError,
1689
1784
  style: { padding: `0 ${controlMetrics.paddingX}px 0 ${leadingContentGap}px` }
1690
1785
  }
1691
1786
  )
1692
1787
  ]
1693
1788
  }
1694
- ) : canTogglePasswordVisibility ? /* @__PURE__ */ jsxs7(
1789
+ ) : hasLeadingIcon ? /* @__PURE__ */ jsxs7(
1695
1790
  "div",
1696
1791
  {
1697
1792
  className: cx(adornedFieldClassName, className),
1698
- style: { ...style, ...disabledFieldStyle },
1793
+ style,
1699
1794
  children: [
1700
1795
  /* @__PURE__ */ jsx6(
1701
- "button",
1796
+ "span",
1702
1797
  {
1703
- type: "button",
1704
- "aria-label": isPasswordVisible ? "Hide password" : "Show password",
1705
- "aria-pressed": isPasswordVisible,
1706
- disabled,
1707
- onMouseDown: (event) => {
1708
- event.preventDefault();
1709
- },
1710
- onClick: () => {
1711
- setIsPasswordVisible((currentValue) => !currentValue);
1712
- },
1713
1798
  className: cx(
1714
- "inline-flex shrink-0 self-stretch items-center justify-center border-0",
1715
- "bg-transparent p-0 appearance-none",
1716
- adornmentColorClassName,
1717
- disabled ? "cursor-not-allowed" : "cursor-pointer"
1799
+ "inline-flex shrink-0 self-stretch items-center justify-center bg-transparent",
1800
+ adornmentColorClassName
1718
1801
  ),
1719
- style: { width: passwordAdornmentWidth },
1720
- children: isPasswordVisible ? /* @__PURE__ */ jsxs7(
1721
- "svg",
1722
- {
1723
- width: passwordLockIconSize,
1724
- height: passwordLockIconSize,
1725
- viewBox: "0 0 20 20",
1726
- fill: "none",
1727
- "aria-hidden": "true",
1728
- children: [
1729
- /* @__PURE__ */ jsx6(
1730
- "path",
1731
- {
1732
- d: "M6.75 8V6.75A3.25 3.25 0 0 1 12.262 4.415",
1733
- stroke: "currentColor",
1734
- strokeWidth: "1.8",
1735
- strokeLinecap: "round",
1736
- strokeLinejoin: "round"
1737
- }
1738
- ),
1739
- /* @__PURE__ */ jsx6(
1740
- "path",
1741
- {
1742
- d: "M6 8.25h8a1.75 1.75 0 0 1 1.75 1.75V14A1.75 1.75 0 0 1 14 15.75H6A1.75 1.75 0 0 1 4.25 14V10A1.75 1.75 0 0 1 6 8.25Z",
1743
- stroke: "currentColor",
1744
- strokeWidth: "1.8",
1745
- strokeLinecap: "round",
1746
- strokeLinejoin: "round"
1747
- }
1748
- ),
1749
- /* @__PURE__ */ jsx6(
1750
- "path",
1751
- {
1752
- d: "M10 11.25v1.5",
1753
- stroke: "currentColor",
1754
- strokeWidth: "1.8",
1755
- strokeLinecap: "round"
1756
- }
1757
- )
1758
- ]
1759
- }
1760
- ) : /* @__PURE__ */ jsxs7(
1761
- "svg",
1762
- {
1763
- width: passwordLockIconSize,
1764
- height: passwordLockIconSize,
1765
- viewBox: "0 0 20 20",
1766
- fill: "none",
1767
- "aria-hidden": "true",
1768
- children: [
1769
- /* @__PURE__ */ jsx6(
1770
- "path",
1771
- {
1772
- d: "M6.75 8V6.75A3.25 3.25 0 1 1 13.25 6.75V8",
1773
- stroke: "currentColor",
1774
- strokeWidth: "1.8",
1775
- strokeLinecap: "round",
1776
- strokeLinejoin: "round"
1777
- }
1778
- ),
1779
- /* @__PURE__ */ jsx6(
1780
- "path",
1781
- {
1782
- d: "M6 8.25h8a1.75 1.75 0 0 1 1.75 1.75V14A1.75 1.75 0 0 1 14 15.75H6A1.75 1.75 0 0 1 4.25 14V10A1.75 1.75 0 0 1 6 8.25Z",
1783
- stroke: "currentColor",
1784
- strokeWidth: "1.8",
1785
- strokeLinecap: "round",
1786
- strokeLinejoin: "round"
1787
- }
1788
- ),
1789
- /* @__PURE__ */ jsx6("path", { d: "M10 11.25v1.5", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round" })
1790
- ]
1791
- }
1792
- )
1802
+ style: {
1803
+ width: leadingAdornmentWidth,
1804
+ boxSizing: "border-box",
1805
+ justifyContent: "flex-start",
1806
+ paddingLeft: leadingIconInset
1807
+ },
1808
+ "aria-hidden": "true",
1809
+ children: resolvedLeadingIcon
1793
1810
  }
1794
1811
  ),
1795
1812
  /* @__PURE__ */ jsx6(
@@ -1800,8 +1817,9 @@ function Input({
1800
1817
  placeholder,
1801
1818
  type: resolvedType,
1802
1819
  disabled,
1803
- onChange,
1820
+ onChange: handleValidatedInputChange,
1804
1821
  className: cx(adornedInputClassName, className),
1822
+ "aria-invalid": hasResolvedError,
1805
1823
  style: { padding: `0 ${controlMetrics.paddingX}px 0 ${leadingContentGap}px` }
1806
1824
  }
1807
1825
  )
@@ -1815,9 +1833,10 @@ function Input({
1815
1833
  placeholder,
1816
1834
  type: resolvedType,
1817
1835
  disabled,
1818
- onChange,
1836
+ onChange: handleValidatedInputChange,
1837
+ "aria-invalid": hasResolvedError,
1819
1838
  className: cx(fieldBaseClassName, FIELD_PADDING_X_CLASSNAMES[controlSize], className),
1820
- style: { boxShadow: "var(--ui-kit-component-shadow)", ...style, ...disabledFieldStyle }
1839
+ style: { boxShadow: "0px 4px 5px var(--theme-shadow)", ...style }
1821
1840
  }
1822
1841
  );
1823
1842
  return /* @__PURE__ */ jsx6(
@@ -1825,7 +1844,7 @@ function Input({
1825
1844
  {
1826
1845
  label,
1827
1846
  hint,
1828
- error,
1847
+ error: resolvedError,
1829
1848
  htmlFor: isFileField ? void 0 : inputId,
1830
1849
  required: rest.required,
1831
1850
  useLabelWrapper: !isFileField,
@@ -2044,13 +2063,13 @@ function getEarlierDate(leftDate, rightDate) {
2044
2063
  return leftDate.getTime() <= rightDate.getTime() ? leftDate : rightDate;
2045
2064
  }
2046
2065
  function CalendarIcon({ size }) {
2047
- return /* @__PURE__ */ jsxs8("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
2066
+ return /* @__PURE__ */ jsx7("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxs8("g", { transform: "translate(0.75 0)", children: [
2048
2067
  /* @__PURE__ */ jsx7("rect", { x: "3", y: "4.5", width: "14", height: "12.5", rx: "3", stroke: "currentColor", strokeWidth: "1.6" }),
2049
2068
  /* @__PURE__ */ jsx7("path", { d: "M6.25 2.75V6", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" }),
2050
2069
  /* @__PURE__ */ jsx7("path", { d: "M13.75 2.75V6", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" }),
2051
2070
  /* @__PURE__ */ jsx7("path", { d: "M3 7.5H17", stroke: "currentColor", strokeWidth: "1.6" }),
2052
2071
  /* @__PURE__ */ jsx7("circle", { cx: "10", cy: "11.5", r: "1.2", fill: "currentColor" })
2053
- ] });
2072
+ ] }) });
2054
2073
  }
2055
2074
  function ClearIcon({ size }) {
2056
2075
  return /* @__PURE__ */ jsxs8("svg", { width: size, height: size, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
@@ -2155,7 +2174,8 @@ function DatePicker({
2155
2174
  const canOpenPicker = !disabled && !readOnly && !hasConfigurationConflict;
2156
2175
  const canClear = clearable && !disabled && !readOnly && !required && hasAnyValue;
2157
2176
  const leadingContentGap = Math.max(0, Math.round(controlMetrics.paddingX / 3));
2158
- const pickerAdornmentWidth = controlMetrics.paddingX + accessoryMetrics.iconSize;
2177
+ const leadingIconInset = getControlLeadingIconInset(controlSize);
2178
+ const pickerAdornmentWidth = getControlLeadingAdornmentWidth(controlSize, accessoryMetrics.iconSize);
2159
2179
  const trailingButtonCount = Number(canClear);
2160
2180
  const trailingInset = trailingButtonCount > 0 ? Math.max(
2161
2181
  0,
@@ -2166,7 +2186,7 @@ function DatePicker({
2166
2186
  const fieldBaseClassName = cx(
2167
2187
  "w-full box-border rounded-2xl border border-solid bg-[var(--theme-surface)]",
2168
2188
  "text-[var(--theme-text)] outline-none transition-[border-color,box-shadow,background-color]",
2169
- "duration-150 placeholder:text-[var(--ui-kit-placeholder)]",
2189
+ "duration-150 placeholder:text-[var(--theme-textLight)]",
2170
2190
  FIELD_HEIGHT_CLASSNAMES2[controlSize],
2171
2191
  FIELD_TEXT_CLASSNAMES2[controlSize],
2172
2192
  resolvedError ? "border-[var(--theme-negative)]" : "border-[var(--theme-textLight)]",
@@ -2180,10 +2200,10 @@ function DatePicker({
2180
2200
  FIELD_TEXT_CLASSNAMES2[controlSize],
2181
2201
  disabled ? "cursor-not-allowed" : readOnly ? "cursor-default" : "cursor-text"
2182
2202
  );
2183
- const integratedFieldBoxShadow = getInsetBorderShadow(fieldBorderColor, resolvedError ? { outerShadow: "0 0 0 3px var(--ui-kit-negative-soft)" } : void 0);
2203
+ const integratedFieldBoxShadow = getInsetBorderShadow(fieldBorderColor, resolvedError ? { outerShadow: "0 0 0 3px var(--theme-negative)", componentShadow: "0px 4px 5px var(--theme-shadow)" } : { componentShadow: "0px 4px 5px var(--theme-shadow)" });
2184
2204
  const integratedInputClassName = cx(
2185
2205
  "h-full w-full box-border border-0 bg-transparent text-[var(--theme-text)]",
2186
- "outline-none placeholder:text-[var(--ui-kit-placeholder)]",
2206
+ "outline-none placeholder:text-[var(--theme-textLight)]",
2187
2207
  FIELD_TEXT_CLASSNAMES2[controlSize],
2188
2208
  disabled ? "cursor-not-allowed" : readOnly ? "cursor-default" : "cursor-text"
2189
2209
  );
@@ -2413,7 +2433,12 @@ function DatePicker({
2413
2433
  },
2414
2434
  onClick: openNativePicker,
2415
2435
  className: pickerAdornmentClassName,
2416
- style: { width: pickerAdornmentWidth },
2436
+ style: {
2437
+ width: pickerAdornmentWidth,
2438
+ boxSizing: "border-box",
2439
+ justifyContent: "flex-start",
2440
+ paddingLeft: leadingIconInset
2441
+ },
2417
2442
  children: /* @__PURE__ */ jsx7(CalendarIcon, { size: accessoryMetrics.iconSize })
2418
2443
  }
2419
2444
  ),
@@ -2441,7 +2466,7 @@ function DatePicker({
2441
2466
  className: cx(fieldBaseClassName, FIELD_PADDING_X_CLASSNAMES2[controlSize], className),
2442
2467
  style: {
2443
2468
  paddingRight: controlMetrics.paddingX + trailingInset,
2444
- boxShadow: resolvedError ? "0 0 0 3px var(--ui-kit-negative-soft), var(--ui-kit-component-shadow)" : "var(--ui-kit-component-shadow)",
2469
+ boxShadow: resolvedError ? "0 0 0 3px var(--theme-negative), 0px 4px 5px var(--theme-shadow)" : "0px 4px 5px var(--theme-shadow)",
2445
2470
  ...style,
2446
2471
  ...disabledFieldStyle
2447
2472
  }
@@ -2501,7 +2526,6 @@ function Separator({
2501
2526
  import {
2502
2527
  useEffect as useEffect6,
2503
2528
  useId as useId3,
2504
- useMemo as useMemo5,
2505
2529
  useRef as useRef4,
2506
2530
  useState as useState5
2507
2531
  } from "react";
@@ -2609,8 +2633,8 @@ function SelectBase({
2609
2633
  ...rest
2610
2634
  }) {
2611
2635
  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
2612
- const { theme, mutedText } = useUiKitTheme();
2613
- const componentShadow = getComponentShadow(theme);
2636
+ const theme = useUiKitTheme();
2637
+ const componentShadow = "0px 4px 5px var(--theme-shadow)";
2614
2638
  const generatedId = useId3().replace(/:/g, "");
2615
2639
  const resolvedId = id != null ? id : `ss-select-${generatedId}`;
2616
2640
  const isMultiSelect = Boolean(isMulti || multiple);
@@ -2636,7 +2660,7 @@ function SelectBase({
2636
2660
  const selectedValue = (_e = selectedValues[0]) != null ? _e : "";
2637
2661
  const optionLookup = new Map(flatOptions.map((option) => [option.value, option]));
2638
2662
  const selectedOption = (_f = optionLookup.get(selectedValue)) != null ? _f : null;
2639
- const placeholderTextColor = withAlpha(theme.colors.text, 0.5);
2663
+ const placeholderTextColor = "var(--theme-textLight)";
2640
2664
  const hasSelection = isMultiSelect ? selectedValues.length > 0 : selectedValue !== "";
2641
2665
  const displayLabel = hasSelection ? isMultiSelect ? selectedValues.map((currentValue) => {
2642
2666
  const option = optionLookup.get(currentValue);
@@ -2653,42 +2677,17 @@ function SelectBase({
2653
2677
  const controlMetrics = getControlMetrics(controlSize);
2654
2678
  const listboxId = `${resolvedId}-listbox`;
2655
2679
  const searchInputId = `${resolvedId}-search`;
2656
- const scrollbarThumbColor = withAlpha(theme.colors.text, 0.22);
2657
- const scrollbarThumbHoverColor = withAlpha(theme.colors.text, 0.32);
2680
+ const scrollbarThumbColor = theme.colors.secondary;
2681
+ const scrollbarThumbHoverColor = theme.colors.textLight;
2658
2682
  const highlightedOption = (_i = visibleOptions.find((option) => option.value === highlightedValue)) != null ? _i : null;
2659
- const optionHoverBackground = theme.colors.primary;
2660
- const optionSelectedBackground = theme.colors.primary;
2661
2683
  const canOpenMenu = allowOpenWithoutOptions || flatOptions.length > 0;
2662
2684
  const isTriggerDisabled = disabled || !canOpenMenu;
2663
2685
  const buttonPassthroughProps = Object.fromEntries(
2664
2686
  Object.entries(rest).filter(([key]) => key.startsWith("aria-") || key.startsWith("data-"))
2665
2687
  );
2666
- const selectVariables = useMemo5(() => ({
2667
- "--ui-kit-select-placeholder": placeholderTextColor,
2668
- "--ui-kit-select-muted": mutedText,
2669
- "--ui-kit-select-indicator-disabled": withAlpha(theme.colors.text, 0.42),
2670
- "--ui-kit-select-surface-raised": theme.colors.surface,
2671
- "--ui-kit-select-scrollbar-thumb": scrollbarThumbColor,
2672
- "--ui-kit-select-scrollbar-thumb-hover": scrollbarThumbHoverColor,
2673
- "--ui-kit-select-divider": withAlpha(theme.colors.text, 0.08),
2674
- "--ui-kit-select-option-hover-bg": optionHoverBackground,
2675
- "--ui-kit-select-option-selected-bg": optionSelectedBackground,
2676
- "--ui-kit-select-option-disabled": withAlpha(theme.colors.text, 0.38),
2677
- "--ui-kit-select-control-shadow": componentShadow
2678
- }), [
2679
- componentShadow,
2680
- mutedText,
2681
- optionHoverBackground,
2682
- optionSelectedBackground,
2683
- placeholderTextColor,
2684
- scrollbarThumbColor,
2685
- scrollbarThumbHoverColor,
2686
- theme.colors.surface,
2687
- theme.colors.text
2688
- ]);
2689
2688
  const triggerBorderColor = error ? "var(--theme-negative)" : "var(--theme-textLight)";
2690
2689
  const triggerBoxShadow = getInsetBorderShadow(triggerBorderColor, {
2691
- componentShadow: "var(--ui-kit-select-control-shadow)"
2690
+ componentShadow
2692
2691
  });
2693
2692
  const triggerClassName = cx(
2694
2693
  "m-0 box-border flex w-full min-w-0 items-center justify-between gap-3 rounded-2xl border-0 appearance-none",
@@ -2696,7 +2695,7 @@ function SelectBase({
2696
2695
  "duration-150 text-left",
2697
2696
  FIELD_HEIGHT_CLASSNAMES3[controlSize],
2698
2697
  FIELD_TEXT_CLASSNAMES3[controlSize],
2699
- hasSelection ? "text-[var(--theme-text)]" : "text-[var(--ui-kit-select-placeholder)]",
2698
+ hasSelection ? "text-[var(--theme-text)]" : "text-[var(--theme-textLight)]",
2700
2699
  isTriggerDisabled ? "cursor-not-allowed" : "cursor-pointer"
2701
2700
  );
2702
2701
  useEffect6(() => {
@@ -3061,7 +3060,7 @@ function SelectBase({
3061
3060
  htmlFor: resolvedId,
3062
3061
  required: rest.required,
3063
3062
  useLabelWrapper: false,
3064
- children: /* @__PURE__ */ jsxs9("div", { ref: shellRef, className: "relative w-full", style: selectVariables, children: [
3063
+ children: /* @__PURE__ */ jsxs9("div", { ref: shellRef, className: "relative w-full", children: [
3065
3064
  /* @__PURE__ */ jsxs9(
3066
3065
  "button",
3067
3066
  {
@@ -3105,7 +3104,7 @@ function SelectBase({
3105
3104
  className: cx(
3106
3105
  "pointer-events-none absolute top-1/2 flex -translate-y-1/2 items-center justify-center",
3107
3106
  "transition-[transform,color] duration-150",
3108
- isTriggerDisabled ? "text-[var(--ui-kit-select-indicator-disabled)]" : "text-[var(--ui-kit-select-muted)]"
3107
+ isTriggerDisabled ? "text-[var(--theme-secondary)]" : "text-[var(--theme-textLight)]"
3109
3108
  ),
3110
3109
  style: {
3111
3110
  right: indicatorOffset,
@@ -3147,7 +3146,7 @@ function SelectBase({
3147
3146
  /* @__PURE__ */ jsx9("style", { children: `
3148
3147
  #${listboxId} {
3149
3148
  scrollbar-width: thin;
3150
- scrollbar-color: var(--ui-kit-select-scrollbar-thumb) transparent;
3149
+ scrollbar-color: ${scrollbarThumbColor} transparent;
3151
3150
  }
3152
3151
 
3153
3152
  #${listboxId}::-webkit-scrollbar {
@@ -3159,19 +3158,19 @@ function SelectBase({
3159
3158
  }
3160
3159
 
3161
3160
  #${listboxId}::-webkit-scrollbar-thumb {
3162
- background: var(--ui-kit-select-scrollbar-thumb);
3161
+ background: ${scrollbarThumbColor};
3163
3162
  border-radius: 999px;
3164
3163
  border: 2px solid transparent;
3165
3164
  background-clip: padding-box;
3166
3165
  }
3167
3166
 
3168
3167
  #${listboxId}::-webkit-scrollbar-thumb:hover {
3169
- background: var(--ui-kit-select-scrollbar-thumb-hover);
3168
+ background: ${scrollbarThumbHoverColor};
3170
3169
  background-clip: padding-box;
3171
3170
  }
3172
3171
 
3173
3172
  #${searchInputId}::placeholder {
3174
- color: var(--ui-kit-select-placeholder);
3173
+ color: ${placeholderTextColor};
3175
3174
  opacity: 1;
3176
3175
  }
3177
3176
  ` }),
@@ -3183,9 +3182,9 @@ function SelectBase({
3183
3182
  style: {
3184
3183
  top: menuPlacement === "bottom" ? `calc(100% + ${MENU_OFFSET}px)` : "auto",
3185
3184
  bottom: menuPlacement === "top" ? `calc(100% + ${MENU_OFFSET}px)` : "auto",
3186
- borderColor: "var(--theme-textLight)",
3187
- backgroundColor: "var(--ui-kit-select-surface-raised)",
3188
- boxShadow: "var(--ui-kit-select-control-shadow)",
3185
+ borderColor: theme.colors.secondary,
3186
+ backgroundColor: theme.colors.surface,
3187
+ boxShadow: componentShadow,
3189
3188
  visibility: isPlacementResolved ? "visible" : "hidden"
3190
3189
  },
3191
3190
  children: [
@@ -3193,7 +3192,7 @@ function SelectBase({
3193
3192
  "div",
3194
3193
  {
3195
3194
  className: "flex shrink-0 items-center justify-start gap-2 border-b px-1 pb-[10px] pt-1",
3196
- style: { borderColor: "var(--ui-kit-select-divider)" },
3195
+ style: { borderColor: theme.colors.secondary },
3197
3196
  children: [
3198
3197
  bulkToggleControl,
3199
3198
  /* @__PURE__ */ jsx9(
@@ -3218,8 +3217,8 @@ function SelectBase({
3218
3217
  "aria-label": searchPlaceholder,
3219
3218
  className: "w-full flex-1 rounded-[11px] border bg-[var(--theme-surface)] px-[11px] py-[7px] text-[11px] leading-[1.4] text-[var(--theme-text)] outline-none",
3220
3219
  style: {
3221
- borderColor: "var(--theme-textLight)",
3222
- boxShadow: "var(--ui-kit-select-control-shadow)"
3220
+ borderColor: theme.colors.secondary,
3221
+ boxShadow: componentShadow
3223
3222
  }
3224
3223
  }
3225
3224
  )
@@ -3229,7 +3228,7 @@ function SelectBase({
3229
3228
  "div",
3230
3229
  {
3231
3230
  className: "flex shrink-0 items-center justify-start border-b px-1 pb-[10px] pt-1",
3232
- style: { borderColor: "var(--ui-kit-select-divider)" },
3231
+ style: { borderColor: theme.colors.secondary },
3233
3232
  children: bulkToggleControl
3234
3233
  }
3235
3234
  ) : null,
@@ -3245,7 +3244,7 @@ function SelectBase({
3245
3244
  children: visibleGroups.length === 0 ? /* @__PURE__ */ jsx9(
3246
3245
  "div",
3247
3246
  {
3248
- className: "px-3 py-[14px] text-center text-[13px] text-[var(--ui-kit-select-muted)]",
3247
+ className: "px-3 py-[14px] text-center text-[13px] text-[var(--theme-textLight)]",
3249
3248
  children: emptyState
3250
3249
  }
3251
3250
  ) : visibleGroups.map((group) => /* @__PURE__ */ jsxs9(
@@ -3256,7 +3255,7 @@ function SelectBase({
3256
3255
  group.label ? /* @__PURE__ */ jsx9(
3257
3256
  "span",
3258
3257
  {
3259
- className: "px-2 pb-0.5 pt-1.5 text-[11px] font-extrabold uppercase tracking-[0.08em] text-[var(--ui-kit-select-muted)]",
3258
+ className: "px-2 pb-0.5 pt-1.5 text-[11px] font-extrabold uppercase tracking-[0.08em] text-[var(--theme-textLight)]",
3260
3259
  children: group.label
3261
3260
  }
3262
3261
  ) : null,
@@ -3292,11 +3291,11 @@ function SelectBase({
3292
3291
  "flex w-full min-w-0 items-center justify-between gap-3 rounded-xl box-border",
3293
3292
  "transition-[background-color,color] duration-150",
3294
3293
  OPTION_PADDING_CLASSNAMES[controlSize],
3295
- option.disabled ? "cursor-not-allowed text-[var(--ui-kit-select-option-disabled)]" : "cursor-pointer",
3294
+ option.disabled ? "cursor-not-allowed text-[var(--theme-secondary)]" : "cursor-pointer",
3296
3295
  !option.disabled && isActive ? "text-[var(--theme-onPrimary)]" : null,
3297
3296
  !option.disabled && !isActive ? "text-[var(--theme-text)]" : null,
3298
- isSelected ? "bg-[var(--ui-kit-select-option-selected-bg)] font-bold" : null,
3299
- !isSelected && isHighlighted ? "bg-[var(--ui-kit-select-option-hover-bg)]" : null,
3297
+ isSelected ? "bg-[var(--theme-primary)] font-bold" : null,
3298
+ !isSelected && isHighlighted ? "bg-[var(--theme-primary)]" : null,
3300
3299
  !isSelected && !isHighlighted ? "bg-[var(--theme-surface)] font-normal" : null
3301
3300
  ),
3302
3301
  children: [
@@ -3313,7 +3312,7 @@ function SelectBase({
3313
3312
  size: 16,
3314
3313
  checkedColor: isActive ? "var(--theme-onPrimary)" : "var(--theme-primary)",
3315
3314
  iconColor: isActive ? "var(--theme-primary)" : "var(--theme-onPrimary)",
3316
- uncheckedBorderColor: isActive ? "var(--theme-onPrimary)" : withAlpha(theme.colors.text, 0.26),
3315
+ uncheckedBorderColor: isActive ? "var(--theme-onPrimary)" : theme.colors.secondary,
3317
3316
  uncheckedBackgroundColor: "transparent"
3318
3317
  }
3319
3318
  ) : null,
@@ -3359,7 +3358,7 @@ function SelectBase({
3359
3358
  "div",
3360
3359
  {
3361
3360
  className: "shrink-0 border-t px-2 pb-1 pt-2.5",
3362
- style: { borderColor: "var(--ui-kit-select-divider)" },
3361
+ style: { borderColor: theme.colors.secondary },
3363
3362
  children: menuFooter
3364
3363
  }
3365
3364
  ) : null
@@ -3711,7 +3710,7 @@ function SelectAsync({
3711
3710
  "div",
3712
3711
  {
3713
3712
  "aria-live": "polite",
3714
- className: "flex items-center gap-3 text-xs leading-[1.4] text-[var(--ui-kit-muted-text)]",
3713
+ className: "flex items-center gap-3 text-xs leading-[1.4] text-[var(--theme-textLight)]",
3715
3714
  style: { justifyContent: hasMore ? "space-between" : "center" },
3716
3715
  children: [
3717
3716
  /* @__PURE__ */ jsx12("span", { children: isLoadingMore ? loadingMoreMessage : hasMore ? loadMoreHintMessage : null }),
@@ -4275,9 +4274,12 @@ function TableBase({
4275
4274
  onInternalPageChange,
4276
4275
  onInternalPageSizeChange
4277
4276
  }) {
4278
- const uiKitTheme = useUiKitTheme();
4279
- const { theme, borderSoft, borderStrong, focusRing, mutedText, surfaceMuted, surfaceRaised } = uiKitTheme;
4280
- const componentShadow = getComponentShadow(theme);
4277
+ const theme = useUiKitTheme();
4278
+ const componentShadow = "0px 4px 5px var(--theme-shadow)";
4279
+ const softBorderColor = theme.colors.secondary;
4280
+ const strongBorderColor = theme.colors.textLight;
4281
+ const mutedTextColor = theme.colors.textLight;
4282
+ const alternateSurfaceColor = theme.colors.background;
4281
4283
  const scrollRegionId = useId4().replace(/:/g, "");
4282
4284
  const containerRef = useRef6(null);
4283
4285
  const [containerWidth, setContainerWidth] = useState7(null);
@@ -4301,8 +4303,8 @@ function TableBase({
4301
4303
  const hasRows = items.length > 0;
4302
4304
  const hasSearchValue = searchValue.trim().length > 0;
4303
4305
  const visibleInlineActions = Math.max(0, Math.floor(maxInlineActions));
4304
- const scrollbarThumbColor = withAlpha(theme.colors.textLight, 0.3);
4305
- const scrollbarThumbHoverColor = theme.colors.text;
4306
+ const scrollbarThumbColor = theme.colors.secondary;
4307
+ const scrollbarThumbHoverColor = theme.colors.textLight;
4306
4308
  const shouldShowToolbarStatus = loading || !loading && Boolean(error) && hasRows;
4307
4309
  const shouldRenderToolbar = shouldShowSearch || shouldShowToolbarStatus || showSettingsButton;
4308
4310
  const shouldRenderToolbarPrimaryGroup = shouldShowSearch || showSettingsButton;
@@ -4311,7 +4313,7 @@ function TableBase({
4311
4313
  const currentPageItemCount = items.length;
4312
4314
  const downloadMatrix = buildTableDownloadMatrix(visibleDownloadColumns, items);
4313
4315
  const downloadFileBaseName = buildTableDownloadFileBaseName(ariaLabel, normalizedPage);
4314
- const stickyActionsColumnShadow = `-10px 0 16px -14px ${withAlpha(theme.colors.shadow, 0.7)}`;
4316
+ const stickyActionsColumnShadow = `-10px 0 16px -14px ${theme.colors.shadow}`;
4315
4317
  const shouldStickActionsColumn = Boolean(actions) && stickyActionsColumn;
4316
4318
  const getStickyActionsCellStyle = (backgroundColor, backgroundImage, isHeader = false) => ({
4317
4319
  position: "sticky",
@@ -4321,7 +4323,7 @@ function TableBase({
4321
4323
  backgroundImage,
4322
4324
  backgroundClip: "padding-box",
4323
4325
  boxShadow: stickyActionsColumnShadow,
4324
- borderLeft: `1px solid ${borderSoft}`
4326
+ borderLeft: `1px solid ${softBorderColor}`
4325
4327
  });
4326
4328
  useEffect8(() => {
4327
4329
  const element = containerRef.current;
@@ -4361,8 +4363,8 @@ function TableBase({
4361
4363
  height: 34,
4362
4364
  padding: iconOnly ? 0 : "0 12px",
4363
4365
  borderRadius: 12,
4364
- border: `1px solid ${tone === "danger" ? withAlpha(theme.colors.negative, 0.28) : borderSoft}`,
4365
- backgroundColor: tone === "danger" ? withAlpha(theme.colors.negative, 0.08) : withAlpha(theme.colors.surface, 0.82),
4366
+ border: `1px solid ${tone === "danger" ? theme.colors.negative : softBorderColor}`,
4367
+ backgroundColor: theme.colors.surface,
4366
4368
  color: tone === "danger" ? theme.colors.negative : theme.colors.text,
4367
4369
  cursor: disabled ? "not-allowed" : "pointer",
4368
4370
  opacity: disabled ? DISABLED_COMPONENT_OPACITY : 1,
@@ -4381,14 +4383,14 @@ function TableBase({
4381
4383
  gap: 6,
4382
4384
  padding: 8,
4383
4385
  borderRadius: STANDARD_COMPONENT_BORDER_RADIUS,
4384
- border: `1px solid ${borderSoft}`,
4386
+ border: `1px solid ${softBorderColor}`,
4385
4387
  backgroundColor: theme.colors.surface,
4386
4388
  boxShadow: componentShadow
4387
4389
  };
4388
4390
  const toolbarControlStyle = {
4389
4391
  height: 42,
4390
4392
  borderRadius: 14,
4391
- border: `1px solid ${borderSoft}`,
4393
+ border: `1px solid ${softBorderColor}`,
4392
4394
  backgroundColor: theme.colors.surface,
4393
4395
  color: theme.colors.text,
4394
4396
  padding: "0 10px",
@@ -4397,7 +4399,7 @@ function TableBase({
4397
4399
  fontSize: 14,
4398
4400
  lineHeight: 1.4,
4399
4401
  transition: "border-color 160ms ease, box-shadow 160ms ease",
4400
- boxShadow: `${componentShadow}, 0 0 0 0 ${focusRing}`
4402
+ boxShadow: componentShadow
4401
4403
  };
4402
4404
  const settingsButtonStyle = {
4403
4405
  ...actionButtonBaseStyle("default", false, true),
@@ -4409,8 +4411,8 @@ function TableBase({
4409
4411
  gap: 4,
4410
4412
  padding: "10px 12px",
4411
4413
  borderRadius: 14,
4412
- border: `1px solid ${borderSoft}`,
4413
- backgroundColor: withAlpha(theme.colors.surface, 0.94),
4414
+ border: `1px solid ${softBorderColor}`,
4415
+ backgroundColor: theme.colors.surface,
4414
4416
  boxShadow: componentShadow
4415
4417
  };
4416
4418
  const handleDownloadCsv = () => {
@@ -4492,7 +4494,7 @@ function TableBase({
4492
4494
  colSpan: column.colSpan,
4493
4495
  style: {
4494
4496
  padding: "6px 10px",
4495
- borderBottom: `1px solid ${borderSoft}`,
4497
+ borderBottom: `1px solid ${softBorderColor}`,
4496
4498
  verticalAlign: "middle",
4497
4499
  color: theme.colors.text,
4498
4500
  fontSize: 14,
@@ -4502,7 +4504,7 @@ function TableBase({
4502
4504
  width: column.width,
4503
4505
  minWidth: column.minWidth
4504
4506
  },
4505
- children: hasRenderableContent(content) ? content : /* @__PURE__ */ jsx13("span", { style: { color: mutedText }, children: "-" })
4507
+ children: hasRenderableContent(content) ? content : /* @__PURE__ */ jsx13("span", { style: { color: mutedTextColor }, children: "-" })
4506
4508
  },
4507
4509
  `${getColumnKey(column, columnIndex)}-${rowIndex}`
4508
4510
  );
@@ -4520,8 +4522,8 @@ function TableBase({
4520
4522
  gap: 12,
4521
4523
  minHeight: 220,
4522
4524
  borderRadius: 20,
4523
- border: `1px dashed ${borderStrong}`,
4524
- backgroundColor: withAlpha(theme.colors.surface, 0.64),
4525
+ border: `1px dashed ${strongBorderColor}`,
4526
+ backgroundColor: theme.colors.surface,
4525
4527
  boxShadow: componentShadow,
4526
4528
  color: theme.colors.text,
4527
4529
  textAlign: "center",
@@ -4541,7 +4543,7 @@ function TableBase({
4541
4543
  className: cx(
4542
4544
  UI_KIT_ROOT_CLASSNAME,
4543
4545
  "flex w-full max-w-full min-w-0 flex-col gap-4 rounded-[24px]",
4544
- "box-border bg-[var(--ui-kit-surface-raised)] p-[18px] text-[var(--theme-text)]",
4546
+ "box-border bg-[var(--theme-surface)] p-[18px] text-[var(--theme-text)]",
4545
4547
  className
4546
4548
  ),
4547
4549
  style,
@@ -4568,8 +4570,8 @@ function TableBase({
4568
4570
  style: {
4569
4571
  flex: "1 1 260px",
4570
4572
  maxWidth: 360,
4571
- borderColor: "var(--ui-kit-border-soft)",
4572
- boxShadow: "var(--ui-kit-component-shadow)"
4573
+ borderColor: softBorderColor,
4574
+ boxShadow: componentShadow
4573
4575
  }
4574
4576
  }
4575
4577
  ) : null,
@@ -4593,7 +4595,7 @@ function TableBase({
4593
4595
  className: "flex min-w-0 flex-wrap items-center justify-end gap-2.5",
4594
4596
  style: { marginLeft: shouldRenderToolbarPrimaryGroup ? "auto" : void 0 },
4595
4597
  children: [
4596
- loading ? /* @__PURE__ */ jsx13("span", { className: "text-[13px] font-semibold text-[var(--ui-kit-muted-text)]", children: resolvedLabels.loadingMessage }) : null,
4598
+ loading ? /* @__PURE__ */ jsx13("span", { className: "text-[13px] font-semibold text-[var(--theme-textLight)]", children: resolvedLabels.loadingMessage }) : null,
4597
4599
  !loading && error && hasRows ? /* @__PURE__ */ jsxs11("div", { className: "inline-flex items-center gap-2.5", children: [
4598
4600
  /* @__PURE__ */ jsx13("span", { className: "text-[13px] font-semibold text-[var(--theme-negative)]", children: resolvedLabels.errorMessage }),
4599
4601
  onRetry ? /* @__PURE__ */ jsx13(Button, { size: "sm", variant: "ghost", onClick: onRetry, children: resolvedLabels.retryLabel }) : null
@@ -4605,7 +4607,7 @@ function TableBase({
4605
4607
  !hasRows && (!loading || error) ? renderEmptyState() : null,
4606
4608
  hasRows ? isCollapsed ? /* @__PURE__ */ jsx13("div", { role: "list", "aria-label": ariaLabel, className: "flex flex-col gap-3.5", children: items.map((item, rowIndex) => {
4607
4609
  const rowActions = renderActions(item, rowIndex);
4608
- const rowBackgroundColor = rowIndex % 2 === 0 ? theme.colors.surface : surfaceMuted;
4610
+ const rowBackgroundColor = rowIndex % 2 === 0 ? theme.colors.surface : alternateSurfaceColor;
4609
4611
  return /* @__PURE__ */ jsxs11(
4610
4612
  "article",
4611
4613
  {
@@ -4616,7 +4618,7 @@ function TableBase({
4616
4618
  gap: 14,
4617
4619
  padding: "16px 16px 6px 16px",
4618
4620
  borderRadius: 20,
4619
- border: `1px solid ${borderSoft}`,
4621
+ border: `1px solid ${softBorderColor}`,
4620
4622
  backgroundColor: rowBackgroundColor,
4621
4623
  boxShadow: componentShadow
4622
4624
  },
@@ -4649,7 +4651,7 @@ function TableBase({
4649
4651
  "span",
4650
4652
  {
4651
4653
  style: {
4652
- color: mutedText,
4654
+ color: mutedTextColor,
4653
4655
  fontSize: 11,
4654
4656
  fontWeight: 700,
4655
4657
  letterSpacing: "0.08em",
@@ -4684,7 +4686,7 @@ function TableBase({
4684
4686
  lineHeight: 1.55,
4685
4687
  textAlign: getTextAlign(align)
4686
4688
  },
4687
- children: hasRenderableContent(content) ? content : /* @__PURE__ */ jsx13("span", { style: { color: mutedText }, children: "-" })
4689
+ children: hasRenderableContent(content) ? content : /* @__PURE__ */ jsx13("span", { style: { color: mutedTextColor }, children: "-" })
4688
4690
  }
4689
4691
  )
4690
4692
  }
@@ -4703,7 +4705,7 @@ function TableBase({
4703
4705
  display: "flex",
4704
4706
  justifyContent: "flex-end",
4705
4707
  paddingTop: 4,
4706
- borderTop: `1px solid ${borderSoft}`
4708
+ borderTop: `1px solid ${softBorderColor}`
4707
4709
  },
4708
4710
  children: rowActions
4709
4711
  }
@@ -4751,8 +4753,8 @@ function TableBase({
4751
4753
  "aria-label": ariaLabel,
4752
4754
  className: "w-full max-w-full min-w-0 overflow-x-auto overflow-y-hidden rounded-[20px] border bg-[var(--theme-surface)]",
4753
4755
  style: {
4754
- borderColor: "var(--ui-kit-border-soft)",
4755
- boxShadow: "var(--ui-kit-component-shadow)"
4756
+ borderColor: softBorderColor,
4757
+ boxShadow: componentShadow
4756
4758
  },
4757
4759
  children: /* @__PURE__ */ jsxs11("table", { className: "min-w-full max-w-none border-separate border-spacing-0", style: { width: "max-content" }, children: [
4758
4760
  /* @__PURE__ */ jsx13("thead", { children: /* @__PURE__ */ jsxs11("tr", { children: [
@@ -4766,8 +4768,8 @@ function TableBase({
4766
4768
  scope: "col",
4767
4769
  style: {
4768
4770
  padding: "6px 10px",
4769
- borderBottom: `1px solid ${borderStrong}`,
4770
- color: mutedText,
4771
+ borderBottom: `1px solid ${strongBorderColor}`,
4772
+ color: mutedTextColor,
4771
4773
  fontSize: 11,
4772
4774
  fontWeight: 700,
4773
4775
  letterSpacing: "0.08em",
@@ -4788,8 +4790,8 @@ function TableBase({
4788
4790
  scope: "col",
4789
4791
  style: {
4790
4792
  padding: "6px 10px",
4791
- borderBottom: `1px solid ${borderStrong}`,
4792
- color: mutedText,
4793
+ borderBottom: `1px solid ${strongBorderColor}`,
4794
+ color: mutedTextColor,
4793
4795
  fontSize: 11,
4794
4796
  fontWeight: 700,
4795
4797
  letterSpacing: "0.08em",
@@ -4805,8 +4807,8 @@ function TableBase({
4805
4807
  ] }) }),
4806
4808
  /* @__PURE__ */ jsx13("tbody", { children: items.map((item, rowIndex) => {
4807
4809
  const rowActions = renderActions(item, rowIndex);
4808
- const rowBackgroundColor = rowIndex % 2 === 0 ? theme.colors.surface : surfaceMuted;
4809
- const stickyRowBackgroundImage = rowIndex % 2 === 0 ? void 0 : `linear-gradient(${surfaceMuted}, ${surfaceMuted})`;
4810
+ const rowBackgroundColor = rowIndex % 2 === 0 ? theme.colors.surface : alternateSurfaceColor;
4811
+ const stickyRowBackgroundImage = rowIndex % 2 === 0 ? void 0 : `linear-gradient(${alternateSurfaceColor}, ${alternateSurfaceColor})`;
4810
4812
  return /* @__PURE__ */ jsxs11(
4811
4813
  "tr",
4812
4814
  {
@@ -4820,7 +4822,7 @@ function TableBase({
4820
4822
  {
4821
4823
  style: {
4822
4824
  padding: "6px 10px",
4823
- borderBottom: `1px solid ${borderSoft}`,
4825
+ borderBottom: `1px solid ${softBorderColor}`,
4824
4826
  textAlign: "right",
4825
4827
  verticalAlign: "middle",
4826
4828
  ...shouldStickActionsColumn ? getStickyActionsCellStyle(theme.colors.surface, stickyRowBackgroundImage) : {}
@@ -4843,7 +4845,7 @@ function TableBase({
4843
4845
  className: "flex flex-wrap items-center justify-between gap-3 pt-1",
4844
4846
  children: [
4845
4847
  shouldShowPaginationControls ? /* @__PURE__ */ jsxs11("div", { className: "flex flex-wrap items-center gap-2", children: [
4846
- /* @__PURE__ */ jsx13("span", { className: "mr-1 text-[13px] text-[var(--ui-kit-muted-text)]", children: resolvedLabels.pageLabel(normalizedPage, totalPages) }),
4848
+ /* @__PURE__ */ jsx13("span", { className: "mr-1 text-[13px] text-[var(--theme-textLight)]", children: resolvedLabels.pageLabel(normalizedPage, totalPages) }),
4847
4849
  /* @__PURE__ */ jsx13(
4848
4850
  "button",
4849
4851
  {
@@ -4892,7 +4894,7 @@ function TableBase({
4892
4894
  /* @__PURE__ */ jsx13(
4893
4895
  "div",
4894
4896
  {
4895
- className: "flex items-center gap-2.5 text-[13px] text-[var(--ui-kit-muted-text)]",
4897
+ className: "flex items-center gap-2.5 text-[13px] text-[var(--theme-textLight)]",
4896
4898
  style: { marginLeft: shouldShowRowsPerPageControl ? "auto" : void 0 },
4897
4899
  children: shouldShowRowsPerPageControl ? /* @__PURE__ */ jsxs11(Fragment4, { children: [
4898
4900
  /* @__PURE__ */ jsx13("span", { children: resolvedLabels.rowsPerPageLabel }),
@@ -4903,8 +4905,8 @@ function TableBase({
4903
4905
  onChange: (event) => onInternalPageSizeChange(Number(event.currentTarget.value)),
4904
4906
  className: "h-[34px] rounded-[14px] border bg-[var(--theme-surface)] px-3 text-sm leading-[1.4] text-[var(--theme-text)] outline-none",
4905
4907
  style: {
4906
- borderColor: "var(--ui-kit-border-soft)",
4907
- boxShadow: "var(--ui-kit-component-shadow)"
4908
+ borderColor: softBorderColor,
4909
+ boxShadow: componentShadow
4908
4910
  },
4909
4911
  children: normalizedPageSizeOptions.map((option) => /* @__PURE__ */ jsx13("option", { value: option, children: option }, option))
4910
4912
  }
@@ -4928,24 +4930,24 @@ function TableBase({
4928
4930
  /* @__PURE__ */ jsx13("strong", { className: "text-sm text-[var(--theme-text)]", children: resolvedLabels.tableInfoSectionTitle }),
4929
4931
  /* @__PURE__ */ jsxs11("div", { className: "grid gap-2.5 [grid-template-columns:repeat(auto-fit,minmax(120px,1fr))]", children: [
4930
4932
  /* @__PURE__ */ jsxs11("div", { style: infoCardStyle, children: [
4931
- /* @__PURE__ */ jsx13("span", { className: "text-[10px] font-bold uppercase tracking-[0.06em] text-[var(--ui-kit-muted-text)]", children: resolvedLabels.totalPagesInfoLabel }),
4933
+ /* @__PURE__ */ jsx13("span", { className: "text-[10px] font-bold uppercase tracking-[0.06em] text-[var(--theme-textLight)]", children: resolvedLabels.totalPagesInfoLabel }),
4932
4934
  /* @__PURE__ */ jsx13("strong", { className: "text-[18px] leading-[1.1] text-[var(--theme-text)]", children: totalPages })
4933
4935
  ] }),
4934
4936
  /* @__PURE__ */ jsxs11("div", { style: infoCardStyle, children: [
4935
- /* @__PURE__ */ jsx13("span", { className: "text-[10px] font-bold uppercase tracking-[0.06em] text-[var(--ui-kit-muted-text)]", children: resolvedLabels.totalItemsInfoLabel }),
4937
+ /* @__PURE__ */ jsx13("span", { className: "text-[10px] font-bold uppercase tracking-[0.06em] text-[var(--theme-textLight)]", children: resolvedLabels.totalItemsInfoLabel }),
4936
4938
  /* @__PURE__ */ jsx13("strong", { className: "text-[18px] leading-[1.1] text-[var(--theme-text)]", children: totalItemCount })
4937
4939
  ] }),
4938
4940
  /* @__PURE__ */ jsxs11("div", { style: infoCardStyle, children: [
4939
- /* @__PURE__ */ jsx13("span", { className: "text-[10px] font-bold uppercase tracking-[0.06em] text-[var(--ui-kit-muted-text)]", children: resolvedLabels.currentPageInfoLabel }),
4941
+ /* @__PURE__ */ jsx13("span", { className: "text-[10px] font-bold uppercase tracking-[0.06em] text-[var(--theme-textLight)]", children: resolvedLabels.currentPageInfoLabel }),
4940
4942
  /* @__PURE__ */ jsx13("strong", { className: "text-[18px] leading-[1.1] text-[var(--theme-text)]", children: normalizedPage })
4941
4943
  ] }),
4942
4944
  /* @__PURE__ */ jsxs11("div", { style: infoCardStyle, children: [
4943
- /* @__PURE__ */ jsx13("span", { className: "text-[10px] font-bold uppercase tracking-[0.06em] text-[var(--ui-kit-muted-text)]", children: resolvedLabels.currentPageItemsInfoLabel }),
4945
+ /* @__PURE__ */ jsx13("span", { className: "text-[10px] font-bold uppercase tracking-[0.06em] text-[var(--theme-textLight)]", children: resolvedLabels.currentPageItemsInfoLabel }),
4944
4946
  /* @__PURE__ */ jsx13("strong", { className: "text-[18px] leading-[1.1] text-[var(--theme-text)]", children: currentPageItemCount })
4945
4947
  ] })
4946
4948
  ] })
4947
4949
  ] }),
4948
- /* @__PURE__ */ jsx13("div", { className: "py-[18px]", children: /* @__PURE__ */ jsx13(Separator, { orientation: "horizontal", color: borderSoft }) }),
4950
+ /* @__PURE__ */ jsx13("div", { className: "py-[18px]", children: /* @__PURE__ */ jsx13(Separator, { orientation: "horizontal", color: softBorderColor }) }),
4949
4951
  /* @__PURE__ */ jsxs11("section", { className: "grid gap-3", children: [
4950
4952
  /* @__PURE__ */ jsx13("strong", { className: "text-sm text-[var(--theme-text)]", children: resolvedLabels.downloadSectionTitle }),
4951
4953
  /* @__PURE__ */ jsxs11("div", { className: "flex flex-wrap gap-2.5", children: [
@@ -5245,12 +5247,13 @@ function Textarea({
5245
5247
  className: cx(
5246
5248
  "w-full min-w-0 box-border resize-y rounded-2xl border border-solid bg-[var(--theme-surface)]",
5247
5249
  "text-[var(--theme-text)] outline-none transition-[border-color,box-shadow,background-color]",
5248
- "duration-150 disabled:cursor-not-allowed",
5250
+ "duration-150 placeholder:opacity-100 disabled:cursor-not-allowed",
5251
+ "placeholder:text-[var(--theme-textLight)]",
5249
5252
  error ? "border-[var(--theme-negative)]" : "border-[var(--theme-textLight)]",
5250
5253
  TEXTAREA_SIZE_CLASSNAMES[controlSize]
5251
5254
  ),
5252
5255
  style: {
5253
- boxShadow: error ? "0 0 0 3px var(--ui-kit-negative-soft), var(--ui-kit-component-shadow)" : "var(--ui-kit-component-shadow)",
5256
+ boxShadow: error ? "0 0 0 3px var(--theme-negative), 0px 4px 5px var(--theme-shadow)" : "0px 4px 5px var(--theme-shadow)",
5254
5257
  ...style,
5255
5258
  ...disabled ? { opacity: DISABLED_FIELD_OPACITY } : {}
5256
5259
  }