@pismo/marola 0.0.1-alpha.32 → 0.0.1-alpha.4

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 (176) hide show
  1. package/README.md +5 -17
  2. package/dist/{Button-2b1peDFT.js → Button-C3Qm852g.js} +23 -23
  3. package/dist/Dialog.module-BO0mdB7d.js +15 -0
  4. package/dist/ListContext-D6-YwtZn.js +18 -0
  5. package/dist/Tabs.module-_kSbSyth.js +66 -0
  6. package/dist/assets/CallToActionButton.css +1 -0
  7. package/dist/assets/Dialog.css +1 -1
  8. package/dist/assets/LoadingSpinner.css +1 -1
  9. package/dist/assets/Tabs.css +1 -1
  10. package/dist/assets/Typography.css +1 -1
  11. package/dist/assets/main.css +1 -0
  12. package/dist/components/CallToActionButton/CallToActionButton.d.ts +21 -0
  13. package/dist/components/CallToActionButton/CallToActionButton.js +57 -0
  14. package/dist/components/Dialog/Actions.js +1 -1
  15. package/dist/components/Dialog/Backdrop.d.ts +1 -1
  16. package/dist/components/Dialog/Backdrop.js +9 -2
  17. package/dist/components/Dialog/CloseIconButton.js +124 -12
  18. package/dist/components/Dialog/Dialog.d.ts +5 -6
  19. package/dist/components/Dialog/Dialog.js +20103 -445
  20. package/dist/components/Dialog/{DialogTitle.d.ts → Title.d.ts} +3 -3
  21. package/dist/components/Dialog/Title.js +14 -0
  22. package/dist/components/LoadingSpinner/LoadingSpinner.d.ts +0 -2
  23. package/dist/components/LoadingSpinner/LoadingSpinner.js +13 -12
  24. package/dist/components/Tabs/Tab.d.ts +1 -6
  25. package/dist/components/Tabs/Tab.js +173 -118
  26. package/dist/components/Tabs/TabPanel.d.ts +1 -5
  27. package/dist/components/Tabs/TabPanel.js +10 -8
  28. package/dist/components/Tabs/Tabs.d.ts +2 -8
  29. package/dist/components/Tabs/Tabs.js +701 -250
  30. package/dist/components/Typography/Typography.d.ts +6 -17
  31. package/dist/components/Typography/Typography.js +64 -55
  32. package/dist/{index-CH45lKw7.js → index-BZ1lkM_M.js} +159 -162
  33. package/dist/main.d.ts +5 -27
  34. package/dist/main.js +21 -75
  35. package/dist/types/helpers.d.ts +7 -14
  36. package/dist/useButton-CbmjmH5z.js +186 -0
  37. package/dist/useCompoundItem-B7wfGDHQ.js +41 -0
  38. package/package.json +9 -50
  39. package/src/playground/Playground.tsx +20 -0
  40. package/dist/ClickAwayListener-BSW-Nd-y.js +0 -107
  41. package/dist/Dialog.module-DFEmFdYT.js +0 -30
  42. package/dist/Group-B3p31ftp.js +0 -26
  43. package/dist/Popup-B6ZSGIEI.js +0 -1248
  44. package/dist/Portal-DIeBsWdL.js +0 -73
  45. package/dist/SelectButton-C8JQKaf4.js +0 -61
  46. package/dist/Tabs.module-jkH1Qjn7.js +0 -22
  47. package/dist/Toggle-BCgIItCc.js +0 -142
  48. package/dist/assets/Advice.css +0 -1
  49. package/dist/assets/Button.css +0 -1
  50. package/dist/assets/Checkbox.css +0 -1
  51. package/dist/assets/EllipsisTooltip.css +0 -1
  52. package/dist/assets/Group.css +0 -1
  53. package/dist/assets/IconButton.css +0 -1
  54. package/dist/assets/Input.css +0 -1
  55. package/dist/assets/InputSearch.css +0 -1
  56. package/dist/assets/PageHeader.css +0 -1
  57. package/dist/assets/Pagination.css +0 -1
  58. package/dist/assets/SelectButton.css +0 -1
  59. package/dist/assets/Skeleton.css +0 -1
  60. package/dist/assets/Snackbar.css +0 -1
  61. package/dist/assets/SortTooltip.css +0 -1
  62. package/dist/assets/Stepper.css +0 -1
  63. package/dist/assets/Table.css +0 -1
  64. package/dist/assets/TextDisplay.css +0 -1
  65. package/dist/assets/Toggle.css +0 -1
  66. package/dist/assets/Toggle2.css +0 -1
  67. package/dist/assets/Tooltip.css +0 -1
  68. package/dist/combineHooksSlotProps-DVjg9PRh.js +0 -80
  69. package/dist/components/Advice/Advice.d.ts +0 -30
  70. package/dist/components/Advice/Advice.js +0 -47
  71. package/dist/components/Advice/Advice.stories.d.ts +0 -18
  72. package/dist/components/Button/Button.d.ts +0 -32
  73. package/dist/components/Button/Button.js +0 -65
  74. package/dist/components/Button/Button.stories.d.ts +0 -62
  75. package/dist/components/Checkbox/Checkbox.d.ts +0 -34
  76. package/dist/components/Checkbox/Checkbox.js +0 -71
  77. package/dist/components/Checkbox/Checkbox.stories.d.ts +0 -31
  78. package/dist/components/Chip/Chip.d.ts +0 -39
  79. package/dist/components/Chip/Chip.js +0 -19
  80. package/dist/components/Chip/Chip.stories.d.ts +0 -42
  81. package/dist/components/Chip/chip.test.d.ts +0 -1
  82. package/dist/components/Dialog/Dialog.stories.d.ts +0 -343
  83. package/dist/components/Dialog/DialogTitle.js +0 -29
  84. package/dist/components/EllipsisTooltip/EllipsisTooltip.d.ts +0 -7
  85. package/dist/components/EllipsisTooltip/EllipsisTooltip.js +0 -23
  86. package/dist/components/EllipsisTooltip/EllipsisTooltip.stories.d.ts +0 -31
  87. package/dist/components/Icon/Icon.d.ts +0 -11
  88. package/dist/components/Icon/Icon.js +0 -127
  89. package/dist/components/Icon/Icon.stories.d.ts +0 -15
  90. package/dist/components/Icon/types.d.ts +0 -5
  91. package/dist/components/Icon/types.js +0 -1
  92. package/dist/components/IconButton/Icon.stories.d.ts +0 -15
  93. package/dist/components/IconButton/IconButton.d.ts +0 -38
  94. package/dist/components/IconButton/IconButton.js +0 -63
  95. package/dist/components/Input/Input.d.ts +0 -44
  96. package/dist/components/Input/Input.js +0 -508
  97. package/dist/components/Input/Input.stories.d.ts +0 -43
  98. package/dist/components/InputSearch/InputSearch.d.ts +0 -9
  99. package/dist/components/InputSearch/InputSearch.js +0 -34
  100. package/dist/components/InputSearch/InputSearch.stories.d.ts +0 -39
  101. package/dist/components/LoadingSpinner/LoadingSpinner.stories.d.ts +0 -14
  102. package/dist/components/PageHeader/PageHeader.d.ts +0 -66
  103. package/dist/components/PageHeader/PageHeader.js +0 -87
  104. package/dist/components/PageHeader/PageHeader.stories.d.ts +0 -14
  105. package/dist/components/Pagination/Pagination.d.ts +0 -55
  106. package/dist/components/Pagination/Pagination.js +0 -237
  107. package/dist/components/Pagination/Pagination.stories.d.ts +0 -17
  108. package/dist/components/Select/Select.d.ts +0 -26
  109. package/dist/components/Select/Select.js +0 -857
  110. package/dist/components/Select/Select.stories.d.ts +0 -22
  111. package/dist/components/Select/SelectButton.d.ts +0 -12
  112. package/dist/components/Select/SelectButton.js +0 -8
  113. package/dist/components/Skeleton/Skeleton.d.ts +0 -25
  114. package/dist/components/Skeleton/Skeleton.js +0 -23
  115. package/dist/components/Skeleton/Skeleton.stories.d.ts +0 -14
  116. package/dist/components/Skeleton/SkeletonCircle.stories.d.ts +0 -14
  117. package/dist/components/Skeleton/SkeletonTable.stories.d.ts +0 -16
  118. package/dist/components/Snackbar/Snackbar.d.ts +0 -27
  119. package/dist/components/Snackbar/Snackbar.js +0 -639
  120. package/dist/components/Snackbar/Snackbar.stories.d.ts +0 -319
  121. package/dist/components/SortTooltip/SortTooltip.d.ts +0 -28
  122. package/dist/components/SortTooltip/SortTooltip.js +0 -93
  123. package/dist/components/Stepper/Stepper.d.ts +0 -26
  124. package/dist/components/Stepper/Stepper.js +0 -48
  125. package/dist/components/Stepper/Stepper.stories.d.ts +0 -16
  126. package/dist/components/Table/Table.d.ts +0 -56
  127. package/dist/components/Table/Table.js +0 -137
  128. package/dist/components/Table/Table.stories.d.ts +0 -29
  129. package/dist/components/Table/TableContext.d.ts +0 -19
  130. package/dist/components/Table/TableContext.js +0 -21
  131. package/dist/components/Table/_Table.TBody.stories.d.ts +0 -14
  132. package/dist/components/Table/_Table.THead.stories.d.ts +0 -14
  133. package/dist/components/Table/_Table.Td.stories.d.ts +0 -16
  134. package/dist/components/Table/_Table.Th.stories.d.ts +0 -15
  135. package/dist/components/Table/_Table.Tr.stories.d.ts +0 -15
  136. package/dist/components/Tabs/Tab.stories.d.ts +0 -15
  137. package/dist/components/Tabs/TabPanel.stories.d.ts +0 -14
  138. package/dist/components/Tabs/Tabs.stories.d.ts +0 -14
  139. package/dist/components/TextDisplay/TextDisplay.d.ts +0 -23
  140. package/dist/components/TextDisplay/TextDisplay.js +0 -37
  141. package/dist/components/TextDisplay/TextDisplay.stories.d.ts +0 -13
  142. package/dist/components/TextDisplay/textDisplay.test.d.ts +0 -1
  143. package/dist/components/Toggle/Toggle.d.ts +0 -11
  144. package/dist/components/Toggle/Toggle.js +0 -266
  145. package/dist/components/Toggle/Toggle.stories.d.ts +0 -21
  146. package/dist/components/ToggleGroup/Group.d.ts +0 -18
  147. package/dist/components/ToggleGroup/Group.js +0 -7
  148. package/dist/components/ToggleGroup/Group.test.d.ts +0 -1
  149. package/dist/components/ToggleGroup/Toggle.d.ts +0 -15
  150. package/dist/components/ToggleGroup/Toggle.js +0 -17
  151. package/dist/components/ToggleGroup/Toggle.test.d.ts +0 -1
  152. package/dist/components/ToggleGroup/ToggleGroup.d.ts +0 -2
  153. package/dist/components/ToggleGroup/ToggleGroup.js +0 -6
  154. package/dist/components/ToggleGroup/ToggleGroup.stories.d.ts +0 -25
  155. package/dist/components/Tooltip/Tooltip.d.ts +0 -33
  156. package/dist/components/Tooltip/Tooltip.js +0 -141
  157. package/dist/components/Tooltip/Tooltip.stories.d.ts +0 -35
  158. package/dist/components/Typography/Typography.stories.d.ts +0 -32
  159. package/dist/components/Typography/typography.test.d.ts +0 -1
  160. package/dist/contexts/SnackbarProvider/SnackbarProvider.d.ts +0 -11
  161. package/dist/contexts/SnackbarProvider/SnackbarProvider.js +0 -50
  162. package/dist/contexts/SnackbarProvider/SnackbarProvider.stories.d.ts +0 -21
  163. package/dist/index-CjW42-M-.js +0 -19584
  164. package/dist/marola.css +0 -1
  165. package/dist/test-utils/assertStyles.d.ts +0 -1
  166. package/dist/test-utils/assertStyles.js +0 -11
  167. package/dist/useButton-DNk3wrQp.js +0 -105
  168. package/dist/useCompoundItem-D1iRfg8D.js +0 -84
  169. package/dist/useControlled-CCMYYdCM.js +0 -31
  170. package/dist/useEventCallback-xTG9piMa.js +0 -45
  171. package/dist/useIsFocusVisible-BH4IAdcw.js +0 -69
  172. package/dist/useList-B0hog_3-.js +0 -436
  173. package/dist/useTimeout-DxF9kiZL.js +0 -36
  174. package/dist/utils/styleStrings.d.ts +0 -6
  175. package/dist/utils/styleStrings.js +0 -10
  176. package/dist/utils/styleStrings.test.d.ts +0 -1
package/dist/main.d.ts CHANGED
@@ -1,30 +1,8 @@
1
- /**
2
- * This file is automatically generated. Any changes will be lost.
3
- * run "yarn export-files" or "yarn build" to regenerate it.
4
- */
5
- export * from './components/Advice/Advice';
6
- export * from './components/Button/Button';
7
- export * from './components/Checkbox/Checkbox';
8
- export * from './components/Chip/Chip';
1
+
9
2
  export * from './components/Dialog/Dialog';
10
- export * from './components/EllipsisTooltip/EllipsisTooltip';
11
- export * from './components/Icon/Icon';
12
- export * from './components/IconButton/IconButton';
13
- export * from './components/Input/Input';
14
- export * from './components/InputSearch/InputSearch';
3
+ export * from './components/Typography/Typography';
15
4
  export * from './components/LoadingSpinner/LoadingSpinner';
16
- export * from './components/PageHeader/PageHeader';
17
- export * from './components/Pagination/Pagination';
18
- export * from './components/Select/Select';
19
- export * from './components/Skeleton/Skeleton';
20
- export * from './components/Snackbar/Snackbar';
21
- export * from './components/SortTooltip/SortTooltip';
22
- export * from './components/Stepper/Stepper';
23
- export * from './components/Table/Table';
5
+ export * from './components/CallToActionButton/CallToActionButton';
24
6
  export * from './components/Tabs/Tabs';
25
- export * from './components/TextDisplay/TextDisplay';
26
- export * from './components/Toggle/Toggle';
27
- export * from './components/ToggleGroup/ToggleGroup';
28
- export * from './components/Tooltip/Tooltip';
29
- export * from './components/Typography/Typography';
30
- export * from './contexts/SnackbarProvider/SnackbarProvider';
7
+ export * from './components/Tabs/Tab';
8
+ export * from './components/Tabs/TabPanel';
package/dist/main.js CHANGED
@@ -1,77 +1,23 @@
1
- import { Advice as e } from "./components/Advice/Advice.js";
2
- import { Button as p } from "./components/Button/Button.js";
3
- import { Checkbox as f } from "./components/Checkbox/Checkbox.js";
4
- import { C as m, T as n } from "./Toggle-BCgIItCc.js";
5
- import { Dialog as i } from "./components/Dialog/Dialog.js";
6
- import { EllipsisTooltip as s } from "./components/EllipsisTooltip/EllipsisTooltip.js";
7
- import { Icon as g } from "./components/Icon/Icon.js";
8
- import { IconButton as u } from "./components/IconButton/IconButton.js";
9
- import { Input as d } from "./components/Input/Input.js";
10
- import { InputSearch as C } from "./components/InputSearch/InputSearch.js";
11
- import { LoadingSpinner as D } from "./components/LoadingSpinner/LoadingSpinner.js";
12
- import { PageHeader as y } from "./components/PageHeader/PageHeader.js";
13
- import { Pagination as B, paginationDefaultTranslations as G } from "./components/Pagination/Pagination.js";
14
- import { Select as A, SelectOption as H } from "./components/Select/Select.js";
15
- import { Skeleton as L, SkeletonCircle as O, SkeletonTable as j } from "./components/Skeleton/Skeleton.js";
16
- import { Snackbar as w } from "./components/Snackbar/Snackbar.js";
17
- import { SortTooltip as F, sortTooltipDefaultTranslations as J } from "./components/SortTooltip/SortTooltip.js";
18
- import { Stepper as M } from "./components/Stepper/Stepper.js";
19
- import { TBody as Q, THead as R, Table as U, Td as V, Th as W, Tr as X } from "./components/Table/Table.js";
20
- import { Tabs as Z } from "./components/Tabs/Tabs.js";
21
- import { TextDisplay as $ } from "./components/TextDisplay/TextDisplay.js";
22
- import { Toggle as ro } from "./components/Toggle/Toggle.js";
23
- import { G as to } from "./Group-B3p31ftp.js";
24
- import { Tooltip as ao } from "./components/Tooltip/Tooltip.js";
25
- import { Typography as xo } from "./components/Typography/Typography.js";
26
- import { SnackbarContext as no, SnackbarProvider as lo, useSnackbar as io } from "./contexts/SnackbarProvider/SnackbarProvider.js";
27
- import { default as so } from "./components/Dialog/DialogTitle.js";
28
- import { default as go } from "./components/Dialog/Content.js";
29
- import { default as uo } from "./components/Dialog/Actions.js";
30
- import { Tab as ko } from "./components/Tabs/Tab.js";
31
- import { TabPanel as ho } from "./components/Tabs/TabPanel.js";
1
+ import './assets/main.css';
2
+ import { Dialog as t } from "./components/Dialog/Dialog.js";
3
+ import { Typography as a } from "./components/Typography/Typography.js";
4
+ import { LoadingSpinner as p } from "./components/LoadingSpinner/LoadingSpinner.js";
5
+ import { CallToActionButton as x } from "./components/CallToActionButton/CallToActionButton.js";
6
+ import { Tabs as n } from "./components/Tabs/Tabs.js";
7
+ import { Tab as T } from "./components/Tabs/Tab.js";
8
+ import { TabPanel as d } from "./components/Tabs/TabPanel.js";
9
+ import { default as u } from "./components/Dialog/Title.js";
10
+ import { default as c } from "./components/Dialog/Content.js";
11
+ import { default as A } from "./components/Dialog/Actions.js";
32
12
  export {
33
- uo as Actions,
34
- e as Advice,
35
- p as Button,
36
- f as Checkbox,
37
- m as Chip,
38
- go as Content,
39
- i as Dialog,
40
- so as DialogTitle,
41
- s as EllipsisTooltip,
42
- g as Icon,
43
- u as IconButton,
44
- d as Input,
45
- C as InputSearch,
46
- D as LoadingSpinner,
47
- y as PageHeader,
48
- B as Pagination,
49
- A as Select,
50
- H as SelectOption,
51
- L as Skeleton,
52
- O as SkeletonCircle,
53
- j as SkeletonTable,
54
- w as Snackbar,
55
- no as SnackbarContext,
56
- lo as SnackbarProvider,
57
- F as SortTooltip,
58
- M as Stepper,
59
- Q as TBody,
60
- R as THead,
61
- ko as Tab,
62
- ho as TabPanel,
63
- U as Table,
64
- Z as Tabs,
65
- V as Td,
66
- $ as TextDisplay,
67
- W as Th,
68
- ro as Toggle,
69
- to as ToggleGroup,
70
- n as ToggleGroupItem,
71
- ao as Tooltip,
72
- X as Tr,
73
- xo as Typography,
74
- G as paginationDefaultTranslations,
75
- J as sortTooltipDefaultTranslations,
76
- io as useSnackbar
13
+ A as Actions,
14
+ x as CallToActionButton,
15
+ c as Content,
16
+ t as Dialog,
17
+ u as DialogTitle,
18
+ p as LoadingSpinner,
19
+ T as Tab,
20
+ d as TabPanel,
21
+ n as Tabs,
22
+ a as Typography
77
23
  };
@@ -1,9 +1,10 @@
1
- /// <reference types="vite-plugin-svgr/client" />
2
-
3
1
  // Saves having to declare 'never' for every property that exists on the 'other' type
4
2
  // Creates a new type that 'only' has properties in the first type and not in the second, if the property does not
5
3
  // exist in the second type, it is given the value of 'never' so it can never be set
6
- type Only<T, U> = { [P in keyof T]: T[P] } & Omit<{ [P in keyof U]?: never }, keyof T>;
4
+ type Only<T, U> = { [P in keyof T]: T[P] } & Omit<
5
+ { [P in keyof U]?: never },
6
+ keyof T
7
+ >;
7
8
 
8
9
  // Usage MyNewType = Either<TypeA, TypeB>
9
10
  // Creates a new type via union based on two types
@@ -14,14 +15,6 @@ export type Either<T, U> = Only<T, U> | Only<U, T>;
14
15
  // note these arguments must be declared in MyType as optional '?'
15
16
  type RequireAllOrNone<T, U extends keyof T = never> = (
16
17
  | Required<Pick<T, U>> // Require all properties
17
- | Partial<Record<U, never>> // Require none
18
- ) &
19
- Omit<T, U>; // remaining keys not listed in U
20
-
21
- // S = string, D = delimiter to split by. Then split S by D and return array of strings. "foo-bar-baz" = ["foo","bar","baz"]
22
- // Fallback if no '-' return [s] which is an array of the input string e.g. foo = [foo]
23
- type Split<S extends string, D extends string> = string extends S
24
- ? string[]
25
- : S extends `${infer T}${D}${infer Rest}`
26
- ? [T, ...Split<Rest, D>]
27
- : [S];
18
+ | Partial<Record<U, never>>
19
+ ) & // Require none
20
+ Omit<T, U>; // remaining keys not listed in U
@@ -0,0 +1,186 @@
1
+ import { u as _, _ as k, e as I } from "./index-BZ1lkM_M.js";
2
+ import * as l from "react";
3
+ function A(r) {
4
+ const {
5
+ rootElementName: n = "",
6
+ componentName: o
7
+ } = r, [a, i] = l.useState(n.toUpperCase());
8
+ process.env.NODE_ENV !== "production" && l.useEffect(() => {
9
+ n && a !== n.toUpperCase() && console.error(`useRootElementName: the \`rootElementName\` prop of ${o ? `the ${o} component` : "a component"} expected the '${n}' element, but a '${a.toLowerCase()}' was rendered instead`, "This may cause hydration issues in an SSR context, for example in a Next.js app");
10
+ }, [n, a, o]);
11
+ const c = l.useCallback((b) => {
12
+ var f;
13
+ i((f = b == null ? void 0 : b.tagName) != null ? f : "");
14
+ }, []);
15
+ return [a, c];
16
+ }
17
+ class F {
18
+ constructor() {
19
+ this.currentId = null, this.clear = () => {
20
+ this.currentId !== null && (clearTimeout(this.currentId), this.currentId = null);
21
+ }, this.disposeEffect = () => this.clear;
22
+ }
23
+ static create() {
24
+ return new F();
25
+ }
26
+ /**
27
+ * Executes `fn` after `delay`, clearing any previously scheduled call.
28
+ */
29
+ start(n, o) {
30
+ this.clear(), this.currentId = setTimeout(() => {
31
+ this.currentId = null, o();
32
+ }, n);
33
+ }
34
+ }
35
+ let R = !0, w = !1;
36
+ const W = new F(), j = {
37
+ text: !0,
38
+ search: !0,
39
+ url: !0,
40
+ tel: !0,
41
+ email: !0,
42
+ password: !0,
43
+ number: !0,
44
+ date: !0,
45
+ month: !0,
46
+ week: !0,
47
+ time: !0,
48
+ datetime: !0,
49
+ "datetime-local": !0
50
+ };
51
+ function X(r) {
52
+ const {
53
+ type: n,
54
+ tagName: o
55
+ } = r;
56
+ return !!(o === "INPUT" && j[n] && !r.readOnly || o === "TEXTAREA" && !r.readOnly || r.isContentEditable);
57
+ }
58
+ function q(r) {
59
+ r.metaKey || r.altKey || r.ctrlKey || (R = !0);
60
+ }
61
+ function T() {
62
+ R = !1;
63
+ }
64
+ function z() {
65
+ this.visibilityState === "hidden" && w && (R = !0);
66
+ }
67
+ function G(r) {
68
+ r.addEventListener("keydown", q, !0), r.addEventListener("mousedown", T, !0), r.addEventListener("pointerdown", T, !0), r.addEventListener("touchstart", T, !0), r.addEventListener("visibilitychange", z, !0);
69
+ }
70
+ function J(r) {
71
+ const {
72
+ target: n
73
+ } = r;
74
+ try {
75
+ return n.matches(":focus-visible");
76
+ } catch {
77
+ }
78
+ return R || X(n);
79
+ }
80
+ function Q() {
81
+ const r = l.useCallback((i) => {
82
+ i != null && G(i.ownerDocument);
83
+ }, []), n = l.useRef(!1);
84
+ function o() {
85
+ return n.current ? (w = !0, W.start(100, () => {
86
+ w = !1;
87
+ }), n.current = !1, !0) : !1;
88
+ }
89
+ function a(i) {
90
+ return J(i) ? (n.current = !0, !0) : !1;
91
+ }
92
+ return {
93
+ isFocusVisibleRef: n,
94
+ onFocus: a,
95
+ onBlur: o,
96
+ ref: r
97
+ };
98
+ }
99
+ function H(r = {}) {
100
+ const {
101
+ disabled: n = !1,
102
+ focusableWhenDisabled: o,
103
+ href: a,
104
+ rootRef: i,
105
+ tabIndex: c,
106
+ to: b,
107
+ type: f,
108
+ rootElementName: V
109
+ } = r, y = l.useRef(), [K, E] = l.useState(!1), {
110
+ isFocusVisibleRef: h,
111
+ onFocus: x,
112
+ onBlur: B,
113
+ ref: v
114
+ } = Q(), [p, N] = l.useState(!1);
115
+ n && !o && p && N(!1), l.useEffect(() => {
116
+ h.current = p;
117
+ }, [p, h]);
118
+ const [m, M] = A({
119
+ rootElementName: V ?? (a || b ? "a" : void 0),
120
+ componentName: "Button"
121
+ }), U = (t) => (e) => {
122
+ var u;
123
+ p && e.preventDefault(), (u = t.onMouseLeave) == null || u.call(t, e);
124
+ }, L = (t) => (e) => {
125
+ var u;
126
+ B(e), h.current === !1 && N(!1), (u = t.onBlur) == null || u.call(t, e);
127
+ }, P = (t) => (e) => {
128
+ var u;
129
+ if (y.current || (y.current = e.currentTarget), x(e), h.current === !0) {
130
+ var d;
131
+ N(!0), (d = t.onFocusVisible) == null || d.call(t, e);
132
+ }
133
+ (u = t.onFocus) == null || u.call(t, e);
134
+ }, g = () => {
135
+ const t = y.current;
136
+ return m === "BUTTON" || m === "INPUT" && ["button", "submit", "reset"].includes(t == null ? void 0 : t.type) || m === "A" && (t == null ? void 0 : t.href);
137
+ }, C = (t) => (e) => {
138
+ if (!n) {
139
+ var u;
140
+ (u = t.onClick) == null || u.call(t, e);
141
+ }
142
+ }, $ = (t) => (e) => {
143
+ var u;
144
+ n || (E(!0), document.addEventListener("mouseup", () => {
145
+ E(!1);
146
+ }, {
147
+ once: !0
148
+ })), (u = t.onMouseDown) == null || u.call(t, e);
149
+ }, S = (t) => (e) => {
150
+ var u;
151
+ if ((u = t.onKeyDown) == null || u.call(t, e), !e.defaultMuiPrevented && (e.target === e.currentTarget && !g() && e.key === " " && e.preventDefault(), e.target === e.currentTarget && e.key === " " && !n && E(!0), e.target === e.currentTarget && !g() && e.key === "Enter" && !n)) {
152
+ var d;
153
+ (d = t.onClick) == null || d.call(t, e), e.preventDefault();
154
+ }
155
+ }, O = (t) => (e) => {
156
+ var u;
157
+ if (e.target === e.currentTarget && E(!1), (u = t.onKeyUp) == null || u.call(t, e), e.target === e.currentTarget && !g() && !n && e.key === " " && !e.defaultMuiPrevented) {
158
+ var d;
159
+ (d = t.onClick) == null || d.call(t, e);
160
+ }
161
+ }, D = _(M, i, v, y), s = {};
162
+ return c !== void 0 && (s.tabIndex = c), m === "BUTTON" ? (s.type = f ?? "button", o ? s["aria-disabled"] = n : s.disabled = n) : m === "INPUT" ? f && ["button", "submit", "reset"].includes(f) && (o ? s["aria-disabled"] = n : s.disabled = n) : m !== "" && (!a && !b && (s.role = "button", s.tabIndex = c ?? 0), n && (s["aria-disabled"] = n, s.tabIndex = o ? c ?? 0 : -1)), {
163
+ getRootProps: (t = {}) => {
164
+ const e = k({}, I(r), I(t)), u = k({
165
+ type: f
166
+ }, e, s, t, {
167
+ onBlur: L(e),
168
+ onClick: C(e),
169
+ onFocus: P(e),
170
+ onKeyDown: S(e),
171
+ onKeyUp: O(e),
172
+ onMouseDown: $(e),
173
+ onMouseLeave: U(e),
174
+ ref: D
175
+ });
176
+ return delete u.onFocusVisible, u;
177
+ },
178
+ focusVisible: p,
179
+ setFocusVisible: N,
180
+ active: K,
181
+ rootRef: D
182
+ };
183
+ }
184
+ export {
185
+ H as u
186
+ };
@@ -0,0 +1,41 @@
1
+ import * as o from "react";
2
+ import { C as a } from "./Tabs.module-_kSbSyth.js";
3
+ import { u as I } from "./useEnhancedEffect-CJGo-L3B.js";
4
+ let r = 0;
5
+ function i(t) {
6
+ const [e, n] = o.useState(t), u = t || e;
7
+ return o.useEffect(() => {
8
+ e == null && (r += 1, n(`mui-${r}`));
9
+ }, [e]), u;
10
+ }
11
+ const d = o.useId;
12
+ function C(t) {
13
+ if (d !== void 0) {
14
+ const e = d();
15
+ return t ?? e;
16
+ }
17
+ return i(t);
18
+ }
19
+ function g(t, e) {
20
+ const n = o.useContext(a);
21
+ if (n === null)
22
+ throw new Error("useCompoundItem must be used within a useCompoundParent");
23
+ const {
24
+ registerItem: u
25
+ } = n, [s, f] = o.useState(typeof t == "function" ? void 0 : t);
26
+ return I(() => {
27
+ const {
28
+ id: c,
29
+ deregister: m
30
+ } = u(t, e);
31
+ return f(c), m;
32
+ }, [u, e, t]), {
33
+ id: s,
34
+ index: s !== void 0 ? n.getItemIndex(s) : -1,
35
+ totalItemCount: n.totalSubitemCount
36
+ };
37
+ }
38
+ export {
39
+ g as a,
40
+ C as u
41
+ };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pismo/marola",
3
3
  "description": "CDX tribe component library",
4
- "version": "0.0.1-alpha.32",
4
+ "version": "0.0.1-alpha.4",
5
5
  "type": "module",
6
6
  "main": "dist/main.js",
7
7
  "types": "dist/main.d.ts",
@@ -17,78 +17,37 @@
17
17
  ],
18
18
  "scripts": {
19
19
  "dev": "vite",
20
- "lint": "eslint . --report-unused-disable-directives --max-warnings 0",
21
- "lint:fix": "yarn lint --fix",
22
- "lint:scss": "stylelint \"**/*.scss\" --fix",
23
- "prettier": "prettier . --write",
20
+ "build": "tsc --p ./tsconfig-build.json && vite build",
21
+ "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
24
22
  "preview": "vite preview",
25
- "prepublishOnly": "npm run build",
26
- "test": "yarn test:unit",
27
- "test:unit": "vitest run",
28
- "test:unit:visual": "vitest-preview",
29
- "test:unit:watch": "vitest",
30
- "test:e2e": "echo \"no test implemented\"",
31
- "coverage": "vitest run --coverage",
32
- "export-files": "node scripts/export-files.cjs",
33
- "generate-icon-types": "node scripts/generate-icon-types.cjs",
34
- "prebuild": "yarn export-files & yarn generate-icon-types",
35
- "build": "tsc --p ./tsconfig-build.json && vite build && mv ./dist/assets/marola.css ./dist",
36
- "postbuild": "storybook build --disable-telemetry --output-dir build",
37
- "storybook": "storybook dev -p 6006"
23
+ "prepublishOnly": "npm run build"
38
24
  },
39
25
  "peerDependencies": {
40
26
  "react": "^18.2.0",
41
27
  "react-dom": "^18.2.0"
42
28
  },
43
29
  "devDependencies": {
44
- "@ianvs/prettier-plugin-sort-imports": "^4.2.1",
45
- "@storybook/addon-a11y": "^8.0.8",
46
- "@storybook/addon-essentials": "^8.0.8",
47
- "@storybook/addon-interactions": "^8.0.8",
48
- "@storybook/addon-links": "^8.0.8",
49
- "@storybook/blocks": "^8.0.8",
50
- "@storybook/react": "^8.0.8",
51
- "@storybook/react-vite": "^8.0.8",
52
- "@storybook/test": "^8.0.8",
53
- "@testing-library/react": "^15.0.5",
54
30
  "@types/node": "^20.12.2",
55
31
  "@types/react": "^18.2.66",
56
32
  "@types/react-dom": "^18.2.22",
57
- "@typescript-eslint/eslint-plugin": "^7.6.0",
58
- "@typescript-eslint/parser": "^7.6.0",
33
+ "@typescript-eslint/eslint-plugin": "^7.2.0",
34
+ "@typescript-eslint/parser": "^7.2.0",
59
35
  "@vitejs/plugin-react": "^4.2.1",
60
36
  "clsx": "^2.1.0",
61
- "commitlint": "^19.2.1",
62
- "cypress": "^13.8.1",
63
37
  "eslint": "^8.57.0",
64
- "eslint-config-prettier": "^9.1.0",
65
- "eslint-plugin-prettier": "^5.1.3",
66
38
  "eslint-plugin-react-hooks": "^4.6.0",
67
39
  "eslint-plugin-react-refresh": "^0.4.6",
68
- "eslint-plugin-simple-import-sort": "^12.0.0",
69
- "eslint-plugin-storybook": "^0.8.0",
70
- "glob": "^10.3.14",
71
- "husky": "^9.0.11",
72
- "jsdom": "^24.0.0",
73
- "prettier": "^3.2.5",
40
+ "glob": "^10.3.12",
74
41
  "react": "^18.2.0",
75
42
  "react-dom": "^18.2.0",
76
43
  "sass": "^1.72.0",
77
- "storybook": "^8.0.8",
78
- "stylelint": "^16.3.1",
79
- "stylelint-config-recess-order": "^5.0.0",
80
- "stylelint-config-standard-scss": "^13.1.0",
81
- "stylelint-prettier": "^5.0.0",
82
44
  "typescript": "^5.2.2",
83
45
  "vite": "^5.2.0",
84
46
  "vite-plugin-dts": "^3.8.1",
85
- "vite-plugin-lib-inject-css": "^2.0.1",
86
- "vite-plugin-svgr": "^4.2.0",
87
- "vitest": "^1.4.0",
88
- "vitest-preview": "^0.0.1"
47
+ "vite-plugin-lib-inject-css": "^2.0.1"
89
48
  },
90
49
  "dependencies": {
91
50
  "@mui/base": "^5.0.0-beta.40",
92
- "@mui/material": "^5.15.15"
51
+ "@pismo/waves-icons": "^1.3.3"
93
52
  }
94
53
  }
@@ -0,0 +1,20 @@
1
+
2
+ import { Tab, Tabs, TabPanel } from "../../lib/main";
3
+
4
+
5
+ const Playground = () => {
6
+ return <>
7
+ <Tabs>
8
+ <Tab value="1">Tab 1 with a very big name ajahsuahdifsadgfiasgfdioafuu</Tab>
9
+ <Tab value="2">Tab 2</Tab>
10
+ <Tab value="3">Tab 3</Tab>
11
+ <Tab value="4">Tab 4</Tab>
12
+ <TabPanel value="1">Tab 1 content</TabPanel>
13
+ <TabPanel value="2">Tab 2 content</TabPanel>
14
+ <TabPanel value="3">Tab 3 content</TabPanel>
15
+ <TabPanel value="4">Tab 4 content</TabPanel>
16
+ </Tabs>
17
+ </>;
18
+ };
19
+
20
+ export default Playground;
@@ -1,107 +0,0 @@
1
- import * as t from "react";
2
- import { u as C, P as f } from "./index-CH45lKw7.js";
3
- import { jsx as w } from "react/jsx-runtime";
4
- import { u as L, o as h, e as b } from "./useEventCallback-xTG9piMa.js";
5
- import { e as g } from "./index-CjW42-M-.js";
6
- function T(c) {
7
- return c.substring(2).toLowerCase();
8
- }
9
- function D(c, s) {
10
- return s.documentElement.clientWidth < c.clientX || s.documentElement.clientHeight < c.clientY;
11
- }
12
- function v(c) {
13
- const {
14
- children: s,
15
- disableReactTree: y = !1,
16
- mouseEvent: i = "onClick",
17
- onClickAway: P,
18
- touchEvent: u = "onTouchEnd"
19
- } = c, l = t.useRef(!1), o = t.useRef(null), d = t.useRef(!1), p = t.useRef(!1);
20
- t.useEffect(() => (setTimeout(() => {
21
- d.current = !0;
22
- }, 0), () => {
23
- d.current = !1;
24
- }), []);
25
- const k = C(
26
- // @ts-expect-error TODO upstream fix
27
- s.ref,
28
- o
29
- ), a = L((e) => {
30
- const n = p.current;
31
- p.current = !1;
32
- const r = h(o.current);
33
- if (!d.current || !o.current || "clientX" in e && D(e, r))
34
- return;
35
- if (l.current) {
36
- l.current = !1;
37
- return;
38
- }
39
- let E;
40
- e.composedPath ? E = e.composedPath().indexOf(o.current) > -1 : E = !r.documentElement.contains(
41
- // @ts-expect-error returns `false` as intended when not dispatched from a Node
42
- e.target
43
- ) || o.current.contains(
44
- // @ts-expect-error returns `false` as intended when not dispatched from a Node
45
- e.target
46
- ), !E && (y || !n) && P(e);
47
- }), R = (e) => (n) => {
48
- p.current = !0;
49
- const r = s.props[e];
50
- r && r(n);
51
- }, m = {
52
- ref: k
53
- };
54
- return u !== !1 && (m[u] = R(u)), t.useEffect(() => {
55
- if (u !== !1) {
56
- const e = T(u), n = h(o.current), r = () => {
57
- l.current = !0;
58
- };
59
- return n.addEventListener(e, a), n.addEventListener("touchmove", r), () => {
60
- n.removeEventListener(e, a), n.removeEventListener("touchmove", r);
61
- };
62
- }
63
- }, [a, u]), i !== !1 && (m[i] = R(i)), t.useEffect(() => {
64
- if (i !== !1) {
65
- const e = T(i), n = h(o.current);
66
- return n.addEventListener(e, a), () => {
67
- n.removeEventListener(e, a);
68
- };
69
- }
70
- }, [a, i]), /* @__PURE__ */ w(t.Fragment, {
71
- children: /* @__PURE__ */ t.cloneElement(s, m)
72
- });
73
- }
74
- process.env.NODE_ENV !== "production" && (v.propTypes = {
75
- // ┌────────────────────────────── Warning ──────────────────────────────┐
76
- // │ These PropTypes are generated from the TypeScript type definitions. │
77
- // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
78
- // └─────────────────────────────────────────────────────────────────────┘
79
- /**
80
- * The wrapped element.
81
- */
82
- children: b.isRequired,
83
- /**
84
- * If `true`, the React tree is ignored and only the DOM tree is considered.
85
- * This prop changes how portaled elements are handled.
86
- * @default false
87
- */
88
- disableReactTree: f.bool,
89
- /**
90
- * The mouse event to listen to. You can disable the listener by providing `false`.
91
- * @default 'onClick'
92
- */
93
- mouseEvent: f.oneOf(["onClick", "onMouseDown", "onMouseUp", "onPointerDown", "onPointerUp", !1]),
94
- /**
95
- * Callback fired when a "click away" event is detected.
96
- */
97
- onClickAway: f.func.isRequired,
98
- /**
99
- * The touch event to listen to. You can disable the listener by providing `false`.
100
- * @default 'onTouchEnd'
101
- */
102
- touchEvent: f.oneOf(["onTouchEnd", "onTouchStart", !1])
103
- });
104
- process.env.NODE_ENV !== "production" && (v.propTypes = g(v.propTypes));
105
- export {
106
- v as C
107
- };
@@ -1,30 +0,0 @@
1
- import './assets/Dialog.css';
2
- const _ = "_dialog__subtitle_yi7uo_52", o = "_dialog_yi7uo_52", a = "_dialog__backdrop_yi7uo_87", y = "_dialog__panel_yi7uo_95", i = "_dialog__title_yi7uo_56", p = "_dialog__divider_yi7uo_121", t = "_dialog__actions_yi7uo_134", u = {
3
- "u-typography-h1": "_u-typography-h1_yi7uo_1",
4
- "u-typography-h2": "_u-typography-h2_yi7uo_8",
5
- "u-typography-h3": "_u-typography-h3_yi7uo_15",
6
- "u-typography-h4": "_u-typography-h4_yi7uo_22",
7
- "u-typography-h5": "_u-typography-h5_yi7uo_29",
8
- "u-typography-h6": "_u-typography-h6_yi7uo_36",
9
- "u-typography-base": "_u-typography-base_yi7uo_43",
10
- "u-typography-base--xxl": "_u-typography-base--xxl_yi7uo_48",
11
- "u-typography-base--xl": "_u-typography-base--xl_yi7uo_52",
12
- dialog__subtitle: _,
13
- "u-typography-base--lg": "_u-typography-base--lg_yi7uo_56",
14
- "dialog__title--small": "_dialog__title--small_yi7uo_56",
15
- "u-typography-base--sm": "_u-typography-base--sm_yi7uo_60",
16
- "u-typography-base--bold": "_u-typography-base--bold_yi7uo_64",
17
- "u-typography-base--strikethrough": "_u-typography-base--strikethrough_yi7uo_67",
18
- "u-typography-base--underlined": "_u-typography-base--underlined_yi7uo_70",
19
- "u-typography-base--strikethrough-underlined": "_u-typography-base--strikethrough-underlined_yi7uo_73",
20
- dialog: o,
21
- dialog__backdrop: a,
22
- dialog__panel: y,
23
- dialog__title: i,
24
- dialog__divider: p,
25
- "dialog__close-icon": "_dialog__close-icon_yi7uo_125",
26
- dialog__actions: t
27
- };
28
- export {
29
- u as s
30
- };