@pathscale/ui 1.2.9 → 1.2.11

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 (125) hide show
  1. package/LICENSE +22 -22
  2. package/README.md +59 -59
  3. package/dist/components/accordion/Accordion.css +158 -158
  4. package/dist/components/alert/Alert.css +116 -116
  5. package/dist/components/avatar/Avatar.css +124 -124
  6. package/dist/components/badge/Badge.css +164 -164
  7. package/dist/components/breadcrumbs/Breadcrumbs.css +63 -63
  8. package/dist/components/button/Button.css +194 -194
  9. package/dist/components/button-group/ButtonGroup.css +117 -117
  10. package/dist/components/calendar/Calendar.css +258 -258
  11. package/dist/components/card/Card.css +110 -110
  12. package/dist/components/chatbubble/ChatBubble.css +164 -164
  13. package/dist/components/checkbox/Checkbox.css +183 -183
  14. package/dist/components/checkbox-group/CheckboxGroup.css +10 -10
  15. package/dist/components/chip/Chip.css +197 -197
  16. package/dist/components/close-button/CloseButton.css +81 -81
  17. package/dist/components/color-area/ColorArea.css +54 -54
  18. package/dist/components/color-field/ColorField.css +88 -88
  19. package/dist/components/color-picker/ColorPicker.css +28 -28
  20. package/dist/components/color-slider/ColorSlider.css +57 -57
  21. package/dist/components/color-swatch/ColorSwatch.css +84 -84
  22. package/dist/components/color-swatch-picker/ColorSwatchPicker.css +12 -12
  23. package/dist/components/color-wheel-flower/ColorWheelFlower.css +147 -147
  24. package/dist/components/combo-box/ComboBox.css +344 -344
  25. package/dist/components/date-field/DateField.css +215 -215
  26. package/dist/components/date-picker/DatePicker.css +143 -143
  27. package/dist/components/date-range-picker/DateRangePicker.css +149 -149
  28. package/dist/components/description/Description.css +10 -10
  29. package/dist/components/disclosure/Disclosure.css +84 -84
  30. package/dist/components/disclosure-group/DisclosureGroup.css +9 -9
  31. package/dist/components/drawer/Drawer.css +463 -463
  32. package/dist/components/dropdown/Dropdown.css +211 -211
  33. package/dist/components/empty-state/EmptyState.css +39 -39
  34. package/dist/components/error-message/ErrorMessage.css +20 -20
  35. package/dist/components/field-error/FieldError.css +27 -27
  36. package/dist/components/fieldset/Fieldset.css +30 -30
  37. package/dist/components/flex/Flex.css +5 -5
  38. package/dist/components/floating-dock/FloatingDock.css +208 -208
  39. package/dist/components/footer/footer.css +51 -51
  40. package/dist/components/form/Form.css +5 -5
  41. package/dist/components/glass-panel/GlassPanel.css +359 -359
  42. package/dist/components/glow-card/GlowCard.css +100 -100
  43. package/dist/components/grid/Grid.css +5 -5
  44. package/dist/components/header/Header.css +13 -13
  45. package/dist/components/icon/Icon.css +10 -10
  46. package/dist/components/immersive-landing/ImmersiveLanding.css +565 -565
  47. package/dist/components/input/Input.css +155 -155
  48. package/dist/components/input-group/InputGroup.css +172 -172
  49. package/dist/components/input-otp/InputOTP.css +170 -170
  50. package/dist/components/kbd/Kbd.css +60 -60
  51. package/dist/components/label/Label.css +30 -30
  52. package/dist/components/language-switcher/LanguageSwitcher.css +56 -56
  53. package/dist/components/link/Link.css +131 -131
  54. package/dist/components/list-box/ListBox.css +148 -148
  55. package/dist/components/live-chat/LiveChat.css +324 -324
  56. package/dist/components/menu/Menu.css +199 -199
  57. package/dist/components/metal-border/MetalBorder.classes.d.ts +26 -0
  58. package/dist/components/metal-border/MetalBorder.classes.js +27 -0
  59. package/dist/components/metal-border/MetalBorder.css +40 -0
  60. package/dist/components/metal-border/MetalBorder.d.ts +20 -0
  61. package/dist/components/metal-border/MetalBorder.js +322 -0
  62. package/dist/components/metal-border/engine/color.d.ts +4 -0
  63. package/dist/components/metal-border/engine/color.js +69 -0
  64. package/dist/components/metal-border/engine/glow/geometry.d.ts +35 -0
  65. package/dist/components/metal-border/engine/glow/geometry.js +176 -0
  66. package/dist/components/metal-border/engine/glow/glow.d.ts +38 -0
  67. package/dist/components/metal-border/engine/glow/glow.js +246 -0
  68. package/dist/components/metal-border/engine/index.d.ts +4 -0
  69. package/dist/components/metal-border/engine/index.js +2 -0
  70. package/dist/components/metal-border/engine/perfConfig.d.ts +9 -0
  71. package/dist/components/metal-border/engine/perfConfig.js +10 -0
  72. package/dist/components/metal-border/engine/presets.d.ts +57 -0
  73. package/dist/components/metal-border/engine/presets.js +214 -0
  74. package/dist/components/metal-border/engine/renderer/core.d.ts +69 -0
  75. package/dist/components/metal-border/engine/renderer/core.js +156 -0
  76. package/dist/components/metal-border/engine/renderer/loop.d.ts +30 -0
  77. package/dist/components/metal-border/engine/renderer/loop.js +248 -0
  78. package/dist/components/metal-border/engine/renderer/sampling.d.ts +14 -0
  79. package/dist/components/metal-border/engine/renderer/sampling.js +145 -0
  80. package/dist/components/metal-border/engine/shaders.d.ts +36 -0
  81. package/dist/components/metal-border/engine/shaders.js +215 -0
  82. package/dist/components/metal-border/engine/tween.d.ts +17 -0
  83. package/dist/components/metal-border/engine/tween.js +28 -0
  84. package/dist/components/metal-border/index.d.ts +2 -0
  85. package/dist/components/metal-border/index.js +1 -0
  86. package/dist/components/meter/Meter.css +89 -89
  87. package/dist/components/modal/Modal.css +320 -320
  88. package/dist/components/navbar/Navbar.css +110 -110
  89. package/dist/components/noise-background/NoiseBackground.css +66 -66
  90. package/dist/components/number-field/NumberField.css +198 -198
  91. package/dist/components/pagination/Pagination.css +121 -121
  92. package/dist/components/popover/Popover.css +117 -117
  93. package/dist/components/progress-bar/ProgressBar.css +104 -104
  94. package/dist/components/progress-circle/ProgressCircle.css +82 -82
  95. package/dist/components/radio/Radio.css +129 -129
  96. package/dist/components/radio-group/RadioGroup.css +58 -58
  97. package/dist/components/range-calendar/RangeCalendar.css +51 -51
  98. package/dist/components/scroll-shadow/ScrollShadow.css +93 -93
  99. package/dist/components/search-field/SearchField.css +183 -183
  100. package/dist/components/select/Select.css +284 -284
  101. package/dist/components/separator/Separator.css +35 -35
  102. package/dist/components/skeleton/Skeleton.css +95 -95
  103. package/dist/components/slider/Slider.css +122 -122
  104. package/dist/components/spinner/Spinner.css +131 -131
  105. package/dist/components/surface/Surface.css +37 -37
  106. package/dist/components/table/Table.css +426 -426
  107. package/dist/components/tabs/Tabs.css +203 -203
  108. package/dist/components/tag/Tag.css +121 -121
  109. package/dist/components/tag-group/TagGroup.css +22 -22
  110. package/dist/components/text/Text.css +66 -66
  111. package/dist/components/text-area/TextArea.css +95 -95
  112. package/dist/components/text-field/TextField.css +33 -33
  113. package/dist/components/time-field/TimeField.css +215 -215
  114. package/dist/components/toast/Toast.css +344 -344
  115. package/dist/components/toggle/Toggle.css +237 -237
  116. package/dist/components/toolbar/Toolbar.css +55 -55
  117. package/dist/components/tooltip/Tooltip.css +153 -153
  118. package/dist/index.css +74 -74
  119. package/dist/index.d.ts +2 -0
  120. package/dist/index.js +1 -0
  121. package/dist/purge-manifest.json +15100 -14847
  122. package/dist/styles/base/index.css +43 -43
  123. package/dist/styles/themes/dark.css +141 -141
  124. package/dist/styles/themes/light.css +143 -143
  125. package/package.json +3 -3
@@ -1,66 +1,66 @@
1
- @layer components {
2
- .text {
3
- --text-color-default: var(--color-foreground);
4
- --text-color-muted: var(
5
- --color-muted,
6
- color-mix(in oklab, var(--color-base-content) 55%, transparent)
7
- );
8
- --text-color-success: var(--color-success);
9
- --text-color-warning: var(--color-warning);
10
- --text-color-danger: var(--color-danger);
11
- --text-color: var(--text-color-default);
12
- --text-font-size: 1rem;
13
- --text-line-height: 1.5rem;
14
-
15
- color: var(--text-color);
16
- font-size: var(--text-font-size);
17
- line-height: var(--text-line-height);
18
- transition-property: color;
19
- transition-duration: 200ms;
20
- }
21
-
22
- .text[data-size="xs"] {
23
- --text-font-size: 0.75rem;
24
- --text-line-height: 1rem;
25
- }
26
-
27
- .text[data-size="sm"] {
28
- --text-font-size: 0.875rem;
29
- --text-line-height: 1.25rem;
30
- }
31
-
32
- .text[data-size="base"] {
33
- --text-font-size: 1rem;
34
- --text-line-height: 1.5rem;
35
- }
36
-
37
- .text[data-size="lg"] {
38
- --text-font-size: 1.125rem;
39
- --text-line-height: 1.75rem;
40
- }
41
-
42
- .text[data-size="xl"] {
43
- --text-font-size: 1.25rem;
44
- --text-line-height: 1.75rem;
45
- }
46
-
47
- .text[data-variant="default"] {
48
- --text-color: var(--text-color-default);
49
- }
50
-
51
- .text[data-variant="muted"] {
52
- --text-color: var(--text-color-muted);
53
- }
54
-
55
- .text[data-variant="success"] {
56
- --text-color: var(--text-color-success);
57
- }
58
-
59
- .text[data-variant="warning"] {
60
- --text-color: var(--text-color-warning);
61
- }
62
-
63
- .text[data-variant="danger"] {
64
- --text-color: var(--text-color-danger);
65
- }
66
- }
1
+ @layer components {
2
+ .text {
3
+ --text-color-default: var(--color-foreground);
4
+ --text-color-muted: var(
5
+ --color-muted,
6
+ color-mix(in oklab, var(--color-base-content) 55%, transparent)
7
+ );
8
+ --text-color-success: var(--color-success);
9
+ --text-color-warning: var(--color-warning);
10
+ --text-color-danger: var(--color-danger);
11
+ --text-color: var(--text-color-default);
12
+ --text-font-size: 1rem;
13
+ --text-line-height: 1.5rem;
14
+
15
+ color: var(--text-color);
16
+ font-size: var(--text-font-size);
17
+ line-height: var(--text-line-height);
18
+ transition-property: color;
19
+ transition-duration: 200ms;
20
+ }
21
+
22
+ .text[data-size="xs"] {
23
+ --text-font-size: 0.75rem;
24
+ --text-line-height: 1rem;
25
+ }
26
+
27
+ .text[data-size="sm"] {
28
+ --text-font-size: 0.875rem;
29
+ --text-line-height: 1.25rem;
30
+ }
31
+
32
+ .text[data-size="base"] {
33
+ --text-font-size: 1rem;
34
+ --text-line-height: 1.5rem;
35
+ }
36
+
37
+ .text[data-size="lg"] {
38
+ --text-font-size: 1.125rem;
39
+ --text-line-height: 1.75rem;
40
+ }
41
+
42
+ .text[data-size="xl"] {
43
+ --text-font-size: 1.25rem;
44
+ --text-line-height: 1.75rem;
45
+ }
46
+
47
+ .text[data-variant="default"] {
48
+ --text-color: var(--text-color-default);
49
+ }
50
+
51
+ .text[data-variant="muted"] {
52
+ --text-color: var(--text-color-muted);
53
+ }
54
+
55
+ .text[data-variant="success"] {
56
+ --text-color: var(--text-color-success);
57
+ }
58
+
59
+ .text[data-variant="warning"] {
60
+ --text-color: var(--text-color-warning);
61
+ }
62
+
63
+ .text[data-variant="danger"] {
64
+ --text-color: var(--text-color-danger);
65
+ }
66
+ }
@@ -1,95 +1,95 @@
1
- @layer components {
2
- .textarea {
3
- width: fit-content;
4
- min-height: 2.375rem;
5
- border-radius: var(--radius-field, 0.75rem);
6
- border: var(--border-width-field, 1px) solid
7
- var(--color-field-border, color-mix(in oklab, var(--color-base-content) 16%, transparent));
8
- background-color: var(--color-field, var(--color-base-100));
9
- padding-block: 0.5rem;
10
- padding-inline: 0.75rem;
11
- font-size: 0.875rem;
12
- line-height: 1.25rem;
13
- color: var(--color-field-foreground, var(--color-base-content));
14
- box-shadow:
15
- 0 1px 0 color-mix(in oklab, var(--color-base-content) 8%, transparent),
16
- 0 1px 0 color-mix(in oklab, var(--color-base-100) 60%, transparent) inset;
17
- outline: none;
18
- resize: vertical;
19
- transition:
20
- background-color 150ms var(--ease-smooth),
21
- border-color 150ms var(--ease-smooth),
22
- box-shadow 150ms var(--ease-out);
23
- }
24
-
25
- .textarea::placeholder {
26
- color: var(--color-field-placeholder, color-mix(in oklab, var(--color-base-content) 45%, transparent));
27
- }
28
-
29
- @media (prefers-reduced-motion: reduce) {
30
- .textarea {
31
- transition: none;
32
- }
33
- }
34
-
35
- @media (hover: hover) {
36
- .textarea:hover:not(:focus):not(:focus-visible):not([data-disabled="true"]) {
37
- background-color: var(--color-field-hover, var(--color-base-200));
38
- border-color: var(--color-field-border-hover, color-mix(in oklab, var(--color-base-content) 22%, transparent));
39
- }
40
- }
41
-
42
- .textarea:focus,
43
- .textarea[data-focused="true"] {
44
- border-color: var(--color-field-border-focus, var(--color-accent));
45
- background-color: var(--color-field-focus, var(--color-base-100));
46
- box-shadow:
47
- 0 0 0 3px color-mix(in oklab, var(--color-accent) 22%, transparent),
48
- 0 1px 0 color-mix(in oklab, var(--color-accent) 24%, transparent);
49
- }
50
-
51
- .textarea[data-invalid="true"] {
52
- border-color: var(--color-field-border-invalid, var(--color-danger));
53
- background-color: var(--color-field-focus, var(--color-base-100));
54
- box-shadow:
55
- 0 0 0 3px color-mix(in oklab, var(--color-danger) 20%, transparent),
56
- 0 1px 0 color-mix(in oklab, var(--color-danger) 20%, transparent);
57
- }
58
-
59
- .textarea[data-disabled="true"],
60
- .textarea[aria-disabled="true"] {
61
- cursor: not-allowed;
62
- border-color: color-mix(in oklab, var(--color-base-content) 12%, transparent);
63
- background-color: var(--color-base-200);
64
- color: color-mix(in oklab, var(--color-base-content) 45%, transparent);
65
- box-shadow: none;
66
- opacity: var(--disabled-opacity, 0.6);
67
- }
68
-
69
- .textarea--primary {
70
- }
71
-
72
- .textarea--secondary {
73
- box-shadow: none;
74
- background-color: var(--textarea-bg, var(--color-default, var(--color-base-200)));
75
- }
76
-
77
- @media (hover: hover) {
78
- .textarea--secondary:hover:not(:focus):not(:focus-visible):not([data-disabled="true"]) {
79
- background-color: var(--textarea-bg-hover, var(--color-default-hover, var(--color-base-300)));
80
- }
81
- }
82
-
83
- .textarea--secondary:focus,
84
- .textarea--secondary[data-focused="true"] {
85
- background-color: var(--textarea-bg-focus, var(--color-default, var(--color-base-200)));
86
- }
87
-
88
- .textarea--secondary[data-invalid="true"] {
89
- background-color: var(--textarea-bg-focus, var(--color-default, var(--color-base-200)));
90
- }
91
-
92
- .textarea--full-width {
93
- width: 100%;
94
- }
95
- }
1
+ @layer components {
2
+ .textarea {
3
+ width: fit-content;
4
+ min-height: 2.375rem;
5
+ border-radius: var(--radius-field, 0.75rem);
6
+ border: var(--border-width-field, 1px) solid
7
+ var(--color-field-border, color-mix(in oklab, var(--color-base-content) 16%, transparent));
8
+ background-color: var(--color-field, var(--color-base-100));
9
+ padding-block: 0.5rem;
10
+ padding-inline: 0.75rem;
11
+ font-size: 0.875rem;
12
+ line-height: 1.25rem;
13
+ color: var(--color-field-foreground, var(--color-base-content));
14
+ box-shadow:
15
+ 0 1px 0 color-mix(in oklab, var(--color-base-content) 8%, transparent),
16
+ 0 1px 0 color-mix(in oklab, var(--color-base-100) 60%, transparent) inset;
17
+ outline: none;
18
+ resize: vertical;
19
+ transition:
20
+ background-color 150ms var(--ease-smooth),
21
+ border-color 150ms var(--ease-smooth),
22
+ box-shadow 150ms var(--ease-out);
23
+ }
24
+
25
+ .textarea::placeholder {
26
+ color: var(--color-field-placeholder, color-mix(in oklab, var(--color-base-content) 45%, transparent));
27
+ }
28
+
29
+ @media (prefers-reduced-motion: reduce) {
30
+ .textarea {
31
+ transition: none;
32
+ }
33
+ }
34
+
35
+ @media (hover: hover) {
36
+ .textarea:hover:not(:focus):not(:focus-visible):not([data-disabled="true"]) {
37
+ background-color: var(--color-field-hover, var(--color-base-200));
38
+ border-color: var(--color-field-border-hover, color-mix(in oklab, var(--color-base-content) 22%, transparent));
39
+ }
40
+ }
41
+
42
+ .textarea:focus,
43
+ .textarea[data-focused="true"] {
44
+ border-color: var(--color-field-border-focus, var(--color-accent));
45
+ background-color: var(--color-field-focus, var(--color-base-100));
46
+ box-shadow:
47
+ 0 0 0 3px color-mix(in oklab, var(--color-accent) 22%, transparent),
48
+ 0 1px 0 color-mix(in oklab, var(--color-accent) 24%, transparent);
49
+ }
50
+
51
+ .textarea[data-invalid="true"] {
52
+ border-color: var(--color-field-border-invalid, var(--color-danger));
53
+ background-color: var(--color-field-focus, var(--color-base-100));
54
+ box-shadow:
55
+ 0 0 0 3px color-mix(in oklab, var(--color-danger) 20%, transparent),
56
+ 0 1px 0 color-mix(in oklab, var(--color-danger) 20%, transparent);
57
+ }
58
+
59
+ .textarea[data-disabled="true"],
60
+ .textarea[aria-disabled="true"] {
61
+ cursor: not-allowed;
62
+ border-color: color-mix(in oklab, var(--color-base-content) 12%, transparent);
63
+ background-color: var(--color-base-200);
64
+ color: color-mix(in oklab, var(--color-base-content) 45%, transparent);
65
+ box-shadow: none;
66
+ opacity: var(--disabled-opacity, 0.6);
67
+ }
68
+
69
+ .textarea--primary {
70
+ }
71
+
72
+ .textarea--secondary {
73
+ box-shadow: none;
74
+ background-color: var(--textarea-bg, var(--color-default, var(--color-base-200)));
75
+ }
76
+
77
+ @media (hover: hover) {
78
+ .textarea--secondary:hover:not(:focus):not(:focus-visible):not([data-disabled="true"]) {
79
+ background-color: var(--textarea-bg-hover, var(--color-default-hover, var(--color-base-300)));
80
+ }
81
+ }
82
+
83
+ .textarea--secondary:focus,
84
+ .textarea--secondary[data-focused="true"] {
85
+ background-color: var(--textarea-bg-focus, var(--color-default, var(--color-base-200)));
86
+ }
87
+
88
+ .textarea--secondary[data-invalid="true"] {
89
+ background-color: var(--textarea-bg-focus, var(--color-default, var(--color-base-200)));
90
+ }
91
+
92
+ .textarea--full-width {
93
+ width: 100%;
94
+ }
95
+ }
@@ -1,33 +1,33 @@
1
- @layer components {
2
- .text-field {
3
- display: flex;
4
- flex-direction: column;
5
- gap: 0.25rem;
6
- }
7
-
8
- .text-field[data-invalid="true"] [data-slot="description"],
9
- .text-field[aria-invalid="true"] [data-slot="description"] {
10
- display: none;
11
- }
12
-
13
- .text-field [data-slot="description"] {
14
- padding-inline: 0.25rem;
15
- }
16
-
17
- .text-field--full-width {
18
- width: 100%;
19
- }
20
-
21
- .text-field--full-width [data-slot="input"],
22
- .text-field--full-width [data-slot="textarea"],
23
- .text-field--full-width [data-slot="input-group"],
24
- .text-field--full-width [data-slot="date-input-group"] {
25
- width: 100%;
26
- }
27
-
28
- .text-field--primary {
29
- }
30
-
31
- .text-field--secondary {
32
- }
33
- }
1
+ @layer components {
2
+ .text-field {
3
+ display: flex;
4
+ flex-direction: column;
5
+ gap: 0.25rem;
6
+ }
7
+
8
+ .text-field[data-invalid="true"] [data-slot="description"],
9
+ .text-field[aria-invalid="true"] [data-slot="description"] {
10
+ display: none;
11
+ }
12
+
13
+ .text-field [data-slot="description"] {
14
+ padding-inline: 0.25rem;
15
+ }
16
+
17
+ .text-field--full-width {
18
+ width: 100%;
19
+ }
20
+
21
+ .text-field--full-width [data-slot="input"],
22
+ .text-field--full-width [data-slot="textarea"],
23
+ .text-field--full-width [data-slot="input-group"],
24
+ .text-field--full-width [data-slot="date-input-group"] {
25
+ width: 100%;
26
+ }
27
+
28
+ .text-field--primary {
29
+ }
30
+
31
+ .text-field--secondary {
32
+ }
33
+ }