@well-insight/ui 0.1.7 → 0.1.9

package/dist/components/CascadeSelect/styles.css

@@ -0,0 +1,108 @@
+/* —— Form: CascadeSelect —— */
+.wi-cascadeselect {
+    display: inline-block;
+    max-width: 100%;
+    position: relative;
+}
+
+.wi-cascadeselect__trigger {
+    align-items: center;
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-control);
+    box-sizing: border-box;
+    color: var(--wi-color-text);
+    cursor: pointer;
+    display: inline-flex;
+    font: inherit;
+    font-size: var(--wi-control-font-medium);
+    gap: var(--wi-space-2);
+    justify-content: space-between;
+    min-height: var(--wi-control-height-medium);
+    min-width: var(--wi-menu-min-width-lg);
+    padding: 0 var(--wi-control-padding-x-medium);
+    width: 100%;
+}
+
+.wi-cascadeselect--small .wi-cascadeselect__trigger {
+    font-size: var(--wi-control-font-small);
+    min-height: var(--wi-control-height-small);
+    padding: 0 var(--wi-control-padding-x-small);
+}
+
+.wi-cascadeselect--large .wi-cascadeselect__trigger {
+    font-size: var(--wi-control-font-large);
+    min-height: var(--wi-control-height-large);
+    padding: 0 var(--wi-control-padding-x-large);
+}
+
+.wi-cascadeselect__trigger:focus-visible {
+    box-shadow: var(--wi-focus-shadow);
+    outline: none;
+}
+
+.wi-cascadeselect--disabled .wi-cascadeselect__trigger {
+    cursor: not-allowed;
+    opacity: var(--wi-opacity-disabled);
+}
+
+.wi-cascadeselect__panel {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-md);
+    box-shadow: var(--wi-shadow-md);
+    box-sizing: border-box;
+    display: flex;
+    left: 0;
+    margin-top: var(--wi-space-1);
+    position: absolute;
+    top: 100%;
+    width: 100%;
+    z-index: var(--wi-z-popper);
+}
+
+.wi-cascadeselect__panel--teleported {
+    margin-top: 0;
+    position: fixed;
+    top: auto;
+    z-index: var(--wi-z-dropdown);
+}
+
+.wi-cascadeselect__column {
+    flex: 1 1 0;
+    list-style: none;
+    margin: 0;
+    max-height: 16rem;
+    min-width: 0;
+    overflow: auto;
+    padding: var(--wi-space-1);
+}
+
+.wi-cascadeselect__column + .wi-cascadeselect__column {
+    border-left: 1px solid var(--wi-color-border);
+}
+
+.wi-cascadeselect__option {
+    align-items: center;
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-sm);
+    color: inherit;
+    cursor: pointer;
+    display: flex;
+    font: inherit;
+    justify-content: space-between;
+    padding: var(--wi-space-2) var(--wi-space-3);
+    text-align: left;
+    width: 100%;
+}
+
+.wi-cascadeselect__option:hover:not(:disabled),
+.wi-cascadeselect__option--selected {
+    background: color-mix(in srgb, var(--wi-color-primary) 10%, transparent);
+}
+
+.wi-cascadeselect__option:disabled {
+    cursor: not-allowed;
+    opacity: var(--wi-opacity-disabled);
+}

package/dist/components/Checkbox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAA;AACtD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAChE,YAAY,EACV,aAAa,EACb,kBAAkB,EAClB,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,aAAa,GACd,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAA;AACtD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAChE,YAAY,EACV,aAAa,EACb,kBAAkB,EAClB,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,aAAa,GACd,MAAM,SAAS,CAAA"}

package/dist/components/Checkbox/styles.css

@@ -0,0 +1,18 @@
+.wi-checkbox__control {
+    border-radius: var(--wi-radius-sm);
+}
+
+.wi-checkbox__control svg {
+    fill: none;
+    height: 0.875rem;
+    stroke: white;
+    stroke-linecap: round;
+    stroke-linejoin: round;
+    stroke-width: 2;
+    width: 0.875rem;
+}
+
+.wi-checkbox__input:indeterminate + .wi-checkbox__control {
+    background: var(--wi-color-primary);
+    border-color: var(--wi-color-primary);
+}

package/dist/components/Chip/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,YAAY,CAAA;AAC9C,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,YAAY,CAAA;AAC9C,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/Chip/styles.css

@@ -0,0 +1,103 @@
+.wi-chip {
+    align-items: center;
+    background: color-mix(in srgb, var(--wi-color-text-muted) 14%, var(--wi-color-surface));
+    border-radius: var(--wi-radius-full);
+    color: var(--wi-color-text);
+    display: inline-flex;
+    font-family: var(--wi-font-sans);
+    font-size: var(--wi-font-size-md);
+    gap: var(--wi-space-2);
+    line-height: 1;
+    max-width: 100%;
+    padding: var(--wi-space-2) var(--wi-space-3);
+}
+
+.wi-chip--disabled {
+    opacity: var(--wi-opacity-disabled);
+    pointer-events: none;
+}
+
+.wi-chip__image {
+    border-radius: var(--wi-radius-full);
+    flex-shrink: 0;
+    height: 1.25rem;
+    object-fit: cover;
+    width: 1.25rem;
+}
+
+.wi-chip__icon {
+    flex-shrink: 0;
+}
+
+.wi-chip__label {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.wi-chip__remove {
+    align-items: center;
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-full);
+    color: var(--wi-color-text-muted);
+    cursor: pointer;
+    display: inline-flex;
+    flex-shrink: 0;
+    font: inherit;
+    font-size: 1rem;
+    height: 1.25rem;
+    justify-content: center;
+    line-height: 1;
+    margin-inline-end: calc(var(--wi-space-1) * -1);
+    padding: 0;
+    width: 1.25rem;
+}
+
+.wi-chip__remove:hover:not(:disabled) {
+    color: var(--wi-color-text);
+}
+
+.wi-chip__remove:focus-visible {
+    box-shadow: var(--wi-focus-shadow);
+    outline: none;
+}
+
+.wi-chip__remove:disabled {
+    cursor: not-allowed;
+}
+
+.wi-chip--small {
+    font-size: var(--wi-font-size-xs);
+    padding: 0.15rem var(--wi-space-2);
+}
+
+.wi-chip--large {
+    font-size: var(--wi-font-size-md);
+    padding: var(--wi-space-2) var(--wi-space-4);
+}
+
+.wi-chip--primary {
+    background: color-mix(in srgb, var(--wi-color-primary) 12%, transparent);
+    color: var(--wi-color-primary);
+}
+
+.wi-chip--success {
+    background: color-mix(in srgb, var(--wi-color-success) 14%, transparent);
+    color: var(--wi-color-success);
+}
+
+.wi-chip--info {
+    background: color-mix(in srgb, var(--wi-color-info) 12%, transparent);
+    color: var(--wi-color-info);
+}
+
+.wi-chip--warn {
+    background: color-mix(in srgb, var(--wi-color-warn) 14%, transparent);
+    color: var(--wi-color-warn);
+}
+
+.wi-chip--danger {
+    background: color-mix(in srgb, var(--wi-color-danger) 14%, transparent);
+    color: var(--wi-color-danger);
+}

package/dist/components/CommandMenu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CommandMenu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAC5D,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CommandMenu/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAC5D,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/CommandMenu/styles.css

@@ -0,0 +1,74 @@
+/* —— Menu: CommandMenu —— */
+.wi-commandmenu-backdrop {
+    align-items: flex-start;
+    background: var(--wi-overlay-scrim);
+    display: flex;
+    inset: 0;
+    justify-content: center;
+    padding-top: 12vh;
+    position: fixed;
+    z-index: var(--wi-z-popper);
+}
+
+.wi-commandmenu {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-lg);
+    box-shadow: var(--wi-shadow-md);
+    max-width: 32rem;
+    overflow: hidden;
+    width: min(32rem, calc(100vw - 2rem));
+}
+
+.wi-commandmenu__input {
+    background: transparent;
+    border: 0;
+    border-bottom: 1px solid var(--wi-color-border);
+    color: inherit;
+    font: inherit;
+    outline: none;
+    padding: var(--wi-space-3) var(--wi-space-4);
+    width: 100%;
+}
+
+.wi-commandmenu__list {
+    list-style: none;
+    margin: 0;
+    max-height: 18rem;
+    overflow: auto;
+    padding: var(--wi-space-2);
+}
+
+.wi-commandmenu__item {
+    align-items: center;
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-sm);
+    color: inherit;
+    cursor: pointer;
+    display: flex;
+    font: inherit;
+    gap: var(--wi-space-2);
+    padding: var(--wi-space-2) var(--wi-space-3);
+    text-align: left;
+    width: 100%;
+}
+
+.wi-commandmenu__item--active,
+.wi-commandmenu__item:hover:not(:disabled) {
+    background: color-mix(in srgb, var(--wi-color-primary) 12%, transparent);
+}
+
+.wi-commandmenu__label {
+    flex: 1;
+}
+
+.wi-commandmenu__shortcut {
+    color: var(--wi-color-text-muted);
+    font-size: var(--wi-font-size-xs);
+}
+
+.wi-commandmenu__empty {
+    color: var(--wi-color-text-muted);
+    padding: var(--wi-space-3);
+}

package/dist/components/ConfigProvider/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ConfigProvider/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAClE,YAAY,EAAE,mBAAmB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ConfigProvider/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAClE,YAAY,EAAE,mBAAmB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/ConfigProvider/styles.css

@@ -0,0 +1 @@
+/* ConfigProvider is a logic wrapper; styles come from theme tokens and descendants. */

package/dist/components/ConfirmDialog/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ConfirmDialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAChE,YAAY,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ConfirmDialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAChE,YAAY,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/ConfirmDialog/styles.css

@@ -0,0 +1,23 @@
+/* —— Overlay: ConfirmDialog —— */
+.wi-confirmdialog {
+    max-width: min(28rem, calc(100vw - 2rem));
+}
+
+.wi-confirmdialog__footer {
+    display: flex;
+    gap: var(--wi-space-2);
+    justify-content: flex-end;
+}
+
+.wi-confirmdialog__message {
+    align-items: flex-start;
+    color: var(--wi-color-text);
+    display: flex;
+    gap: var(--wi-space-3);
+    line-height: 1.5;
+}
+
+.wi-confirmdialog__copy {
+    flex: 1 1 auto;
+    min-width: 0;
+}

package/dist/components/ConfirmPopup/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ConfirmPopup/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAC9D,YAAY,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ConfirmPopup/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAC9D,YAAY,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/ConfirmPopup/styles.css

@@ -0,0 +1,37 @@
+/* —— Overlay: ConfirmPopup —— */
+.wi-confirmpopup {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-md);
+    box-shadow: var(--wi-shadow-md);
+    max-width: min(20rem, calc(100vw - 2rem));
+    padding: var(--wi-space-3);
+    position: fixed;
+    z-index: var(--wi-z-popper);
+}
+
+.wi-confirmpopup--teleported {
+    z-index: var(--wi-z-dropdown);
+}
+
+.wi-confirmpopup__message {
+    color: var(--wi-color-text);
+    line-height: 1.5;
+    margin-bottom: var(--wi-space-3);
+}
+
+.wi-confirmpopup__footer {
+    display: flex;
+    gap: var(--wi-space-2);
+    justify-content: flex-end;
+}
+
+.wi-confirmpopup__message {
+    align-items: center;
+    display: flex;
+    gap: var(--wi-space-2);
+}
+
+.wi-confirmpopup__icon {
+    flex-shrink: 0;
+}

package/dist/components/ContextMenu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ContextMenu/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,YAAY,EACV,gBAAgB,EAChB,mBAAmB,EACnB,eAAe,EACf,mBAAmB,EACnB,gBAAgB,GACjB,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ContextMenu/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,mBAAmB,CAAA;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AACjD,YAAY,EACV,gBAAgB,EAChB,mBAAmB,EACnB,eAAe,EACf,mBAAmB,EACnB,gBAAgB,GACjB,MAAM,SAAS,CAAA"}

package/dist/components/ContextMenu/styles.css

@@ -0,0 +1,50 @@
+/* —— Menu: ContextMenu —— */
+.wi-contextmenu {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-md);
+    box-shadow: var(--wi-shadow-md);
+    display: flex;
+    flex-direction: column;
+    gap: 0.125rem;
+    min-width: var(--wi-menu-min-width);
+    padding: var(--wi-space-1);
+    position: fixed;
+    z-index: var(--wi-z-popper);
+}
+
+.wi-contextmenu--teleported {
+    z-index: var(--wi-z-dropdown);
+}
+
+.wi-contextmenu__item {
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-sm);
+    color: var(--wi-color-text);
+    cursor: pointer;
+    font: inherit;
+    padding: var(--wi-space-2) var(--wi-space-3);
+    text-align: start;
+    width: 100%;
+}
+
+.wi-contextmenu__item:hover:not(:disabled) {
+    background: color-mix(in srgb, var(--wi-color-primary) 10%, var(--wi-color-surface));
+}
+
+.wi-contextmenu__item:disabled {
+    cursor: not-allowed;
+    opacity: var(--wi-opacity-disabled);
+}
+
+.wi-contextmenu__item:focus-visible {
+    box-shadow: var(--wi-focus-shadow);
+    outline: none;
+}
+
+.wi-contextmenu__separator {
+    background: var(--wi-color-border);
+    height: 1px;
+    margin: var(--wi-space-1) 0;
+}

package/dist/components/DataView/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DataView/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAA;AACtD,YAAY,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DataView/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAA;AACtD,YAAY,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/DataView/styles.css

@@ -0,0 +1,33 @@
+/* —— Data: DataView —— */
+.wi-dataview {
+    display: flex;
+    flex-direction: column;
+    gap: var(--wi-space-3);
+}
+
+.wi-dataview__list {
+    display: flex;
+    flex-direction: column;
+    gap: var(--wi-space-2);
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+
+.wi-dataview__list-item,
+.wi-dataview__grid-item {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-md);
+    padding: var(--wi-space-3);
+}
+
+.wi-dataview__grid {
+    display: grid;
+    gap: var(--wi-space-3);
+    grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
+}
+
+.wi-dataview__paginator {
+    align-self: center;
+}

package/dist/components/DatePicker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAC1D,YAAY,EACV,mBAAmB,EACnB,eAAe,EACf,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,eAAe,GAChB,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAC1D,YAAY,EACV,mBAAmB,EACnB,eAAe,EACf,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,eAAe,GAChB,MAAM,SAAS,CAAA"}

package/dist/components/DatePicker/styles.css

@@ -0,0 +1,197 @@
+/* —— Form: DatePicker —— */
+.wi-datepicker {
+    display: inline-flex;
+    flex-direction: column;
+    gap: var(--wi-space-2);
+    position: relative;
+}
+
+.wi-datepicker--fluid {
+    display: flex;
+    width: 100%;
+}
+
+.wi-datepicker__label {
+    color: var(--wi-color-text);
+    font-size: var(--wi-font-size-md);
+    font-weight: 600;
+}
+
+.wi-datepicker__control {
+    align-items: center;
+    display: flex;
+    position: relative;
+}
+
+.wi-datepicker__input {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-control);
+    color: var(--wi-color-text);
+    cursor: pointer;
+    font: inherit;
+    font-size: var(--wi-control-font-medium);
+    min-height: var(--wi-control-height-medium);
+    padding: 0 2rem 0 var(--wi-control-padding-x-medium);
+    width: 100%;
+}
+
+.wi-datepicker--small .wi-datepicker__input {
+    font-size: var(--wi-control-font-small);
+    min-height: var(--wi-control-height-small);
+    padding: 0 1.75rem 0 var(--wi-control-padding-x-small);
+}
+
+.wi-datepicker--large .wi-datepicker__input {
+    font-size: var(--wi-control-font-large);
+    min-height: var(--wi-control-height-large);
+    padding: 0 2.25rem 0 var(--wi-control-padding-x-large);
+}
+
+.wi-datepicker--invalid .wi-datepicker__input {
+    border-color: var(--wi-color-danger);
+}
+
+.wi-datepicker--disabled {
+    opacity: var(--wi-opacity-disabled);
+    pointer-events: none;
+}
+
+.wi-datepicker__clear {
+    background: transparent;
+    border: 0;
+    color: var(--wi-color-text-muted);
+    cursor: pointer;
+    font: inherit;
+    position: absolute;
+    right: 0.5rem;
+}
+
+.wi-datepicker__panel {
+    background: var(--wi-color-surface);
+    border: 1px solid var(--wi-color-border);
+    border-radius: var(--wi-radius-md);
+    box-shadow: var(--wi-shadow-md);
+    margin-top: var(--wi-space-1);
+    padding: var(--wi-space-3);
+    position: absolute;
+    top: 100%;
+    z-index: var(--wi-z-popper);
+}
+
+.wi-datepicker__panel--teleported {
+    margin-top: 0;
+    position: fixed;
+    top: auto;
+    z-index: var(--wi-z-dropdown);
+}
+
+.wi-datepicker__header {
+    align-items: center;
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: var(--wi-space-2);
+}
+
+.wi-datepicker__month {
+    font-weight: 600;
+}
+
+.wi-datepicker__nav {
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-sm);
+    color: var(--wi-color-text);
+    cursor: pointer;
+    font: inherit;
+    line-height: 1;
+    padding: var(--wi-space-1) var(--wi-space-2);
+}
+
+.wi-datepicker__nav:hover {
+    background: color-mix(in srgb, var(--wi-color-primary) 10%, var(--wi-color-surface));
+}
+
+.wi-datepicker__weekdays,
+.wi-datepicker__grid {
+    display: grid;
+    gap: 0.125rem;
+    grid-template-columns: repeat(7, 2rem);
+}
+
+.wi-datepicker__weekdays {
+    color: var(--wi-color-text-muted);
+    font-size: var(--wi-font-size-xs);
+    margin-bottom: var(--wi-space-1);
+    text-align: center;
+}
+
+.wi-datepicker__day {
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-sm);
+    color: var(--wi-color-text);
+    cursor: pointer;
+    font: inherit;
+    height: var(--wi-control-affix-size);
+    width: var(--wi-control-affix-size);
+}
+
+.wi-datepicker__day--other {
+    color: var(--wi-color-text-muted);
+    opacity: var(--wi-opacity-disabled);
+}
+
+.wi-datepicker__day--selected {
+    background: var(--wi-color-primary);
+    color: var(--wi-color-on-emphasis);
+}
+
+.wi-datepicker__day:hover:not(:disabled):not(.wi-datepicker__day--selected) {
+    background: color-mix(in srgb, var(--wi-color-primary) 12%, var(--wi-color-surface));
+}
+
+.wi-datepicker__day:disabled {
+    cursor: not-allowed;
+    opacity: 0.4;
+}
+
+.wi-datepicker__panel--with-shortcuts {
+    display: flex;
+    gap: var(--wi-space-3);
+}
+
+.wi-datepicker__shortcuts {
+    display: grid;
+    gap: var(--wi-space-1);
+    min-width: 6rem;
+}
+
+.wi-datepicker__shortcut {
+    background: transparent;
+    border: 0;
+    border-radius: var(--wi-radius-sm);
+    color: var(--wi-color-text);
+    cursor: pointer;
+    font: inherit;
+    padding: var(--wi-space-1) var(--wi-space-2);
+    text-align: left;
+}
+
+.wi-datepicker__shortcut:hover {
+    background: color-mix(in srgb, var(--wi-color-primary) 10%, var(--wi-color-surface));
+    color: var(--wi-color-primary);
+}
+
+.wi-datepicker__day--in-range {
+    background: color-mix(in srgb, var(--wi-color-primary) 16%, var(--wi-color-surface));
+    border-radius: 0;
+}
+
+.wi-datepicker__day--range-start {
+    border-radius: var(--wi-radius-sm) 0 0 var(--wi-radius-sm);
+}
+
+.wi-datepicker__day--range-end {
+    border-radius: 0 var(--wi-radius-sm) var(--wi-radius-sm) 0;
+}