defuss-shadcn 0.6.0 → 0.6.3

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.
Files changed (11) hide show
  1. package/dist/css/shadcn.cdn.css +128 -0
  2. package/dist/css/shadcn.cdn.min.css +1 -1
  3. package/dist/index.cjs +109 -49
  4. package/dist/index.cjs.map +1 -1
  5. package/dist/index.d.cts +21 -7
  6. package/dist/index.d.cts.map +1 -1
  7. package/dist/index.d.mts +21 -7
  8. package/dist/index.d.mts.map +1 -1
  9. package/dist/index.mjs +109 -49
  10. package/dist/index.mjs.map +1 -1
  11. package/package.json +4 -5
package/dist/css/shadcn.cdn.css CHANGED
@@ -57,6 +57,8 @@
57
57
  --color-ring: var(--defuss-ring);
58
58
  --color-sidebar: var(--defuss-sidebar);
59
59
  --color-sidebar-foreground: var(--defuss-sidebar-foreground);
60
+ --color-sidebar-primary: var(--defuss-sidebar-primary);
61
+ --color-sidebar-primary-foreground: var(--defuss-sidebar-primary-foreground);
60
62
  --color-sidebar-accent: var(--defuss-sidebar-accent);
61
63
  --color-sidebar-accent-foreground: var(--defuss-sidebar-accent-foreground);
62
64
  --color-sidebar-border: var(--defuss-sidebar-border);
@@ -552,6 +554,11 @@
552
554
  }
553
555
  @layer components {
554
556
  .defuss-shadcn {
557
+ .defuss-skeleton {
558
+ border-radius: var(--radius-md);
559
+ background-color: var(--defuss-skeleton-bg, var(--color-accent, var(--defuss-accent, oklch(0.97 0 0))));
560
+ animation: defuss-skeleton-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
561
+ }
555
562
  .btn, .btn-primary, .btn-secondary, .btn-outline, .btn-ghost, .btn-link, .btn-destructive, .btn-sm, .btn-sm-primary, .btn-sm-secondary, .btn-sm-outline, .btn-sm-ghost, .btn-sm-link, .btn-sm-destructive, .btn-lg, .btn-lg-primary, .btn-lg-secondary, .btn-lg-outline, .btn-lg-ghost, .btn-lg-link, .btn-lg-destructive, .btn-icon, .btn-icon-primary, .btn-icon-secondary, .btn-icon-outline, .btn-icon-ghost, .btn-icon-link, .btn-icon-destructive, .btn-sm-icon, .btn-sm-icon-primary, .btn-sm-icon-secondary, .btn-sm-icon-outline, .btn-sm-icon-ghost, .btn-sm-icon-link, .btn-sm-icon-destructive, .btn-lg-icon, .btn-lg-icon-primary, .btn-lg-icon-secondary, .btn-lg-icon-outline, .btn-lg-icon-ghost, .btn-lg-icon-link, .btn-lg-icon-destructive {
556
563
  display: inline-flex;
557
564
  flex-shrink: 0;
@@ -2987,6 +2994,67 @@
2987
2994
  color: var(--color-muted-foreground);
2988
2995
  }
2989
2996
  }
2997
+ .data-table {
2998
+ .data-table-sortable-header {
2999
+ cursor: pointer;
3000
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
3001
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
3002
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
3003
+ &:hover {
3004
+ @media (hover: hover) {
3005
+ background-color: var(--color-muted);
3006
+ @supports (color: color-mix(in lab, red, red)) {
3007
+ background-color: color-mix(in oklab, var(--color-muted) 50%, transparent);
3008
+ }
3009
+ }
3010
+ }
3011
+ }
3012
+ tr[data-row-id].data-table-row-clickable {
3013
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
3014
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
3015
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
3016
+ &:hover {
3017
+ @media (hover: hover) {
3018
+ background-color: var(--color-muted);
3019
+ @supports (color: color-mix(in lab, red, red)) {
3020
+ background-color: color-mix(in oklab, var(--color-muted) 40%, transparent);
3021
+ }
3022
+ }
3023
+ }
3024
+ }
3025
+ .data-table-empty {
3026
+ color: var(--color-muted-foreground);
3027
+ }
3028
+ }
3029
+ .tree-view {
3030
+ .tree-view-row {
3031
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
3032
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
3033
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
3034
+ &:hover {
3035
+ @media (hover: hover) {
3036
+ background-color: var(--color-accent);
3037
+ @supports (color: color-mix(in lab, red, red)) {
3038
+ background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
3039
+ }
3040
+ }
3041
+ }
3042
+ }
3043
+ .tree-view-row.is-selected {
3044
+ background-color: var(--color-accent);
3045
+ color: var(--color-accent-foreground);
3046
+ }
3047
+ .tree-view-toggle {
3048
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
3049
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
3050
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
3051
+ &:hover {
3052
+ @media (hover: hover) {
3053
+ background-color: var(--color-accent);
3054
+ }
3055
+ }
3056
+ }
3057
+ }
2990
3058
  }
2991
3059
  }
2992
3060
  @layer components {
@@ -3274,6 +3342,66 @@
3274
3342
  transform: translateY(100%);
3275
3343
  }
3276
3344
  }
3345
+ @keyframes defuss-skeleton-pulse {
3346
+ 0%, 100% {
3347
+ opacity: 1;
3348
+ }
3349
+ 50% {
3350
+ opacity: 0.5;
3351
+ }
3352
+ }
3353
+ @layer utilities {
3354
+ .defuss-shadcn {
3355
+ .text-primary {
3356
+ color: var(--color-primary);
3357
+ }
3358
+ .text-primary-foreground {
3359
+ color: var(--color-primary-foreground);
3360
+ }
3361
+ .bg-primary {
3362
+ background-color: var(--color-primary);
3363
+ }
3364
+ .bg-primary-foreground {
3365
+ background-color: var(--color-primary-foreground);
3366
+ }
3367
+ .border-primary {
3368
+ border-color: var(--color-primary);
3369
+ }
3370
+ .hover\:text-primary:hover {
3371
+ color: var(--color-primary);
3372
+ }
3373
+ .hover\:bg-primary:hover {
3374
+ background-color: var(--color-primary);
3375
+ }
3376
+ .text-sidebar-foreground {
3377
+ color: var(--color-sidebar-foreground);
3378
+ }
3379
+ .text-sidebar-primary-foreground {
3380
+ color: var(--color-sidebar-primary-foreground);
3381
+ }
3382
+ .text-sidebar-accent-foreground {
3383
+ color: var(--color-sidebar-accent-foreground);
3384
+ }
3385
+ .bg-sidebar {
3386
+ background-color: var(--color-sidebar);
3387
+ }
3388
+ .bg-sidebar-primary {
3389
+ background-color: var(--color-sidebar-primary);
3390
+ }
3391
+ .bg-sidebar-accent {
3392
+ background-color: var(--color-sidebar-accent);
3393
+ }
3394
+ .border-sidebar-border {
3395
+ border-color: var(--color-sidebar-border);
3396
+ }
3397
+ .hover\:bg-sidebar-accent:hover {
3398
+ background-color: var(--color-sidebar-accent);
3399
+ }
3400
+ .hover\:text-sidebar-accent-foreground:hover {
3401
+ color: var(--color-sidebar-accent-foreground);
3402
+ }
3403
+ }
3404
+ }
3277
3405
  @layer components {
3278
3406
  .defuss-shadcn {
3279
3407
  [data-tooltip] {