@itcase/ui 1.3.37 → 1.4.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.
@@ -145,12 +145,12 @@ function Tab(props) {
145
145
  }
146
146
 
147
147
  function TabGroup(props) {
148
- var id = props.id, children = props.children, className = props.className, dataTour = props.dataTour, horizontalScroll = props.horizontalScroll, set = props.set, style = props.style;
148
+ var id = props.id, className = props.className, children = props.children, dataTour = props.dataTour, horizontalScroll = props.horizontalScroll, style = props.style, set = props.set;
149
149
  var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
150
- var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, contentAlignClass = propsGenerator.contentAlignClass, directionClass = propsGenerator.directionClass, fillClass = propsGenerator.fillClass, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
150
+ var directionClass = propsGenerator.directionClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, contentAlignClass = propsGenerator.contentAlignClass, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
151
151
  // @ts-expect-error
152
152
  var _a = useStyles.useStyles(props), groupStyles = _a.styles, groupWrapperStyles = _a.wrapper;
153
- return (jsxRuntime.jsx("div", { className: clsx(className, 'tab-group', 'group', widthClass && "width_".concat(widthClass), contentAlignClass && "group_content-align_".concat(contentAlignClass), alignDirectionClass && "align_".concat(alignDirectionClass), directionClass && "group_direction_".concat(directionClass), alignClass && "align_".concat(alignClass), fillClass && "fill_".concat(fillClass), set && "group_set_".concat(set), horizontalScroll && 'group_type_horizontal_scroll', wrapClass && "group_wrap_".concat(wrapClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass)), "data-tour": dataTour, id: id, style: Object.assign({}, groupStyles, style), children: horizontalScroll ? (jsxRuntime.jsx("div", { className: "tab-group__wrapper group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
153
+ return (jsxRuntime.jsx("div", { id: id, className: clsx(className, 'tab-group', 'group', widthClass && "width_".concat(widthClass), contentAlignClass && "group_content-align_".concat(contentAlignClass), alignDirectionClass && "align_".concat(alignDirectionClass), directionClass && "group_direction_".concat(directionClass), alignClass && "align_".concat(alignClass), fillClass && "fill_".concat(fillClass), set && "group_set_".concat(set), horizontalScroll && 'group_type_horizontal_scroll', wrapClass && "group_wrap_".concat(wrapClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass)), "data-tour": dataTour, style: Object.assign({}, groupStyles, style), children: horizontalScroll ? (jsxRuntime.jsx("div", { className: "tab-group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
154
154
  }
155
155
 
156
156
  exports.Tab = Tab;
@@ -143,12 +143,12 @@ function Tab(props) {
143
143
  }
144
144
 
145
145
  function TabGroup(props) {
146
- var id = props.id, children = props.children, className = props.className, dataTour = props.dataTour, horizontalScroll = props.horizontalScroll, set = props.set, style = props.style;
146
+ var id = props.id, className = props.className, children = props.children, dataTour = props.dataTour, horizontalScroll = props.horizontalScroll, style = props.style, set = props.set;
147
147
  var propsGenerator = useDevicePropsGenerator(props);
148
- var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, contentAlignClass = propsGenerator.contentAlignClass, directionClass = propsGenerator.directionClass, fillClass = propsGenerator.fillClass, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
148
+ var directionClass = propsGenerator.directionClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, contentAlignClass = propsGenerator.contentAlignClass, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
149
149
  // @ts-expect-error
150
150
  var _a = useStyles(props), groupStyles = _a.styles, groupWrapperStyles = _a.wrapper;
151
- return (jsx("div", { className: clsx(className, 'tab-group', 'group', widthClass && "width_".concat(widthClass), contentAlignClass && "group_content-align_".concat(contentAlignClass), alignDirectionClass && "align_".concat(alignDirectionClass), directionClass && "group_direction_".concat(directionClass), alignClass && "align_".concat(alignClass), fillClass && "fill_".concat(fillClass), set && "group_set_".concat(set), horizontalScroll && 'group_type_horizontal_scroll', wrapClass && "group_wrap_".concat(wrapClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass)), "data-tour": dataTour, id: id, style: Object.assign({}, groupStyles, style), children: horizontalScroll ? (jsx("div", { className: "tab-group__wrapper group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
151
+ return (jsx("div", { id: id, className: clsx(className, 'tab-group', 'group', widthClass && "width_".concat(widthClass), contentAlignClass && "group_content-align_".concat(contentAlignClass), alignDirectionClass && "align_".concat(alignDirectionClass), directionClass && "group_direction_".concat(directionClass), alignClass && "align_".concat(alignClass), fillClass && "fill_".concat(fillClass), set && "group_set_".concat(set), horizontalScroll && 'group_type_horizontal_scroll', wrapClass && "group_wrap_".concat(wrapClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass)), "data-tour": dataTour, style: Object.assign({}, groupStyles, style), children: horizontalScroll ? (jsx("div", { className: "tab-group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
152
152
  }
153
153
 
154
154
  export { Tab, TabGroup, tabAppearance, tabConfig };
@@ -32,20 +32,20 @@
32
32
 
33
33
  .select {
34
34
  &&_size {
35
- @each $size in xs, s, m, l, xl, xxl, tiny, compact, normal, large {
35
+ @each $size in xxl, xl, l, m, s, xs, xxs {
36
36
  &_$(size) {
37
37
  ^^&__control {
38
- padding: var(--select-size-$(size)-padding);
38
+ padding: var(--select-$(size)-padding);
39
39
  }
40
40
  ^^&__option {
41
- padding: var(--select-size-$(size)-padding);
41
+ padding: var(--select-$(size)-padding);
42
42
  }
43
43
  ^^&__menu {
44
44
  &-notice {
45
- padding: var(--select-size-$(size)-padding);
45
+ padding: var(--select-$(size)-padding);
46
46
  }
47
47
  &-group-heading {
48
- padding: var(--select-size-$(size)-padding);
48
+ padding: var(--select-$(size)-padding);
49
49
  }
50
50
  }
51
51
  }
@@ -111,9 +111,11 @@
111
111
  .select {
112
112
  &__control {
113
113
  &_fill {
114
- @each $type in accent, primary, secondary, tertiary, surface, success, error {
114
+ @each $type in accent, primary, secondary, tertiary, surface, success,
115
+ error {
115
116
  &_$(type) {
116
- @each $color in primary, secondary, tertiary, quaternary, quinary, senary, accent, disabled, hover {
117
+ @each $color in primary, secondary, tertiary, quaternary, quinary,
118
+ senary, accent, disabled, hover {
117
119
  &-$(color) {
118
120
  background: var(--color-$(type)-$(color));
119
121
  }
@@ -206,7 +208,7 @@
206
208
  &_size {
207
209
  @each $size in xs, s, m, l, xl, xxl {
208
210
  &_$(size) {
209
- padding: var(--select-menu-list-item-size-$(size)-padding, 5px 10px);
211
+ padding: var(--select-menu-list-item-$(size)-padding, 5px 10px);
210
212
  }
211
213
  }
212
214
  }
@@ -373,12 +375,12 @@
373
375
  }
374
376
 
375
377
  :root {
376
- --select-size-xxl-padding: 15px 25px;
377
- --select-size-xl-padding: 9px 20px;
378
- --select-size-xs-padding: 0px 8px;
379
- --select-size-m-padding: 5px 12px;
380
- --select-size-s-padding: 0 4px;
381
- --select-size-l-padding: 7px 15px;
378
+ --select-xxl-padding: 15px 25px;
379
+ --select-xl-padding: 9px 20px;
380
+ --select-xs-padding: 0px 8px;
381
+ --select-m-padding: 5px 12px;
382
+ --select-s-padding: 1px 4px;
383
+ --select-l-padding: 7px 15px;
382
384
 
383
385
  --select-menu-border-radius: 12px;
384
386
  --select-menu-margin: 0;
@@ -389,10 +391,10 @@
389
391
 
390
392
  --select-success-border: var(--color-surface-border-tertiary);
391
393
 
392
- --select-menu-list-item-size-xxl-padding: 18px 25px;
393
- --select-menu-list-item-size-xl-padding: 14px 20px;
394
- --select-menu-list-item-size-l-padding: 10px 12px;
395
- --select-menu-list-item-size-m-padding: 8px 12px;
396
- --select-menu-list-item-size-s-padding: 6px 10px;
397
- --select-menu-list-item-size-xs-padding: 2px 8px;
394
+ --select-menu-list-item-xxl-padding: 18px 25px;
395
+ --select-menu-list-item-xl-padding: 14px 20px;
396
+ --select-menu-list-item-l-padding: 10px 12px;
397
+ --select-menu-list-item-m-padding: 8px 12px;
398
+ --select-menu-list-item-s-padding: 6px 10px;
399
+ --select-menu-list-item-xs-padding: 2px 8px;
398
400
  }
@@ -1,10 +1,10 @@
1
1
  :root {
2
- --select-size-xxl-padding: 15px 25px;
3
- --select-size-xl-padding: 9px 20px;
4
- --select-size-xs-padding: 0px 8px;
5
- --select-size-m-padding: 5px 12px;
6
- --select-size-s-padding: 0 4px;
7
- --select-size-l-padding: 7px 15px;
2
+ --select-xxl-padding: 15px 25px;
3
+ --select-xl-padding: 9px 20px;
4
+ --select-xs-padding: 0px 8px;
5
+ --select-m-padding: 5px 12px;
6
+ --select-s-padding: 1px 4px;
7
+ --select-l-padding: 7px 15px;
8
8
 
9
9
  --select-menu-border-radius: 12px;
10
10
  --select-menu-margin: 0;
@@ -15,10 +15,10 @@
15
15
 
16
16
  --select-success-border: var(--color-surface-border-tertiary);
17
17
 
18
- --select-menu-list-item-size-xxl-padding: 18px 25px;
19
- --select-menu-list-item-size-xl-padding: 14px 20px;
20
- --select-menu-list-item-size-l-padding: 10px 12px;
21
- --select-menu-list-item-size-m-padding: 8px 12px;
22
- --select-menu-list-item-size-s-padding: 6px 10px;
23
- --select-menu-list-item-size-xs-padding: 2px 8px;
18
+ --select-menu-list-item-xxl-padding: 18px 25px;
19
+ --select-menu-list-item-xl-padding: 14px 20px;
20
+ --select-menu-list-item-l-padding: 10px 12px;
21
+ --select-menu-list-item-m-padding: 8px 12px;
22
+ --select-menu-list-item-s-padding: 6px 10px;
23
+ --select-menu-list-item-xs-padding: 2px 8px;
24
24
  }
@@ -1,9 +1,11 @@
1
1
  .select {
2
2
  &__control {
3
3
  &_fill {
4
- @each $type in accent, primary, secondary, tertiary, surface, success, error {
4
+ @each $type in accent, primary, secondary, tertiary, surface, success,
5
+ error {
5
6
  &_$(type) {
6
- @each $color in primary, secondary, tertiary, quaternary, quinary, senary, accent, disabled, hover {
7
+ @each $color in primary, secondary, tertiary, quaternary, quinary,
8
+ senary, accent, disabled, hover {
7
9
  &-$(color) {
8
10
  background: var(--color-$(type)-$(color));
9
11
  }
@@ -5,7 +5,7 @@
5
5
  &_size {
6
6
  @each $size in xs, s, m, l, xl, xxl {
7
7
  &_$(size) {
8
- padding: var(--select-menu-list-item-size-$(size)-padding, 5px 10px);
8
+ padding: var(--select-menu-list-item-$(size)-padding, 5px 10px);
9
9
  }
10
10
  }
11
11
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itcase/ui",
3
- "version": "1.3.37",
3
+ "version": "1.4.0",
4
4
  "description": "UI components (Modal, Loader, Popup, etc)",
5
5
  "keywords": [
6
6
  "Modal",
@@ -125,7 +125,7 @@
125
125
  "@babel/preset-react": "^7.26.3",
126
126
  "@commitlint/cli": "^19.8.0",
127
127
  "@commitlint/config-conventional": "^19.8.0",
128
- "@itcase/lint": "^1.0.48",
128
+ "@itcase/lint": "^1.0.49",
129
129
  "@rollup/plugin-babel": "^6.0.4",
130
130
  "@rollup/plugin-commonjs": "^28.0.3",
131
131
  "@rollup/plugin-image": "^3.0.3",