@sigx/zero-daisyui 0.2.0-beta.1 → 0.2.0-beta.2

package/dist/lynx/components/field.css

@@ -30,6 +30,186 @@
     font-weight: var(--weight-medium);
 }
 
+.zx-root .zx-field__error {
+    color: #d9576d;
+}
+
+.zx-root.zx-theme-dark .zx-field__error {
+    color: #ff7d90;
+}
+
+.zx-root.zx-theme-dim .zx-field__error {
+    color: #f5b3a4;
+}
+
+.zx-root.zx-theme-nord .zx-field__error {
+    color: #a85b64;
+}
+
+.zx-root.zx-theme-sunset .zx-field__error {
+    color: #f2bbc0;
+}
+
+.zx-root .zx-field__root.zx-a-color-primary {
+    --field-accent: #3f2bcb;
+}
+
+.zx-root.zx-theme-dark .zx-field__root.zx-a-color-primary {
+    --field-accent: #6567ff;
+}
+
+.zx-root.zx-theme-dim .zx-field__root.zx-a-color-primary {
+    --field-accent: #a0e791;
+}
+
+.zx-root.zx-theme-nord .zx-field__root.zx-a-color-primary {
+    --field-accent: #5c7da6;
+}
+
+.zx-root.zx-theme-sunset .zx-field__root.zx-a-color-primary {
+    --field-accent: #fb8a62;
+}
+
+.zx-root .zx-field__root.zx-a-color-secondary {
+    --field-accent: #ad316f;
+}
+
+.zx-root.zx-theme-dark .zx-field__root.zx-a-color-secondary {
+    --field-accent: #fa7cb6;
+}
+
+.zx-root.zx-theme-dim .zx-field__root.zx-a-color-secondary {
+    --field-accent: #ed9984;
+}
+
+.zx-root.zx-theme-nord .zx-field__root.zx-a-color-secondary {
+    --field-accent: #677e98;
+}
+
+.zx-root.zx-theme-sunset .zx-field__root.zx-a-color-secondary {
+    --field-accent: #e68aac;
+}
+
+.zx-root .zx-field__root.zx-a-color-accent {
+    --field-accent: #2b786d;
+}
+
+.zx-root.zx-theme-dark .zx-field__root.zx-a-color-accent {
+    --field-accent: #93e5d9;
+}
+
+.zx-root.zx-theme-dim .zx-field__root.zx-a-color-accent {
+    --field-accent: #bfade1;
+}
+
+.zx-root.zx-theme-nord .zx-field__root.zx-a-color-accent {
+    --field-accent: #5e7d8c;
+}
+
+.zx-root.zx-theme-sunset .zx-field__root.zx-a-color-accent {
+    --field-accent: #ab9fe8;
+}
+
+.zx-root .zx-field__root.zx-a-color-neutral {
+    --field-accent: #121214;
+}
+
+.zx-root.zx-theme-dark .zx-field__root.zx-a-color-neutral {
+    --field-accent: #878e92;
+}
+
+.zx-root.zx-theme-dim .zx-field__root.zx-a-color-neutral {
+    --field-accent: #71828c;
+}
+
+.zx-root.zx-theme-nord .zx-field__root.zx-a-color-neutral {
+    --field-accent: #3a4150;
+}
+
+.zx-root.zx-theme-sunset .zx-field__root.zx-a-color-neutral {
+    --field-accent: #667a8a;
+}
+
+.zx-root .zx-field__root.zx-a-color-info {
+    --field-accent: #2685b3;
+}
+
+.zx-root.zx-theme-dark .zx-field__root.zx-a-color-info {
+    --field-accent: #70ceff;
+}
+
+.zx-root.zx-theme-dim .zx-field__root.zx-a-color-info {
+    --field-accent: #6ce2f3;
+}
+
+.zx-root.zx-theme-nord .zx-field__root.zx-a-color-info {
+    --field-accent: #89728a;
+}
+
+.zx-root.zx-theme-sunset .zx-field__root.zx-a-color-info {
+    --field-accent: #91d4e3;
+}
+
+.zx-root .zx-field__root.zx-a-color-success {
+    --field-accent: #2a7858;
+}
+
+.zx-root.zx-theme-dark .zx-field__root.zx-a-color-success {
+    --field-accent: #92e5c2;
+}
+
+.zx-root.zx-theme-dim .zx-field__root.zx-a-color-success {
+    --field-accent: #8ee0c9;
+}
+
+.zx-root.zx-theme-nord .zx-field__root.zx-a-color-success {
+    --field-accent: #6b7d6a;
+}
+
+.zx-root.zx-theme-sunset .zx-field__root.zx-a-color-success {
+    --field-accent: #a6cebe;
+}
+
+.zx-root .zx-field__root.zx-a-color-warning {
+    --field-accent: #755a2b;
+}
+
+.zx-root.zx-theme-dark .zx-field__root.zx-a-color-warning {
+    --field-accent: #f5ddac;
+}
+
+.zx-root.zx-theme-dim .zx-field__root.zx-a-color-warning {
+    --field-accent: #cecfa6;
+}
+
+.zx-root.zx-theme-nord .zx-field__root.zx-a-color-warning {
+    --field-accent: #7d7463;
+}
+
+.zx-root.zx-theme-sunset .zx-field__root.zx-a-color-warning {
+    --field-accent: #c5c1b7;
+}
+
+.zx-root .zx-field__root.zx-a-color-error {
+    --field-accent: #d9576d;
+}
+
+.zx-root.zx-theme-dark .zx-field__root.zx-a-color-error {
+    --field-accent: #ff7d90;
+}
+
+.zx-root.zx-theme-dim .zx-field__root.zx-a-color-error {
+    --field-accent: #f5b3a4;
+}
+
+.zx-root.zx-theme-nord .zx-field__root.zx-a-color-error {
+    --field-accent: #a85b64;
+}
+
+.zx-root.zx-theme-sunset .zx-field__root.zx-a-color-error {
+    --field-accent: #f2bbc0;
+}
+
 .zx-field__label.zx-a-size-xs {
     font-size: var(--text-xs);
 }

package/dist/lynx/components/file-upload.css

@@ -54,11 +54,32 @@
     padding: var(--fu-pad);
     text-align: center;
     font-size: var(--fu-font);
+    border: calc(var(--border) * 2) dashed var(--color-base-300);
     border-radius: var(--radius-box);
     background: var(--color-base-100);
     cursor: pointer;
 }
 
+.zx-root .zx-file-upload__dropzone {
+    color: #07070899;
+}
+
+.zx-root.zx-theme-dark .zx-file-upload__dropzone {
+    color: #767d8099;
+}
+
+.zx-root.zx-theme-dim .zx-file-upload__dropzone {
+    color: #57656a99;
+}
+
+.zx-root.zx-theme-nord .zx-file-upload__dropzone {
+    color: #12151b99;
+}
+
+.zx-root.zx-theme-sunset .zx-file-upload__dropzone {
+    color: #4d5b6799;
+}
+
 .zx-file-upload__dropzone.zx-f-highlighted {
     border-color: var(--fu-accent);
     color: var(--color-base-content);
@@ -106,6 +127,26 @@
     font-variant-numeric: tabular-nums;
 }
 
+.zx-root .zx-file-upload__item-size {
+    color: #07070899;
+}
+
+.zx-root.zx-theme-dark .zx-file-upload__item-size {
+    color: #767d8099;
+}
+
+.zx-root.zx-theme-dim .zx-file-upload__item-size {
+    color: #57656a99;
+}
+
+.zx-root.zx-theme-nord .zx-file-upload__item-size {
+    color: #12151b99;
+}
+
+.zx-root.zx-theme-sunset .zx-file-upload__item-size {
+    color: #4d5b6799;
+}
+
 .zx-file-upload__item-remove {
     appearance: none;
     border: none;
@@ -127,6 +168,166 @@
     outline-offset: 2px;
 }
 
+.zx-root .zx-file-upload__root.zx-a-color-primary {
+    --fu-accent: #3f2bcb;
+}
+
+.zx-root.zx-theme-dark .zx-file-upload__root.zx-a-color-primary {
+    --fu-accent: #6567ff;
+}
+
+.zx-root.zx-theme-dim .zx-file-upload__root.zx-a-color-primary {
+    --fu-accent: #a0e791;
+}
+
+.zx-root.zx-theme-nord .zx-file-upload__root.zx-a-color-primary {
+    --fu-accent: #5c7da6;
+}
+
+.zx-root.zx-theme-sunset .zx-file-upload__root.zx-a-color-primary {
+    --fu-accent: #fb8a62;
+}
+
+.zx-root .zx-file-upload__root.zx-a-color-secondary {
+    --fu-accent: #ad316f;
+}
+
+.zx-root.zx-theme-dark .zx-file-upload__root.zx-a-color-secondary {
+    --fu-accent: #fa7cb6;
+}
+
+.zx-root.zx-theme-dim .zx-file-upload__root.zx-a-color-secondary {
+    --fu-accent: #ed9984;
+}
+
+.zx-root.zx-theme-nord .zx-file-upload__root.zx-a-color-secondary {
+    --fu-accent: #677e98;
+}
+
+.zx-root.zx-theme-sunset .zx-file-upload__root.zx-a-color-secondary {
+    --fu-accent: #e68aac;
+}
+
+.zx-root .zx-file-upload__root.zx-a-color-accent {
+    --fu-accent: #2b786d;
+}
+
+.zx-root.zx-theme-dark .zx-file-upload__root.zx-a-color-accent {
+    --fu-accent: #93e5d9;
+}
+
+.zx-root.zx-theme-dim .zx-file-upload__root.zx-a-color-accent {
+    --fu-accent: #bfade1;
+}
+
+.zx-root.zx-theme-nord .zx-file-upload__root.zx-a-color-accent {
+    --fu-accent: #5e7d8c;
+}
+
+.zx-root.zx-theme-sunset .zx-file-upload__root.zx-a-color-accent {
+    --fu-accent: #ab9fe8;
+}
+
+.zx-root .zx-file-upload__root.zx-a-color-neutral {
+    --fu-accent: #121214;
+}
+
+.zx-root.zx-theme-dark .zx-file-upload__root.zx-a-color-neutral {
+    --fu-accent: #878e92;
+}
+
+.zx-root.zx-theme-dim .zx-file-upload__root.zx-a-color-neutral {
+    --fu-accent: #71828c;
+}
+
+.zx-root.zx-theme-nord .zx-file-upload__root.zx-a-color-neutral {
+    --fu-accent: #3a4150;
+}
+
+.zx-root.zx-theme-sunset .zx-file-upload__root.zx-a-color-neutral {
+    --fu-accent: #667a8a;
+}
+
+.zx-root .zx-file-upload__root.zx-a-color-info {
+    --fu-accent: #2685b3;
+}
+
+.zx-root.zx-theme-dark .zx-file-upload__root.zx-a-color-info {
+    --fu-accent: #70ceff;
+}
+
+.zx-root.zx-theme-dim .zx-file-upload__root.zx-a-color-info {
+    --fu-accent: #6ce2f3;
+}
+
+.zx-root.zx-theme-nord .zx-file-upload__root.zx-a-color-info {
+    --fu-accent: #89728a;
+}
+
+.zx-root.zx-theme-sunset .zx-file-upload__root.zx-a-color-info {
+    --fu-accent: #91d4e3;
+}
+
+.zx-root .zx-file-upload__root.zx-a-color-success {
+    --fu-accent: #2a7858;
+}
+
+.zx-root.zx-theme-dark .zx-file-upload__root.zx-a-color-success {
+    --fu-accent: #92e5c2;
+}
+
+.zx-root.zx-theme-dim .zx-file-upload__root.zx-a-color-success {
+    --fu-accent: #8ee0c9;
+}
+
+.zx-root.zx-theme-nord .zx-file-upload__root.zx-a-color-success {
+    --fu-accent: #6b7d6a;
+}
+
+.zx-root.zx-theme-sunset .zx-file-upload__root.zx-a-color-success {
+    --fu-accent: #a6cebe;
+}
+
+.zx-root .zx-file-upload__root.zx-a-color-warning {
+    --fu-accent: #755a2b;
+}
+
+.zx-root.zx-theme-dark .zx-file-upload__root.zx-a-color-warning {
+    --fu-accent: #f5ddac;
+}
+
+.zx-root.zx-theme-dim .zx-file-upload__root.zx-a-color-warning {
+    --fu-accent: #cecfa6;
+}
+
+.zx-root.zx-theme-nord .zx-file-upload__root.zx-a-color-warning {
+    --fu-accent: #7d7463;
+}
+
+.zx-root.zx-theme-sunset .zx-file-upload__root.zx-a-color-warning {
+    --fu-accent: #c5c1b7;
+}
+
+.zx-root .zx-file-upload__root.zx-a-color-error {
+    --fu-accent: #d9576d;
+}
+
+.zx-root.zx-theme-dark .zx-file-upload__root.zx-a-color-error {
+    --fu-accent: #ff7d90;
+}
+
+.zx-root.zx-theme-dim .zx-file-upload__root.zx-a-color-error {
+    --fu-accent: #f5b3a4;
+}
+
+.zx-root.zx-theme-nord .zx-file-upload__root.zx-a-color-error {
+    --fu-accent: #a85b64;
+}
+
+.zx-root.zx-theme-sunset .zx-file-upload__root.zx-a-color-error {
+    --fu-accent: #f2bbc0;
+}
+
 .zx-file-upload__root.zx-a-size-xs {
     --fu-pad: var(--space-sm);
     --fu-font: var(--text-xs);
@@ -143,5 +344,6 @@
 }
 
 .zx-file-upload__root.zx-a-size-xl {
+    --fu-pad: calc(var(--space-xl) * 1.25);
     --fu-font: var(--text-md);
 }

package/dist/lynx/components/input.css

@@ -17,10 +17,31 @@
     opacity: var(--disabled-opacity);
 }
 
+.zx-root .zx-input__label.zx-f-invalid {
+    color: #d9576d;
+}
+
+.zx-root.zx-theme-dark .zx-input__label.zx-f-invalid {
+    color: #ff7d90;
+}
+
+.zx-root.zx-theme-dim .zx-input__label.zx-f-invalid {
+    color: #f5b3a4;
+}
+
+.zx-root.zx-theme-nord .zx-input__label.zx-f-invalid {
+    color: #a85b64;
+}
+
+.zx-root.zx-theme-sunset .zx-input__label.zx-f-invalid {
+    color: #f2bbc0;
+}
+
 .zx-input__control {
     display: inline-flex;
     align-items: stretch;
     box-sizing: border-box;
+    height: calc(var(--size-field) * 12);
     background: var(--color-base-100);
     border: var(--border) solid var(--color-base-300);
     border-radius: var(--radius-field);
@@ -91,21 +112,37 @@
     --input-accent: var(--color-error);
 }
 
+.zx-input__control.zx-a-size-xs {
+    height: calc(var(--size-field) * 8);
+}
+
 .zx-input__input.zx-a-size-xs {
     font-size: var(--text-xs);
     padding: var(--space-2xs) var(--space-xs);
 }
 
+.zx-input__control.zx-a-size-sm {
+    height: calc(var(--size-field) * 10);
+}
+
 .zx-input__input.zx-a-size-sm {
     font-size: var(--text-xs);
     padding: var(--space-xs) var(--space-sm);
 }
 
+.zx-input__control.zx-a-size-lg {
+    height: calc(var(--size-field) * 14);
+}
+
 .zx-input__input.zx-a-size-lg {
     font-size: var(--text-md);
     padding: var(--space-md) var(--space-lg);
 }
 
+.zx-input__control.zx-a-size-xl {
+    height: calc(var(--size-field) * 16);
+}
+
 .zx-input__input.zx-a-size-xl {
     font-size: var(--text-lg);
     padding: var(--space-lg) var(--space-xl);

package/dist/lynx/components/kbd.css

@@ -12,6 +12,7 @@
     background: var(--kbd-fill);
     color: var(--kbd-ink);
     border: var(--border) solid var(--color-base-300);
+    border-block-end-width: calc(var(--border) * 2);
     border-radius: var(--radius-field);
     font-size: var(--text-xs);
     font-weight: var(--weight-semibold);

package/dist/lynx/components/menu.css

@@ -4,6 +4,8 @@
     align-items: center;
     justify-content: center;
     gap: 0.5em;
+    height: calc(var(--size-field) * 12);
+    padding-inline: calc(var(--size-field) * 4);
     font-size: var(--text-sm);
     font-weight: var(--weight-semibold);
     color: var(--color-base-content);
@@ -266,17 +268,25 @@
 }
 
 .zx-menu__trigger.zx-a-size-xs {
+    height: calc(var(--size-field) * 8);
+    padding-inline: calc(var(--size-field) * 2);
     font-size: var(--text-xs);
 }
 
 .zx-menu__trigger.zx-a-size-sm {
+    height: calc(var(--size-field) * 10);
+    padding-inline: calc(var(--size-field) * 3);
     font-size: var(--text-sm);
 }
 
 .zx-menu__trigger.zx-a-size-lg {
+    height: calc(var(--size-field) * 14);
+    padding-inline: calc(var(--size-field) * 5);
     font-size: var(--text-md);
 }
 
 .zx-menu__trigger.zx-a-size-xl {
+    height: calc(var(--size-field) * 16);
+    padding-inline: calc(var(--size-field) * 6);
     font-size: var(--text-lg);
 }

package/dist/lynx/components/native-select.css

@@ -13,6 +13,7 @@
     width: 100%;
     min-width: 12rem;
     box-sizing: border-box;
+    height: calc(var(--size-field) * 12);
     background: var(--color-base-100);
     border: var(--border) solid var(--color-base-300);
     border-radius: var(--radius-field);
@@ -21,6 +22,7 @@
     font: inherit;
     font-size: var(--text-sm);
     padding: var(--space-sm) var(--space-md);
+    padding-inline-end: calc(var(--space-md) + 1.25em);
     cursor: pointer;
     transition: border-color var(--duration-fast) var(--ease-standard);
 }
@@ -34,6 +36,26 @@
     cursor: not-allowed;
 }
 
+.zx-root .zx-native-select__control.zx-f-placeholder {
+    color: #07070899;
+}
+
+.zx-root.zx-theme-dark .zx-native-select__control.zx-f-placeholder {
+    color: #767d8099;
+}
+
+.zx-root.zx-theme-dim .zx-native-select__control.zx-f-placeholder {
+    color: #57656a99;
+}
+
+.zx-root.zx-theme-nord .zx-native-select__control.zx-f-placeholder {
+    color: #12151b99;
+}
+
+.zx-root.zx-theme-sunset .zx-native-select__control.zx-f-placeholder {
+    color: #4d5b6799;
+}
+
 .zx-native-select__control.zx-f-focus-visible {
     outline: 2px solid var(--native-select-accent);
     outline-offset: 2px;
@@ -80,21 +102,29 @@
 }
 
 .zx-native-select__control.zx-a-size-xs {
+    height: calc(var(--size-field) * 8);
     font-size: var(--text-xs);
     padding: var(--space-2xs) var(--space-xs);
+    padding-inline-end: calc(var(--space-xs) + 1.25em);
 }
 
 .zx-native-select__control.zx-a-size-sm {
+    height: calc(var(--size-field) * 10);
     font-size: var(--text-xs);
     padding: var(--space-xs) var(--space-sm);
+    padding-inline-end: calc(var(--space-sm) + 1.25em);
 }
 
 .zx-native-select__control.zx-a-size-lg {
+    height: calc(var(--size-field) * 14);
     font-size: var(--text-md);
     padding: var(--space-md) var(--space-lg);
+    padding-inline-end: calc(var(--space-lg) + 1.25em);
 }
 
 .zx-native-select__control.zx-a-size-xl {
+    height: calc(var(--size-field) * 16);
     font-size: var(--text-lg);
     padding: var(--space-lg) var(--space-xl);
+    padding-inline-end: calc(var(--space-xl) + 1.25em);
 }

package/dist/lynx/components/number-input.css

@@ -17,10 +17,31 @@
     opacity: var(--disabled-opacity);
 }
 
+.zx-root .zx-number-input__label.zx-f-invalid {
+    color: #d9576d;
+}
+
+.zx-root.zx-theme-dark .zx-number-input__label.zx-f-invalid {
+    color: #ff7d90;
+}
+
+.zx-root.zx-theme-dim .zx-number-input__label.zx-f-invalid {
+    color: #f5b3a4;
+}
+
+.zx-root.zx-theme-nord .zx-number-input__label.zx-f-invalid {
+    color: #a85b64;
+}
+
+.zx-root.zx-theme-sunset .zx-number-input__label.zx-f-invalid {
+    color: #f2bbc0;
+}
+
 .zx-number-input__control {
     display: inline-flex;
     align-items: stretch;
     box-sizing: border-box;
+    height: calc(var(--size-field) * 12);
     background: var(--color-base-100);
     border: var(--border) solid var(--color-base-300);
     border-radius: var(--radius-field);
@@ -135,21 +156,37 @@
     --number-input-accent: var(--color-error);
 }
 
+.zx-number-input__control.zx-a-size-xs {
+    height: calc(var(--size-field) * 8);
+}
+
 .zx-number-input__input.zx-a-size-xs {
     font-size: var(--text-xs);
     padding: var(--space-2xs) var(--space-xs);
 }
 
+.zx-number-input__control.zx-a-size-sm {
+    height: calc(var(--size-field) * 10);
+}
+
 .zx-number-input__input.zx-a-size-sm {
     font-size: var(--text-xs);
     padding: var(--space-xs) var(--space-sm);
 }
 
+.zx-number-input__control.zx-a-size-lg {
+    height: calc(var(--size-field) * 14);
+}
+
 .zx-number-input__input.zx-a-size-lg {
     font-size: var(--text-md);
     padding: var(--space-md) var(--space-lg);
 }
 
+.zx-number-input__control.zx-a-size-xl {
+    height: calc(var(--size-field) * 16);
+}
+
 .zx-number-input__input.zx-a-size-xl {
     font-size: var(--text-lg);
     padding: var(--space-lg) var(--space-xl);