@fibery/ui-kit 1.40.3 → 1.41.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.
Files changed (174) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/eslint.config.mjs +16 -0
  3. package/package.json +11 -13
  4. package/src/a11y-color.test.ts +162 -0
  5. package/src/a11y-color.ts +13 -20
  6. package/src/actions-menu/actions-menu-item.tsx +9 -12
  7. package/src/actions-menu/context-actions-menu.tsx +8 -3
  8. package/src/ai/model.tsx +0 -1
  9. package/src/ai/temperature.tsx +0 -1
  10. package/src/animated-height-container.tsx +3 -3
  11. package/src/antd/ant-modal.tsx +10 -5
  12. package/src/antd/index.tsx +3 -0
  13. package/src/antd/input.tsx +0 -1
  14. package/src/antd/styles.ts +15 -15
  15. package/src/app-icon-with-fallback.tsx +6 -6
  16. package/src/app-icon-wrapper.tsx +2 -3
  17. package/src/app-icon.tsx +4 -4
  18. package/src/avatar.tsx +3 -3
  19. package/src/button/base-button.tsx +0 -1
  20. package/src/button/button.tsx +1 -0
  21. package/src/button/make-button-colors.ts +5 -13
  22. package/src/checkbox.tsx +2 -2
  23. package/src/collapsible-section.tsx +11 -1
  24. package/src/color-picker/ColorPickerOrLoader.js +2 -2
  25. package/src/color-utils.test.ts +307 -0
  26. package/src/color-utils.ts +215 -0
  27. package/src/command-menu/index.tsx +1 -0
  28. package/src/comment.tsx +3 -2
  29. package/src/context-menu/index.tsx +12 -7
  30. package/src/date-picker/contexts.ts +2 -2
  31. package/src/date-picker/date-range-picker.tsx +3 -4
  32. package/src/date-picker/single-date-picker.tsx +147 -119
  33. package/src/date-picker/types.ts +4 -3
  34. package/src/day-select/iso-week-day-select.tsx +2 -2
  35. package/src/day-select/week-day-select.tsx +2 -2
  36. package/src/delayed.tsx +0 -1
  37. package/src/design-system/alpha.test.ts +59 -0
  38. package/src/design-system/alpha.ts +41 -0
  39. package/src/design-system/animation.ts +10 -0
  40. package/src/design-system/colors-css.test.ts +39 -0
  41. package/src/design-system/colors-css.ts +25 -0
  42. package/src/design-system/colors-js.test.ts +232 -0
  43. package/src/design-system/colors-js.ts +107 -0
  44. package/src/design-system/colors.test.ts +74 -0
  45. package/src/design-system/colors.ts +759 -0
  46. package/src/design-system/date.ts +3 -0
  47. package/src/design-system/layout.ts +106 -0
  48. package/src/design-system/theme.test.ts +94 -0
  49. package/src/design-system/theme.ts +93 -0
  50. package/src/design-system/typography.ts +179 -0
  51. package/src/design-system/vars.test.ts +1679 -0
  52. package/src/design-system/vars.ts +52 -0
  53. package/src/design-system.test.ts +45 -22
  54. package/src/design-system.ts +25 -1339
  55. package/src/dropdown-menu/index.tsx +21 -16
  56. package/src/emoji-picker/app-icon-picker.tsx +5 -5
  57. package/src/emoji-picker/emoji-picker-content-with-color.tsx +4 -4
  58. package/src/emoji-picker/icon-emoji-picker.tsx +3 -3
  59. package/src/favorites-icon.tsx +1 -1
  60. package/src/fibermoji-placeholder.tsx +3 -3
  61. package/src/field-container.tsx +11 -2
  62. package/src/file-item/file-icon.tsx +169 -0
  63. package/src/file-item/file-menu-items.tsx +68 -0
  64. package/src/file-item/file-preview-actions.tsx +38 -0
  65. package/src/file-item/file-title.tsx +48 -0
  66. package/src/file-item/types.ts +27 -0
  67. package/src/file-item/use-register-in-image-gallery.tsx +70 -0
  68. package/src/file-item-2.tsx +32 -348
  69. package/src/file-item.tsx +6 -3
  70. package/src/hue-shift.test.ts +91 -0
  71. package/src/icons/ast/ChatBubble.ts +8 -0
  72. package/src/icons/ast/ChatFloat.ts +8 -0
  73. package/src/icons/ast/ChatSidebar.ts +8 -0
  74. package/src/icons/ast/FileCounter.ts +8 -0
  75. package/src/icons/ast/FileMultiple.ts +8 -0
  76. package/src/icons/ast/FileOther.ts +8 -0
  77. package/src/icons/ast/NoBorder.ts +8 -0
  78. package/src/icons/ast/NoFill.ts +8 -0
  79. package/src/icons/ast/ValueEdit.ts +8 -0
  80. package/src/icons/ast/index.tsx +9 -0
  81. package/src/icons/react/ChatBubble.tsx +13 -0
  82. package/src/icons/react/ChatFloat.tsx +13 -0
  83. package/src/icons/react/ChatSidebar.tsx +13 -0
  84. package/src/icons/react/FileCounter.tsx +13 -0
  85. package/src/icons/react/FileMultiple.tsx +13 -0
  86. package/src/icons/react/FileOther.tsx +13 -0
  87. package/src/icons/react/NoBorder.tsx +13 -0
  88. package/src/icons/react/NoFill.tsx +13 -0
  89. package/src/icons/react/ValueEdit.tsx +13 -0
  90. package/src/icons/react/index.tsx +9 -0
  91. package/src/icons/svg/chat-bubble.svg +4 -0
  92. package/src/icons/svg/chat-float.svg +4 -0
  93. package/src/icons/svg/chat-sidebar.svg +4 -0
  94. package/src/icons/svg/file-counter.svg +3 -0
  95. package/src/icons/svg/file-multiple.svg +3 -0
  96. package/src/icons/svg/file-other.svg +3 -0
  97. package/src/icons/svg/no-border.svg +17 -0
  98. package/src/icons/svg/no-fill.svg +4 -0
  99. package/src/icons/svg/value-edit.svg +3 -0
  100. package/src/images-gallery/images-gallery.tsx +8 -6
  101. package/src/images-gallery/slide-buttons.tsx +4 -11
  102. package/src/is-iOS.ts +0 -1
  103. package/src/is-in-popup.ts +2 -1
  104. package/src/lists/actions-menu-row-surface.tsx +7 -7
  105. package/src/loading-sausage.tsx +2 -2
  106. package/src/media-query-utils.ts +1 -2
  107. package/src/mobile-keyboard-aware-popup.tsx +6 -5
  108. package/src/modal-menu/modal-menu-content.tsx +2 -2
  109. package/src/number-input/decimal.js +9 -7
  110. package/src/number-input/{number-inline-input-with-autosize.tsx → number-input-inline-with-autosize.tsx} +20 -41
  111. package/src/number-input/number-input-inline.tsx +118 -0
  112. package/src/number-input/{index.test.js → number-input.test.tsx} +38 -43
  113. package/src/number-input/number-input.tsx +63 -121
  114. package/src/number-input/types.ts +19 -0
  115. package/src/number-input/utils.ts +61 -0
  116. package/src/online-users.tsx +2 -2
  117. package/src/palette-generator.test.ts +309 -0
  118. package/src/palette-generator.ts +160 -0
  119. package/src/palettes/_.ts +72 -0
  120. package/src/palettes/slate-arch.colors-snapshot.test.ts +1689 -0
  121. package/src/palettes/slate-arch.ts +188 -0
  122. package/src/palettes/slate-user.colors-snapshot.test.ts +1689 -0
  123. package/src/palettes/slate-user.ts +187 -0
  124. package/src/palettes/warm-arch.colors-snapshot.test.ts +1689 -0
  125. package/src/palettes/warm-arch.ts +222 -0
  126. package/src/palettes/warm-user.colors-snapshot.test.ts +1689 -0
  127. package/src/palettes/warm-user.ts +222 -0
  128. package/src/platform.ts +0 -3
  129. package/src/popover/get-element-ref.ts +28 -0
  130. package/src/popover/index.tsx +236 -339
  131. package/src/popover/{mobile-popup-context.tsx → mobile-popover-context.tsx} +7 -7
  132. package/src/popover/mobile-popover.tsx +169 -0
  133. package/src/popover/modifiers.tsx +2 -2
  134. package/src/popover/popup-stack-context.tsx +8 -9
  135. package/src/progress.tsx +2 -2
  136. package/src/reactions/reaction-button.tsx +12 -6
  137. package/src/root-theme-provider.test.tsx +411 -0
  138. package/src/scale-generator.ts +356 -0
  139. package/src/select/components/menu-list-virtualized.tsx +12 -25
  140. package/src/select/components/menu.tsx +12 -2
  141. package/src/select/index.tsx +6 -5
  142. package/src/select/select.tsx +38 -39
  143. package/src/select/styles.ts +0 -1
  144. package/src/select/util.ts +1 -1
  145. package/src/static-palettes.ts +356 -0
  146. package/src/thematic-color-picker.tsx +266 -0
  147. package/src/thematic-constants.tsx +27 -0
  148. package/src/thematic-controls.tsx +144 -0
  149. package/src/thematic-scales.tsx +122 -0
  150. package/src/thematic-state.ts +370 -0
  151. package/src/thematic.tsx +386 -0
  152. package/src/theme-provider.test.tsx +820 -0
  153. package/src/theme-provider.tsx +158 -92
  154. package/src/theme-settings.ts +67 -12
  155. package/src/theme-styles.ts +58 -6
  156. package/src/toast/toast-action.tsx +1 -1
  157. package/src/toast/toast.tsx +1 -2
  158. package/src/toggle-on-off.tsx +2 -2
  159. package/src/toggle.tsx +7 -8
  160. package/src/tooltip.tsx +14 -10
  161. package/src/type-badge.tsx +7 -14
  162. package/src/unit/styles.ts +2 -25
  163. package/src/unit/unit-with-tooltip.tsx +3 -2
  164. package/src/use-is-phone.tsx +7 -2
  165. package/src/use-long-press.tsx +2 -2
  166. package/src/use-on-screen-keyboard-data.tsx +2 -2
  167. package/src/with-data.tsx +4 -3
  168. package/src/workflow-progress-icon.tsx +2 -2
  169. package/.eslintignore +0 -3
  170. package/.eslintrc +0 -14
  171. package/src/__mocks__/createInlineTheme.js +0 -3
  172. package/src/create-inline-theme.ts +0 -66
  173. package/src/number-input/index.js +0 -191
  174. package/src/palette.ts +0 -237
package/src/palettes/slate-user.ts ADDED
@@ -0,0 +1,187 @@
1
+ import {ThemePalette} from "../palette-generator";
2
+
3
+ export const slateUserPalette: ThemePalette = {
4
+ key: "default",
5
+ white: "#FFFFFF",
6
+ whiteA: [
7
+ null,
8
+ "hsla(0, 0%, 100%, 0)",
9
+ "hsla(0, 0%, 100%, 0.01)",
10
+ "hsla(0, 0%, 100%, 0.03)",
11
+ "hsla(0, 0%, 100%, 0.06)",
12
+ "hsla(0, 0%, 100%, 0.09)",
13
+ "hsla(0, 0%, 100%, 0.12)",
14
+ "hsla(0, 0%, 100%, 0.18)",
15
+ "hsla(0, 0%, 100%, 0.25)",
16
+ "hsla(0, 0%, 100%, 0.39)",
17
+ "hsla(0, 0%, 100%, 0.45)",
18
+ "hsla(0, 0%, 100%, 0.59)",
19
+ "hsla(0, 0%, 100%, 0.92)",
20
+ ],
21
+ black: "#000000",
22
+ blackA: [
23
+ null,
24
+ "hsla(0, 0%, 0%, 0.01)",
25
+ "hsla(0, 0%, 0%, 0.03)",
26
+ "hsla(0, 0%, 0%, 0.05)",
27
+ "hsla(0, 0%, 0%, 0.07)",
28
+ "hsla(0, 0%, 0%, 0.09)",
29
+ "hsla(0, 0%, 0%, 0.11)",
30
+ "hsla(0, 0%, 0%, 0.14)",
31
+ "hsla(0, 0%, 0%, 0.22)",
32
+ "hsla(0, 0%, 0%, 0.44)",
33
+ "hsla(0, 0%, 0%, 0.48)",
34
+ "hsla(0, 0%, 0%, 0.57)",
35
+ "hsla(0, 0%, 0%, 0.91)",
36
+ ],
37
+ base: [
38
+ null,
39
+ "hsl(206, 0%, 99%)",
40
+ "hsl(210, 0%, 97%)",
41
+ "hsl(209, 0%, 96%)",
42
+ "hsl(209, 0%, 93%)",
43
+ "hsl(208, 0%, 91%)",
44
+ "hsl(208, 0%, 89%)",
45
+ "hsl(207, 0%, 86%)",
46
+ "hsl(205, 0%, 78%)",
47
+ "hsl(205, 0%, 62%)",
48
+ "hsl(205, 0%, 47%)",
49
+ "hsl(204, 0%, 37%)",
50
+ "hsl(200, 0%, 9%)",
51
+ ],
52
+ baseDark: [
53
+ null,
54
+ "hsl(200, 0%, 9%)",
55
+ "hsl(195, 0%, 11%)",
56
+ "hsl(197, 0%, 14%)",
57
+ "hsl(198, 0%, 16%)",
58
+ "hsl(199, 0%, 18%)",
59
+ "hsl(201, 0%, 20%)",
60
+ "hsl(203, 0%, 24%)",
61
+ "hsl(207, 0%, 32%)",
62
+ "hsl(206, 0%, 44%)",
63
+ "hsl(206, 0%, 50%)",
64
+ "hsl(206, 0%, 63%)",
65
+ "hsl(210, 0%, 93%)",
66
+ ],
67
+ accent: [
68
+ null,
69
+ "hsl(220, 60%, 99%)",
70
+ "hsl(220, 90%, 99%)",
71
+ "hsl(220, 88%, 97%)",
72
+ "hsl(220, 83%, 95%)",
73
+ "hsl(220, 77%, 92%)",
74
+ "hsl(220, 72%, 88%)",
75
+ "hsl(220, 67%, 82%)",
76
+ "hsl(220, 65%, 75%)",
77
+ "hsl(220, 62%, 56%)", // formerly brandColor.blue
78
+ "hsl(220, 59%, 51%)",
79
+ "hsl(220, 55%, 45%)",
80
+ "hsl(220, 62%, 17%)",
81
+ ],
82
+ accentDark: [
83
+ null,
84
+ "hsl(222, 24%, 10%)",
85
+ "hsl(222, 36%, 13%)",
86
+ "hsl(222, 43%, 18%)",
87
+ "hsl(222, 47%, 21%)",
88
+ "hsl(222, 45%, 24%)",
89
+ "hsl(222, 43%, 28%)",
90
+ "hsl(222, 50%, 35%)",
91
+ "hsl(222, 55%, 44%)",
92
+ "hsl(222, 60%, 56%)",
93
+ "hsl(222, 65%, 62%)",
94
+ "hsl(222, 70%, 76%)",
95
+ "hsl(222, 83%, 96%)",
96
+ ],
97
+ red: [
98
+ null,
99
+ "hsl(359, 100%, 99%)",
100
+ "hsl(359, 100%, 99%)",
101
+ "hsl(360, 100%, 97%)",
102
+ "hsl(360, 98%, 95%)",
103
+ "hsl(360, 90%, 92%)",
104
+ "hsl(360, 82%, 88%)",
105
+ "hsl(359, 74%, 82%)",
106
+ "hsl(359, 69%, 74%)",
107
+ "hsl(358, 75%, 59%)",
108
+ "hsl(358, 69%, 55%)",
109
+ "hsl(358, 65%, 49%)",
110
+ "hsl(354, 50%, 15%)",
111
+ ],
112
+ redDark: [
113
+ null,
114
+ "hsl(353, 23%, 10%)",
115
+ "hsl(357, 34%, 12%)",
116
+ "hsl(356, 43%, 16%)",
117
+ "hsl(356, 48%, 19%)",
118
+ "hsl(356, 51%, 22%)",
119
+ "hsl(356, 55%, 26%)",
120
+ "hsl(357, 60%, 32%)",
121
+ "hsl(358, 65%, 40%)",
122
+ "hsl(358, 75%, 59%)",
123
+ "hsl(358, 85%, 64%)",
124
+ "hsl(358, 100%, 70%)",
125
+ "hsl(351, 89%, 96%)",
126
+ ],
127
+ teal: [
128
+ null,
129
+ "hsl(165, 60%, 99%)",
130
+ "hsl(169, 65%, 97%)",
131
+ "hsl(169, 60%, 94%)",
132
+ "hsl(169, 53%, 90%)",
133
+ "hsl(170, 47%, 85%)",
134
+ "hsl(170, 43%, 78%)",
135
+ "hsl(170, 40%, 68%)",
136
+ "hsl(172, 42%, 52%)",
137
+ "hsl(169, 89%, 39%)", // formerly brandColor.green
138
+ "hsl(173, 83%, 33%)",
139
+ "hsl(174, 90%, 25%)",
140
+ "hsl(170, 50%, 13%)",
141
+ ],
142
+ tealDark: [
143
+ null,
144
+ "hsl(168, 48%, 6%)",
145
+ "hsl(169, 78%, 7%)",
146
+ "hsl(170, 76%, 9%)",
147
+ "hsl(171, 76%, 11%)",
148
+ "hsl(171, 76%, 13%)",
149
+ "hsl(172, 76%, 15%)",
150
+ "hsl(172, 77%, 19%)",
151
+ "hsl(173, 80%, 24%)",
152
+ "hsl(173, 80%, 36%)",
153
+ "hsl(174, 84%, 38%)",
154
+ "hsl(174, 90%, 41%)",
155
+ "hsl(166, 73%, 93%)",
156
+ ],
157
+ yellow: [
158
+ null,
159
+ "hsl(60, 54%, 98%)",
160
+ "hsl(52, 100%, 95%)",
161
+ "hsl(55, 100%, 91%)",
162
+ "hsl(54, 100%, 87%)",
163
+ "hsl(52, 98%, 82%)",
164
+ "hsl(50, 89%, 76%)",
165
+ "hsl(47, 80%, 68%)",
166
+ "hsl(48, 100%, 46%)",
167
+ "hsl(53, 92%, 50%)",
168
+ "hsl(50, 100%, 48%)",
169
+ "hsl(42, 100%, 29%)",
170
+ "hsl(40, 55%, 13%)",
171
+ ],
172
+ yellowDark: [
173
+ null,
174
+ "hsl(45, 100%, 5%)",
175
+ "hsl(46, 100%, 7%)",
176
+ "hsl(45, 100%, 9%)",
177
+ "hsl(45, 100%, 10%)",
178
+ "hsl(47, 100%, 12%)",
179
+ "hsl(49, 100%, 14%)",
180
+ "hsl(49, 90%, 18%)",
181
+ "hsl(50, 100%, 22%)",
182
+ "hsl(53, 92%, 50%)",
183
+ "hsl(54, 100%, 68%)",
184
+ "hsl(48, 100%, 47%)",
185
+ "hsl(53, 100%, 91%)",
186
+ ],
187
+ };