@nattstack/ui 0.0.30 → 0.0.31

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 (30) hide show
  1. package/dist/components/index.d.ts +183 -170
  2. package/dist/components/index.js +581 -730
  3. package/dist/components/style.css +727 -0
  4. package/package.json +8 -7
  5. package/dist/components/button-spinner.module-T3OGVJS4.module.css +0 -95
  6. package/dist/components/button.module-4EHK5C4W.module.css +0 -183
  7. package/dist/components/column.module-A7QCVPFC.module.css +0 -4
  8. package/dist/components/dialog-responsive-backdrop.module-O336AARV.module.css +0 -27
  9. package/dist/components/dialog-responsive-bar.module-QCLP4IUN.module.css +0 -14
  10. package/dist/components/dialog-responsive-popup.module-BOEQIHJ7.module.css +0 -58
  11. package/dist/components/dialog-responsive-portal.module-YFVKMKVT.module.css +0 -5
  12. package/dist/components/dialog-responsive-viewport.module-LT7MZPLD.module.css +0 -16
  13. package/dist/components/input.module-H5TWAPFX.module.css +0 -97
  14. package/dist/components/label.module-2UZDXZQ4.module.css +0 -8
  15. package/dist/components/row.module-GYNANRAY.module.css +0 -4
  16. package/dist/components/spacer.module-ZYYYWYEB.module.css +0 -3
  17. package/dist/components/switch.module-U6Q27QB5.module.css +0 -62
  18. package/dist/components/tabs-panel.module-VGH3G3KV.module.css +0 -12
  19. package/dist/components/tabs-pill-indicator.module-533HMO7L.module.css +0 -12
  20. package/dist/components/tabs-pill-list.module-KQW67ZSW.module.css +0 -7
  21. package/dist/components/tabs-pill-tab.module-5SZMEO3Y.module.css +0 -64
  22. package/dist/components/tabs-segmented-indicator.module-EG56DHS2.module.css +0 -12
  23. package/dist/components/tabs-segmented-list.module-I3DSVFSP.module.css +0 -11
  24. package/dist/components/tabs-segmented-tab.module-SVYVEM2O.module.css +0 -36
  25. package/dist/components/tabs-underline-indicator.module-6SHQHUH5.module.css +0 -10
  26. package/dist/components/tabs-underline-list.module-72ZCIEAS.module.css +0 -8
  27. package/dist/components/tabs-underline-tab.module-OAE4JH7K.module.css +0 -35
  28. package/dist/components/tabs.module-3Z5DRPPX.module.css +0 -5
  29. package/dist/components/textarea.module-LK25MKCZ.module.css +0 -10
  30. package/dist/components/tooltip-content.module-QGRFS5NN.module.css +0 -18
@@ -1,64 +0,0 @@
1
- .tabs_pill_tab {
2
- align-items: center;
3
- border-radius: var(--border-radius);
4
- color: black;
5
- column-gap: 8px;
6
- cursor: pointer;
7
- display: flex;
8
- flex-shrink: 0;
9
- font-size: 14px;
10
- font-weight: 500;
11
- height: 40px;
12
- justify-content: center;
13
- outline-color: var(--color-primary-9);
14
- outline-offset: -4px;
15
- outline-style: solid;
16
- outline-width: 0px;
17
- padding: 0 14px;
18
- transition-duration: 150ms;
19
- transition-property: background-color, color;
20
- }
21
-
22
- .tabs_pill_tab:focus-visible {
23
- outline-width: 2px;
24
- }
25
-
26
- .tabs_pill_tab:hover {
27
- background-color: var(--color-gray-4);
28
- }
29
-
30
- .tabs_pill_tab[data-active] {
31
- background-color: transparent;
32
- color: white;
33
- }
34
-
35
- :global(.dark) .tabs_pill_tab {
36
- color: white;
37
- }
38
-
39
- :global(.dark) .tabs_pill_tab[data-active] {
40
- color: black;
41
- }
42
-
43
- /* Icon size */
44
- .tabs_pill_tab > svg {
45
- --size-icon: 16px;
46
- height: var(--size-icon);
47
- width: var(--size-icon);
48
- }
49
-
50
- .tabs_pill_tab_wrapper {
51
- --border-radius: 12px;
52
- border-radius: var(--border-radius);
53
- display: flex;
54
- flex-shrink: 0;
55
- overflow: hidden;
56
- position: relative;
57
- }
58
-
59
- .tabs_pill_tab_background {
60
- background-color: var(--color-gray-3);
61
- inset: 0;
62
- position: absolute;
63
- z-index: -2;
64
- }
@@ -1,12 +0,0 @@
1
- .tabs_segmented_indicator {
2
- background-color: var(--color-gray-1);
3
- border-radius: 10px;
4
- height: var(--active-tab-height);
5
- left: var(--active-tab-left);
6
- position: absolute;
7
- top: var(--active-tab-top);
8
- transition-duration: 150ms;
9
- transition-property: left, width;
10
- width: var(--active-tab-width);
11
- z-index: -1;
12
- }
@@ -1,11 +0,0 @@
1
- .tabs_segmented_list {
2
- background-color: var(--color-gray-3);
3
- border-radius: 12px;
4
- display: flex;
5
- height: 40px;
6
- isolation: isolate;
7
- overflow-x: auto;
8
- padding: 2px;
9
- position: relative;
10
- width: fit-content;
11
- }
@@ -1,36 +0,0 @@
1
- .tabs_segmented_tab {
2
- align-items: center;
3
- border-radius: 10px;
4
- color: var(--color-gray-11);
5
- column-gap: 8px;
6
- cursor: pointer;
7
- display: flex;
8
- flex-shrink: 0;
9
- font-size: 14px;
10
- font-weight: 500;
11
- height: 100%;
12
- justify-content: center;
13
- outline-color: var(--color-primary-9);
14
- outline-offset: -4px;
15
- outline-style: solid;
16
- outline-width: 0px;
17
- padding: 0 14px;
18
- transition-duration: 150ms;
19
- transition-property: color;
20
- }
21
-
22
- .tabs_segmented_tab:focus-visible {
23
- outline-width: 2px;
24
- }
25
-
26
- .tabs_segmented_tab:hover,
27
- .tabs_segmented_tab[data-active] {
28
- color: var(--color-gray-12);
29
- }
30
-
31
- /* Icon size */
32
- .tabs_segmented_tab > svg {
33
- --size-icon: 16px;
34
- height: var(--size-icon);
35
- width: var(--size-icon);
36
- }
@@ -1,10 +0,0 @@
1
- .tabs_underline_indicator {
2
- background-color: var(--color-primary-9);
3
- bottom: 0px;
4
- height: 2px;
5
- left: var(--active-tab-left);
6
- position: absolute;
7
- transition-duration: 150ms;
8
- transition-property: left, width;
9
- width: var(--active-tab-width);
10
- }
@@ -1,8 +0,0 @@
1
- .tabs_underline_list {
2
- border-bottom-color: var(--color-gray-4);
3
- border-bottom-style: solid;
4
- border-bottom-width: 1px;
5
- display: flex;
6
- overflow-x: auto;
7
- position: relative;
8
- }
@@ -1,35 +0,0 @@
1
- .tabs_underline_tab {
2
- align-items: center;
3
- border-radius: 8px;
4
- color: var(--color-gray-11);
5
- column-gap: 8px;
6
- cursor: pointer;
7
- display: flex;
8
- flex-shrink: 0;
9
- font-size: 14px;
10
- font-weight: 500;
11
- margin-bottom: 6px;
12
- outline-color: var(--color-primary-9);
13
- outline-offset: -2px;
14
- outline-style: solid;
15
- outline-width: 0px;
16
- padding: 6px 12px;
17
- transition-duration: 150ms;
18
- transition-property: color;
19
- }
20
-
21
- .tabs_underline_tab:focus-visible {
22
- outline-width: 2px;
23
- }
24
-
25
- .tabs_underline_tab:hover,
26
- .tabs_underline_tab[data-active] {
27
- color: var(--color-gray-12);
28
- }
29
-
30
- /* Icon size */
31
- .tabs_underline_tab > svg {
32
- --size-icon: 16px;
33
- height: var(--size-icon);
34
- width: var(--size-icon);
35
- }
@@ -1,5 +0,0 @@
1
- .tabs {
2
- display: flex;
3
- flex-direction: column;
4
- width: 100%;
5
- }
@@ -1,10 +0,0 @@
1
- /* ===================================================== */
2
- /* Base */
3
- /* ===================================================== */
4
- .textarea {
5
- height: auto;
6
- max-height: none;
7
- min-height: 66px;
8
- padding: 12px !important;
9
- resize: vertical;
10
- }
@@ -1,18 +0,0 @@
1
- .tooltip_content {
2
- background-color: var(--color-gray-dark-1);
3
- border-radius: 8px;
4
- color: var(--color-gray-dark-12);
5
- font-size: 13px;
6
- font-weight: 500;
7
- padding: 4px 8px;
8
- }
9
-
10
- .tooltip_content_positioner {
11
- isolation: isolate;
12
- z-index: 50;
13
- }
14
-
15
- :global(.dark) .tooltip_content {
16
- background-color: var(--color-gray-light-1);
17
- color: var(--color-gray-light-12);
18
- }