@quidgest/ui 0.17.8 → 0.18.0

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 (109) hide show
  1. package/dist/json/api.json +490 -20
  2. package/dist/manifest/components.json +3 -0
  3. package/dist/ui.css +3426 -3165
  4. package/dist/ui.esm.js +582 -614
  5. package/dist/ui.js +526 -560
  6. package/dist/ui.min.css +1 -1
  7. package/dist/ui.min.js +526 -560
  8. package/dist/ui.scss +389 -135
  9. package/esm/components/QAccordion/QAccordionItem.vue.js +1 -0
  10. package/esm/components/QCarousel/QCarousel.vue.js +1 -1
  11. package/esm/components/QCheckbox/QCheckbox.d.ts.map +1 -1
  12. package/esm/components/QCheckbox/QCheckbox.vue.js +2 -0
  13. package/esm/components/QCollapsible/QCollapsible.d.ts +2 -1
  14. package/esm/components/QCollapsible/QCollapsible.d.ts.map +1 -1
  15. package/esm/components/QCollapsible/QCollapsible.vue.js +50 -47
  16. package/esm/components/QCollapsible/constants.d.ts +6 -0
  17. package/esm/components/QCollapsible/constants.d.ts.map +1 -1
  18. package/esm/components/QCollapsible/constants.js +3 -2
  19. package/esm/components/QCollapsible/index.d.ts +6 -0
  20. package/esm/components/QCollapsible/index.d.ts.map +1 -1
  21. package/esm/components/QCollapsible/types.d.ts +11 -1
  22. package/esm/components/QCollapsible/types.d.ts.map +1 -1
  23. package/esm/components/QDateTimePicker/QDateTimePicker.d.ts.map +1 -1
  24. package/esm/components/QDateTimePicker/QDateTimePicker.vue.js +505 -597
  25. package/esm/components/QDropdownMenu/QDropdownMenuContent.d.ts +32 -16
  26. package/esm/components/QDropdownMenu/QDropdownMenuContent.d.ts.map +1 -1
  27. package/esm/components/QDropdownMenu/QDropdownMenuContent.vue.js +179 -86
  28. package/esm/components/QDropdownMenu/types.d.ts +6 -0
  29. package/esm/components/QDropdownMenu/types.d.ts.map +1 -1
  30. package/esm/components/QField/types.d.ts +3 -0
  31. package/esm/components/QField/types.d.ts.map +1 -1
  32. package/esm/components/QLabel/QLabel.d.ts.map +1 -1
  33. package/esm/components/QLabel/QLabel.vue.js +19 -17
  34. package/esm/components/QLabel/types.d.ts +3 -0
  35. package/esm/components/QLabel/types.d.ts.map +1 -1
  36. package/esm/components/QObfuscation/QObfuscation.d.ts +74 -0
  37. package/esm/components/QObfuscation/QObfuscation.d.ts.map +1 -0
  38. package/esm/components/QObfuscation/QObfuscation.vue.js +183 -0
  39. package/esm/components/QObfuscation/QObfuscation2.vue.js +5 -0
  40. package/esm/components/QObfuscation/constants.d.ts +17 -0
  41. package/esm/components/QObfuscation/constants.d.ts.map +1 -0
  42. package/esm/components/QObfuscation/constants.js +12 -0
  43. package/esm/components/QObfuscation/index.d.ts +162 -0
  44. package/esm/components/QObfuscation/index.d.ts.map +1 -0
  45. package/esm/components/QObfuscation/index.js +6 -0
  46. package/esm/components/QObfuscation/types.d.ts +44 -0
  47. package/esm/components/QObfuscation/types.d.ts.map +1 -0
  48. package/esm/components/QTabs/QTab.d.ts +172 -0
  49. package/esm/components/QTabs/QTab.d.ts.map +1 -0
  50. package/esm/components/QTabs/QTab.vue.js +122 -0
  51. package/esm/components/QTabs/QTab2.vue.js +5 -0
  52. package/esm/components/QTabs/QTabs.d.ts +35 -0
  53. package/esm/components/QTabs/QTabs.d.ts.map +1 -0
  54. package/esm/components/QTabs/QTabs.vue.js +83 -0
  55. package/esm/components/QTabs/QTabs2.vue.js +5 -0
  56. package/esm/components/QTabs/constants.d.ts +5 -0
  57. package/esm/components/QTabs/constants.d.ts.map +1 -0
  58. package/esm/components/QTabs/context.d.ts +78 -0
  59. package/esm/components/QTabs/context.d.ts.map +1 -0
  60. package/esm/components/QTabs/context.js +4 -0
  61. package/esm/components/QTabs/index.d.ts +164 -0
  62. package/esm/components/QTabs/index.d.ts.map +1 -0
  63. package/esm/components/QTabs/index.js +7 -0
  64. package/esm/components/QTabs/types.d.ts +106 -0
  65. package/esm/components/QTabs/types.d.ts.map +1 -0
  66. package/esm/components/__internal__/QRequiredIndicator/QRequiredIndicator.d.ts +7 -0
  67. package/esm/components/__internal__/QRequiredIndicator/QRequiredIndicator.d.ts.map +1 -0
  68. package/esm/components/__internal__/QRequiredIndicator/QRequiredIndicator.vue.js +24 -0
  69. package/esm/components/__internal__/QRequiredIndicator/QRequiredIndicator2.vue.js +5 -0
  70. package/esm/components/__internal__/QRequiredIndicator/constants.d.ts +7 -0
  71. package/esm/components/__internal__/QRequiredIndicator/constants.d.ts.map +1 -0
  72. package/esm/components/__internal__/QRequiredIndicator/constants.js +4 -0
  73. package/esm/components/__internal__/QRequiredIndicator/index.d.ts +6 -0
  74. package/esm/components/__internal__/QRequiredIndicator/index.d.ts.map +1 -0
  75. package/esm/components/__internal__/QRequiredIndicator/index.js +6 -0
  76. package/esm/components/__internal__/QRequiredIndicator/types.d.ts +18 -0
  77. package/esm/components/__internal__/QRequiredIndicator/types.d.ts.map +1 -0
  78. package/esm/components/__internal__/QSafeTriangle/QSafeTriangle.d.ts +10 -0
  79. package/esm/components/__internal__/QSafeTriangle/QSafeTriangle.d.ts.map +1 -0
  80. package/esm/components/__internal__/QSafeTriangle/QSafeTriangle.vue.js +31 -0
  81. package/esm/components/__internal__/QSafeTriangle/QSafeTriangle2.vue.js +5 -0
  82. package/esm/components/__internal__/QSafeTriangle/index.d.ts +10 -0
  83. package/esm/components/__internal__/QSafeTriangle/index.d.ts.map +1 -0
  84. package/esm/components/__internal__/QSafeTriangle/index.js +6 -0
  85. package/esm/components/__internal__/QSafeTriangle/types.d.ts +33 -0
  86. package/esm/components/__internal__/QSafeTriangle/types.d.ts.map +1 -0
  87. package/esm/components/index.d.ts +2 -0
  88. package/esm/components/index.d.ts.map +1 -1
  89. package/esm/components/index.js +37 -32
  90. package/esm/composables/useSafeTriangle/index.d.ts +31 -0
  91. package/esm/composables/useSafeTriangle/index.d.ts.map +1 -0
  92. package/esm/composables/useSafeTriangle/index.js +87 -0
  93. package/esm/index.d.ts +3 -0
  94. package/esm/utils/date.d.ts +36 -1
  95. package/esm/utils/date.d.ts.map +1 -1
  96. package/esm/utils/date.js +90 -1
  97. package/esm/utils/index.d.ts +1 -0
  98. package/esm/utils/index.d.ts.map +1 -1
  99. package/esm/utils/index.js +30 -24
  100. package/esm/utils/mask.d.ts +17 -0
  101. package/esm/utils/mask.d.ts.map +1 -0
  102. package/esm/utils/mask.js +154 -0
  103. package/esm/utils/safeTriangle.d.ts +68 -0
  104. package/esm/utils/safeTriangle.d.ts.map +1 -0
  105. package/esm/utils/safeTriangle.js +83 -0
  106. package/package.json +6 -6
  107. package/esm/composables/useInputMask/index.d.ts +0 -50
  108. package/esm/composables/useInputMask/index.d.ts.map +0 -1
  109. package/esm/composables/useInputMask/index.js +0 -408
package/dist/ui.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * Quidgest UI v0.17.8
2
+ * Quidgest UI v0.18.0
3
3
  * (c) 2026 Quidgest - Consultores de Gestão, S.A.
4
4
  * Released under the MIT License.
5
5
  */
@@ -237,6 +237,7 @@ $shadow-md: (
237
237
  0 4px 6px -1px rgb(0 0 0 / 10%),
238
238
  0 2px 4px -2px rgb(0 0 0 / 10%)
239
239
  );
240
+ $overlay-z-index: 1070 !default;
240
241
  $breakpoint-sm: 576px;
241
242
  $breakpoint-md: 768px;
242
243
  $breakpoint-lg: 992px;
@@ -400,6 +401,20 @@ $transition-duration: 0.2s !default;
400
401
  --#{$prefix}-on-hover-color-rgb: var(--q-theme-on-#{$color}-rgb);
401
402
  }
402
403
  }
404
+ @mixin sr-only {
405
+ position: absolute;
406
+ width: 1px;
407
+ height: 1px;
408
+ padding: 0;
409
+ margin: -1px;
410
+ overflow: hidden;
411
+ clip-path: inset(50%);
412
+ white-space: nowrap;
413
+ border: 0;
414
+ }
415
+ .q-sr-only {
416
+ @include sr-only;
417
+ }
403
418
  .q-chevron {
404
419
  transition: all 0.2s;
405
420
  &--expanded {
@@ -420,6 +435,24 @@ $transition-duration: 0.2s !default;
420
435
  opacity: 1;
421
436
  }
422
437
  }
438
+ .q-required-indicator {
439
+ display: contents;
440
+ &__mark {
441
+ margin-inline-start: 0.25em;
442
+ font-weight: 700;
443
+ color: var(--q-theme-danger);
444
+ }
445
+ }
446
+ .q-safe-triangle {
447
+ position: fixed;
448
+ z-index: $overlay-z-index + 1;
449
+ overflow: visible;
450
+ pointer-events: none;
451
+ &__path {
452
+ pointer-events: auto;
453
+ fill: transparent;
454
+ }
455
+ }
423
456
  .q-accordion {
424
457
  display: flex;
425
458
  flex-direction: column;
@@ -1201,17 +1234,6 @@ $q-carousel-height-md: 300px;
1201
1234
  width: 100%;
1202
1235
  height: 100%;
1203
1236
  }
1204
- .q-carousel__sr-only {
1205
- position: absolute;
1206
- width: 1px;
1207
- height: 1px;
1208
- padding: 0;
1209
- margin: -1px;
1210
- overflow: hidden;
1211
- clip-path: inset(50%);
1212
- white-space: nowrap;
1213
- border: 0;
1214
- }
1215
1237
  @media (max-width: $breakpoint-md) {
1216
1238
  .q-carousel {
1217
1239
  --q-carousel-height: #{$q-carousel-height-md};
@@ -1426,12 +1448,13 @@ $q-carousel-height-md: 300px;
1426
1448
  justify-content: start;
1427
1449
  align-items: flex-start;
1428
1450
  flex-direction: column;
1429
- padding: $header-padding;
1451
+ padding: 0;
1430
1452
  }
1431
1453
  &__btn {
1432
1454
  width: 100%;
1433
1455
  margin: 0;
1434
- padding: 0;
1456
+
1457
+ padding: $header-padding;
1435
1458
  .q-button__content {
1436
1459
  gap: 0;
1437
1460
  padding: $btn-padding;
@@ -1500,10 +1523,6 @@ $q-carousel-height-md: 300px;
1500
1523
  }
1501
1524
  }
1502
1525
 
1503
- &--required {
1504
- font-weight: 700;
1505
- color: var(--q-theme-danger);
1506
- }
1507
1526
  &--icon-right {
1508
1527
  &:not(.q-collapsible--borderless) .q-collapsible__title .q-icon {
1509
1528
  margin: 0 0 0 auto;
@@ -1514,7 +1533,7 @@ $q-carousel-height-md: 300px;
1514
1533
  }
1515
1534
 
1516
1535
  @mixin header-spacing($spacing, $increment) {
1517
- &--#{$spacing} .q-collapsible__header {
1536
+ &--#{$spacing} .q-collapsible__btn {
1518
1537
  padding: calc(#{$header-padding} + #{$increment});
1519
1538
  }
1520
1539
  }
@@ -2197,6 +2216,114 @@ $q-carousel-height-md: 300px;
2197
2216
  @media (min-width: $breakpoint-xxl) {
2198
2217
  @include generate-cols('-xxl');
2199
2218
  }
2219
+ 
2220
+ .q-spacer {
2221
+ flex: 1 1 0;
2222
+ }
2223
+ $q-spacers: (
2224
+ 0: 0,
2225
+ 1: $space-base * 0.25,
2226
+ 2: $space-base * 0.5,
2227
+ 3: $space-base,
2228
+ 4: $space-base * 1.5,
2229
+ 5: $space-base * 3
2230
+ ) !default;
2231
+ $q-breakpoints: (
2232
+ sm: $breakpoint-sm,
2233
+ md: $breakpoint-md,
2234
+ lg: $breakpoint-lg,
2235
+ xl: $breakpoint-xl,
2236
+ xxl: $breakpoint-xxl
2237
+ ) !default;
2238
+ $q-spacing-sides: (
2239
+ null: '',
2240
+
2241
+ t: 't',
2242
+
2243
+ b: 'b',
2244
+
2245
+ l: 'l',
2246
+
2247
+ r: 'r',
2248
+
2249
+ x: 'x',
2250
+
2251
+ y: 'y'
2252
+ ) !default;
2253
+ @mixin q-media-up($breakpoint) {
2254
+ $value: map.get($q-breakpoints, $breakpoint);
2255
+ @if $value {
2256
+ @media (min-width: $value) {
2257
+ @content;
2258
+ }
2259
+ } @else {
2260
+ @warn "Breakpoint `#{$breakpoint}` not found in $q-breakpoints.";
2261
+ }
2262
+ }
2263
+ @mixin q-emit-spacing($property, $side, $value) {
2264
+ @if not $side {
2265
+ #{$property}: $value;
2266
+ } @else if $side == t {
2267
+ #{$property}-top: $value;
2268
+ } @else if $side == b {
2269
+ #{$property}-bottom: $value;
2270
+ } @else if $side == l {
2271
+ #{$property}-left: $value;
2272
+ } @else if $side == r {
2273
+ #{$property}-right: $value;
2274
+ } @else if $side == x {
2275
+ #{$property}-left: $value;
2276
+ #{$property}-right: $value;
2277
+ } @else if $side == y {
2278
+ #{$property}-top: $value;
2279
+ #{$property}-bottom: $value;
2280
+ } @else {
2281
+ @warn "Unknown side `#{$side}` used for spacing generation.";
2282
+ }
2283
+ }
2284
+ @mixin q-generate-responsive-spacing($property, $short) {
2285
+
2286
+ @each $size, $length in $q-spacers {
2287
+ @each $sideKey, $sideSuffix in $q-spacing-sides {
2288
+ .q-#{$short}#{$sideSuffix}-#{$size} {
2289
+ @include q-emit-spacing($property, $sideKey, $length);
2290
+ }
2291
+ }
2292
+ }
2293
+
2294
+ @each $breakpoint, $bpValue in $q-breakpoints {
2295
+ @include q-media-up($breakpoint) {
2296
+ @each $size, $length in $q-spacers {
2297
+ @each $sideKey, $sideSuffix in $q-spacing-sides {
2298
+ .q-#{$short}#{$sideSuffix}-#{$breakpoint}-#{$size} {
2299
+ @include q-emit-spacing($property, $sideKey, $length);
2300
+ }
2301
+ }
2302
+ }
2303
+ }
2304
+ }
2305
+ }
2306
+ @mixin q-generate-margin-auto() {
2307
+
2308
+ @each $sideKey, $sideSuffix in $q-spacing-sides {
2309
+ .q-m#{$sideSuffix}-auto {
2310
+ @include q-emit-spacing(margin, $sideKey, auto);
2311
+ }
2312
+ }
2313
+
2314
+ @each $breakpoint, $bpValue in $q-breakpoints {
2315
+ @include q-media-up($breakpoint) {
2316
+ @each $sideKey, $sideSuffix in $q-spacing-sides {
2317
+ .q-m#{$sideSuffix}-#{$breakpoint}-auto {
2318
+ @include q-emit-spacing(margin, $sideKey, auto);
2319
+ }
2320
+ }
2321
+ }
2322
+ }
2323
+ }
2324
+ @include q-generate-responsive-spacing(margin, m);
2325
+ @include q-generate-responsive-spacing(padding, p);
2326
+ @include q-generate-margin-auto;
2200
2327
  .q-group-box {
2201
2328
  $this: &;
2202
2329
  display: inline-block;
@@ -2397,13 +2524,6 @@ $input-group-addon-background: rgb(var(--q-theme-neutral-light-rgb) / 25%);
2397
2524
  .q-icon {
2398
2525
  color: currentcolor;
2399
2526
  }
2400
- &--required {
2401
- &::after {
2402
- content: ' *';
2403
- font-weight: 700;
2404
- color: var(--q-theme-danger);
2405
- }
2406
- }
2407
2527
  &--topright {
2408
2528
  align-self: flex-end;
2409
2529
  }
@@ -2569,10 +2689,65 @@ $q-line-loader-color: var(--q-line-loader-color);
2569
2689
  background-color: var(--q-theme-primary);
2570
2690
  }
2571
2691
  }
2692
+ .q-obfuscation {
2693
+ &__value {
2694
+ display: flex;
2695
+ align-items: center;
2696
+ gap: $space-base;
2697
+ font-size: inherit;
2698
+ }
2699
+ &__mask {
2700
+ display: inline-flex;
2701
+ align-items: center;
2702
+ gap: $space-base;
2703
+ width: 100%;
2704
+ color: var(--q-theme-neutral);
2705
+ user-select: none;
2706
+ .q-icon {
2707
+ color: inherit;
2708
+ }
2709
+ }
2710
+ &__action {
2711
+ justify-content: flex-start;
2712
+ margin: 0;
2713
+ padding: 0;
2714
+ border-width: 0;
2715
+ width: 100%;
2716
+ min-height: 1.5em;
2717
+ line-height: inherit;
2718
+ color: var(--q-theme-primary);
2719
+ &:hover,
2720
+ &:focus-visible {
2721
+ outline-offset: 0;
2722
+ }
2723
+ .q-button__content {
2724
+ justify-content: flex-start;
2725
+ }
2726
+ &.q-button--labeled {
2727
+ padding: 0;
2728
+ }
2729
+ }
2730
+ &__content {
2731
+ display: flex;
2732
+ align-items: flex-start;
2733
+ gap: $space-base;
2734
+ min-width: 0;
2735
+ }
2736
+ &__label-action {
2737
+ color: var(--q-theme-primary);
2738
+ min-width: auto;
2739
+ min-height: auto;
2740
+ &:focus-visible {
2741
+ outline-offset: 2px;
2742
+ }
2743
+ }
2744
+ &__icon {
2745
+ flex-shrink: 0;
2746
+ }
2747
+ }
2572
2748
  $overlay-border-width: 1px;
2573
2749
  $overlay-arrow-width: 11.31px;
2574
2750
  $overlay-arrow-height: 11.31px;
2575
- $overlay-z-index: 1070;
2576
2751
  $arrow-tip-radius: 0.1rem;
2577
2752
  .q-overlay {
2578
2753
  $this: &;
@@ -3516,6 +3691,193 @@ $spinner-color: var(--q-theme-primary);
3516
3691
  transition: none;
3517
3692
  }
3518
3693
  }
3694
+ .q-tabs {
3695
+ display: flex;
3696
+ gap: 0;
3697
+ &--horizontal {
3698
+ flex-direction: column;
3699
+ .q-tabs__list {
3700
+ flex-direction: row;
3701
+ width: 100%;
3702
+ border-bottom: 1px solid $border;
3703
+ }
3704
+ .q-tab {
3705
+ margin-bottom: -1px;
3706
+ }
3707
+ .q-tabs__panels {
3708
+ border: 1px solid $border;
3709
+ border-top: 0;
3710
+ border-start-start-radius: 0;
3711
+ border-start-end-radius: 0;
3712
+ border-end-start-radius: $border-radius;
3713
+ border-end-end-radius: $border-radius;
3714
+ padding-inline: calc($space-base * 2);
3715
+ }
3716
+ }
3717
+ &--vertical {
3718
+ flex-direction: row;
3719
+ align-items: stretch;
3720
+ .q-tabs__list {
3721
+ flex: 0 0 auto;
3722
+ flex-direction: column;
3723
+ width: max-content;
3724
+ max-width: 100%;
3725
+ border-inline-end: 1px solid $border;
3726
+ }
3727
+ .q-tab {
3728
+ justify-content: flex-start;
3729
+ margin-inline-end: -1px;
3730
+ }
3731
+ .q-tabs__panels {
3732
+ flex: 1;
3733
+ min-width: 0;
3734
+ border: 1px solid $border;
3735
+ border-inline-start: 0;
3736
+ border-start-start-radius: 0;
3737
+ border-end-start-radius: 0;
3738
+ border-start-end-radius: $border-radius;
3739
+ border-end-end-radius: $border-radius;
3740
+ padding-inline: calc($space-base * 2);
3741
+ }
3742
+ }
3743
+
3744
+ &--line {
3745
+ &.q-tabs--horizontal .q-tab {
3746
+ border-bottom: 4px solid transparent;
3747
+ border-end-start-radius: 0;
3748
+ border-end-end-radius: 0;
3749
+ &--active {
3750
+ border-bottom-color: $primary;
3751
+ }
3752
+ @media (hover: hover) {
3753
+ &:hover:not(:disabled, .q-tab--active) {
3754
+ border-bottom-color: currentcolor;
3755
+ }
3756
+ }
3757
+ }
3758
+ &.q-tabs--vertical .q-tab {
3759
+ border-inline-end: 4px solid transparent;
3760
+ border-start-end-radius: 0;
3761
+ border-end-end-radius: 0;
3762
+ &--active {
3763
+ border-inline-end-color: $primary;
3764
+ }
3765
+ @media (hover: hover) {
3766
+ &:hover:not(:disabled, .q-tab--active) {
3767
+ border-inline-end-color: currentcolor;
3768
+ }
3769
+ }
3770
+ }
3771
+ }
3772
+
3773
+ &--card {
3774
+ .q-tabs__list {
3775
+ gap: 0;
3776
+ }
3777
+ .q-tab {
3778
+ border: 1px solid $border;
3779
+ background-color: rgb(var(--q-theme-neutral-light-rgb) / 25%);
3780
+ &--active {
3781
+ background-color: $container;
3782
+ z-index: 1;
3783
+ }
3784
+ @media (hover: hover) {
3785
+ &:hover:not(:disabled) {
3786
+ border-color: $border;
3787
+ }
3788
+ }
3789
+ }
3790
+ &.q-tabs--horizontal .q-tab {
3791
+ border-start-start-radius: $border-radius;
3792
+ border-start-end-radius: $border-radius;
3793
+ border-end-start-radius: 0;
3794
+ border-end-end-radius: 0;
3795
+ &--active {
3796
+ border-bottom-color: $container;
3797
+ color: $primary;
3798
+ }
3799
+ }
3800
+ &.q-tabs--horizontal .q-tab--active:hover:not(:disabled) {
3801
+ @media (hover: hover) {
3802
+ border-bottom-color: $container;
3803
+ }
3804
+ }
3805
+ &.q-tabs--vertical .q-tab {
3806
+ border-start-start-radius: $border-radius;
3807
+ border-end-start-radius: $border-radius;
3808
+ border-start-end-radius: 0;
3809
+ border-end-end-radius: 0;
3810
+ &--active {
3811
+ border-inline-end-color: $container;
3812
+ }
3813
+ }
3814
+ &.q-tabs--vertical .q-tab--active:hover:not(:disabled) {
3815
+ @media (hover: hover) {
3816
+ border-inline-end-color: $container;
3817
+ }
3818
+ }
3819
+ }
3820
+ &--align-start .q-tabs__list {
3821
+ justify-content: flex-start;
3822
+ }
3823
+ &--align-end .q-tabs__list {
3824
+ justify-content: flex-end;
3825
+ }
3826
+ &--align-center .q-tabs__list {
3827
+ justify-content: center;
3828
+ }
3829
+ &--align-justify .q-tabs__list {
3830
+ justify-content: space-between;
3831
+ .q-tab {
3832
+ flex: 1;
3833
+ }
3834
+ }
3835
+ &__list {
3836
+ display: flex;
3837
+ gap: $space-base;
3838
+ }
3839
+ &__panels {
3840
+ padding-block: calc($space-base * 2);
3841
+ }
3842
+ &__panel {
3843
+ &:focus {
3844
+ outline: $outline;
3845
+ &:not(:focus-visible) {
3846
+ outline: 0;
3847
+ }
3848
+ }
3849
+ }
3850
+ }
3851
+ .q-tab {
3852
+ background: transparent;
3853
+ border: 0;
3854
+ padding: 0.5rem 0.75rem;
3855
+ &.q-button {
3856
+ color: $on-background;
3857
+ }
3858
+ &--active.q-button {
3859
+ color: $primary;
3860
+ cursor: default;
3861
+ &:hover:not(:disabled) {
3862
+ color: $primary;
3863
+ cursor: default;
3864
+ }
3865
+ }
3866
+ &__title {
3867
+ display: inline-flex;
3868
+ align-items: center;
3869
+ gap: calc($space-base * 0.5);
3870
+ }
3871
+ &__title-text {
3872
+ font-weight: 600;
3873
+ }
3874
+ &--disabled {
3875
+ cursor: not-allowed;
3876
+ &:hover {
3877
+ cursor: not-allowed;
3878
+ }
3879
+ }
3880
+ }
3519
3881
  .q-text-area {
3520
3882
 
3521
3883
  display: flex;
@@ -3780,111 +4142,3 @@ $q-toast-slide-distance: clamp(1rem, 3vw, 1.5rem) !default;
3780
4142
  max-width: 200px;
3781
4143
  }
3782
4144
  }
3783
- 
3784
- .q-spacer {
3785
- flex: 1 1 0;
3786
- }
3787
- $q-spacers: (
3788
- 0: 0,
3789
- 1: $space-base * 0.25,
3790
- 2: $space-base * 0.5,
3791
- 3: $space-base,
3792
- 4: $space-base * 1.5,
3793
- 5: $space-base * 3
3794
- ) !default;
3795
- $q-breakpoints: (
3796
- sm: $breakpoint-sm,
3797
- md: $breakpoint-md,
3798
- lg: $breakpoint-lg,
3799
- xl: $breakpoint-xl,
3800
- xxl: $breakpoint-xxl
3801
- ) !default;
3802
- $q-spacing-sides: (
3803
- null: '',
3804
-
3805
- t: 't',
3806
-
3807
- b: 'b',
3808
-
3809
- l: 'l',
3810
-
3811
- r: 'r',
3812
-
3813
- x: 'x',
3814
-
3815
- y: 'y'
3816
- ) !default;
3817
- @mixin q-media-up($breakpoint) {
3818
- $value: map.get($q-breakpoints, $breakpoint);
3819
- @if $value {
3820
- @media (min-width: $value) {
3821
- @content;
3822
- }
3823
- } @else {
3824
- @warn "Breakpoint `#{$breakpoint}` not found in $q-breakpoints.";
3825
- }
3826
- }
3827
- @mixin q-emit-spacing($property, $side, $value) {
3828
- @if not $side {
3829
- #{$property}: $value;
3830
- } @else if $side == t {
3831
- #{$property}-top: $value;
3832
- } @else if $side == b {
3833
- #{$property}-bottom: $value;
3834
- } @else if $side == l {
3835
- #{$property}-left: $value;
3836
- } @else if $side == r {
3837
- #{$property}-right: $value;
3838
- } @else if $side == x {
3839
- #{$property}-left: $value;
3840
- #{$property}-right: $value;
3841
- } @else if $side == y {
3842
- #{$property}-top: $value;
3843
- #{$property}-bottom: $value;
3844
- } @else {
3845
- @warn "Unknown side `#{$side}` used for spacing generation.";
3846
- }
3847
- }
3848
- @mixin q-generate-responsive-spacing($property, $short) {
3849
-
3850
- @each $size, $length in $q-spacers {
3851
- @each $sideKey, $sideSuffix in $q-spacing-sides {
3852
- .q-#{$short}#{$sideSuffix}-#{$size} {
3853
- @include q-emit-spacing($property, $sideKey, $length);
3854
- }
3855
- }
3856
- }
3857
-
3858
- @each $breakpoint, $bpValue in $q-breakpoints {
3859
- @include q-media-up($breakpoint) {
3860
- @each $size, $length in $q-spacers {
3861
- @each $sideKey, $sideSuffix in $q-spacing-sides {
3862
- .q-#{$short}#{$sideSuffix}-#{$breakpoint}-#{$size} {
3863
- @include q-emit-spacing($property, $sideKey, $length);
3864
- }
3865
- }
3866
- }
3867
- }
3868
- }
3869
- }
3870
- @mixin q-generate-margin-auto() {
3871
-
3872
- @each $sideKey, $sideSuffix in $q-spacing-sides {
3873
- .q-m#{$sideSuffix}-auto {
3874
- @include q-emit-spacing(margin, $sideKey, auto);
3875
- }
3876
- }
3877
-
3878
- @each $breakpoint, $bpValue in $q-breakpoints {
3879
- @include q-media-up($breakpoint) {
3880
- @each $sideKey, $sideSuffix in $q-spacing-sides {
3881
- .q-m#{$sideSuffix}-#{$breakpoint}-auto {
3882
- @include q-emit-spacing(margin, $sideKey, auto);
3883
- }
3884
- }
3885
- }
3886
- }
3887
- }
3888
- @include q-generate-responsive-spacing(margin, m);
3889
- @include q-generate-responsive-spacing(padding, p);
3890
- @include q-generate-margin-auto;
@@ -16,6 +16,7 @@ var d = /*@__PURE__*/ i({
16
16
  width: {},
17
17
  required: { type: Boolean },
18
18
  icons: {},
19
+ texts: {},
19
20
  value: {}
20
21
  },
21
22
  setup(i) {
@@ -29,7 +29,7 @@ var k = ["id"], A = {
29
29
  "aria-label",
30
30
  "aria-current",
31
31
  "onClick"
32
- ], P = { class: "q-carousel__sr-only" }, F = { class: "q-carousel__sr-only" }, I = /*@__PURE__*/ d({
32
+ ], P = { class: "q-sr-only" }, F = { class: "q-sr-only" }, I = /*@__PURE__*/ d({
33
33
  __name: "QCarousel",
34
34
  props: /*@__PURE__*/ f({
35
35
  id: {},
@@ -1 +1 @@
1
- {"version":3,"file":"QCheckbox.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QCheckbox/QCheckbox.vue"],"names":[],"mappings":"AAkEA;AAiJC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAU3C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,GAAG,CAAA;AAKvC,KAAK,WAAW,GAAG,cAAc,CAAC;AAqEnC,KAAK,iBAAiB,GAAG;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,WAAW,CAAC;AAKhB,iBAAS,cAAc;WA2HT,OAAO,IAA6B;;wBAdtB,GAAG;wBACF,GAAG;;;;;;;EAkB/B;AAiBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;OASnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
1
+ {"version":3,"file":"QCheckbox.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QCheckbox/QCheckbox.vue"],"names":[],"mappings":"AAmEA;AAkJC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAU3C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,GAAG,CAAA;AAKvC,KAAK,WAAW,GAAG,cAAc,CAAC;AAqEnC,KAAK,iBAAiB,GAAG;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,WAAW,CAAC;AAKhB,iBAAS,cAAc;WA4HT,OAAO,IAA6B;;wBAdtB,GAAG;wBACF,GAAG;;;;;;;EAkB/B;AAiBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;;;;;;OASnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
@@ -15,6 +15,7 @@ var w = [
15
15
  "id",
16
16
  "aria-label",
17
17
  "aria-checked",
18
+ "aria-required",
18
19
  "disabled",
19
20
  "readonly",
20
21
  "onKeydown"
@@ -111,6 +112,7 @@ var w = [
111
112
  "data-testid": "checkbox-button",
112
113
  "aria-label": u.label,
113
114
  "aria-checked": u.indeterminate ? "mixed" : d.value,
115
+ "aria-required": u.required || void 0,
114
116
  disabled: u.disabled,
115
117
  readonly: u.readonly
116
118
  }, t.$attrs, {
@@ -1,4 +1,4 @@
1
- import { DEFAULT_ICONS } from './constants';
1
+ import { DEFAULT_ICONS, DEFAULT_TEXTS } from './constants';
2
2
  import { QCollapsibleProps } from '.';
3
3
  type __VLS_Props = QCollapsibleProps;
4
4
  type __VLS_PublicProps = {
@@ -25,6 +25,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps,
25
25
  }>, {
26
26
  width: import('./types').QCollapsibleWidth;
27
27
  icons: typeof DEFAULT_ICONS;
28
+ texts: typeof DEFAULT_TEXTS;
28
29
  }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
29
30
  declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
30
31
  export default _default;
@@ -1 +1 @@
1
- {"version":3,"file":"QCollapsible.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QCollapsible/QCollapsible.vue"],"names":[],"mappings":"AAyEA;AA2IC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAQ3C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,GAAG,CAAA;AAK1C,KAAK,WAAW,GAAG,iBAAiB,CAAC;AAuDtC,KAAK,iBAAiB,GAAG;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,WAAW,CAAC;AAKhB,iBAAS,cAAc;WA+IT,OAAO,IAA6B;;sBAfvB,GAAG;sBAGH,GAAG;iCAFQ,GAAG;gCACJ,GAAG;0BAET,GAAG;yBACJ,GAAG;;;;EAehC;AAkBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;6EASnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
1
+ {"version":3,"file":"QCollapsible.vue.d.ts","sourceRoot":"","sources":["../../../src/components/QCollapsible/QCollapsible.vue"],"names":[],"mappings":"AAwEA;AA4IC,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAS1D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,GAAG,CAAA;AAK1C,KAAK,WAAW,GAAG,iBAAiB,CAAC;AAyDtC,KAAK,iBAAiB,GAAG;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,WAAW,CAAC;AAKhB,iBAAS,cAAc;WAuJT,OAAO,IAA6B;;sBAfvB,GAAG;sBAGH,GAAG;iCAFQ,GAAG;gCACJ,GAAG;0BAET,GAAG;yBACJ,GAAG;;;;EAehC;AAmBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;6EASnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}