@solibo/solibo-ui 0.2.15 → 0.2.17

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 (117) hide show
  1. package/README.md +17 -2
  2. package/dist/assets/index.css +1 -1
  3. package/dist/assets/index10.css +1 -0
  4. package/dist/assets/index12.css +1 -1
  5. package/dist/assets/index13.css +1 -1
  6. package/dist/assets/index15.css +1 -1
  7. package/dist/assets/index16.css +1 -1
  8. package/dist/assets/index17.css +1 -1
  9. package/dist/assets/index18.css +1 -1
  10. package/dist/assets/index19.css +1 -1
  11. package/dist/assets/index2.css +1 -1
  12. package/dist/assets/index20.css +1 -1
  13. package/dist/assets/index21.css +1 -1
  14. package/dist/assets/index22.css +1 -1
  15. package/dist/assets/index23.css +1 -1
  16. package/dist/assets/index24.css +1 -1
  17. package/dist/assets/index3.css +1 -1
  18. package/dist/assets/index4.css +1 -1
  19. package/dist/assets/index5.css +1 -1
  20. package/dist/assets/index6.css +1 -1
  21. package/dist/assets/index7.css +1 -1
  22. package/dist/assets/index8.css +1 -1
  23. package/dist/assets/index9.css +0 -1
  24. package/dist/components/accordion/index.cjs +1 -1
  25. package/dist/components/accordion/index.js +6 -6
  26. package/dist/components/aside/index.cjs +1 -1
  27. package/dist/components/aside/index.cjs.map +1 -1
  28. package/dist/components/aside/index.js +16 -16
  29. package/dist/components/aside/index.js.map +1 -1
  30. package/dist/components/banner/index.cjs +1 -1
  31. package/dist/components/banner/index.cjs.map +1 -1
  32. package/dist/components/banner/index.js +14 -35
  33. package/dist/components/banner/index.js.map +1 -1
  34. package/dist/components/branding/index.cjs +1 -1
  35. package/dist/components/branding/index.js +1 -1
  36. package/dist/components/button/index.cjs +1 -1
  37. package/dist/components/button/index.cjs.map +1 -1
  38. package/dist/components/button/index.js +22 -53
  39. package/dist/components/button/index.js.map +1 -1
  40. package/dist/components/card/index.cjs +1 -1
  41. package/dist/components/card/index.cjs.map +1 -1
  42. package/dist/components/card/index.js +11 -37
  43. package/dist/components/card/index.js.map +1 -1
  44. package/dist/components/checkbox/index.cjs +1 -1
  45. package/dist/components/checkbox/index.cjs.map +1 -1
  46. package/dist/components/checkbox/index.js +19 -22
  47. package/dist/components/checkbox/index.js.map +1 -1
  48. package/dist/components/dialog/index.cjs +1 -1
  49. package/dist/components/dialog/index.cjs.map +1 -1
  50. package/dist/components/dialog/index.js +8 -52
  51. package/dist/components/dialog/index.js.map +1 -1
  52. package/dist/components/dropdown/index.cjs +1 -1
  53. package/dist/components/dropdown/index.js +3 -3
  54. package/dist/components/editor/index.cjs +1 -1
  55. package/dist/components/editor/index.js +1 -1
  56. package/dist/components/file/index.cjs +2 -0
  57. package/dist/components/file/index.cjs.map +1 -0
  58. package/dist/components/file/index.js +27 -0
  59. package/dist/components/file/index.js.map +1 -0
  60. package/dist/components/footer/index.cjs +1 -1
  61. package/dist/components/footer/index.js +1 -1
  62. package/dist/components/form/index.cjs +1 -1
  63. package/dist/components/form/index.js +1 -1
  64. package/dist/components/header/index.cjs +1 -1
  65. package/dist/components/header/index.js +4 -4
  66. package/dist/components/icon/index.cjs +1 -1
  67. package/dist/components/icon/index.cjs.map +1 -1
  68. package/dist/components/icon/index.js +26 -44
  69. package/dist/components/icon/index.js.map +1 -1
  70. package/dist/components/input/index.cjs +1 -1
  71. package/dist/components/input/index.js +13 -13
  72. package/dist/components/layout/index.cjs +1 -1
  73. package/dist/components/layout/index.js +1 -1
  74. package/dist/components/link/index.cjs +1 -1
  75. package/dist/components/link/index.js +1 -1
  76. package/dist/components/list/index.cjs +1 -1
  77. package/dist/components/list/index.js +1 -1
  78. package/dist/components/nav/index.cjs +1 -1
  79. package/dist/components/nav/index.js +42 -42
  80. package/dist/components/nav/index.js.map +1 -1
  81. package/dist/components/toggle/index.cjs +1 -1
  82. package/dist/components/toggle/index.cjs.map +1 -1
  83. package/dist/components/toggle/index.js +11 -20
  84. package/dist/components/toggle/index.js.map +1 -1
  85. package/dist/index.cjs +1 -1
  86. package/dist/index.d.ts +27 -99
  87. package/dist/index.js +32 -38
  88. package/dist/index.js.map +1 -1
  89. package/package.json +1 -1
  90. package/dist/assets/index25.css +0 -1
  91. package/dist/assets/index26.css +0 -1
  92. package/dist/assets/index27.css +0 -1
  93. package/dist/assets/styles.css +0 -1
  94. package/dist/components/component/index.cjs +0 -2
  95. package/dist/components/component/index.cjs.map +0 -1
  96. package/dist/components/component/index.js +0 -30
  97. package/dist/components/component/index.js.map +0 -1
  98. package/dist/components/document/index.cjs +0 -2
  99. package/dist/components/document/index.cjs.map +0 -1
  100. package/dist/components/document/index.js +0 -53
  101. package/dist/components/document/index.js.map +0 -1
  102. package/dist/components/grid/index.cjs +0 -2
  103. package/dist/components/grid/index.cjs.map +0 -1
  104. package/dist/components/grid/index.js +0 -140
  105. package/dist/components/grid/index.js.map +0 -1
  106. package/dist/components/loading/index.cjs +0 -2
  107. package/dist/components/loading/index.cjs.map +0 -1
  108. package/dist/components/loading/index.js +0 -99
  109. package/dist/components/loading/index.js.map +0 -1
  110. package/dist/components/picture/index.cjs +0 -2
  111. package/dist/components/picture/index.cjs.map +0 -1
  112. package/dist/components/picture/index.js +0 -150
  113. package/dist/components/picture/index.js.map +0 -1
  114. package/dist/styles.module-B_pXIacc.cjs +0 -2
  115. package/dist/styles.module-B_pXIacc.cjs.map +0 -1
  116. package/dist/styles.module-BhmNqlYd.js +0 -7
  117. package/dist/styles.module-BhmNqlYd.js.map +0 -1
package/dist/index.d.ts CHANGED
@@ -1,10 +1,7 @@
1
- import { default as default_2 } from 'react';
2
1
  import { DetailedHTMLProps } from 'react';
3
- import { DragEvent as DragEvent_2 } from 'react';
4
2
  import { ForwardRefExoticComponent } from 'react';
5
3
  import { InputHTMLAttributes } from 'react';
6
4
  import { JSX } from 'react/jsx-runtime';
7
- import { ReactNode } from 'react';
8
5
  import { RefAttributes } from 'react';
9
6
 
10
7
  export declare const Accordion: ({ children, icon, label, open }: AccordionProps) => JSX.Element;
@@ -36,7 +33,7 @@ declare type AsideProps = {
36
33
  variant?: keyof typeof variants;
37
34
  };
38
35
 
39
- export declare const Banner: ({ button, message, onClick, onDismiss, visible, ...props }: BannerProps) => JSX.Element;
36
+ export declare const Banner: ({ button, message, onClick, onDismiss, visible }: BannerProps) => JSX.Element;
40
37
 
41
38
  declare type BannerProps = {
42
39
  button: string;
@@ -58,64 +55,39 @@ declare const brandingSVG: {
58
55
  logo: string;
59
56
  };
60
57
 
61
- export declare const Button: ({ children, className, disabled, icon, label, loading, onClick, title, type, variant, ...props }: ButtonProps) => JSX.Element;
58
+ export declare const Button: ({ children, className, disabled, onClick, variant, ...props }: ButtonProps) => JSX.Element;
62
59
 
63
60
  declare type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
64
- children?: React.ReactNode;
61
+ children: React.ReactNode;
65
62
  className?: string;
66
63
  disabled?: boolean;
67
- icon?: IconName;
68
- label?: string;
69
64
  onClick?: React.MouseEventHandler<HTMLButtonElement>;
70
- loading?: boolean;
71
- title?: string;
72
- type?: 'button' | 'submit' | 'reset';
73
65
  variant?: keyof typeof variants_3;
74
66
  };
75
67
 
76
- export declare const Card: ({ children, contentHtml, contentText, draft, headerText, image, onClick, onDrop, subHeaderText, }: CardProps) => JSX.Element;
68
+ export declare const Card: ({ children, draft, image, onClick }: CardProps) => JSX.Element;
77
69
 
78
70
  declare type CardProps = {
79
- children?: ReactNode;
80
- contentHtml?: string;
81
- contentText?: string;
71
+ children: React.ReactNode;
82
72
  draft?: boolean;
83
- headerText?: string;
84
- image?: ReactNode;
85
- onClick?: () => void;
86
- onDrop?: (event: DragEvent_2<HTMLElement>) => void;
87
- subHeaderText?: string;
73
+ image?: React.ReactNode;
74
+ onClick?: React.MouseEventHandler<HTMLElement>;
88
75
  };
89
76
 
90
- export declare const Checkbox: ({ isChecked, isDefaultChecked, isDisabled, isLoading, label, onChange, ...props }: CheckboxProps) => JSX.Element;
77
+ export declare const Checkbox: ({ checked, disabled, isLoading, label, onChange, ...props }: CheckboxProps) => JSX.Element;
91
78
 
92
79
  declare type CheckboxProps = React.InputHTMLAttributes<HTMLInputElement> & {
93
- isChecked?: boolean;
94
- isDefaultChecked?: boolean;
95
- isDisabled?: boolean;
80
+ checked?: boolean;
81
+ disabled?: boolean;
96
82
  isLoading?: boolean;
97
83
  label?: string;
98
84
  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
99
85
  };
100
86
 
101
- export declare const Dialog: ({ button, children, message, title, ...props }: DialogProps) => JSX.Element;
87
+ export declare const Dialog: ({ children, ...props }: DialogProps) => JSX.Element;
102
88
 
103
89
  declare type DialogProps = React.DialogHTMLAttributes<HTMLDialogElement> & {
104
- button?: string;
105
- children?: React.ReactNode;
106
- message?: string;
107
- title?: string;
108
- };
109
-
110
- declare type DivProps = Omit<default_2.HTMLAttributes<HTMLDivElement>, 'children'>;
111
-
112
- declare const Document_2: ({ name, onClick, onDelete }: DocumentProps) => JSX.Element;
113
- export { Document_2 as Document }
114
-
115
- declare type DocumentProps = {
116
- name: string;
117
- onClick?: () => void;
118
- onDelete?: () => void;
90
+ children: React.ReactNode;
119
91
  };
120
92
 
121
93
  export declare const Dropdown: ({ children, inline, label, placeholder, ...props }: DropdownProps) => JSX.Element;
@@ -156,6 +128,14 @@ declare type FigureProps = {
156
128
  label?: string;
157
129
  };
158
130
 
131
+ declare const File_2: ({ name, url }: FileProps) => JSX.Element;
132
+ export { File_2 as File }
133
+
134
+ declare type FileProps = {
135
+ name: string;
136
+ url: string;
137
+ };
138
+
159
139
  export declare const Footer: ({ children, ...props }: FooterProps) => JSX.Element;
160
140
 
161
141
  declare type FooterProps = {
@@ -170,23 +150,6 @@ declare type FormProps = React.FormHTMLAttributes<HTMLFormElement> & {
170
150
  inline?: boolean;
171
151
  };
172
152
 
173
- export declare const Grid: ({ canRearrange, className, columns, items, onRearrange, ...props }: GridProps) => JSX.Element;
174
-
175
- declare type GridItem = {
176
- component: default_2.ReactNode;
177
- id: number;
178
- };
179
-
180
- declare type GridProps = DivProps & {
181
- canRearrange?: boolean;
182
- columns?: number;
183
- items: GridItem[];
184
- onRearrange?: (items: Array<{
185
- id: number;
186
- index: number;
187
- }>) => void;
188
- };
189
-
190
153
  export declare const Header: ({ children, size, label, ...props }: HeaderProps) => JSX.Element;
191
154
 
192
155
  declare type HeaderProps = {
@@ -197,7 +160,7 @@ declare type HeaderProps = {
197
160
  subHeader?: string;
198
161
  };
199
162
 
200
- export declare const Icon: ({ name, size, variant, loading, }: IconProps) => JSX.Element;
163
+ export declare const Icon: ({ name, size, variant }: IconProps) => JSX.Element;
201
164
 
202
165
  declare type IconName = keyof typeof iconPaths;
203
166
 
@@ -231,22 +194,6 @@ declare type IconProps = {
231
194
  loading?: boolean;
232
195
  };
233
196
 
234
- declare type ImageProps = {
235
- alt: string;
236
- canEdit: boolean;
237
- caption?: string;
238
- handleUpload?: (imageFile: File) => void;
239
- inputId?: string;
240
- isUploading?: boolean;
241
- minimumImagePixelHeight?: number;
242
- minimumImagePixelWidth?: number;
243
- placeholderSrc?: string;
244
- sizes?: string;
245
- source?: string;
246
- srcSet?: string;
247
- variant?: keyof typeof variants_6;
248
- };
249
-
250
197
  export declare const Input: ForwardRefExoticComponent<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
251
198
  disabled?: boolean;
252
199
  label?: string;
@@ -289,26 +236,17 @@ declare type NavProps = {
289
236
  variant?: keyof typeof variants_5;
290
237
  };
291
238
 
292
- export declare const PageLoader: ({ size }: PageLoaderProps) => JSX.Element;
293
-
294
- declare type PageLoaderProps = {
295
- size?: number;
296
- };
297
-
298
- export declare const Picture: ({ source, alt, variant, ...props }: ImageProps) => JSX.Element;
299
-
300
239
  declare const sizes: {
301
240
  large: string;
302
241
  medium: string;
303
242
  small: string;
304
243
  };
305
244
 
306
- export declare const Toggle: ({ isChecked, isDefaultChecked, isDisabled, isLoading, label, onChange, }: ToggleProps) => JSX.Element;
245
+ export declare const Toggle: ({ checked, disabled, isLoading, label, onChange }: ToggleProps) => JSX.Element;
307
246
 
308
247
  declare type ToggleProps = {
309
- isChecked?: boolean;
310
- isDefaultChecked?: boolean;
311
- isDisabled?: boolean;
248
+ checked?: boolean;
249
+ disabled?: boolean;
312
250
  isLoading?: boolean;
313
251
  label?: string;
314
252
  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
@@ -316,8 +254,8 @@ declare type ToggleProps = {
316
254
 
317
255
  declare const variants: {
318
256
  default: string;
319
- right: string;
320
- 'site-wide': string;
257
+ nav: string;
258
+ meta: string;
321
259
  };
322
260
 
323
261
  declare const variants_2: {
@@ -328,18 +266,13 @@ declare const variants_2: {
328
266
 
329
267
  declare const variants_3: {
330
268
  default: string;
331
- destructive: string;
332
269
  minimal: string;
333
270
  primary: string;
334
- secondary: string;
335
- white: string;
336
271
  };
337
272
 
338
273
  declare const variants_4: {
339
- clickable: string;
340
274
  default: string;
341
- deletable: string;
342
- dialog: string;
275
+ primary: string;
343
276
  white: string;
344
277
  };
345
278
 
@@ -349,9 +282,4 @@ declare const variants_5: {
349
282
  tabs: string;
350
283
  };
351
284
 
352
- declare const variants_6: {
353
- default: string;
354
- profile: string;
355
- };
356
-
357
285
  export { }
package/dist/index.js CHANGED
@@ -3,27 +3,24 @@ import { Aside as m } from "./components/aside/index.js";
3
3
  import { Banner as f } from "./components/banner/index.js";
4
4
  import { Branding as i } from "./components/branding/index.js";
5
5
  import { Button as a } from "./components/button/index.js";
6
- import { Card as u } from "./components/card/index.js";
7
- import { Checkbox as D } from "./components/checkbox/index.js";
6
+ import { Card as g } from "./components/card/index.js";
7
+ import { Checkbox as F } from "./components/checkbox/index.js";
8
8
  import { Dialog as A } from "./components/dialog/index.js";
9
- import { Document as F } from "./components/document/index.js";
10
- import { Dropdown as l } from "./components/dropdown/index.js";
11
- import { Dropzone as C } from "./components/dropzone/index.js";
12
- import { Editor as I } from "./components/editor/index.js";
9
+ import { Dropdown as D } from "./components/dropdown/index.js";
10
+ import { Dropzone as k } from "./components/dropzone/index.js";
11
+ import { Editor as C } from "./components/editor/index.js";
13
12
  import { Figure as b } from "./components/figure/index.js";
14
- import { Footer as v } from "./components/footer/index.js";
15
- import { Form as y } from "./components/form/index.js";
16
- import { Grid as E } from "./components/grid/index.js";
17
- import { Header as N } from "./components/header/index.js";
18
- import { Icon as j } from "./components/icon/index.js";
19
- import { Input as J } from "./components/input/index.js";
20
- import { Layout as M } from "./components/layout/index.js";
21
- import { Link as Q } from "./components/link/index.js";
22
- import { List as S } from "./components/list/index.js";
23
- import { Nav as V } from "./components/nav/index.js";
24
- import { PageLoader as X } from "./components/loading/index.js";
25
- import { Picture as Z } from "./components/picture/index.js";
26
- import { Toggle as $ } from "./components/toggle/index.js";
13
+ import { File as v } from "./components/file/index.js";
14
+ import { Footer as y } from "./components/footer/index.js";
15
+ import { Form as E } from "./components/form/index.js";
16
+ import { Header as H } from "./components/header/index.js";
17
+ import { Icon as T } from "./components/icon/index.js";
18
+ import { Input as q } from "./components/input/index.js";
19
+ import { Layout as K } from "./components/layout/index.js";
20
+ import { Link as O } from "./components/link/index.js";
21
+ import { List as Q } from "./components/list/index.js";
22
+ import { Nav as S } from "./components/nav/index.js";
23
+ import { Toggle as V } from "./components/toggle/index.js";
27
24
  import './assets/index.css';export {
28
25
  e as Accordion,
29
26
  t as AccordionGroup,
@@ -31,26 +28,23 @@ import './assets/index.css';export {
31
28
  f as Banner,
32
29
  i as Branding,
33
30
  a as Button,
34
- u as Card,
35
- D as Checkbox,
31
+ g as Card,
32
+ F as Checkbox,
36
33
  A as Dialog,
37
- F as Document,
38
- l as Dropdown,
39
- C as Dropzone,
40
- I as Editor,
34
+ D as Dropdown,
35
+ k as Dropzone,
36
+ C as Editor,
41
37
  b as Figure,
42
- v as Footer,
43
- y as Form,
44
- E as Grid,
45
- N as Header,
46
- j as Icon,
47
- J as Input,
48
- M as Layout,
49
- Q as Link,
50
- S as List,
51
- V as Nav,
52
- X as PageLoader,
53
- Z as Picture,
54
- $ as Toggle
38
+ v as File,
39
+ y as Footer,
40
+ E as Form,
41
+ H as Header,
42
+ T as Icon,
43
+ q as Input,
44
+ K as Layout,
45
+ O as Link,
46
+ Q as List,
47
+ S as Nav,
48
+ V as Toggle
55
49
  };
56
50
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@solibo/solibo-ui",
3
- "version": "0.2.15",
3
+ "version": "0.2.17",
4
4
  "type": "module",
5
5
  "scripts": {
6
6
  "dev": "vite build --watch",
@@ -1 +0,0 @@
1
- ._aside_16h63_1{background-color:var(--color-white)}._right_16h63_5{height:100vh;padding:var(--unit);width:100%}._right_16h63_5 figure{height:400px;left:calc(-2 * var(--unit));position:absolute;width:336px}._right_16h63_5 figure img{border-radius:var(--border-radius)}._sticky_16h63_22{position:-webkit-sticky;position:sticky;top:0}._site-wide_16h63_27{background:var(--gradient-green);border-radius:var(--border-radius);margin:var(--unit);overflow-y:auto;padding:var(--unit);padding-top:var(--unit-large);position:relative;transition:all var(--transition-duration)}._site-wide_16h63_27 figure{display:flex;justify-self:center}._site-wide_16h63_27 figure figcaption{display:none}._site-wide_16h63_27 footer{bottom:var(--unit);position:absolute}._site-wide_16h63_27 nav{flex:1 1 auto;padding-bottom:var(--unit-large)}._site-wide_16h63_27 nav a,._site-wide_16h63_27 nav summary{color:var(--color-white);padding:var(--unit-small) 0;text-decoration:none;font-weight:var(--font-weight-normal)}._site-wide_16h63_27 nav a span,._site-wide_16h63_27 nav summary span{background-color:var(--color-white);margin-bottom:var(--unit-tiny);margin-right:var(--unit-small)}._site-wide_16h63_27 nav a[aria-current=page],._site-wide_16h63_27 nav summary[aria-current=page]{font-weight:var(--font-weight-bold)}._site-wide_16h63_27 nav details a{margin-left:var(--unit);padding-left:var(--unit);position:relative;width:100%}._site-wide_16h63_27 nav details a:before{background-color:var(--color-white);border-radius:4px;content:"​";display:inline-block;height:100%;left:calc(-1 * var(--unit-tiny) - 1px);position:absolute;top:0;transition:width var(--transition-duration);width:2px}._site-wide_16h63_27 nav details a[aria-current=page]:before{left:calc(-1 * var(--unit-tiny) - 2px);width:4px}._site-wide_16h63_27 nav details a:hover{color:var(--color-white)}._site-wide_16h63_27 nav details a:last-child{margin-bottom:var(--unit)}._site-wide_16h63_27 nav[data-orientation=horizontal]{align-items:center;display:flex;justify-self:center;padding-bottom:var(--unit-large)}._site-wide_16h63_27 nav[data-orientation=horizontal] a{font-size:var(--font-size-small);padding:var(--unit) var(--unit-small);transition:all}._site-wide_16h63_27 nav[data-orientation=horizontal] a[data-active]{border-bottom:solid 2px var(--color-white);font-size:var(--font-size)}._site-wide_16h63_27 nav[data-orientation=horizontal] a:hover{color:var(--color-white);text-decoration:none}@media all and (width <= 550px){._portal_16h63_135{animation:calc(var(--transition-duration) * 2) ease-out 0ms 1 _portal-slide-in_16h63_1;border-top-left-radius:0;border-bottom-left-radius:0;margin:0}}@keyframes _portal-slide-in_16h63_1{0%{opacity:0;scale:.9;transform:translate(-100%)}to{opacity:1;scale:1;transform:translate(0)}}
@@ -1 +0,0 @@
1
- ._accordion_g1krd_1 details>:not(summary){max-height:0;opacity:0;transition:max-height var(--transition-duration) var(--transition-function),opacity var(--transition-duration) var(--transition-function)}._accordion_g1krd_1 details[open]>*{max-height:100vh;opacity:1}._accordion_g1krd_1 summary{cursor:pointer;list-style:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}._accordion_g1krd_1 summary::marker{display:none}
@@ -1 +0,0 @@
1
- ._icon_d115m_1{display:inline-block;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;vertical-align:middle}._small_d115m_8{height:var(--unit);width:var(--unit)}._medium_d115m_13{height:calc(var(--unit) * 1.5);width:calc(var(--unit) * 1.5)}._large_d115m_18{height:calc(var(--unit) * 2);width:calc(var(--unit) * 2)}._default_d115m_23{background-color:var(--color-icon)}._clickable_d115m_27{background-color:var(--color-primary)}._deletable_d115m_31{background-color:var(--color-text-error)}._dialog_d115m_35{background-color:var(--color-green)}._white_d115m_39{background-color:var(--color-white)}._wrapper_d115m_43{--size-dialog: calc(var(--unit) * 5)}._wrapper_d115m_43:has(>._dialog_d115m_35){align-content:center;background-color:var(--color-green-light);border-radius:var(--size-dialog);display:inline-block;height:var(--size-dialog);text-align:center;width:var(--size-dialog)}._wrapper_d115m_43 ._dialog_d115m_35{height:calc(var(--unit) * 3);width:calc(var(--unit) * 3)}
@@ -1 +0,0 @@
1
- ._spinner_gsv2s_1{color:#0000!important;position:relative}._spinner_gsv2s_1:before{animation:_spin_gsv2s_1 .8s linear infinite;aspect-ratio:1 / 1;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAxMjAgMTIwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogICAgPGRlZnM+CiAgICAgICAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkWSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgICAgICAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSJyZ2IoOTAgMzUgMjQ1KSIvPgogICAgICAgICAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0icmdiKDI1NSAyNTUgMjU1KSIvPgogICAgICAgICAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9InJnYig5MCAzNSAyNDUpIi8+CiAgICAgICAgPC9saW5lYXJHcmFkaWVudD4KCiAgICAgICAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkWCIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgICAgICAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSJyZ2IoMjU1IDI1NSAyNTUpIiBzdG9wLW9wYWNpdHk9IjAuNiIvPgogICAgICAgICAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0icmdiKDkwIDM1IDI0NSkiIHN0b3Atb3BhY2l0eT0iMC4yIi8+CiAgICAgICAgICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0icmdiKDI1NSAyNTUgMjU1KSIgc3RvcC1vcGFjaXR5PSIwLjYiLz4KICAgICAgICA8L2xpbmVhckdyYWRpZW50PgoKICAgICAgICA8ZmlsdGVyIGlkPSJibGVuZCI+CiAgICAgICAgICAgIDxmZUltYWdlIGhyZWY9IiNncmFkWSIgcmVzdWx0PSJncmFkWSIvPgogICAgICAgICAgICA8ZmVJbWFnZSBocmVmPSIjZ3JhZFgiIHJlc3VsdD0iZ3JhZFgiLz4KICAgICAgICAgICAgPGZlQmxlbmQgaW49ImdyYWRZIiBpbjI9ImdyYWRYIiBtb2RlPSJvdmVybGF5Ii8+CiAgICAgICAgPC9maWx0ZXI+CgogICAgICAgIDxtYXNrIGlkPSJyaW5nTWFzayI+CiAgICAgICAgICAgIDxjaXJjbGUgY3g9IjYwIiBjeT0iNjAiIHI9IjYwIiBmaWxsPSJ3aGl0ZSIvPgogICAgICAgICAgICA8Y2lyY2xlIGN4PSI2MCIgY3k9IjYwIiByPSIzNSIgZmlsbD0iYmxhY2siLz4KICAgICAgICA8L21hc2s+CiAgICA8L2RlZnM+CgogICAgPGNpcmNsZQogICAgICAgICAgICBjeD0iNjAiIGN5PSI2MCIgcj0iNTAiCiAgICAgICAgICAgIHN0cm9rZT0idXJsKCNncmFkWSkiCiAgICAgICAgICAgIHN0cm9rZS13aWR0aD0iMTUiCiAgICAgICAgICAgIGZpbGw9Im5vbmUiCiAgICAgICAgICAgIG1hc2s9InVybCgjcmluZ01hc2spIgogICAgLz4KICAgIDxjaXJjbGUKICAgICAgICAgICAgY3g9IjYwIiBjeT0iNjAiIHI9IjUwIgogICAgICAgICAgICBzdHJva2U9InVybCgjZ3JhZFgpIgogICAgICAgICAgICBzdHJva2Utd2lkdGg9IjE1IgogICAgICAgICAgICBmaWxsPSJub25lIgogICAgICAgICAgICBtYXNrPSJ1cmwoI3JpbmdNYXNrKSIKICAgICAgICAgICAgb3BhY2l0eT0iMC42IgogICAgLz4KPC9zdmc+);background-position:center;background-repeat:no-repeat;background-size:contain;content:"";height:100%;top:0;right:0;bottom:0;left:0;min-height:var(--unit);min-width:var(--unit);opacity:1;position:absolute;width:100%}@keyframes _spin_gsv2s_1{to{transform:rotate(360deg)}}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index18.css');const e=require("react/jsx-runtime"),n=require("../icon/index.cjs"),i="_component_l8zgx_1",t={component:i},s=({...o})=>e.jsx("div",{className:t.component,...o,children:e.jsxs("article",{children:[e.jsx("h1",{children:"Hello world"}),e.jsxs("p",{children:["Lorem ipsum dolor sit amet consectetur adipisicing elit. Ad doloribus odio, aperiam enim provident voluptates, eos illum, error nihil amet iste necessitatibus ab unde accusantium in. ",e.jsx("b",{children:"Explicabo quod eius numquam?"})]}),e.jsx("a",{href:"/?path=/docs/introduction--docs",children:e.jsx(n.Icon,{name:"home",variant:"dialog"})}),e.jsx("p",{children:"Feel free to copy this folder to have a bare minimum component."})]})});exports.Component=s;
2
- //# sourceMappingURL=index.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.cjs","sources":["../../../src/components/component/index.tsx"],"sourcesContent":["import { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport const Component = ({ ...props }) => {\n return (\n <div\n className={styles.component}\n {...props}\n >\n <article>\n <h1>Hello world</h1>\n\n <p>\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Ad doloribus odio, aperiam enim\n provident voluptates, eos illum, error nihil amet iste necessitatibus ab unde accusantium\n in. <b>Explicabo quod eius numquam?</b>\n </p>\n\n <a href='/?path=/docs/introduction--docs'>\n <Icon\n name='home'\n variant='dialog'\n />\n </a>\n\n <p>Feel free to copy this folder to have a bare minimum component.</p>\n </article>\n </div>\n );\n};\n"],"names":["Component","props","jsx","styles","Icon"],"mappings":"2LAGaA,EAAY,CAAC,CAAE,GAAGC,KAE3BC,EAAAA,IAAC,MAAA,CACC,UAAWC,EAAO,UACjB,GAAGF,EAEJ,gBAAC,UAAA,CACC,SAAA,CAAAC,EAAAA,IAAC,MAAG,SAAA,aAAA,CAAW,SAEd,IAAA,CAAE,SAAA,CAAA,0LAGGA,EAAAA,IAAC,KAAE,SAAA,8BAAA,CAA4B,CAAA,EACrC,EAEAA,EAAAA,IAAC,IAAA,CAAE,KAAK,kCACN,SAAAA,EAAAA,IAACE,EAAAA,KAAA,CACC,KAAK,OACL,QAAQ,QAAA,CAAA,EAEZ,EAEAF,EAAAA,IAAC,KAAE,SAAA,iEAAA,CAA+D,CAAA,CAAA,CACpE,CAAA,CAAA"}
@@ -1,30 +0,0 @@
1
- import { jsx as o, jsxs as e } from "react/jsx-runtime";
2
- import { Icon as n } from "../icon/index.js";
3
- import '../../assets/index18.css';const t = "_component_l8zgx_1", r = {
4
- component: t
5
- }, s = ({ ...i }) => /* @__PURE__ */ o(
6
- "div",
7
- {
8
- className: r.component,
9
- ...i,
10
- children: /* @__PURE__ */ e("article", { children: [
11
- /* @__PURE__ */ o("h1", { children: "Hello world" }),
12
- /* @__PURE__ */ e("p", { children: [
13
- "Lorem ipsum dolor sit amet consectetur adipisicing elit. Ad doloribus odio, aperiam enim provident voluptates, eos illum, error nihil amet iste necessitatibus ab unde accusantium in. ",
14
- /* @__PURE__ */ o("b", { children: "Explicabo quod eius numquam?" })
15
- ] }),
16
- /* @__PURE__ */ o("a", { href: "/?path=/docs/introduction--docs", children: /* @__PURE__ */ o(
17
- n,
18
- {
19
- name: "home",
20
- variant: "dialog"
21
- }
22
- ) }),
23
- /* @__PURE__ */ o("p", { children: "Feel free to copy this folder to have a bare minimum component." })
24
- ] })
25
- }
26
- );
27
- export {
28
- s as Component
29
- };
30
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/component/index.tsx"],"sourcesContent":["import { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport const Component = ({ ...props }) => {\n return (\n <div\n className={styles.component}\n {...props}\n >\n <article>\n <h1>Hello world</h1>\n\n <p>\n Lorem ipsum dolor sit amet consectetur adipisicing elit. Ad doloribus odio, aperiam enim\n provident voluptates, eos illum, error nihil amet iste necessitatibus ab unde accusantium\n in. <b>Explicabo quod eius numquam?</b>\n </p>\n\n <a href='/?path=/docs/introduction--docs'>\n <Icon\n name='home'\n variant='dialog'\n />\n </a>\n\n <p>Feel free to copy this folder to have a bare minimum component.</p>\n </article>\n </div>\n );\n};\n"],"names":["Component","props","jsx","styles","Icon"],"mappings":";;;;GAGaA,IAAY,CAAC,EAAE,GAAGC,QAE3B,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,EAAO;AAAA,IACjB,GAAGF;AAAA,IAEJ,4BAAC,WAAA,EACC,UAAA;AAAA,MAAA,gBAAAC,EAAC,QAAG,UAAA,cAAA,CAAW;AAAA,wBAEd,KAAA,EAAE,UAAA;AAAA,QAAA;AAAA,QAGG,gBAAAA,EAAC,OAAE,UAAA,+BAAA,CAA4B;AAAA,MAAA,GACrC;AAAA,MAEA,gBAAAA,EAAC,KAAA,EAAE,MAAK,mCACN,UAAA,gBAAAA;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAQ;AAAA,QAAA;AAAA,MAAA,GAEZ;AAAA,MAEA,gBAAAF,EAAC,OAAE,UAAA,kEAAA,CAA+D;AAAA,IAAA,EAAA,CACpE;AAAA,EAAA;AAAA;"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index16.css');const e=require("react/jsx-runtime"),s=require("../button/index.cjs"),r=require("../header/index.cjs"),t=require("../icon/index.cjs"),m="_document_5rt2n_1",u={document:m},a=({name:o,onClick:c,onDelete:n})=>e.jsxs("article",{onClick:c,className:u.document,children:[e.jsxs("section",{children:[e.jsx(t.Icon,{name:"document",size:"medium"}),e.jsx(r.Header,{label:o,size:3})]}),e.jsx(s.Button,{variant:"minimal",onClick:n?i=>{i.stopPropagation(),n()}:void 0,"aria-label":n?"Delete document":"Open document",children:e.jsx(t.Icon,{name:n?"x":"toDocument",size:"medium",variant:n?"deletable":"clickable"})})]});exports.Document=a;
2
- //# sourceMappingURL=index.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.cjs","sources":["../../../src/components/document/index.tsx"],"sourcesContent":["import { Button } from '@/components/button';\nimport { Header } from '@/components/header';\nimport { Icon } from '@/components/icon';\n\nimport styles from './styles.module.css';\n\nexport type DocumentProps = {\n name: string;\n onClick?: () => void;\n onDelete?: () => void;\n};\n\nexport const Document = ({ name, onClick, onDelete }: DocumentProps) => {\n return (\n <article\n onClick={onClick}\n className={styles.document}\n >\n <section>\n <Icon\n name={'document'}\n size={'medium'}\n />\n <Header\n label={name}\n size={3}\n />\n </section>\n <Button\n variant={'minimal'}\n onClick={\n onDelete\n ? (e) => {\n e.stopPropagation();\n onDelete();\n }\n : undefined\n }\n aria-label={onDelete ? 'Delete document' : 'Open document'}\n >\n <Icon\n name={onDelete ? 'x' : 'toDocument'}\n size={'medium'}\n variant={onDelete ? 'deletable' : 'clickable'}\n />\n </Button>\n </article>\n );\n};\n"],"names":["Document","name","onClick","onDelete","jsxs","styles","jsx","Icon","Header","Button","e"],"mappings":"2PAYaA,EAAW,CAAC,CAAE,KAAAC,EAAM,QAAAC,EAAS,SAAAC,KAEtCC,EAAAA,KAAC,UAAA,CACC,QAAAF,EACA,UAAWG,EAAO,SAElB,SAAA,CAAAD,OAAC,UAAA,CACC,SAAA,CAAAE,EAAAA,IAACC,EAAAA,KAAA,CACC,KAAM,WACN,KAAM,QAAA,CAAA,EAERD,EAAAA,IAACE,EAAAA,OAAA,CACC,MAAOP,EACP,KAAM,CAAA,CAAA,CACR,EACF,EACAK,EAAAA,IAACG,EAAAA,OAAA,CACC,QAAS,UACT,QACEN,EACKO,GAAM,CACLA,EAAE,gBAAA,EACFP,EAAA,CACF,EACA,OAEN,aAAYA,EAAW,kBAAoB,gBAE3C,SAAAG,EAAAA,IAACC,EAAAA,KAAA,CACC,KAAMJ,EAAW,IAAM,aACvB,KAAM,SACN,QAASA,EAAW,YAAc,WAAA,CAAA,CACpC,CAAA,CACF,CAAA,CAAA"}
@@ -1,53 +0,0 @@
1
- import { jsxs as o, jsx as m } from "react/jsx-runtime";
2
- import { Button as r } from "../button/index.js";
3
- import { Header as a } from "../header/index.js";
4
- import { Icon as e } from "../icon/index.js";
5
- import '../../assets/index16.css';const d = "_document_5rt2n_1", s = {
6
- document: d
7
- }, f = ({ name: n, onClick: i, onDelete: t }) => /* @__PURE__ */ o(
8
- "article",
9
- {
10
- onClick: i,
11
- className: s.document,
12
- children: [
13
- /* @__PURE__ */ o("section", { children: [
14
- /* @__PURE__ */ m(
15
- e,
16
- {
17
- name: "document",
18
- size: "medium"
19
- }
20
- ),
21
- /* @__PURE__ */ m(
22
- a,
23
- {
24
- label: n,
25
- size: 3
26
- }
27
- )
28
- ] }),
29
- /* @__PURE__ */ m(
30
- r,
31
- {
32
- variant: "minimal",
33
- onClick: t ? (c) => {
34
- c.stopPropagation(), t();
35
- } : void 0,
36
- "aria-label": t ? "Delete document" : "Open document",
37
- children: /* @__PURE__ */ m(
38
- e,
39
- {
40
- name: t ? "x" : "toDocument",
41
- size: "medium",
42
- variant: t ? "deletable" : "clickable"
43
- }
44
- )
45
- }
46
- )
47
- ]
48
- }
49
- );
50
- export {
51
- f as Document
52
- };
53
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/document/index.tsx"],"sourcesContent":["import { Button } from '@/components/button';\nimport { Header } from '@/components/header';\nimport { Icon } from '@/components/icon';\n\nimport styles from './styles.module.css';\n\nexport type DocumentProps = {\n name: string;\n onClick?: () => void;\n onDelete?: () => void;\n};\n\nexport const Document = ({ name, onClick, onDelete }: DocumentProps) => {\n return (\n <article\n onClick={onClick}\n className={styles.document}\n >\n <section>\n <Icon\n name={'document'}\n size={'medium'}\n />\n <Header\n label={name}\n size={3}\n />\n </section>\n <Button\n variant={'minimal'}\n onClick={\n onDelete\n ? (e) => {\n e.stopPropagation();\n onDelete();\n }\n : undefined\n }\n aria-label={onDelete ? 'Delete document' : 'Open document'}\n >\n <Icon\n name={onDelete ? 'x' : 'toDocument'}\n size={'medium'}\n variant={onDelete ? 'deletable' : 'clickable'}\n />\n </Button>\n </article>\n );\n};\n"],"names":["Document","name","onClick","onDelete","jsxs","styles","jsx","Icon","Header","Button","e"],"mappings":";;;;;;GAYaA,IAAW,CAAC,EAAE,MAAAC,GAAM,SAAAC,GAAS,UAAAC,QAEtC,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,SAAAF;AAAA,IACA,WAAWG,EAAO;AAAA,IAElB,UAAA;AAAA,MAAA,gBAAAD,EAAC,WAAA,EACC,UAAA;AAAA,QAAA,gBAAAE;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,MAAM;AAAA,YACN,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,QAER,gBAAAD;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,OAAOP;AAAA,YACP,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MACR,GACF;AAAA,MACA,gBAAAK;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,SAAS;AAAA,UACT,SACEN,IACI,CAACO,MAAM;AACL,YAAAA,EAAE,gBAAA,GACFP,EAAA;AAAA,UACF,IACA;AAAA,UAEN,cAAYA,IAAW,oBAAoB;AAAA,UAE3C,UAAA,gBAAAG;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,MAAMJ,IAAW,MAAM;AAAA,cACvB,MAAM;AAAA,cACN,SAASA,IAAW,cAAc;AAAA,YAAA;AAAA,UAAA;AAAA,QACpC;AAAA,MAAA;AAAA,IACF;AAAA,EAAA;AAAA;"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index8.css');const i=require("react/jsx-runtime"),g=require("../../classix-5H4IWnMA.cjs"),c=require("react"),D=require("../button/index.cjs"),S="_grid_1x08g_1",q="_items_1x08g_8",E="_controls_1x08g_19",O="_item_1x08g_8",d={grid:S,items:q,"item-container":"_item-container_1x08g_14",controls:E,"active-controls":"_active-controls_1x08g_27",item:O,"arrow-button-up":"_arrow-button-up_1x08g_59"},I=({canRearrange:o=!1,className:j,columns:p,items:a=[],onRearrange:r,...C})=>{const[b,h]=c.useState(a),m=c.useRef(null),v=c.useRef(null);c.useEffect(()=>{const t=a.map(n=>n.id),e=v.current;e&&e.length===t.length&&e.every((n,s)=>n===t[s])||(v.current=t,h(a))},[a]);const k=c.useCallback(t=>e=>{!o||!e.dataTransfer||(m.current=t,e.dataTransfer.effectAllowed="move")},[o]),w=c.useCallback(t=>{!o||!t.dataTransfer||(t.preventDefault(),t.dataTransfer.dropEffect="move")},[o]),y=c.useCallback(t=>e=>{if(!o)return;e.preventDefault();const n=m.current;n===null||n===t||(h(s=>{if(n<0||n>=s.length||t<0||t>s.length)return s;const l=[...s],[u]=l.splice(n,1);if(!u)return s;const f=Math.max(0,Math.min(t,l.length)),_=n<t?Math.min(f,l.length):f;return l.splice(_,0,u),r==null||r(l.map((T,N)=>({id:T.id,index:N}))),l}),m.current=null)},[o,r]),M=c.useCallback(()=>m.current=null,[]),x=c.useCallback((t,e)=>{h(n=>{const s=e==="up"?t-1:t+1;if(s<0||s>=n.length)return n;const l=[...n],[u]=l.splice(t,1);return u?(l.splice(s,0,u),r==null||r(l.map((f,_)=>({id:f.id,index:_}))),l):n})},[r]);return i.jsx("div",{className:g.t(d.grid,j),...C,children:i.jsx("div",{className:d.items,style:p?{gridTemplateColumns:`repeat(${p}, 1fr)`}:{},children:b.map((t,e)=>i.jsxs("div",{className:d["item-container"],children:[i.jsx("div",{className:d.item,"data-grid-id":t.id,draggable:o,onDragEnd:M,onDragOver:w,onDragStart:k(e),onDrop:y(e),children:t.component}),i.jsxs("div",{className:g.t(d.controls,o&&d["active-controls"]),children:[e>0&&i.jsx(D.Button,{"aria-label":"Move item up",variant:"minimal",className:d["arrow-button-up"],"data-direction":"up",type:"button",icon:"chevron",onClick:()=>x(e,"up")}),e<b.length-1&&i.jsx(D.Button,{"aria-label":"Move item down",variant:"minimal","data-direction":"down",type:"button",icon:"chevron",onClick:()=>x(e,"down")})]})]},t.id))})})};exports.Grid=I;
2
- //# sourceMappingURL=index.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.cjs","sources":["../../../src/components/grid/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '@/components/button';\n\nimport styles from './styles.module.css';\n\nexport type GridItem = {\n component: React.ReactNode;\n id: number;\n};\n\ntype DivProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'>;\n\nexport type GridProps = DivProps & {\n canRearrange?: boolean;\n columns?: number;\n items: GridItem[];\n onRearrange?: (items: Array<{ id: number; index: number }>) => void;\n};\n\nexport const Grid = ({\n canRearrange = false,\n className,\n columns,\n items = [],\n onRearrange,\n ...props\n}: GridProps) => {\n const [orderedItems, setOrderedItems] = useState<GridItem[]>(items);\n const dragIndexRef = useRef<number | null>(null);\n const previousItemIdsRef = useRef<number[]>(null);\n\n useEffect(() => {\n const nextItemIds = items.map((item) => item.id);\n const previousItemIds = previousItemIdsRef.current;\n\n if (\n previousItemIds &&\n previousItemIds.length === nextItemIds.length &&\n previousItemIds.every((id, index) => id === nextItemIds[index])\n ) {\n return;\n }\n\n previousItemIdsRef.current = nextItemIds;\n setOrderedItems(items);\n }, [items]);\n\n const handleDragStart = useCallback(\n (index: number) => (event: React.DragEvent<HTMLDivElement>) => {\n if (!canRearrange || !event.dataTransfer) {\n return;\n }\n\n dragIndexRef.current = index;\n event.dataTransfer.effectAllowed = 'move';\n },\n [canRearrange]\n );\n\n const handleDragOver = useCallback(\n (event: React.DragEvent<HTMLDivElement>) => {\n if (!canRearrange || !event.dataTransfer) {\n return;\n }\n\n event.preventDefault();\n event.dataTransfer.dropEffect = 'move';\n },\n [canRearrange]\n );\n\n const handleDrop = useCallback(\n (targetIndex: number) => (event: React.DragEvent<HTMLDivElement>) => {\n if (!canRearrange) {\n return;\n }\n\n event.preventDefault();\n\n const fromIndex = dragIndexRef.current;\n\n if (fromIndex === null || fromIndex === targetIndex) {\n return;\n }\n\n setOrderedItems((previousItems) => {\n if (\n fromIndex < 0 ||\n fromIndex >= previousItems.length ||\n targetIndex < 0 ||\n targetIndex > previousItems.length\n ) {\n return previousItems;\n }\n\n const nextItems = [...previousItems];\n const [movedItem] = nextItems.splice(fromIndex, 1);\n\n if (!movedItem) {\n return previousItems;\n }\n\n const boundedTarget = Math.max(0, Math.min(targetIndex, nextItems.length));\n const nextIndex =\n fromIndex < targetIndex ? Math.min(boundedTarget, nextItems.length) : boundedTarget;\n\n nextItems.splice(nextIndex, 0, movedItem);\n\n onRearrange?.(\n nextItems.map((item, index) => ({\n id: item.id,\n index,\n }))\n );\n\n return nextItems;\n });\n\n dragIndexRef.current = null;\n },\n [canRearrange, onRearrange]\n );\n\n const handleDragEnd = useCallback(() => (dragIndexRef.current = null), []);\n\n const handleMove = useCallback(\n (fromIndex: number, direction: 'up' | 'down') => {\n setOrderedItems((previousItems) => {\n const targetIndex = direction === 'up' ? fromIndex - 1 : fromIndex + 1;\n\n if (targetIndex < 0 || targetIndex >= previousItems.length) {\n return previousItems;\n }\n\n const nextItems = [...previousItems];\n const [movedItem] = nextItems.splice(fromIndex, 1);\n\n if (!movedItem) {\n return previousItems;\n }\n\n nextItems.splice(targetIndex, 0, movedItem);\n\n onRearrange?.(\n nextItems.map((item, index) => ({\n id: item.id,\n index,\n }))\n );\n\n return nextItems;\n });\n },\n [onRearrange]\n );\n\n return (\n <div\n className={cx(styles.grid, className)}\n {...props}\n >\n <div\n className={styles.items}\n style={columns ? { gridTemplateColumns: `repeat(${columns}, 1fr)` } : {}}\n >\n {orderedItems.map((item, index) => (\n <div\n key={item.id}\n className={styles['item-container']}\n >\n <div\n className={styles.item}\n data-grid-id={item.id}\n draggable={canRearrange}\n onDragEnd={handleDragEnd}\n onDragOver={handleDragOver}\n onDragStart={handleDragStart(index)}\n onDrop={handleDrop(index)}\n >\n {item.component}\n </div>\n\n <div className={cx(styles.controls, canRearrange && styles['active-controls'])}>\n {index > 0 && (\n <Button\n aria-label='Move item up'\n variant='minimal'\n className={styles['arrow-button-up']}\n data-direction='up'\n type='button'\n icon='chevron'\n onClick={() => handleMove(index, 'up')}\n />\n )}\n {index < orderedItems.length - 1 && (\n <Button\n aria-label='Move item down'\n variant='minimal'\n data-direction='down'\n type='button'\n icon='chevron'\n onClick={() => handleMove(index, 'down')}\n />\n )}\n </div>\n </div>\n ))}\n </div>\n </div>\n );\n};\n"],"names":["Grid","canRearrange","className","columns","items","onRearrange","props","orderedItems","setOrderedItems","useState","dragIndexRef","useRef","previousItemIdsRef","useEffect","nextItemIds","item","previousItemIds","id","index","handleDragStart","useCallback","event","handleDragOver","handleDrop","targetIndex","fromIndex","previousItems","nextItems","movedItem","boundedTarget","nextIndex","handleDragEnd","handleMove","direction","jsx","cx","styles","jsxs","Button"],"mappings":"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"}