@boxcustodia/library 1.4.2 → 1.5.0

package/dist/theme.css

@@ -1,248 +1,248 @@
-@plugin "tailwindcss-animate";
-@custom-variant open (&[data-state="open"]);
-@custom-variant closed (&[data-state="closed"]);
-@custom-variant invalid (&[aria-invalid="true"]);
-
-@theme {
-  --color-background: oklch(100% 0 0);
-  --color-foreground: oklch(13.63% 0.036 259.2);
-
-  --color-popover: oklch(100% 0 0);
-  --color-popover-foreground: oklch(13.63% 0.036 259.2);
-
-  --color-primary: oklch(59.5% 0.195 270.48);
-  --color-primary-foreground: oklch(100% 0 0);
-
-  --color-secondary: oklch(96.83% 0.007 247.9);
-  --color-secondary-foreground: oklch(20.77% 0.04 265.75);
-
-  --color-muted: oklch(96.83% 0.007 247.9);
-  --color-muted-foreground: oklch(55.44% 0.041 257.42);
-
-  --color-accent: oklch(96.74% 0.001 286.38);
-  --color-accent-foreground: oklch(19.06% 0.003 247.96);
-
-  --color-error: oklch(63.68% 0.208 25.33);
-  --color-error-foreground: oklch(98.42% 0.003 247.86);
-
-  --color-success: oklch(70.1% 0.146 156.33);
-  --color-success-foreground: oklch(98.42% 0.003 247.86);
-
-  --color-input: oklch(76.68% 0 0);
-  --color-checkbox: var(--color-primary);
-  --color-ring: oklch(13.63% 0.036 259.2);
-
-  --radius: 0.5rem;
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: calc(var(--radius));
-  --radius-xl: calc(var(--radius) + 4px);
-  --radius-tag: 0.375rem;
-  --radius-checkbox: 0.25rem;
-
-  --icon-size: 1rem;
-}
-@layer base {
-  body {
-    background-color: var(--color-background);
-    color: var(--color-foreground);
-  }
-  * {
-    box-sizing: border-box;
-    margin: 0;
-    padding: 0;
-  }
-  *,
-  ::after,
-  ::before,
-  ::backdrop,
-  ::file-selector-button {
-    border-color: var(--color-gray-200, currentColor);
-  }
-
-  input:disabled,
-  button:disabled,
-  textarea:disabled,
-  select:disabled,
-  [data-disabled="true"] {
-    pointer-events: none;
-    opacity: 0.5;
-  }
-  button:not(:disabled),
-  [role="button"]:not(:disabled) {
-    cursor: pointer;
-  }
-
-  .field-error {
-    border-color: var(--color-error);
-  }
-
-  .lucide {
-    width: var(--icon-size);
-    height: var(--icon-size);
-  }
-
-  @keyframes pulse {
-    0%,
-    100% {
-      opacity: 1;
-    }
-    50% {
-      opacity: 0.9;
-    }
-  }
-
-  @keyframes fadeIn {
-    from {
-      opacity: 0;
-    }
-    to {
-      opacity: 1;
-    }
-  }
-
-  /* Accordion */
-  .accordion {
-    display: grid;
-    transition: grid-template-rows 0.2s ease-out;
-  }
-
-  .accordion > :first-child {
-    overflow: hidden;
-    position: relative;
-  }
-
-  .accordion-enter {
-    grid-template-rows: 0fr;
-  }
-
-  .accordion-enter-active {
-    grid-template-rows: 1fr;
-  }
-
-  .accordion-exit {
-    grid-template-rows: 1fr;
-  }
-
-  .accordion-exit-active {
-    grid-template-rows: 0fr;
-  }
-
-  /* Btn loader */
-  .btn-loader-enter,
-  .btn-loader-exit {
-    overflow: hidden;
-  }
-
-  .btn-loader-enter {
-    width: 0;
-    opacity: 0;
-  }
-
-  .btn-loader-enter-active {
-    width: var(--icon-size);
-    opacity: 1;
-    transition:
-      width 0.3s ease,
-      opacity 0.3s ease;
-  }
-
-  .btn-loader-exit {
-    width: var(--icon-size);
-    opacity: 1;
-  }
-
-  .btn-loader-exit-active {
-    width: 0;
-    opacity: 0;
-    transition:
-      width 0.15s ease,
-      opacity 0.25s ease;
-  }
-
-  /* Fade */
-  .fade-enter {
-    opacity: 0;
-    transform: scale(0.8);
-  }
-
-  .fade-enter-active {
-    opacity: 1;
-    transform: scale(1);
-    transition:
-      opacity 0.1s ease,
-      transform 0.1s ease;
-  }
-
-  .fade-exit {
-    opacity: 1;
-    transform: scale(1);
-  }
-
-  .fade-exit-active {
-    opacity: 0;
-    transform: scale(0.8);
-    transition:
-      opacity 0.2s ease,
-      transform 0.2s ease;
-  }
-
-  .toast-enter {
-    opacity: 0;
-    transform: translateX(120%) scale(0.85) rotate(5deg);
-    filter: blur(2px);
-  }
-
-  .toast-enter-active {
-    opacity: 1;
-    transform: translateX(0) scale(1) rotate(0);
-    filter: blur(0);
-    transition:
-      transform 400ms cubic-bezier(0.34, 1.56, 0.64, 1),
-      opacity 300ms ease-out,
-      filter 300ms ease-out;
-  }
-
-  .toast-exit {
-    opacity: 1;
-    transform: translateX(0) scale(1) rotate(0);
-    filter: blur(0);
-  }
-
-  .toast-exit-active {
-    opacity: 0;
-    transform: translateX(120%) scale(0.75) rotate(-5deg);
-    filter: blur(3px);
-    transition:
-      transform 350ms cubic-bezier(0.34, 0, 0.64, 1),
-      opacity 250ms ease-in,
-      filter 250ms ease-in;
-  }
-
-  .numberInput {
-    /* Chrome, Safari, Edge, Opera */
-    &::-webkit-outer-spin-button,
-    &::-webkit-inner-spin-button {
-      -webkit-appearance: none;
-      margin: -1;
-    }
-
-    /* Firefox */
-    &[type="number"] {
-      -moz-appearance: textfield;
-    }
-  }
-
-  .space-y-6 > :not([hidden]) ~ :not([hidden]) {
-    margin-top: 1.5rem;
-  }
-  .space-y-4 > :not([hidden]) ~ :not([hidden]) {
-    margin-top: 1rem;
-  }
-  .space-y-2 > :not([hidden]) ~ :not([hidden]) {
-    margin-top: 0.5rem;
-  }
-  .space-y-1 > :not([hidden]) ~ :not([hidden]) {
-    margin-top: 0.275rem;
-  }
-}
+@plugin "tailwindcss-animate";
+@custom-variant open (&[data-state="open"]);
+@custom-variant closed (&[data-state="closed"]);
+@custom-variant invalid (&[aria-invalid="true"]);
+
+@theme {
+  --color-background: oklch(100% 0 0);
+  --color-foreground: oklch(13.63% 0.036 259.2);
+
+  --color-popover: oklch(100% 0 0);
+  --color-popover-foreground: oklch(13.63% 0.036 259.2);
+
+  --color-primary: oklch(59.5% 0.195 270.48);
+  --color-primary-foreground: oklch(100% 0 0);
+
+  --color-secondary: oklch(96.83% 0.007 247.9);
+  --color-secondary-foreground: oklch(20.77% 0.04 265.75);
+
+  --color-muted: oklch(96.83% 0.007 247.9);
+  --color-muted-foreground: oklch(55.44% 0.041 257.42);
+
+  --color-accent: oklch(96.74% 0.001 286.38);
+  --color-accent-foreground: oklch(19.06% 0.003 247.96);
+
+  --color-error: oklch(63.68% 0.208 25.33);
+  --color-error-foreground: oklch(98.42% 0.003 247.86);
+
+  --color-success: oklch(70.1% 0.146 156.33);
+  --color-success-foreground: oklch(98.42% 0.003 247.86);
+
+  --color-input: oklch(76.68% 0 0);
+  --color-checkbox: var(--color-primary);
+  --color-ring: oklch(13.63% 0.036 259.2);
+
+  --radius: 0.5rem;
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: calc(var(--radius));
+  --radius-xl: calc(var(--radius) + 4px);
+  --radius-tag: 0.375rem;
+  --radius-checkbox: 0.25rem;
+
+  --icon-size: 1rem;
+}
+@layer base {
+  body {
+    background-color: var(--color-background);
+    color: var(--color-foreground);
+  }
+  * {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+  }
+  *,
+  ::after,
+  ::before,
+  ::backdrop,
+  ::file-selector-button {
+    border-color: var(--color-gray-200, currentColor);
+  }
+
+  input:disabled,
+  button:disabled,
+  textarea:disabled,
+  select:disabled,
+  [data-disabled="true"] {
+    pointer-events: none;
+    opacity: 0.5;
+  }
+  button:not(:disabled),
+  [role="button"]:not(:disabled) {
+    cursor: pointer;
+  }
+
+  .field-error {
+    border-color: var(--color-error);
+  }
+
+  .lucide {
+    width: var(--icon-size);
+    height: var(--icon-size);
+  }
+
+  @keyframes pulse {
+    0%,
+    100% {
+      opacity: 1;
+    }
+    50% {
+      opacity: 0.9;
+    }
+  }
+
+  @keyframes fadeIn {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: 1;
+    }
+  }
+
+  /* Accordion */
+  .accordion {
+    display: grid;
+    transition: grid-template-rows 0.2s ease-out;
+  }
+
+  .accordion > :first-child {
+    overflow: hidden;
+    position: relative;
+  }
+
+  .accordion-enter {
+    grid-template-rows: 0fr;
+  }
+
+  .accordion-enter-active {
+    grid-template-rows: 1fr;
+  }
+
+  .accordion-exit {
+    grid-template-rows: 1fr;
+  }
+
+  .accordion-exit-active {
+    grid-template-rows: 0fr;
+  }
+
+  /* Btn loader */
+  .btn-loader-enter,
+  .btn-loader-exit {
+    overflow: hidden;
+  }
+
+  .btn-loader-enter {
+    width: 0;
+    opacity: 0;
+  }
+
+  .btn-loader-enter-active {
+    width: var(--icon-size);
+    opacity: 1;
+    transition:
+      width 0.3s ease,
+      opacity 0.3s ease;
+  }
+
+  .btn-loader-exit {
+    width: var(--icon-size);
+    opacity: 1;
+  }
+
+  .btn-loader-exit-active {
+    width: 0;
+    opacity: 0;
+    transition:
+      width 0.15s ease,
+      opacity 0.25s ease;
+  }
+
+  /* Fade */
+  .fade-enter {
+    opacity: 0;
+    transform: scale(0.8);
+  }
+
+  .fade-enter-active {
+    opacity: 1;
+    transform: scale(1);
+    transition:
+      opacity 0.1s ease,
+      transform 0.1s ease;
+  }
+
+  .fade-exit {
+    opacity: 1;
+    transform: scale(1);
+  }
+
+  .fade-exit-active {
+    opacity: 0;
+    transform: scale(0.8);
+    transition:
+      opacity 0.2s ease,
+      transform 0.2s ease;
+  }
+
+  .toast-enter {
+    opacity: 0;
+    transform: translateX(120%) scale(0.85) rotate(5deg);
+    filter: blur(2px);
+  }
+
+  .toast-enter-active {
+    opacity: 1;
+    transform: translateX(0) scale(1) rotate(0);
+    filter: blur(0);
+    transition:
+      transform 400ms cubic-bezier(0.34, 1.56, 0.64, 1),
+      opacity 300ms ease-out,
+      filter 300ms ease-out;
+  }
+
+  .toast-exit {
+    opacity: 1;
+    transform: translateX(0) scale(1) rotate(0);
+    filter: blur(0);
+  }
+
+  .toast-exit-active {
+    opacity: 0;
+    transform: translateX(120%) scale(0.75) rotate(-5deg);
+    filter: blur(3px);
+    transition:
+      transform 350ms cubic-bezier(0.34, 0, 0.64, 1),
+      opacity 250ms ease-in,
+      filter 250ms ease-in;
+  }
+
+  .numberInput {
+    /* Chrome, Safari, Edge, Opera */
+    &::-webkit-outer-spin-button,
+    &::-webkit-inner-spin-button {
+      -webkit-appearance: none;
+      margin: -1;
+    }
+
+    /* Firefox */
+    &[type="number"] {
+      -moz-appearance: textfield;
+    }
+  }
+
+  .space-y-6 > :not([hidden]) ~ :not([hidden]) {
+    margin-top: 1.5rem;
+  }
+  .space-y-4 > :not([hidden]) ~ :not([hidden]) {
+    margin-top: 1rem;
+  }
+  .space-y-2 > :not([hidden]) ~ :not([hidden]) {
+    margin-top: 0.5rem;
+  }
+  .space-y-1 > :not([hidden]) ~ :not([hidden]) {
+    margin-top: 0.275rem;
+  }
+}