@cfx-dev/ui-components 1.0.2 → 1.1.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.
- package/README.md +38 -38
- package/dist/Button.module-Cv-7p0xt.js +16 -0
- package/dist/assets/Button.css +1 -1
- package/dist/assets/Flex.css +1 -1
- package/dist/assets/Flyout.css +1 -1
- package/dist/assets/Input.css +1 -1
- package/dist/assets/Island.css +1 -1
- package/dist/assets/Pad.css +1 -1
- package/dist/assets/Popover.css +1 -1
- package/dist/assets/RichInput.css +1 -1
- package/dist/assets/Spacer.css +1 -1
- package/dist/assets/Textarea.css +1 -1
- package/dist/assets/global.css +1 -1
- package/dist/components/Button/Button.d.ts +1 -1
- package/dist/components/Button/Button.js +1 -1
- package/dist/components/Button/ButtonBar.js +1 -1
- package/dist/components/Flyout/Flyout.js +39 -39
- package/dist/components/Input/Input.d.ts +0 -1
- package/dist/components/Input/Input.js +58 -61
- package/dist/components/Input/RichInput.js +27 -27
- package/dist/components/InputDropzone/InputDropzone.js +122 -119
- package/dist/components/InputDropzone/ItemPreview.js +1 -1
- package/dist/components/Island/Island.js +23 -23
- package/dist/components/Layout/Flex/Flex.d.ts +1 -1
- package/dist/components/Layout/Flex/Flex.js +44 -43
- package/dist/components/Layout/Pad/Pad.d.ts +1 -1
- package/dist/components/Layout/Pad/Pad.js +30 -29
- package/dist/components/Modal/Modal.d.ts +2 -0
- package/dist/components/Modal/Modal.js +25 -23
- package/dist/components/Overlay/Overlay.js +13 -13
- package/dist/components/Popover/Popover.js +18 -18
- package/dist/components/Select/Select.d.ts +1 -1
- package/dist/components/Select/Select.js +239 -229
- package/dist/components/Spacer/Spacer.d.ts +1 -1
- package/dist/components/Spacer/Spacer.js +13 -12
- package/dist/components/Table/Table.js +41 -35
- package/dist/components/Text/Text.types.d.ts +1 -1
- package/dist/components/Textarea/Textarea.d.ts +0 -1
- package/dist/components/Textarea/Textarea.js +37 -40
- package/dist/iconBase-Bipuk9tK.js +112 -0
- package/dist/main.d.ts +1 -1
- package/dist/main.js +112 -113
- package/dist/style-guide/Icons/IconDisplayGrid.js +3 -3
- package/dist/style-guide/Icons/Icons.d.ts +13 -13
- package/dist/style-guide/Icons/Icons.js +36 -8
- package/dist/styles-scss/_ui.scss +167 -195
- package/dist/styles-scss/assets/images/checkered_dark.svg +7 -7
- package/dist/styles-scss/assets/images/checkered_light.svg +7 -7
- package/dist/styles-scss/global.scss +73 -75
- package/dist/styles-scss/theme_dark.scss +24 -24
- package/dist/styles-scss/theme_light.scss +54 -54
- package/dist/styles-scss/themes.scss +2 -2
- package/dist/styles-scss/tokens.scss +272 -274
- package/dist/utils/string.d.ts +16 -1
- package/dist/utils/string.js +46 -39
- package/package.json +71 -72
- package/dist/Button.module-Z6njvP9Z.js +0 -17
- package/dist/Icons-NE1cibCU.js +0 -107
- package/dist/index.esm-BkynlSN6.js +0 -72
package/README.md
CHANGED
|
@@ -1,39 +1,39 @@
|
|
|
1
|
-
# UI Component Library
|
|
2
|
-
Include design system, utils and reusable components.
|
|
3
|
-
|
|
4
|
-
## Instalation
|
|
5
|
-
```console
|
|
6
|
-
yarn add @cfx-dev/ui-components
|
|
7
|
-
```
|
|
8
|
-
or
|
|
9
|
-
```console
|
|
10
|
-
npm install @cfx-dev/ui-components
|
|
11
|
-
```
|
|
12
|
-
|
|
13
|
-
## Usage
|
|
14
|
-
In your bundler config add this sass option to use ui utils in styles:
|
|
15
|
-
```javascript
|
|
16
|
-
additionalData: `@use "~@cfx-dev/ui-components/dist/styles-scss/ui" as ui;`,
|
|
17
|
-
```
|
|
18
|
-
```javascript
|
|
19
|
-
import '@cfx-dev/ui-components/dist/styles-scss/global.scss';
|
|
20
|
-
```
|
|
21
|
-
Import default themes or take a look inside how to make your own:
|
|
22
|
-
```javascript
|
|
23
|
-
import '@cfx-dev/ui-components/dist/styles-scss/themes.scss';
|
|
24
|
-
```
|
|
25
|
-
Add theme class name to body or root element
|
|
26
|
-
```javascript
|
|
27
|
-
<body className="cfxui-theme-dark">
|
|
28
|
-
```
|
|
29
|
-
For some components you will need to define this variables in your root stiles:
|
|
30
|
-
```css
|
|
31
|
-
html {
|
|
32
|
-
--width: 100vw;
|
|
33
|
-
--height: 100vh;
|
|
34
|
-
--quant: calc(1rem * 0.25);
|
|
35
|
-
}
|
|
36
|
-
```
|
|
37
|
-
|
|
38
|
-
## License
|
|
1
|
+
# UI Component Library
|
|
2
|
+
Include design system, utils and reusable components.
|
|
3
|
+
|
|
4
|
+
## Instalation
|
|
5
|
+
```console
|
|
6
|
+
yarn add @cfx-dev/ui-components
|
|
7
|
+
```
|
|
8
|
+
or
|
|
9
|
+
```console
|
|
10
|
+
npm install @cfx-dev/ui-components
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
## Usage
|
|
14
|
+
In your bundler config add this sass option to use ui utils in styles:
|
|
15
|
+
```javascript
|
|
16
|
+
additionalData: `@use "~@cfx-dev/ui-components/dist/styles-scss/ui" as ui;`,
|
|
17
|
+
```
|
|
18
|
+
```javascript
|
|
19
|
+
import '@cfx-dev/ui-components/dist/styles-scss/global.scss';
|
|
20
|
+
```
|
|
21
|
+
Import default themes or take a look inside how to make your own:
|
|
22
|
+
```javascript
|
|
23
|
+
import '@cfx-dev/ui-components/dist/styles-scss/themes.scss';
|
|
24
|
+
```
|
|
25
|
+
Add theme class name to body or root element
|
|
26
|
+
```javascript
|
|
27
|
+
<body className="cfxui-theme-dark">
|
|
28
|
+
```
|
|
29
|
+
For some components you will need to define this variables in your root stiles:
|
|
30
|
+
```css
|
|
31
|
+
html {
|
|
32
|
+
--width: 100vw;
|
|
33
|
+
--height: 100vh;
|
|
34
|
+
--quant: calc(1rem * 0.25);
|
|
35
|
+
}
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
## License
|
|
39
39
|
This project is licensed under the MIT License.
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import './assets/Button.css';const o = "_bar_1p5no_1", n = "_root_1p5no_6", r = "_fullWidth_1p5no_72", _ = "_primary_1p5no_75", t = "_transparent_1p5no_90", a = "_small_1p5no_95", s = "_large_1p5no_100", c = "_icon_1p5no_105", p = "_decorator_1p5no_117", l = {
|
|
2
|
+
bar: o,
|
|
3
|
+
root: n,
|
|
4
|
+
fullWidth: r,
|
|
5
|
+
primary: _,
|
|
6
|
+
transparent: t,
|
|
7
|
+
small: a,
|
|
8
|
+
large: s,
|
|
9
|
+
icon: c,
|
|
10
|
+
"straight-borders": "_straight-borders_1p5no_109",
|
|
11
|
+
"icon-node": "_icon-node_1p5no_112",
|
|
12
|
+
decorator: p
|
|
13
|
+
};
|
|
14
|
+
export {
|
|
15
|
+
l as s
|
|
16
|
+
};
|
package/dist/assets/Button.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._bar_1p5no_1{display:flex;align-items:center;gap:2px}._bar_1p5no_1 ._root_1p5no_6{border-radius:0}._bar_1p5no_1>*:first-child ._root_1p5no_6,._bar_1p5no_1>._root_1p5no_6:first-child{border-top-left-radius:var(--border-radius-small);border-bottom-left-radius:var(--border-radius-small)}._bar_1p5no_1>*:last-child ._root_1p5no_6,._bar_1p5no_1>._root_1p5no_6:last-child{border-top-right-radius:var(--border-radius-small);border-bottom-right-radius:var(--border-radius-small)}._bar_1p5no_1 ._root_1p5no_6 ._root_1p5no_6{border-radius:var(--border-radius-small)}._root_1p5no_6{flex-shrink:0;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--offset-small);--height: var(--control-height-normal);height:var(--height);padding:0 var(--offset-normal);border:none;outline:none;-webkit-user-select:none;user-select:none;font-family:var(--font-family-primary);font-size:var(--font-size-normal);font-weight:var(--font-weight-normal);line-height:1.1;letter-spacing:1px;text-decoration:none;text-transform:uppercase;cursor:pointer;border:solid 2px;border-radius:var(--border-radius-small);color:var(--color-button-text);border-color:var(--color-button-border);background-color:var(--color-button-background)}._root_1p5no_6{transition:background-color .2s ease}._root_1p5no_6:hover{transition:none}._root_1p5no_6:disabled{cursor:not-allowed;opacity:.5}._root_1p5no_6:not(:disabled):hover{border-color:var(--color-button-hover-border);background-color:var(--color-button-hover-background)}._root_1p5no_6:not(:disabled):active{border-color:var(--color-button-active-border);background-color:var(--color-button-active-background);transform:translateY(1px)}._root_1p5no_6:not(:disabled):focus-visible:not(:active):not(:hover){box-shadow:0 0 0 2px var(--color-button-focus-outline)}._root_1p5no_6._fullWidth_1p5no_72{width:100%}._root_1p5no_6._primary_1p5no_75{color:var(--color-button-primary-text);border-color:var(--color-button-primary-border);background-color:var(--color-button-primary-background)}._root_1p5no_6._primary_1p5no_75:not(:disabled):hover{color:var(--color-button-primary-hover-text);border-color:var(--color-button-primary-hover-border);background-color:var(--color-button-primary-hover-background)}._root_1p5no_6._primary_1p5no_75:not(:disabled):active{color:var(--color-button-primary-active-text);border-color:var(--color-button-primary-active-border);background-color:var(--color-button-primary-active-background)}._root_1p5no_6._transparent_1p5no_90{border-color:transparent;background-color:transparent;text-transform:initial}._root_1p5no_6._small_1p5no_95{--height: var(--control-height-small);padding:0 var(--offset-small);font-size:var(--font-size-small)}._root_1p5no_6._large_1p5no_100{--height: var(--control-height-large);padding:0 var(--offset-large);font-size:var(--font-size-normal)}._root_1p5no_6._icon_1p5no_105{padding:0;width:var(--height)}._root_1p5no_6._straight-borders_1p5no_109{border-radius:0}._root_1p5no_6 ._icon-node_1p5no_112{display:flex;align-items:center;height:100%}._root_1p5no_6 ._decorator_1p5no_117{position:absolute;top:2px;left:2px;display:flex;align-items:center;justify-content:center;width:0;height:0}
|
package/dist/assets/Flex.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_pd612_1{display:flex;flex-direction:row}._root_pd612_1._full-width_pd612_5{width:100%}._root_pd612_1._full-height_pd612_8{height:100%}._root_pd612_1._centered_pd612_11{align-items:center;justify-content:center}._root_pd612_1._centered-axis_pd612_15{align-items:center}._root_pd612_1._centered-cross-axis_pd612_18{justify-content:center}._root_pd612_1._baseline-axis_pd612_21{align-items:baseline}._root_pd612_1._baseline-cross-axis_pd612_24{justify-content:baseline}._root_pd612_1._reverse-order_pd612_27{flex-direction:row-reverse}._root_pd612_1._vertical_pd612_30{flex-direction:column}._root_pd612_1._vertical_pd612_30._reverse-order_pd612_27{flex-direction:column-reverse}._root_pd612_1._repell_pd612_36{justify-content:space-between}._root_pd612_1._wrap_pd612_39{flex-wrap:wrap}._root_pd612_1._align-to-end_pd612_42{justify-content:flex-end}._root_pd612_1._align-to-end-axis_pd612_45{align-items:flex-end}._root_pd612_1._space-between_pd612_48{justify-content:space-between}._root_pd612_1._stretch_pd612_51{justify-content:stretch}._root_pd612_1._stretch_pd612_51>*{flex-grow:1}._root_pd612_1._stretch_pd612_51._horizontal_pd612_57>*{width:1px}._root_pd612_1._stretch_pd612_51._vertical_pd612_30>*{height:1px}._root_pd612_1._gap-none_pd612_63{gap:0}._root_pd612_1._gap-thin_pd612_66{gap:2px}._root_pd612_1._gap-xsmall_pd612_69{gap:var(--offset-xsmall)}._root_pd612_1._gap-small_pd612_72{gap:var(--offset-small)}._root_pd612_1._gap-normal_pd612_75{gap:var(--offset-normal)}._root_pd612_1._gap-medium_pd612_78{gap:var(--offset-medium)}._root_pd612_1._gap-large_pd612_81{gap:var(--offset-large)}._root_pd612_1._gap-xlarge_pd612_84{gap:var(--offset-xlarge)}
|
package/dist/assets/Flyout.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_xny34_1{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}._root_xny34_1._size-normal_xny34_6 ._holder_xny34_6{left:32vw}._root_xny34_1._size-small_xny34_9 ._holder_xny34_6{left:48vw}._root_xny34_1._size-xsmall_xny34_12 ._holder_xny34_6{left:64vw}._root_xny34_1._active_xny34_15 ._backdrop_xny34_15{opacity:1;pointer-events:all;animation:_backdrop-appearance_xny34_1 .2s ease}@keyframes _backdrop-appearance_xny34_1{0%{opacity:0}to{opacity:1}}._root_xny34_1._active_xny34_15 ._mask_xny34_28{opacity:1}._root_xny34_1._active_xny34_15 ._holder_xny34_6{opacity:1;transform:translate(0);pointer-events:all;animation:_holder-appearance_xny34_1 .2s ease}@keyframes _holder-appearance_xny34_1{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}._root_xny34_1 ._backdrop_xny34_15{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--color-overlay-backdrop-background);opacity:0;pointer-events:none}._root_xny34_1 ._mask_xny34_28{position:fixed;top:0;right:0;bottom:0;left:0;--mask-right: var(--viewport-right, initial);--mask-right-offset: calc(var(--mask-right, initial) - var(--offset-large));-webkit-mask:linear-gradient(90deg,black 0%,black var(--mask-right-offset, initial),transparent var(--mask-right, initial),transparent 100%);mask:linear-gradient(90deg,black 0%,black var(--mask-right-offset, initial),transparent var(--mask-right, initial),transparent 100%);opacity:0;pointer-events:none}._root_xny34_1 ._holder_xny34_6{position:fixed;--offset: calc((100vh - (var(--height) - var(--offset-safezone) * 2) * 1) * .5 - var(--offset-large));top:var(--offset, initial);right:0;bottom:var(--offset, initial);padding-top:calc((100vh - (var(--height) - var(--offset-safezone) * 2) * 1) * .5 - var(--offset, initial));padding-bottom:calc((100vh - (var(--height) - var(--offset-safezone) * 2) * 1) * .5 - var(--offset, initial));padding-right:calc((100vw - (var(--width) - var(--offset-safezone) * 2) * 1) * .5);padding-left:var(--offset-xlarge);border-radius:var(--border-radius-normal);border-top-right-radius:0;border-bottom-right-radius:0;box-shadow:0 0 0 2px var(--color-flyout-holder-border) inset,var(--shadow-large, initial);background-color:var(--color-flyout-holder-blur-background);opacity:0;transform:translate(20px);pointer-events:none}._root_xny34_1 ._holder_xny34_6 ._content_xny34_83{width:100%;height:100%;overflow:hidden}._root_xny34_1 ._header_xny34_88{display:flex;align-items:center;justify-content:space-between;gap:var(--offset-normal)}._root_xny34_1 ._header_xny34_88 ._title_xny34_94{flex-grow:1;width:1px;display:flex;align-items:center;gap:var(--offset-normal);font-size:var(--font-size-xxlarge)}
|
package/dist/assets/Input.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_1eaux_1 ._input_1eaux_1 input{font-size:var(--font-size-normal);color:var(--color-input-text);font-weight:var(--font-weight-normal);font-family:var(--font-family-primary)}._root_1eaux_1._small_1eaux_8 ._input_1eaux_1 input{font-size:var(--font-size-small)}._root_1eaux_1._large_1eaux_12 ._input_1eaux_1 input{font-size:var(--font-size-normal)}._root_1eaux_1 ._input_1eaux_1 input{width:100%;height:var(--control-height-normal);padding:var(--offset-normal);background-color:var(--color-input-background);border-radius:var(--border-radius-small);border:none;box-shadow:0 0 0 2px var(--color-input-border) inset}._root_1eaux_1 ._input_1eaux_1 input{transition:all .2s ease}._root_1eaux_1 ._input_1eaux_1 input:hover{transition:none}._root_1eaux_1 ._input_1eaux_1 input:disabled{box-shadow:0 0 0 2px var(--color-input-disabled-border) inset;cursor:not-allowed;opacity:.5}._root_1eaux_1 ._input_1eaux_1 input:not(:disabled):hover{box-shadow:0 0 0 2px var(--color-input-hover-border) inset}._root_1eaux_1 ._input_1eaux_1 input:not(:disabled):focus-visible{box-shadow:0 0 0 2px var(--color-input-focus-border) inset}._root_1eaux_1 ._input_1eaux_1 input::-webkit-input-placeholder{color:var(--color-input-placeholder-text)}._root_1eaux_1._small_1eaux_8 ._input_1eaux_1 input{height:var(--control-height-small)}._root_1eaux_1._large_1eaux_12 ._input_1eaux_1 input{height:var(--control-height-large)}._root_1eaux_1{display:inline-block}._root_1eaux_1._full-width_1eaux_57{width:100%}._root_1eaux_1._small_1eaux_8 ._input_1eaux_1 ._decorator_1eaux_60{height:var(--control-height-small);right:var(--offset-small)}._root_1eaux_1._large_1eaux_12 ._input_1eaux_1 ._decorator_1eaux_60{height:var(--control-height-large);right:var(--offset-normal)}._root_1eaux_1._error_1eaux_68 label{color:rgba(var(--color-error),1);font-weight:var(--font-weight-bold)}._root_1eaux_1._disabled_1eaux_72 label{color:var(--color-input-disabled-label-text)}._root_1eaux_1 label{width:100%;font-family:var(--font-family-primary);font-size:var(--font-size-normal);color:var(--color-input-label-text)}._root_1eaux_1 label{transition:all .2s ease}._root_1eaux_1 label:hover{transition:none}._root_1eaux_1 label input{margin-top:var(--offset-small)}._root_1eaux_1 ._input_1eaux_1{position:relative;display:flex}._root_1eaux_1 ._input_1eaux_1 input{flex-grow:1}._root_1eaux_1 ._input_1eaux_1 ._decorator_1eaux_60{position:absolute;display:flex;align-items:center;gap:var(--offset-normal);bottom:2px;right:var(--offset-small);height:calc(var(--control-height-normal) - 4px)}._root_1eaux_1 ._description_1eaux_106{margin-top:var(--offset-small);font-size:var(--font-size-small);color:var(--color-input-description-text)}
|
package/dist/assets/Island.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_cg6qz_1{flex-shrink:0;border-radius:var(--border-radius-normal);overflow:hidden;background-color:var(--color-island-background)}._root_cg6qz_1._grow_cg6qz_7{flex-shrink:1;flex-grow:1}._root_cg6qz_1._no-round-border-top-left_cg6qz_11{border-top-left-radius:0}._root_cg6qz_1._no-round-border-top-right_cg6qz_14{border-top-right-radius:0}._root_cg6qz_1._no-round-border-bottom-left_cg6qz_17{border-bottom-left-radius:0}._root_cg6qz_1._no-round-border-bottom-right_cg6qz_20{border-bottom-right-radius:0}
|
package/dist/assets/Pad.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_1lf8m_1._offset-none_1lf8m_1{--padding-offset: 0}._root_1lf8m_1._offset-thin_1lf8m_4{--padding-offset: 2px}._root_1lf8m_1._offset-xsmall_1lf8m_7{--padding-offset: var(--offset-xsmall)}._root_1lf8m_1._offset-small_1lf8m_10{--padding-offset: var(--offset-small)}._root_1lf8m_1._offset-normal_1lf8m_13{--padding-offset: var(--offset-normal)}._root_1lf8m_1._offset-medium_1lf8m_16{--padding-offset: var(--offset-medium)}._root_1lf8m_1._offset-large_1lf8m_19{--padding-offset: var(--offset-large)}._root_1lf8m_1._offset-xlarge_1lf8m_22{--padding-offset: var(--offset-xlarge)}._root_1lf8m_1._only-top_1lf8m_25{padding-top:var(--padding-offset)}._root_1lf8m_1._only-left_1lf8m_28{padding-left:var(--padding-offset)}._root_1lf8m_1._only-right_1lf8m_31{padding-right:var(--padding-offset)}._root_1lf8m_1._only-bottom_1lf8m_34{padding-bottom:var(--padding-offset)}
|
package/dist/assets/Popover.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_1vjg7_1{position:relative}._root_1vjg7_1._active_1vjg7_4 ._popover_1vjg7_4{opacity:1;pointer-events:all;animation:_appearance_1vjg7_1 .2s ease}@keyframes _appearance_1vjg7_1{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}._root_1vjg7_1 ._popover_1vjg7_4{position:absolute;border-radius:var(--border-radius-small);box-shadow:var(--shadow-large, initial);background-color:var(--color-island-background);min-height:100%;min-width:100%;z-index:1;opacity:0;pointer-events:none}._root_1vjg7_1 ._popover_1vjg7_4._pos-top-right_1vjg7_30{top:calc(100% + var(--offset-small));right:0}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_1n2jn_1 ._renderer_1n2jn_1,._root_1n2jn_1 input{font-size:var(--font-size-normal);color:var(--color-input-text);font-weight:var(--font-weight-normal);font-family:var(--font-family-primary)}._root_1n2jn_1._small_1n2jn_8 input,._root_1n2jn_1._small_1n2jn_8 ._renderer_1n2jn_1{font-size:var(--font-size-small)}._root_1n2jn_1._large_1n2jn_13 input,._root_1n2jn_1._large_1n2jn_13 ._renderer_1n2jn_1{font-size:var(--font-size-normal)}._root_1n2jn_1 input{width:100%;height:var(--control-height-normal);padding:var(--offset-normal);background-color:var(--color-input-background);border-radius:var(--border-radius-small);border:none;box-shadow:0 0 0 2px var(--color-input-border) inset}._root_1n2jn_1 input{transition:all .2s ease}._root_1n2jn_1 input:hover{transition:none}._root_1n2jn_1 input:disabled{box-shadow:0 0 0 2px var(--color-input-disabled-border) inset;cursor:not-allowed;opacity:.5}._root_1n2jn_1 input:not(:disabled):hover{box-shadow:0 0 0 2px var(--color-input-hover-border) inset}._root_1n2jn_1 input:not(:disabled):focus-visible{box-shadow:0 0 0 2px var(--color-input-focus-border) inset}._root_1n2jn_1 input::-webkit-input-placeholder{color:var(--color-input-placeholder-text)}._root_1n2jn_1._small_1n2jn_8 input,._root_1n2jn_1._small_1n2jn_8 ._renderer_1n2jn_1{height:var(--control-height-small)}._root_1n2jn_1._large_1n2jn_13 input,._root_1n2jn_1._large_1n2jn_13 ._renderer_1n2jn_1{height:var(--control-height-large)}._root_1n2jn_1{position:relative;display:inline-block;border-radius:var(--border-radius-small);background-color:var(--color-input-background)}._root_1n2jn_1 input{position:absolute;width:100%;top:0;left:0;background-color:transparent;z-index:1}._root_1n2jn_1 ._renderer_1n2jn_1{color:transparent;position:absolute;left:var(--offset-normal);right:var(--offset-normal);padding:var(--offset-normal) 0;height:unset!important;white-space:pre;overflow-y:visible;overflow-x:auto;-webkit-user-select:none;user-select:none;scrollbar-width:none}._root_1n2jn_1 ._renderer_1n2jn_1::-webkit-scrollbar{display:none}._root_1n2jn_1 ._clear_1n2jn_88{position:absolute;display:flex;align-items:center;justify-content:center;top:0;right:0;bottom:0;padding-right:var(--offset-normal);z-index:2}
|
package/dist/assets/Spacer.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_gods5_1._horizontal_gods5_1{width:100%}._root_gods5_1._horizontal_gods5_1._size-none_gods5_4{height:0}._root_gods5_1._horizontal_gods5_1._size-thin_gods5_7{height:2px}._root_gods5_1._horizontal_gods5_1._size-xsmall_gods5_10{height:var(--offset-xsmall)}._root_gods5_1._horizontal_gods5_1._size-small_gods5_13{height:var(--offset-small)}._root_gods5_1._horizontal_gods5_1._size-normal_gods5_16{height:var(--offset-normal)}._root_gods5_1._horizontal_gods5_1._size-medium_gods5_19{height:var(--offset-medium)}._root_gods5_1._horizontal_gods5_1._size-large_gods5_22{height:var(--offset-large)}._root_gods5_1._horizontal_gods5_1._size-xlarge_gods5_25{height:var(--offset-xlarge)}._root_gods5_1._horizontal_gods5_1{height:100%}._root_gods5_1._horizontal_gods5_1._size-none_gods5_4{width:0}._root_gods5_1._horizontal_gods5_1._size-thin_gods5_7{width:2px}._root_gods5_1._horizontal_gods5_1._size-xsmall_gods5_10{width:var(--offset-xsmall)}._root_gods5_1._horizontal_gods5_1._size-small_gods5_13{width:var(--offset-small)}._root_gods5_1._horizontal_gods5_1._size-normal_gods5_16{width:var(--offset-normal)}._root_gods5_1._horizontal_gods5_1._size-medium_gods5_19{width:var(--offset-medium)}._root_gods5_1._horizontal_gods5_1._size-large_gods5_22{width:var(--offset-large)}._root_gods5_1._horizontal_gods5_1._size-xlarge_gods5_25{width:var(--offset-xlarge)}
|
package/dist/assets/Textarea.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._root_19t3p_1{display:block}._root_19t3p_1._full-width_19t3p_4{width:100%}._root_19t3p_1._small_19t3p_7 textarea{min-height:var(--control-height-small);font-size:var(--font-size-small)}._root_19t3p_1._large_19t3p_11 textarea{min-height:var(--control-height-large);font-size:var(--font-size-large)}._root_19t3p_1._error_19t3p_15 label{color:rgba(var(--color-error),1);font-weight:var(--font-weight-bold)}._root_19t3p_1._disabled_19t3p_19 label{color:var(--color-input-disabled-label-text)}._root_19t3p_1 label{width:100%;font-family:var(--font-family-primary);font-size:var(--font-size-normal);color:var(--color-input-label-text)}._root_19t3p_1 label{transition:all .2s ease}._root_19t3p_1 label:hover{transition:none}._root_19t3p_1 label textarea{margin-top:var(--offset-small)}._root_19t3p_1 textarea{flex-grow:1;width:100%;min-height:var(--control-height-normal);padding:var(--offset-normal);font-weight:var(--font-weight-normal);font-family:var(--font-family-primary);font-size:var(--font-size-normal);color:var(--color-input-text);background-color:var(--color-input-background);border-radius:var(--border-radius-small);border:none;box-shadow:0 0 0 2px var(--color-input-border) inset}._root_19t3p_1 textarea{transition:all .2s ease}._root_19t3p_1 textarea:hover{transition:none}._root_19t3p_1 textarea._resize-none_19t3p_57{resize:none}._root_19t3p_1 textarea._resize-vertical_19t3p_60{resize:vertical}._root_19t3p_1 textarea._resize-horizontal_19t3p_63{resize:horizontal}._root_19t3p_1 textarea._resize-both_19t3p_66{resize:both}._root_19t3p_1 textarea:disabled{box-shadow:0 0 0 2px var(--color-input-disabled-border) inset;cursor:not-allowed;opacity:.5}._root_19t3p_1 textarea:not(:disabled):hover{box-shadow:0 0 0 2px var(--color-input-hover-border) inset}._root_19t3p_1 textarea:not(:disabled):focus-visible,._root_19t3p_1 textarea:not(:disabled):focus-visible:hover{box-shadow:0 0 0 2px var(--color-input-focus-border) inset}._root_19t3p_1 textarea::-webkit-input-placeholder{color:var(--color-input-placeholder-text)}
|