@pismo/marola 2.1.70 → 2.1.72

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 (5) hide show
  1. package/dist/assets/StepperNavigator.css +1 -1
  2. package/dist/components/StepperNavigator/StepperNavigator.d.ts +11 -1
  3. package/dist/components/StepperNavigator/StepperNavigator.js +94 -70
  4. package/dist/components/StepperNavigator/StepperNavigator.stories.d.ts +2 -1
  5. package/package.json +1 -1
package/dist/assets/StepperNavigator.css CHANGED
@@ -1 +1 @@
1
- ._stepper-navigator_v6lmn_1{display:flex;justify-content:space-between;padding:1rem 0}._stepper-navigator_v6lmn_1>span{display:flex;gap:1rem}._stepper-navigator_v6lmn_1 button{padding:0 1.5rem}._previous-button_v6lmn_14,._cancel-button_v6lmn_15,._next-button_v6lmn_16,._finish-button_v6lmn_17{display:flex;gap:.25rem;align-items:center;justify-content:space-between;padding:0 1rem;font-size:.875rem}._previous-button_v6lmn_14>*,._cancel-button_v6lmn_15>*,._next-button_v6lmn_16>*,._finish-button_v6lmn_17>*{display:inline-flex;flex:1;align-items:center;justify-content:center}._previous-button_v6lmn_14>*:nth-child(1),._cancel-button_v6lmn_15>*:nth-child(1),._next-button_v6lmn_16>*:nth-child(1),._finish-button_v6lmn_17>*:nth-child(1){justify-content:flex-start}._previous-button_v6lmn_14>*:nth-child(3),._cancel-button_v6lmn_15>*:nth-child(3),._next-button_v6lmn_16>*:nth-child(3),._finish-button_v6lmn_17>*:nth-child(3){justify-content:flex-end}
1
+ ._stepper-navigator_il5pd_1{display:flex;justify-content:space-between;padding:1rem 0}._stepper-navigator_il5pd_1>span{display:flex;gap:1rem}._stepper-navigator_il5pd_1 button{padding:0 1.5rem}._previous-button_il5pd_14,._cancel-button_il5pd_15,._skip-button_il5pd_16,._next-button_il5pd_17,._finish-button_il5pd_18{display:flex;gap:.25rem;align-items:center;justify-content:space-between;padding:0 1rem;font-size:.875rem}._previous-button_il5pd_14>*,._cancel-button_il5pd_15>*,._skip-button_il5pd_16>*,._next-button_il5pd_17>*,._finish-button_il5pd_18>*{display:inline-flex;flex:1;align-items:center;justify-content:center}._previous-button_il5pd_14>*:nth-child(1),._cancel-button_il5pd_15>*:nth-child(1),._skip-button_il5pd_16>*:nth-child(1),._next-button_il5pd_17>*:nth-child(1),._finish-button_il5pd_18>*:nth-child(1){justify-content:flex-start}._previous-button_il5pd_14>*:nth-child(3),._cancel-button_il5pd_15>*:nth-child(3),._skip-button_il5pd_16>*:nth-child(3),._next-button_il5pd_17>*:nth-child(3),._finish-button_il5pd_18>*:nth-child(3){justify-content:flex-end}
package/dist/components/StepperNavigator/StepperNavigator.d.ts CHANGED
@@ -10,6 +10,8 @@ export type StepperNavigatorProps = {
10
10
  hidePrevious?: boolean;
11
11
  /** Hides the "cancel" button */
12
12
  hideCancel?: boolean;
13
+ /** Hides the "skip" button */
14
+ hideSkip?: boolean;
13
15
  /** Hides the "next" button */
14
16
  hideNext?: boolean;
15
17
  /** Hides the "finish" button */
@@ -18,6 +20,8 @@ export type StepperNavigatorProps = {
18
20
  disablePrevious?: boolean;
19
21
  /** Disables the "cancel" button */
20
22
  disableCancel?: boolean;
23
+ /** Disables the "skip" button */
24
+ disableSkip?: boolean;
21
25
  /** Disables the "next" button */
22
26
  disableNext?: boolean;
23
27
  /** Disables the "finish" button */
@@ -28,6 +32,8 @@ export type StepperNavigatorProps = {
28
32
  labelPrevious?: React.ReactNode;
29
33
  /** Label to be used for the "cancel" button */
30
34
  labelCancel?: React.ReactNode;
35
+ /** Label to be used for the "skip" button */
36
+ labelSkip?: React.ReactNode;
31
37
  /** Label to be used for the "next" button */
32
38
  labelNext?: React.ReactNode;
33
39
  /** Label to be used for the "finish" button */
@@ -42,6 +48,8 @@ export type StepperNavigatorProps = {
42
48
  previousButtonProps?: StepperNavigatorButtonProps;
43
49
  /** Cancel button props */
44
50
  cancelButtonProps?: StepperNavigatorButtonProps;
51
+ /** Skip button props */
52
+ skipButtonProps?: StepperNavigatorButtonProps;
45
53
  /** Next button props */
46
54
  nextButtonProps?: StepperNavigatorButtonProps;
47
55
  /** Finish button props */
@@ -50,10 +58,12 @@ export type StepperNavigatorProps = {
50
58
  onPrevious?: () => void;
51
59
  /** Callback to be called when the "cancel" button is clicked */
52
60
  onCancel?: () => void;
61
+ /** Callback to be called when the "skip" button is clicked. Use this to clear selections on the current step */
62
+ onSkip?: () => void;
53
63
  /** Callback to be called when the "next" button is clicked */
54
64
  onNext?: () => void;
55
65
  /** Callback to be called when the "finish" button is clicked */
56
66
  onFinish?: () => void;
57
67
  };
58
- export declare const StepperNavigator: ({ hideNext, hidePrevious, hideCancel, hideFinish, disableNext, disablePrevious, disableCancel, disableFinish, loading, lang, labelNext, labelPrevious, labelCancel, labelFinish, className, "data-testid": dataTestId, previousButtonProps, cancelButtonProps, nextButtonProps, finishButtonProps, onNext, onPrevious, onCancel, onFinish, }: StepperNavigatorProps) => import("react/jsx-runtime").JSX.Element;
68
+ export declare const StepperNavigator: ({ hideNext, hidePrevious, hideCancel, hideSkip, hideFinish, disableNext, disablePrevious, disableCancel, disableSkip, disableFinish, loading, lang, labelNext, labelPrevious, labelCancel, labelSkip, labelFinish, className, "data-testid": dataTestId, previousButtonProps, cancelButtonProps, skipButtonProps, nextButtonProps, finishButtonProps, onNext, onPrevious, onCancel, onSkip, onFinish, }: StepperNavigatorProps) => import("react/jsx-runtime").JSX.Element;
59
69
  export {};
package/dist/components/StepperNavigator/StepperNavigator.js CHANGED
@@ -1,123 +1,147 @@
1
- import { jsxs as _, jsx as I } from "react/jsx-runtime";
2
- import { c as g } from "../../clsx-OuTLNxxd.js";
3
- import { Button as e } from "../Button/Button.js";
4
- import '../../assets/StepperNavigator.css';const b = {
5
- "stepper-navigator": "_stepper-navigator_v6lmn_1",
6
- "previous-button": "_previous-button_v6lmn_14",
7
- "cancel-button": "_cancel-button_v6lmn_15",
8
- "next-button": "_next-button_v6lmn_16",
9
- "finish-button": "_finish-button_v6lmn_17"
1
+ import { jsxs as I, jsx as m } from "react/jsx-runtime";
2
+ import { c as _ } from "../../clsx-OuTLNxxd.js";
3
+ import { Button as b } from "../Button/Button.js";
4
+ import '../../assets/StepperNavigator.css';const g = {
5
+ "stepper-navigator": "_stepper-navigator_il5pd_1",
6
+ "previous-button": "_previous-button_il5pd_14",
7
+ "cancel-button": "_cancel-button_il5pd_15",
8
+ "skip-button": "_skip-button_il5pd_16",
9
+ "next-button": "_next-button_il5pd_17",
10
+ "finish-button": "_finish-button_il5pd_18"
10
11
  }, N = {
11
12
  en: {
12
13
  previous: "Back",
13
14
  cancel: "Cancel",
15
+ skip: "Skip this step",
14
16
  next: "Next",
15
17
  finish: "Finish"
16
18
  },
17
19
  pt: {
18
20
  previous: "Voltar",
19
21
  cancel: "Cancelar",
22
+ skip: "Pular esta etapa",
20
23
  next: "Próximo",
21
24
  finish: "Finalizar"
22
25
  }
23
- }, R = ({
24
- hideNext: q = !1,
25
- hidePrevious: w = !1,
26
- hideCancel: A = !1,
27
- hideFinish: D = !1,
28
- disableNext: j = !1,
29
- disablePrevious: z = !1,
30
- disableCancel: S = !1,
31
- disableFinish: V = !1,
32
- loading: f = !1,
33
- lang: c = "en",
34
- labelNext: h,
35
- labelPrevious: k,
36
- labelCancel: y,
37
- labelFinish: C,
38
- className: E,
39
- "data-testid": G = "stepper-navigator",
26
+ }, $ = ({
27
+ hideNext: G = !1,
28
+ hidePrevious: H = !1,
29
+ hideCancel: J = !1,
30
+ hideSkip: K = !0,
31
+ hideFinish: L = !1,
32
+ disableNext: V = !1,
33
+ disablePrevious: q = !1,
34
+ disableCancel: w = !1,
35
+ disableSkip: A = !1,
36
+ disableFinish: D = !1,
37
+ loading: E = !1,
38
+ lang: h = "en",
39
+ labelNext: y,
40
+ labelPrevious: C,
41
+ labelCancel: f,
42
+ labelSkip: j,
43
+ labelFinish: z,
44
+ className: M,
45
+ "data-testid": O = "stepper-navigator",
40
46
  previousButtonProps: a,
41
47
  cancelButtonProps: d,
42
- nextButtonProps: m,
43
- finishButtonProps: l,
44
- onNext: H = () => {
48
+ skipButtonProps: e,
49
+ nextButtonProps: l,
50
+ finishButtonProps: c,
51
+ onNext: Q = () => {
45
52
  },
46
- onPrevious: J = () => {
53
+ onPrevious: R = () => {
47
54
  },
48
- onCancel: K = () => {
55
+ onCancel: T = () => {
49
56
  },
50
- onFinish: L = () => {
57
+ onSkip: U = () => {
58
+ },
59
+ onFinish: W = () => {
51
60
  }
52
- }) => (y = y || N[c].cancel, k = k || N[c].previous, h = h || N[c].next, C = C || N[c].finish, f && (j = !0, z = !0, S = !0, V = !0), /* @__PURE__ */ _("div", { className: g(b["stepper-navigator"], E), "data-testid": G, children: [
53
- w ? /* @__PURE__ */ I("span", {}) : /* @__PURE__ */ _(
54
- e,
61
+ }) => (f = f || N[h].cancel, C = C || N[h].previous, j = j || N[h].skip, y = y || N[h].next, z = z || N[h].finish, E && (V = !0, q = !0, w = !0, A = !0, D = !0), /* @__PURE__ */ I("div", { className: _(g["stepper-navigator"], M), "data-testid": O, children: [
62
+ H ? /* @__PURE__ */ m("span", {}) : /* @__PURE__ */ I(
63
+ b,
55
64
  {
56
65
  variant: "default",
57
66
  shape: "round",
58
- className: g(b["previous-button"], a == null ? void 0 : a.className),
67
+ className: _(g["previous-button"], a == null ? void 0 : a.className),
59
68
  "data-testid": (a == null ? void 0 : a["data-testid"]) || "stepper-navigator-previous-button",
60
- disabled: z,
61
- onClick: J,
69
+ disabled: q,
70
+ onClick: R,
62
71
  children: [
63
- (a == null ? void 0 : a.leftIcon) && /* @__PURE__ */ I("span", { children: a == null ? void 0 : a.leftIcon }),
64
- /* @__PURE__ */ I("span", { children: k }),
65
- (a == null ? void 0 : a.rightIcon) && /* @__PURE__ */ I("span", { children: a == null ? void 0 : a.rightIcon })
72
+ (a == null ? void 0 : a.leftIcon) && /* @__PURE__ */ m("span", { children: a == null ? void 0 : a.leftIcon }),
73
+ /* @__PURE__ */ m("span", { children: C }),
74
+ (a == null ? void 0 : a.rightIcon) && /* @__PURE__ */ m("span", { children: a == null ? void 0 : a.rightIcon })
66
75
  ]
67
76
  }
68
77
  ),
69
- /* @__PURE__ */ _("span", { children: [
70
- !A && /* @__PURE__ */ _(
71
- e,
78
+ /* @__PURE__ */ I("span", { children: [
79
+ !J && /* @__PURE__ */ I(
80
+ b,
72
81
  {
73
82
  variant: "text",
74
83
  shape: "round",
75
- className: g(b["cancel-button"], d == null ? void 0 : d.className),
84
+ className: _(g["cancel-button"], d == null ? void 0 : d.className),
76
85
  "data-testid": (d == null ? void 0 : d["data-testid"]) || "stepper-navigator-cancel-button",
77
- disabled: S,
78
- onClick: K,
86
+ disabled: w,
87
+ onClick: T,
88
+ children: [
89
+ (d == null ? void 0 : d.leftIcon) && /* @__PURE__ */ m("span", { children: d == null ? void 0 : d.leftIcon }),
90
+ /* @__PURE__ */ m("span", { children: f }),
91
+ (d == null ? void 0 : d.rightIcon) && /* @__PURE__ */ m("span", { children: d == null ? void 0 : d.rightIcon })
92
+ ]
93
+ }
94
+ ),
95
+ !K && /* @__PURE__ */ I(
96
+ b,
97
+ {
98
+ variant: "secondary",
99
+ className: _(g["skip-button"], e == null ? void 0 : e.className),
100
+ "data-testid": (e == null ? void 0 : e["data-testid"]) || "stepper-navigator-skip-button",
101
+ disabled: A,
102
+ onClick: U,
79
103
  children: [
80
- (d == null ? void 0 : d.leftIcon) && /* @__PURE__ */ I("span", { children: d == null ? void 0 : d.leftIcon }),
81
- /* @__PURE__ */ I("span", { children: y }),
82
- (d == null ? void 0 : d.rightIcon) && /* @__PURE__ */ I("span", { children: d == null ? void 0 : d.rightIcon })
104
+ (e == null ? void 0 : e.leftIcon) && /* @__PURE__ */ m("span", { children: e == null ? void 0 : e.leftIcon }),
105
+ /* @__PURE__ */ m("span", { children: j }),
106
+ (e == null ? void 0 : e.rightIcon) && /* @__PURE__ */ m("span", { children: e == null ? void 0 : e.rightIcon })
83
107
  ]
84
108
  }
85
109
  ),
86
- !q && /* @__PURE__ */ _(
87
- e,
110
+ !G && /* @__PURE__ */ I(
111
+ b,
88
112
  {
89
113
  variant: "primary",
90
114
  shape: "round",
91
- className: g(b["next-button"], m == null ? void 0 : m.className),
92
- "data-testid": (m == null ? void 0 : m["data-testid"]) || "stepper-navigator-next-button",
93
- disabled: j,
94
- onClick: H,
115
+ className: _(g["next-button"], l == null ? void 0 : l.className),
116
+ "data-testid": (l == null ? void 0 : l["data-testid"]) || "stepper-navigator-next-button",
117
+ disabled: V,
118
+ onClick: Q,
95
119
  children: [
96
- (m == null ? void 0 : m.leftIcon) && /* @__PURE__ */ I("span", { children: m == null ? void 0 : m.leftIcon }),
97
- /* @__PURE__ */ I("span", { children: h }),
98
- (m == null ? void 0 : m.rightIcon) && /* @__PURE__ */ I("span", { children: m == null ? void 0 : m.rightIcon })
120
+ (l == null ? void 0 : l.leftIcon) && /* @__PURE__ */ m("span", { children: l == null ? void 0 : l.leftIcon }),
121
+ /* @__PURE__ */ m("span", { children: y }),
122
+ (l == null ? void 0 : l.rightIcon) && /* @__PURE__ */ m("span", { children: l == null ? void 0 : l.rightIcon })
99
123
  ]
100
124
  }
101
125
  ),
102
- !D && /* @__PURE__ */ _(
103
- e,
126
+ !L && /* @__PURE__ */ I(
127
+ b,
104
128
  {
105
129
  variant: "primary",
106
130
  shape: "round",
107
- className: g(b["finish-button"], l == null ? void 0 : l.className),
108
- "data-testid": (l == null ? void 0 : l["data-testid"]) || "stepper-navigator-finish-button",
109
- disabled: V,
110
- onClick: L,
111
- loading: f,
131
+ className: _(g["finish-button"], c == null ? void 0 : c.className),
132
+ "data-testid": (c == null ? void 0 : c["data-testid"]) || "stepper-navigator-finish-button",
133
+ disabled: D,
134
+ onClick: W,
135
+ loading: E,
112
136
  children: [
113
- (l == null ? void 0 : l.leftIcon) && /* @__PURE__ */ I("span", { children: l == null ? void 0 : l.leftIcon }),
114
- /* @__PURE__ */ I("span", { children: C }),
115
- (l == null ? void 0 : l.rightIcon) && /* @__PURE__ */ I("span", { children: l == null ? void 0 : l.rightIcon })
137
+ (c == null ? void 0 : c.leftIcon) && /* @__PURE__ */ m("span", { children: c == null ? void 0 : c.leftIcon }),
138
+ /* @__PURE__ */ m("span", { children: z }),
139
+ (c == null ? void 0 : c.rightIcon) && /* @__PURE__ */ m("span", { children: c == null ? void 0 : c.rightIcon })
116
140
  ]
117
141
  }
118
142
  )
119
143
  ] })
120
144
  ] }));
121
145
  export {
122
- R as StepperNavigator
146
+ $ as StepperNavigator
123
147
  };
package/dist/components/StepperNavigator/StepperNavigator.stories.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { StoryObj } from '@storybook/react';
2
2
  declare const meta: {
3
3
  title: string;
4
- component: ({ hideNext, hidePrevious, hideCancel, hideFinish, disableNext, disablePrevious, disableCancel, disableFinish, loading, lang, labelNext, labelPrevious, labelCancel, labelFinish, className, "data-testid": dataTestId, previousButtonProps, cancelButtonProps, nextButtonProps, finishButtonProps, onNext, onPrevious, onCancel, onFinish, }: import('./StepperNavigator').StepperNavigatorProps) => import("react/jsx-runtime").JSX.Element;
4
+ component: ({ hideNext, hidePrevious, hideCancel, hideSkip, hideFinish, disableNext, disablePrevious, disableCancel, disableSkip, disableFinish, loading, lang, labelNext, labelPrevious, labelCancel, labelSkip, labelFinish, className, "data-testid": dataTestId, previousButtonProps, cancelButtonProps, skipButtonProps, nextButtonProps, finishButtonProps, onNext, onPrevious, onCancel, onSkip, onFinish, }: import('./StepperNavigator').StepperNavigatorProps) => import("react/jsx-runtime").JSX.Element;
5
5
  tags: string[];
6
6
  parameters: {
7
7
  layout: string;
@@ -10,6 +10,7 @@ declare const meta: {
10
10
  export default meta;
11
11
  type Story = StoryObj<typeof meta>;
12
12
  export declare const Simple: Story;
13
+ export declare const WithSkipButton: Story;
13
14
  export declare const WithCustomLanguage: Story;
14
15
  export declare const WithCustomLabels: Story;
15
16
  export declare const Disabled: Story;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pismo/marola",
3
3
  "description": "CDX tribe component library",
4
- "version": "2.1.70",
4
+ "version": "2.1.72",
5
5
  "type": "module",
6
6
  "main": "dist/main.js",
7
7
  "types": "dist/main.d.ts",