@uzum-tech/ui 1.5.1 → 1.5.2

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 (50) hide show
  1. package/dist/index.js +312 -314
  2. package/dist/index.prod.js +3 -3
  3. package/es/_internal/typography/src/styles/text.cssr.js +0 -1
  4. package/es/_internal/typography/styles/light.js +1 -1
  5. package/es/data-table/src/DataTable.d.ts +3 -0
  6. package/es/data-table/src/DataTable.js +1 -0
  7. package/es/data-table/src/TableParts/Body.d.ts +1 -0
  8. package/es/data-table/src/TableParts/Body.js +3 -3
  9. package/es/data-table/src/interface.d.ts +2 -0
  10. package/es/data-table/src/interface.js +1 -1
  11. package/es/list/src/List.d.ts +41 -55
  12. package/es/list/src/List.js +6 -10
  13. package/es/list/src/ListItem.d.ts +84 -25
  14. package/es/list/src/ListItem.js +116 -98
  15. package/es/list/src/interface.d.ts +1 -0
  16. package/es/list/src/props.d.ts +70 -31
  17. package/es/list/src/props.js +25 -5
  18. package/es/list/src/styles/index.cssr.js +32 -90
  19. package/es/list/styles/light.d.ts +5 -8
  20. package/es/list/styles/light.js +6 -9
  21. package/es/tag/src/styles/index.cssr.js +5 -1
  22. package/es/tag/styles/light.js +2 -2
  23. package/es/upload/src/UploadFile.js +4 -3
  24. package/es/version.d.ts +1 -1
  25. package/es/version.js +1 -1
  26. package/lib/_internal/typography/src/styles/text.cssr.js +0 -1
  27. package/lib/_internal/typography/styles/light.js +1 -1
  28. package/lib/data-table/src/DataTable.d.ts +3 -0
  29. package/lib/data-table/src/DataTable.js +1 -0
  30. package/lib/data-table/src/TableParts/Body.d.ts +1 -0
  31. package/lib/data-table/src/TableParts/Body.js +3 -3
  32. package/lib/data-table/src/interface.d.ts +2 -0
  33. package/lib/data-table/src/interface.js +1 -1
  34. package/lib/list/src/List.d.ts +41 -55
  35. package/lib/list/src/List.js +6 -10
  36. package/lib/list/src/ListItem.d.ts +84 -25
  37. package/lib/list/src/ListItem.js +115 -97
  38. package/lib/list/src/interface.d.ts +1 -0
  39. package/lib/list/src/props.d.ts +70 -31
  40. package/lib/list/src/props.js +25 -5
  41. package/lib/list/src/styles/index.cssr.js +32 -90
  42. package/lib/list/styles/light.d.ts +5 -8
  43. package/lib/list/styles/light.js +6 -9
  44. package/lib/tag/src/styles/index.cssr.js +5 -1
  45. package/lib/tag/styles/light.js +2 -2
  46. package/lib/upload/src/UploadFile.js +4 -3
  47. package/lib/version.d.ts +1 -1
  48. package/lib/version.js +1 -1
  49. package/package.json +1 -1
  50. package/web-types.json +62 -35
@@ -1,6 +1,10 @@
1
1
  import { ArrayMouseHandler, ArrayKeyboardHandler, ArrayEmptyHandler, ArrayFocusHandler, ExtractPublicPropTypes } from '../../_utils';
2
- import type { PropType, Ref } from 'vue';
3
- import { ListItemPropsBoolean, ListItemPropsRenderable, ExtractIntoInjection, ListInjectionBoolean, ListInjectionRenderable } from './interface';
2
+ import type { Component, PropType, Ref } from 'vue';
3
+ import { ListItemPropsBoolean, ListItemPropsRenderable, ExtractIntoInjection, ListInjectionBoolean, ListInjectionRenderable, Size } from './interface';
4
+ import { InternalTextProps } from '../../_internal/typography';
5
+ import { SkeletonProps } from '../../_internal/skeleton';
6
+ import { AvatarProps } from '../../avatar';
7
+ import { BadgeProps } from '../../badge';
4
8
  export declare const listItemPropsBoolean: Array<keyof ListItemPropsBoolean>;
5
9
  export declare const listItemPropsRenderable: Array<keyof ListItemPropsRenderable>;
6
10
  export declare const listItemBaseProps: {
@@ -39,11 +43,55 @@ export declare const listItemBaseProps: {
39
43
  icon: import("./interface").RenderableProp;
40
44
  avatar: import("./interface").RenderableProp;
41
45
  };
46
+ export type HeaderPropObject = InternalTextProps & Partial<{
47
+ loading: boolean;
48
+ position: 'top' | 'bottom';
49
+ skeleton: SkeletonProps;
50
+ align: 'stretch' | 'start' | 'center' | 'end';
51
+ }>;
52
+ export type DescriptionPropsObject = InternalTextProps & Partial<{
53
+ loading: boolean;
54
+ position: 'top' | 'bottom';
55
+ skeleton: SkeletonProps;
56
+ }>;
42
57
  export declare const listItemProps: {
58
+ avatar: {
59
+ type: PropType<AvatarProps & {
60
+ icon: Component;
61
+ hasBadge?: boolean;
62
+ }>;
63
+ default: () => {};
64
+ };
65
+ badge: {
66
+ type: PropType<BadgeProps>;
67
+ default: () => {};
68
+ };
43
69
  tag: {
44
70
  type: StringConstructor;
45
71
  default: undefined;
46
72
  };
73
+ prefixAlign: {
74
+ type: PropType<"start" | "center" | "end">;
75
+ default: string;
76
+ };
77
+ suffixAlign: {
78
+ type: PropType<"start" | "center" | "end">;
79
+ default: string;
80
+ };
81
+ loadingPrefix: BooleanConstructor;
82
+ loadingSuffix: BooleanConstructor;
83
+ header: {
84
+ type: PropType<HeaderPropObject>;
85
+ };
86
+ description: {
87
+ type: PropType<DescriptionPropsObject>;
88
+ };
89
+ headerSide: {
90
+ type: PropType<HeaderPropObject>;
91
+ };
92
+ descriptionSide: {
93
+ type: PropType<DescriptionPropsObject>;
94
+ };
47
95
  onClick: {
48
96
  type: PropType<ArrayMouseHandler | undefined>;
49
97
  default: undefined;
@@ -72,14 +120,13 @@ export declare const listItemProps: {
72
120
  disabled: import("./interface").BooleanProp;
73
121
  loading: import("./interface").BooleanProp;
74
122
  loadingSkeleton: import("./interface").BooleanProp;
75
- header: import("./interface").RenderableProp;
76
- description: import("./interface").RenderableProp;
77
- headerSide: import("./interface").RenderableProp;
78
- descriptionSide: import("./interface").RenderableProp;
79
123
  icon: import("./interface").RenderableProp;
80
- avatar: import("./interface").RenderableProp;
81
124
  };
82
125
  export declare const listProps: {
126
+ size: {
127
+ type: PropType<Size>;
128
+ default: string;
129
+ };
83
130
  showIcon: {
84
131
  type: BooleanConstructor;
85
132
  default: boolean;
@@ -129,18 +176,12 @@ export declare const listProps: {
129
176
  icon: import("./interface").RenderableProp;
130
177
  avatar: import("./interface").RenderableProp;
131
178
  theme: PropType<import("../../_mixins").Theme<"List", {
132
- padding: string;
133
179
  iconSize: string;
134
180
  iconSpace: string;
135
181
  suffixSpace: string;
136
182
  prefixSpace: string;
137
- titleSize: string;
138
- titleLineHeight: string;
139
- subtitleSize: string;
140
- subtitleLineHeight: string;
141
183
  subtitleColor: string;
142
184
  avatarSpace: string;
143
- minHeight: string;
144
185
  colorFocus: string;
145
186
  pressedScale: string;
146
187
  textColorDisabled: string;
@@ -154,22 +195,19 @@ export declare const listProps: {
154
195
  borderColor: string;
155
196
  borderColorModal: string;
156
197
  borderColorPopover: string;
157
- borderRadius: string;
158
- fontSize: string;
198
+ borderRadiusLarge: string;
199
+ borderRadiusMedium: string;
200
+ borderRadiusSmall: string;
201
+ padding: string;
202
+ suffixSize: string;
159
203
  }, any>>;
160
204
  themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"List", {
161
- padding: string;
162
205
  iconSize: string;
163
206
  iconSpace: string;
164
207
  suffixSpace: string;
165
208
  prefixSpace: string;
166
- titleSize: string;
167
- titleLineHeight: string;
168
- subtitleSize: string;
169
- subtitleLineHeight: string;
170
209
  subtitleColor: string;
171
210
  avatarSpace: string;
172
- minHeight: string;
173
211
  colorFocus: string;
174
212
  pressedScale: string;
175
213
  textColorDisabled: string;
@@ -183,22 +221,19 @@ export declare const listProps: {
183
221
  borderColor: string;
184
222
  borderColorModal: string;
185
223
  borderColorPopover: string;
186
- borderRadius: string;
187
- fontSize: string;
224
+ borderRadiusLarge: string;
225
+ borderRadiusMedium: string;
226
+ borderRadiusSmall: string;
227
+ padding: string;
228
+ suffixSize: string;
188
229
  }, any>>>;
189
230
  builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"List", {
190
- padding: string;
191
231
  iconSize: string;
192
232
  iconSpace: string;
193
233
  suffixSpace: string;
194
234
  prefixSpace: string;
195
- titleSize: string;
196
- titleLineHeight: string;
197
- subtitleSize: string;
198
- subtitleLineHeight: string;
199
235
  subtitleColor: string;
200
236
  avatarSpace: string;
201
- minHeight: string;
202
237
  colorFocus: string;
203
238
  pressedScale: string;
204
239
  textColorDisabled: string;
@@ -212,8 +247,11 @@ export declare const listProps: {
212
247
  borderColor: string;
213
248
  borderColorModal: string;
214
249
  borderColorPopover: string;
215
- borderRadius: string;
216
- fontSize: string;
250
+ borderRadiusLarge: string;
251
+ borderRadiusMedium: string;
252
+ borderRadiusSmall: string;
253
+ padding: string;
254
+ suffixSize: string;
217
255
  }, any>>>;
218
256
  };
219
257
  export type ListInjection = ExtractIntoInjection<typeof listItemBaseProps> & ListInjectionBoolean & ListInjectionRenderable & {
@@ -222,6 +260,7 @@ export type ListInjection = ExtractIntoInjection<typeof listItemBaseProps> & Lis
222
260
  bordered: Ref<boolean>;
223
261
  clickable: Ref<boolean>;
224
262
  showDivider: Ref<boolean>;
263
+ size: Ref<Size>;
225
264
  };
226
265
  export declare const listInjectionKey: import("vue").InjectionKey<ListInjection>;
227
266
  export type ListItemProps = ExtractPublicPropTypes<typeof listItemProps>;
@@ -10,8 +10,7 @@ exports.listItemPropsBoolean = [
10
10
  'hoverable',
11
11
  'rounded',
12
12
  'disabled',
13
- 'loading',
14
- 'loadingSkeleton'
13
+ 'loading'
15
14
  ];
16
15
  exports.listItemPropsRenderable = [
17
16
  'header',
@@ -45,11 +44,32 @@ exports.listItemBaseProps = Object.assign(Object.assign(Object.assign({}, export
45
44
  type: [Function, Array, undefined],
46
45
  default: undefined
47
46
  } });
48
- exports.listItemProps = Object.assign(Object.assign({}, exports.listItemBaseProps), { tag: {
47
+ const headerProps = {
48
+ type: Object
49
+ };
50
+ const descriptionProps = {
51
+ type: Object
52
+ };
53
+ exports.listItemProps = Object.assign(Object.assign({}, exports.listItemBaseProps), { avatar: {
54
+ type: Object,
55
+ default: () => ({})
56
+ }, badge: {
57
+ type: Object,
58
+ default: () => ({})
59
+ }, tag: {
49
60
  type: String,
50
61
  default: undefined
51
- } });
52
- exports.listProps = Object.assign(Object.assign(Object.assign({}, _mixins_1.useTheme.props), exports.listItemBaseProps), { showIcon: {
62
+ }, prefixAlign: {
63
+ type: String,
64
+ default: 'start'
65
+ }, suffixAlign: {
66
+ type: String,
67
+ default: 'start'
68
+ }, loadingPrefix: Boolean, loadingSuffix: Boolean, header: headerProps, description: descriptionProps, headerSide: headerProps, descriptionSide: descriptionProps });
69
+ exports.listProps = Object.assign(Object.assign(Object.assign({}, _mixins_1.useTheme.props), exports.listItemBaseProps), { size: {
70
+ type: [String],
71
+ default: 'medium'
72
+ }, showIcon: {
53
73
  type: Boolean,
54
74
  default: true
55
75
  }, tag: {
@@ -4,13 +4,20 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  const cssr_1 = require("../../../_utils/cssr");
7
- exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('list', `
7
+ // --u-border-radius
8
+ // --u-suffix-size
9
+ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('align-start', `
10
+ align-self: self-start;
11
+ `), (0, cssr_1.cB)('align-center', `
12
+ align-self: center;
13
+ `), (0, cssr_1.cB)('align-end', `
14
+ align-self: self-end;
15
+ `), (0, cssr_1.cB)('list', `
8
16
  --u-merged-border-color: var(--u-border-color);
9
17
  --u-merged-color: var(--u-color);
10
18
  --u-merged-color-focus: var(--u-color-focus);
11
19
  --u-merged-color-hover: var(--u-color-hover);
12
20
  margin: 0;
13
- font-size: var(--u-font-size);
14
21
  transition:
15
22
  background-color .3s var(--u-bezier),
16
23
  color .3s var(--u-bezier),
@@ -21,17 +28,10 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('list', `
21
28
  background-color: var(--u-merged-color);
22
29
  `, [(0, cssr_1.cM)('clickable', [(0, cssr_1.cB)('list-item', `
23
30
  cursor: pointer;
24
- `)]), (0, cssr_1.cM)('bordered', `
25
- border: 1px solid var(--u-merged-border-color);
26
- border-radius: var(--u-border-radius);
27
- `, [(0, cssr_1.cB)('list-item', [(0, cssr_1.c)('&:first-child', `
28
- border-radius: var(--u-border-radius);
29
- border-bottom-left-radius: 0;
30
- border-bottom-right-radius: 0;
31
- `), (0, cssr_1.c)('&:last-child', `
32
- border-radius: var(--u-border-radius);
33
- border-top-left-radius: 0;
34
- border-top-right-radius: 0;
31
+ `)]), (0, cssr_1.cM)('bordered', [(0, cssr_1.cB)('list-item', `
32
+ border-bottom: 1px solid var(--u-merged-border-color);
33
+ `, [(0, cssr_1.c)('&:last-child', `
34
+ border: none;
35
35
  `)])]), (0, cssr_1.cE)('header, footer', `
36
36
  padding: var(--u-padding);
37
37
  padding-left: 0px;
@@ -51,11 +51,10 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('list', `
51
51
  position: relative;
52
52
  outline: none;
53
53
  display: flex;
54
- align-items: center;
55
54
  padding: var(--u-padding);
56
- padding-left: 0;
57
- padding-right: 0;
58
- `, [(0, cssr_1.cE)('main', `
55
+ `, [(0, cssr_1.cB)('skeleton', `
56
+ height: 24px
57
+ `), (0, cssr_1.cE)('main', `
59
58
  flex: 1;
60
59
  `), (0, cssr_1.c)('&:focus', `
61
60
  outline: none;
@@ -70,81 +69,43 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('list', `
70
69
  left: 0;
71
70
  `), (0, cssr_1.cE)('icon', `
72
71
  display: flex;
73
- font-size: var(--u-icon-size);
74
72
  margin-left: var(--u-icon-space);
75
73
  `), (0, cssr_1.cE)('suffix', `
76
74
  margin-left: var(--u-suffix-space);
75
+ font-size: var(--u-suffix-size);
76
+ align-self: center;
77
77
  `), (0, cssr_1.cE)('prefix', `
78
78
  margin-right: var(--u-prefix-space);
79
+ display: flex;
79
80
  `), (0, cssr_1.cE)('content', `
80
- flex-grow: 1;
81
- padding: 0;
82
81
  display: flex;
83
82
  flex-direction: column;
84
- align-items: stretch;
83
+ gap: 4px;
85
84
  `, [(0, cssr_1.cM)('right', `
86
- margin-left: auto;
87
85
  text-align: right;
88
- align-items: flex-end;
89
- `, [(0, cssr_1.cE)('title', `
90
- font-weight: 600;
91
- `)]), (0, cssr_1.c)('+', [(0, cssr_1.cE)('content', `
92
- margin-left: 24px;
93
- flex-grow: 0;
94
- `)])]), (0, cssr_1.cE)('text', `
95
- flex-grow: 1;
96
- display: flex;
97
- align-items: flex-start;
86
+ `), (0, cssr_1.cM)('full', {
87
+ width: '100%'
88
+ })]), (0, cssr_1.cE)('text', `
89
+ display: grid;
90
+ gap: 16px;
91
+ grid-template-columns: 1fr 1fr;
92
+ height: 100%
98
93
  `), (0, cssr_1.cE)('title', `
99
- padding-top: 4px;
100
94
  flex-grow: 1;
101
- margin-bottom: 4px;
102
- font-size: var(--u-title-size);
103
- font-weight: 500;
104
- line-height: var(--u-title-line-height);
105
- `, [(0, cssr_1.c)('&:last-child', `
106
- margin-bottom: 0;
107
- `)]), (0, cssr_1.cE)('subtitle', `
108
- padding-bottom: 4px;
95
+ `), (0, cssr_1.cE)('subtitle', `
109
96
  flex-grow: 1;
110
- font-size: var(--u-subtitle-size);
111
- font-weight: 500;
112
- line-height: var(--u-subtitle-line-height);
113
97
  color: var(--u-subtitle-color);
114
98
  `), (0, cssr_1.cE)('subtitle,title', [(0, cssr_1.c)('&:last-child:first-child', `
115
- padding: 12px 0;
116
- `)]), (0, cssr_1.cE)('avatar', `
117
- display: flex;
118
- margin-right: var(--u-avatar-space);
119
- `), (0, cssr_1.c)('&:last-child', [(0, cssr_1.cE)('divider', `
99
+ `)]), (0, cssr_1.c)('&:last-child', [(0, cssr_1.cE)('divider', `
120
100
  display: none;
121
101
  `)]), (0, cssr_1.cM)('default', `
122
- min-height: var(--u-min-height);
123
102
  padding: var(--u-padding);
124
103
  `, [(0, cssr_1.cE)('main', `
125
- display: flex;
104
+ display: none;
126
105
  align-items: center;
127
- `)]), (0, cssr_1.cM)('description-first', [(0, cssr_1.cE)('title', `
128
- padding-top: 0;
129
- padding-bottom: 4px;
130
- order: 1;
131
- margin-top: 4px;
132
- margin-bottom: 0px;
133
- `, [(0, cssr_1.c)('&:last-child', `
134
- margin-top: 0;
135
- `)]), (0, cssr_1.cE)('subtitle', `
136
- padding-bottom: 0;
137
- padding-top: 4px;
138
- `)]), (0, cssr_1.cM)('columns-even', [(0, cssr_1.cE)('content', [(0, cssr_1.cM)('right', `
139
- flex-grow: 1;
140
- text-align: left;
141
- align-items: stretch;
142
- `)])]), (0, cssr_1.cM)('bordered', `
143
- padding: var(--u-padding);
144
- `), (0, cssr_1.cNotM)('loading', [(0, cssr_1.cNotM)('disabled', [(0, cssr_1.cNotM)('loading-skeleton', [(0, cssr_1.cM)('hoverable', `
106
+ `)]), (0, cssr_1.cNotM)('loading', [(0, cssr_1.cNotM)('disabled', [(0, cssr_1.cNotM)('loading-skeleton', [(0, cssr_1.cM)('hoverable', `
145
107
  cursor: pointer;
146
108
  user-select: none;
147
- padding: var(--u-padding);
148
109
  `, [(0, cssr_1.c)('&:hover', `
149
110
  background: var(--u-merged-color-hover);
150
111
  `), (0, cssr_1.c)('&:focus,&:active', `
@@ -157,26 +118,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('list', `
157
118
  border-radius: var(--u-border-radius);
158
119
  `), (0, cssr_1.cM)('disabled', [(0, cssr_1.cE)('text, subtitle', `
159
120
  color: var(--u-text-color-disabled);
160
- `)]), (0, cssr_1.cM)('loading-skeleton', [(0, cssr_1.cE)('content', `
161
- padding: 5px 0;
162
- `), (0, cssr_1.cE)('content--left', `
163
- flex-grow: 0;
164
- width: calc(66.38% - 8px);
165
- `), (0, cssr_1.cE)('content--right', `
166
- flex-grow: 0;
167
- width: calc(33.62% - 8px);
168
- `), (0, cssr_1.cE)('title,subtitle', [(0, cssr_1.c)('&:first-child:last-child', `
169
- padding: 0;
170
- `)]), (0, cssr_1.cE)('title', `
171
- margin-bottom: 8px;
172
- `, [(0, cssr_1.c)('&:last-child', `
173
- margin-bottom: 0;
174
- `)]), (0, cssr_1.cM)('description-first', [(0, cssr_1.cE)('title', `
175
- margin-bottom: 0;
176
- margin-top: 8px;
177
- `, [(0, cssr_1.c)('&:last-child', `
178
- margin-top: 0;
179
- `)])])])]), (0, cssr_1.insideModal)((0, cssr_1.cB)('list', `
121
+ `)])]), (0, cssr_1.insideModal)((0, cssr_1.cB)('list', `
180
122
  --u-merged-color-hover: var(--u-color-hover-modal);
181
123
  --u-merged-color: var(--u-color-modal);
182
124
  --u-merged-border-color: var(--u-border-color-modal);
@@ -1,18 +1,12 @@
1
1
  import type { ThemeCommonVars } from '../../_styles/common';
2
2
  import { type Theme } from '../../_mixins';
3
3
  export declare const self: (vars: ThemeCommonVars) => {
4
- padding: string;
5
4
  iconSize: string;
6
5
  iconSpace: string;
7
6
  suffixSpace: string;
8
7
  prefixSpace: string;
9
- titleSize: string;
10
- titleLineHeight: string;
11
- subtitleSize: string;
12
- subtitleLineHeight: string;
13
8
  subtitleColor: string;
14
9
  avatarSpace: string;
15
- minHeight: string;
16
10
  colorFocus: string;
17
11
  pressedScale: string;
18
12
  textColorDisabled: string;
@@ -26,8 +20,11 @@ export declare const self: (vars: ThemeCommonVars) => {
26
20
  borderColor: string;
27
21
  borderColorModal: string;
28
22
  borderColorPopover: string;
29
- borderRadius: string;
30
- fontSize: string;
23
+ borderRadiusLarge: string;
24
+ borderRadiusMedium: string;
25
+ borderRadiusSmall: string;
26
+ padding: string;
27
+ suffixSize: string;
31
28
  };
32
29
  export type ListThemeVars = ReturnType<typeof self>;
33
30
  declare const listLight: Theme<'List', ListThemeVars>;
@@ -3,20 +3,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.self = void 0;
4
4
  const common_1 = require("../../_styles/common");
5
5
  const self = (vars) => {
6
- const { borderRadius, iconMedium, fontBodyLarge, lineHeightBodyLarge, lineHeightBodyMedium, textSecondary, iconSmall, elementsQuaternary, textTertiary, textPrimary, fontBodyMedium, containerPrimary, elementsTertiary } = vars;
6
+ const { borderRadius, borderRadiusMedium, borderRadiusSmall, iconMedium, textSecondary, iconSmall, elementsQuaternary, textTertiary, textPrimary, containerPrimary, elementsTertiary } = vars;
7
7
  return {
8
- padding: '8px 24px',
9
8
  iconSize: iconMedium,
10
9
  iconSpace: '16px',
11
10
  suffixSpace: '20px',
12
11
  prefixSpace: '20px',
13
- titleSize: fontBodyLarge,
14
- titleLineHeight: lineHeightBodyLarge,
15
- subtitleSize: fontBodyMedium,
16
- subtitleLineHeight: lineHeightBodyMedium,
17
12
  subtitleColor: textSecondary,
18
13
  avatarSpace: iconSmall,
19
- minHeight: '64px',
20
14
  colorFocus: elementsQuaternary,
21
15
  pressedScale: '0.98',
22
16
  textColorDisabled: textTertiary,
@@ -30,8 +24,11 @@ const self = (vars) => {
30
24
  borderColor: elementsQuaternary,
31
25
  borderColorModal: elementsQuaternary,
32
26
  borderColorPopover: elementsQuaternary,
33
- borderRadius,
34
- fontSize: fontBodyMedium
27
+ borderRadiusLarge: borderRadius,
28
+ borderRadiusMedium,
29
+ borderRadiusSmall,
30
+ padding: '12px 24px',
31
+ suffixSize: '24px'
35
32
  };
36
33
  };
37
34
  exports.self = self;
@@ -97,6 +97,7 @@ exports.default = (0, cssr_1.cB)('tag', `
97
97
  cursor: pointer;
98
98
  box-shadow: none;
99
99
  color: var(--u-text-color-checkable);
100
+ padding: 0px 8px;
100
101
  background-color: var(--u-color-checkable);
101
102
  transition: border-color .3s var(--u-bezier);
102
103
  `, [(0, cssr_1.cNotM)('disabled', [(0, cssr_1.c)('&:hover', 'background-color: var(--u-color-hover-checkable);', [(0, cssr_1.cNotM)('checked', 'color: var(--u-text-color-hover-checkable);')]), (0, cssr_1.c)('&:focus', `
@@ -106,4 +107,7 @@ exports.default = (0, cssr_1.cB)('tag', `
106
107
  transition: border-color .3s var(--u-bezier);`, [(0, cssr_1.cNotM)('checked', 'color: var(--u-text-color-pressed-checkable);')])]), (0, cssr_1.cM)('checked', `
107
108
  color: var(--u-text-color-checked);
108
109
  background-color: var(--u-color-checked);
109
- `, [(0, cssr_1.cNotM)('disabled', [(0, cssr_1.c)('&:hover', 'background-color: var(--u-color-checked-hover);'), (0, cssr_1.c)('&:focus', 'background-color: var(--u-color-checked-hover);'), (0, cssr_1.c)('&:active', 'background-color: var(--u-color-checked-pressed);')])])])]);
110
+ `, [(0, cssr_1.cE)('border', `
111
+ border-color: var(--u-color-checked);
112
+ transition: none;
113
+ `), (0, cssr_1.cNotM)('disabled', [(0, cssr_1.c)('&:hover', 'background-color: var(--u-color-checked-hover);'), (0, cssr_1.c)('&:focus', 'background-color: var(--u-color-checked-hover);'), (0, cssr_1.c)('&:active', 'background-color: var(--u-color-checked-pressed);')])])])]);
@@ -4,7 +4,7 @@ exports.self = void 0;
4
4
  const seemly_1 = require("seemly");
5
5
  const common_1 = require("../../_styles/common");
6
6
  const self = (vars) => {
7
- const { opacityDisabled, borderRadiusSmall: borderRadius, fontWeightStrong, fontWeight, elementsTertiary, fontBodySmall, fontBodyMedium, textQuaternary, elementsPrimary, elementsSenary, elementsQuinary, textPrimary, elementsQuaternary, transparencySecondary, staticDarkGrey, staticWhite, elementsDarkQuinary, brandPrimary600, brandPrimary500, brandQuaternary600, brandQuaternary500, staticGreen, staticOrange, staticRed, staticBlack } = vars;
7
+ const { opacityDisabled, borderRadiusSmall: borderRadius, fontWeightStrong, fontWeight, elementsTertiary, fontBodySmall, fontBodyMedium, textQuaternary, elementsPrimary, elementsSecondary, elementsSenary, elementsQuinary, textPrimary, elementsQuaternary, transparencySecondary, staticDarkGrey, staticWhite, elementsDarkQuinary, brandPrimary600, brandPrimary500, brandQuaternary600, brandQuaternary500, staticGreen, staticOrange, staticRed, staticBlack } = vars;
8
8
  const borderTagWidth = 2;
9
9
  return {
10
10
  closeIconSizeTiny: '16px',
@@ -39,7 +39,7 @@ const self = (vars) => {
39
39
  textColorHoverCheckable: textPrimary,
40
40
  textColorPressedCheckable: textPrimary,
41
41
  textColorChecked: textQuaternary,
42
- colorCheckable: elementsTertiary,
42
+ colorCheckable: elementsSecondary,
43
43
  colorHoverCheckable: elementsQuaternary,
44
44
  colorPressedCheckable: elementsQuaternary,
45
45
  colorChecked: elementsPrimary,
@@ -222,8 +222,8 @@ exports.default = (0, vue_1.defineComponent)({
222
222
  !this.vertical &&
223
223
  !imageCardTypes.includes(listType) &&
224
224
  `${clsPrefix}-upload-file-loader--default`
225
- ] },
226
- (0, vue_1.h)("div", { class: [
225
+ ] }, {
226
+ default: () => ((0, vue_1.h)("div", { class: [
227
227
  `${clsPrefix}-upload-file`,
228
228
  `${clsPrefix}-upload-file--${this.progressStatus}-status`,
229
229
  file.url &&
@@ -249,6 +249,7 @@ exports.default = (0, vue_1.defineComponent)({
249
249
  ? this.$slots['upload-file-subtitle']({ file })
250
250
  : ''))),
251
251
  actionsNode),
252
- this.showProgress && ((0, vue_1.h)("div", { class: `${clsPrefix}-upload-file-overlay` })))));
252
+ this.showProgress && ((0, vue_1.h)("div", { class: `${clsPrefix}-upload-file-overlay` }))))
253
+ }));
253
254
  }
254
255
  });
package/lib/version.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- declare const _default: "1.5.1";
1
+ declare const _default: "1.5.2";
2
2
  export default _default;
package/lib/version.js CHANGED
@@ -1,3 +1,3 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.default = '1.5.1';
3
+ exports.default = '1.5.2';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uzum-tech/ui",
3
- "version": "1.5.1",
3
+ "version": "1.5.2",
4
4
  "description": "A Vue 3 Component Library. Fairly Complete, Theme Customizable, Uses TypeScript, Fast",
5
5
  "main": "lib/index.js",
6
6
  "module": "es/index.js",