nuance-ui 0.2.1 → 0.2.5

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 (113) hide show
  1. package/LICENSE.md +9 -9
  2. package/README.md +75 -75
  3. package/dist/module.json +1 -1
  4. package/dist/runtime/components/action-icon/action-icon-section.vue +3 -3
  5. package/dist/runtime/components/action-icon/action-icon.vue +22 -22
  6. package/dist/runtime/components/alert.vue +128 -128
  7. package/dist/runtime/components/app-shell/app-shell-aside.vue +30 -30
  8. package/dist/runtime/components/app-shell/app-shell-footer.vue +29 -29
  9. package/dist/runtime/components/app-shell/app-shell-header.vue +30 -30
  10. package/dist/runtime/components/app-shell/app-shell-navbar.vue +34 -34
  11. package/dist/runtime/components/app-shell/app-shell-section.vue +10 -10
  12. package/dist/runtime/components/app-shell/app-shell.vue +34 -34
  13. package/dist/runtime/components/avatar/avatar-group.vue +3 -3
  14. package/dist/runtime/components/avatar/avatar.vue +14 -14
  15. package/dist/runtime/components/background-image.vue +18 -18
  16. package/dist/runtime/components/badge.vue +159 -160
  17. package/dist/runtime/components/box.vue +3 -3
  18. package/dist/runtime/components/breadcrumbs.vue +78 -78
  19. package/dist/runtime/components/button/button-group.vue +3 -3
  20. package/dist/runtime/components/button/button.vue +37 -37
  21. package/dist/runtime/components/button/unstyled-button.vue +23 -23
  22. package/dist/runtime/components/calendar/calendar.vue +60 -60
  23. package/dist/runtime/components/calendar/ui/core/calendar-cell.vue +115 -115
  24. package/dist/runtime/components/calendar/ui/core/calendar-header.vue +95 -95
  25. package/dist/runtime/components/calendar/ui/core/calendar-root.vue +3 -3
  26. package/dist/runtime/components/calendar/ui/levels/calendar-decade.vue +40 -40
  27. package/dist/runtime/components/calendar/ui/levels/calendar-month.vue +77 -77
  28. package/dist/runtime/components/calendar/ui/levels/calendar-year.vue +40 -40
  29. package/dist/runtime/components/card/card-section.vue +3 -3
  30. package/dist/runtime/components/card/card.vue +3 -3
  31. package/dist/runtime/components/checkbox/checkbox-card.vue +36 -36
  32. package/dist/runtime/components/checkbox/checkbox-group.vue +16 -16
  33. package/dist/runtime/components/checkbox/checkbox-indicator.vue +116 -116
  34. package/dist/runtime/components/checkbox/checkbox.vue +140 -140
  35. package/dist/runtime/components/chip/chip-group.vue +2 -2
  36. package/dist/runtime/components/chip/chip.vue +200 -200
  37. package/dist/runtime/components/combobox/combobox-dropdown.vue +14 -14
  38. package/dist/runtime/components/combobox/combobox-empty.vue +3 -3
  39. package/dist/runtime/components/combobox/combobox-group.vue +21 -21
  40. package/dist/runtime/components/combobox/combobox-option-list.vue +3 -3
  41. package/dist/runtime/components/combobox/combobox-option.vue +26 -26
  42. package/dist/runtime/components/combobox/combobox-options-dropdown.vue +28 -28
  43. package/dist/runtime/components/combobox/combobox-root.vue +3 -3
  44. package/dist/runtime/components/combobox/combobox-target.vue +3 -3
  45. package/dist/runtime/components/container.vue +8 -8
  46. package/dist/runtime/components/date-time-picker.vue +65 -65
  47. package/dist/runtime/components/dialog/ui/dialog-close-button.vue +11 -11
  48. package/dist/runtime/components/dialog/ui/dialog-header.vue +5 -5
  49. package/dist/runtime/components/dialog/ui/dialog-root.vue +20 -20
  50. package/dist/runtime/components/dialog/ui/dialog-title.vue +5 -5
  51. package/dist/runtime/components/drawer/drawer-close-button.vue +3 -3
  52. package/dist/runtime/components/drawer/drawer-header.vue +3 -3
  53. package/dist/runtime/components/drawer/drawer-root.vue +15 -15
  54. package/dist/runtime/components/drawer/drawer-title.vue +3 -3
  55. package/dist/runtime/components/files/file-upload-button.vue +12 -12
  56. package/dist/runtime/components/files/file-upload-icon.vue +1 -1
  57. package/dist/runtime/components/input/date-picker.vue +85 -85
  58. package/dist/runtime/components/input/email-input.vue +21 -21
  59. package/dist/runtime/components/input/number-input.vue +132 -132
  60. package/dist/runtime/components/input/password-input.vue +28 -28
  61. package/dist/runtime/components/input/text-input.vue +33 -33
  62. package/dist/runtime/components/input/ui/button-input.vue +64 -64
  63. package/dist/runtime/components/input/ui/input-base.vue +283 -283
  64. package/dist/runtime/components/input/ui/input-inline.vue +105 -105
  65. package/dist/runtime/components/input/ui/input-label.vue +4 -4
  66. package/dist/runtime/components/input/ui/input-wrapper.vue +54 -54
  67. package/dist/runtime/components/input/ui/spin-input.vue +69 -69
  68. package/dist/runtime/components/link/link-button.vue +16 -16
  69. package/dist/runtime/components/link/link.vue +10 -10
  70. package/dist/runtime/components/loader/_loaders/bars-loader.vue +5 -5
  71. package/dist/runtime/components/loader/_loaders/dots-loader.vue +5 -5
  72. package/dist/runtime/components/loader/_loaders/oval-loader.vue +1 -1
  73. package/dist/runtime/components/loader/loader.vue +1 -1
  74. package/dist/runtime/components/modal/modal-close-button.vue +3 -3
  75. package/dist/runtime/components/modal/modal-header.vue +3 -3
  76. package/dist/runtime/components/modal/modal-root.vue +13 -13
  77. package/dist/runtime/components/modal/modal-title.vue +3 -3
  78. package/dist/runtime/components/nav-link/nav-icon-link.vue +15 -15
  79. package/dist/runtime/components/nav-link/nav-link.vue +130 -130
  80. package/dist/runtime/components/paper.vue +33 -33
  81. package/dist/runtime/components/popover/popover-dropdown.vue +69 -70
  82. package/dist/runtime/components/popover/popover-target.vue +8 -8
  83. package/dist/runtime/components/popover/popover.vue +1 -1
  84. package/dist/runtime/components/progress/progress-label.vue +3 -3
  85. package/dist/runtime/components/progress/progress-root.vue +3 -3
  86. package/dist/runtime/components/progress/progress-section.vue +8 -8
  87. package/dist/runtime/components/progress/progress.vue +9 -9
  88. package/dist/runtime/components/renderless/renderless.vue +3 -3
  89. package/dist/runtime/components/roving-focus/roving-focus-item.vue +14 -14
  90. package/dist/runtime/components/roving-focus/roving-focus.vue +3 -3
  91. package/dist/runtime/components/select/select.vue +59 -59
  92. package/dist/runtime/components/table/table.d.ts +30 -30
  93. package/dist/runtime/components/table/ui/table-sort-icon.vue +1 -1
  94. package/dist/runtime/components/table/ui/table-sortable-header.vue +11 -11
  95. package/dist/runtime/components/table/ui/table.vue +295 -295
  96. package/dist/runtime/components/tabs/tabs-list.vue +10 -10
  97. package/dist/runtime/components/tabs/tabs-panel.vue +11 -11
  98. package/dist/runtime/components/tabs/tabs-root.vue +8 -8
  99. package/dist/runtime/components/tabs/tabs-tab.vue +20 -20
  100. package/dist/runtime/components/text.vue +67 -67
  101. package/dist/runtime/components/textarea.vue +34 -34
  102. package/dist/runtime/components/time-picker/time-picker.vue +230 -230
  103. package/dist/runtime/components/title.vue +14 -14
  104. package/dist/runtime/components/transition/transition.vue +3 -3
  105. package/dist/runtime/components/tree/_ui/tree-item.vue +128 -129
  106. package/dist/runtime/components/tree/_ui/tree-root.vue +21 -21
  107. package/dist/runtime/components/tree/tree.vue +20 -20
  108. package/dist/runtime/components/visually-hidden/visually-hidden-input.vue +1 -1
  109. package/dist/runtime/components/visually-hidden/visually-hidden.vue +9 -9
  110. package/dist/runtime/modals/_confirm-modal/confirm-modal.vue +31 -31
  111. package/dist/runtime/modals/modals-provider.vue +10 -10
  112. package/dist/runtime/styles/dark-theme.css +1 -1
  113. package/package.json +30 -10
@@ -57,17 +57,17 @@ useProvideTabsContext({
57
57
  </script>
58
58
 
59
59
  <template>
60
- <Box
61
- :is
62
- :style
60
+ <Box
61
+ :is
62
+ :style
63
63
  :mod='[mod, {
64
64
  orientation,
65
65
  inverted: orientation === "horizontal" && inverted,
66
66
  placement: orientation === "vertical" && placement,
67
67
  variant
68
- }]'
69
- :class='css.root'
70
- >
71
- <slot />
72
- </Box>
68
+ }]'
69
+ :class='css.root'
70
+ >
71
+ <slot />
72
+ </Box>
73
73
  </template>
@@ -12,30 +12,30 @@ const active = computed(() => value === ctx?.active.value);
12
12
  </script>
13
13
 
14
14
  <template>
15
- <UnstyledButton
16
- :id='ctx?.getTabId(value)'
15
+ <UnstyledButton
16
+ :id='ctx?.getTabId(value)'
17
17
  :mod='[mod, {
18
18
  variant: ctx?.variant,
19
19
  active,
20
20
  orientation: ctx?.orientation,
21
21
  inverted: ctx?.inverted,
22
22
  placement: ctx?.orientation === "vertical" && ctx.placement
23
- }]'
24
- :class='css.tab'
25
- role='tab'
26
- :aria-selected='active'
27
- :tabindex='$attrs?.tabIndex !== void 0 ? $attrs?.tabIndex : active || ctx?.active.value === null ? 0 : -1'
28
- :aria-controls='ctx?.getPanelId(value)'
29
- @click='ctx?.onUpdate(value)'
30
- >
31
- <span v-if='$slots.leftSection' :class='css.tabSection' data-position='left'>
32
- <slot name='leftSection' />
33
- </span>
34
- <span v-if='$slots.default' :class='css.tabLabel'>
35
- <slot />
36
- </span>
37
- <span v-if='$slots.rightSection' :class='css.tabSection' data-position='right'>
38
- <slot name='rightSection' />
39
- </span>
40
- </UnstyledButton>
23
+ }]'
24
+ :class='css.tab'
25
+ role='tab'
26
+ :aria-selected='active'
27
+ :tabindex='$attrs?.tabIndex !== void 0 ? $attrs?.tabIndex : active || ctx?.active.value === null ? 0 : -1'
28
+ :aria-controls='ctx?.getPanelId(value)'
29
+ @click='ctx?.onUpdate(value)'
30
+ >
31
+ <span v-if='$slots.leftSection' :class='css.tabSection' data-position='left'>
32
+ <slot name='leftSection' />
33
+ </span>
34
+ <span v-if='$slots.default' :class='css.tabLabel'>
35
+ <slot />
36
+ </span>
37
+ <span v-if='$slots.rightSection' :class='css.tabSection' data-position='right'>
38
+ <slot name='rightSection' />
39
+ </span>
40
+ </UnstyledButton>
41
41
  </template>
@@ -51,74 +51,74 @@ const style = computed(() => useStyleResolver((theme) => ({
51
51
  </script>
52
52
 
53
53
  <template>
54
- <Box :is v-bind='rest' :mod='_mod' :class='$style.root' :style>
55
- <slot />
56
- </Box>
54
+ <Box :is v-bind='rest' :mod='_mod' :class='$style.root' :style>
55
+ <slot />
56
+ </Box>
57
57
  </template>
58
58
 
59
59
  <style module lang="postcss">
60
- .root {
61
- --text-fz: var(--font-size-sm);
62
- --text-lh: var(--line-height-sm);
63
- --text-color: inherit;
64
- --text-fw: normal;
65
- --text-gradient: none;
66
- --text-line-clamp: none;
67
-
68
- margin: 0;
69
- padding: 0;
70
-
71
- font-size: var(--text-fz);
72
- font-weight: var(--text-fw);
73
- line-height: var(--text-lh);
74
- color: var(--text-color);
75
- text-decoration: none;
76
- -webkit-tap-highlight-color: transparent;
77
-
78
- &:where([data-truncate]) {
79
- overflow: hidden;
80
-
81
- text-overflow: ellipsis;
82
- white-space: nowrap;
83
- }
84
-
85
- &:where([data-truncate='start']) {
86
- direction: rtl;
87
-
88
- text-align: right;
89
-
90
- @mixin where-rtl {
91
- direction: ltr;
92
-
93
- text-align: left;
94
- }
95
- }
96
-
97
- &:where([data-variant='gradient']) {
98
- background-image: var(--text-gradient);
99
- -webkit-background-clip: text;
100
- background-clip: text;
101
- -webkit-text-fill-color: transparent;
102
- }
103
-
104
- &:where([data-line-clamp]) {
105
- overflow: hidden;
106
- display: -webkit-box;
107
- -webkit-box-orient: vertical;
108
- -webkit-line-clamp: var(--text-line-clamp);
109
-
110
- text-overflow: ellipsis;
111
- }
112
-
113
- &:where([data-inherit]) {
114
- font-size: inherit;
115
- font-weight: inherit;
116
- line-height: inherit;
117
- color: inherit;
118
- }
119
-
120
- &:where([data-inline]) {
121
- line-height: 1;
122
- }
123
- }
60
+ .root {
61
+ --text-fz: var(--font-size-sm);
62
+ --text-lh: var(--line-height-sm);
63
+ --text-color: inherit;
64
+ --text-fw: normal;
65
+ --text-gradient: none;
66
+ --text-line-clamp: none;
67
+
68
+ margin: 0;
69
+ padding: 0;
70
+
71
+ font-size: var(--text-fz);
72
+ font-weight: var(--text-fw);
73
+ line-height: var(--text-lh);
74
+ color: var(--text-color);
75
+ text-decoration: none;
76
+ -webkit-tap-highlight-color: transparent;
77
+
78
+ &:where([data-truncate]) {
79
+ overflow: hidden;
80
+
81
+ text-overflow: ellipsis;
82
+ white-space: nowrap;
83
+ }
84
+
85
+ &:where([data-truncate='start']) {
86
+ direction: rtl;
87
+
88
+ text-align: right;
89
+
90
+ @mixin where-rtl {
91
+ direction: ltr;
92
+
93
+ text-align: left;
94
+ }
95
+ }
96
+
97
+ &:where([data-variant='gradient']) {
98
+ background-image: var(--text-gradient);
99
+ -webkit-background-clip: text;
100
+ background-clip: text;
101
+ -webkit-text-fill-color: transparent;
102
+ }
103
+
104
+ &:where([data-line-clamp]) {
105
+ overflow: hidden;
106
+ display: -webkit-box;
107
+ -webkit-box-orient: vertical;
108
+ -webkit-line-clamp: var(--text-line-clamp);
109
+
110
+ text-overflow: ellipsis;
111
+ }
112
+
113
+ &:where([data-inherit]) {
114
+ font-size: inherit;
115
+ font-weight: inherit;
116
+ line-height: inherit;
117
+ color: inherit;
118
+ }
119
+
120
+ &:where([data-inline]) {
121
+ line-height: 1;
122
+ }
123
+ }
124
124
  </style>
@@ -32,40 +32,40 @@ defineExpose({
32
32
  </script>
33
33
 
34
34
  <template>
35
- <InputWrapper v-bind='props' :multiline :class='$attrs?.class'>
36
- <InputBase>
37
- <template v-if='!!$slots.leftSection' #leftSection>
38
- <slot name='leftSection' />
39
- </template>
40
-
41
- <template #default='{ id, css }'>
42
- <textarea
43
- v-bind='{ ...$attrs, class: void 0 }'
44
- :id
45
- ref='input'
46
- v-model='model'
47
- :class='[css, $style.textarea]'
48
- :required='props.required'
49
- :disabled='props.required'
50
- :readonly='props.readonly'
51
- />
52
- </template>
53
-
54
- <template v-if='!!$slots.rightSection' #rightSection>
55
- <slot name='rightSection' />
56
- </template>
57
- </InputBase>
58
-
59
- <template v-if='!!$slots.label' #label>
60
- <slot name='label' />
61
- </template>
62
- <template v-if='!!$slots.error' #error>
63
- <slot name='error' />
64
- </template>
65
- <template v-if='!!$slots.description' #description>
66
- <slot name='description' />
67
- </template>
68
- </InputWrapper>
35
+ <InputWrapper v-bind='props' :multiline :class='$attrs?.class'>
36
+ <InputBase>
37
+ <template v-if='!!$slots.leftSection' #leftSection>
38
+ <slot name='leftSection' />
39
+ </template>
40
+
41
+ <template #default='{ id, css }'>
42
+ <textarea
43
+ v-bind='{ ...$attrs, class: void 0 }'
44
+ :id
45
+ ref='input'
46
+ v-model='model'
47
+ :class='[css, $style.textarea]'
48
+ :required='props.required'
49
+ :disabled='props.required'
50
+ :readonly='props.readonly'
51
+ />
52
+ </template>
53
+
54
+ <template v-if='!!$slots.rightSection' #rightSection>
55
+ <slot name='rightSection' />
56
+ </template>
57
+ </InputBase>
58
+
59
+ <template v-if='!!$slots.label' #label>
60
+ <slot name='label' />
61
+ </template>
62
+ <template v-if='!!$slots.error' #error>
63
+ <slot name='error' />
64
+ </template>
65
+ <template v-if='!!$slots.description' #description>
66
+ <slot name='description' />
67
+ </template>
68
+ </InputWrapper>
69
69
  </template>
70
70
 
71
71
  <style module>