@danalazar/metro-ui 0.0.3 → 0.0.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.
- package/README.md +33 -0
- package/dist/{button-DTU9l2Gg.js → button-D2IRRUFN.js} +2 -2
- package/dist/components/button/button.d.ts +1 -1
- package/dist/components/button/button.js +2 -2
- package/dist/components/formField/formField.d.ts +6 -1
- package/dist/components/formField/formField.js +1 -1
- package/dist/components/input/input.d.ts +3 -9
- package/dist/components/input/input.js +1 -1
- package/dist/components/inputWithActions/inputWithAction.js +1 -1
- package/dist/components/keypad/keypad.d.ts +2 -7
- package/dist/components/keypad/keypad.js +3 -3
- package/dist/components/modal/modal.js +3 -3
- package/dist/components/select/select.js +1 -1
- package/dist/components/spinner/spinner.js +1 -1
- package/dist/formField-CYd3ghXm.js +39 -0
- package/dist/input-B4hjpmbq.js +20 -0
- package/dist/{inputWithAction-VBlCurUV.js → inputWithAction-DrO4FktP.js} +1 -1
- package/dist/{keypad-Bu5TjaRH.js → keypad-CrTKdzrB.js} +11 -35
- package/dist/main.js +8 -8
- package/dist/{modal-mu0n0R19.js → modal-BcJDY1O7.js} +1 -1
- package/dist/{select-NHAc5xjZ.js → select-DmezR35h.js} +1 -1
- package/dist/{spinner-Co2caOhH.js → spinner-BThkQA3X.js} +1 -1
- package/dist/test/setup.js +6176 -580
- package/package.json +4 -3
- package/dist/components/button/button.stories.d.ts +0 -48
- package/dist/components/button/button.stories.js +0 -82
- package/dist/components/button/button.test.d.ts +0 -1
- package/dist/components/button/button.test.js +0 -42
- package/dist/components/formField/formField.stories.d.ts +0 -15
- package/dist/components/formField/formField.stories.js +0 -77
- package/dist/components/formField/formField.test.d.ts +0 -1
- package/dist/components/formField/formField.test.js +0 -40
- package/dist/components/inputWithActions/inputWithAction.stories.d.ts +0 -9
- package/dist/components/inputWithActions/inputWithAction.stories.js +0 -83
- package/dist/components/inputWithActions/inputWithAction.test.d.ts +0 -1
- package/dist/components/inputWithActions/inputWithAction.test.js +0 -9
- package/dist/components/keypad/keypad.stories.d.ts +0 -6
- package/dist/components/keypad/keypad.stories.js +0 -17
- package/dist/components/keypad/keypad.test.d.ts +0 -1
- package/dist/components/keypad/keypad.test.js +0 -31
- package/dist/components/modal/modal.stories.d.ts +0 -32
- package/dist/components/modal/modal.stories.js +0 -78
- package/dist/components/modal/modal.test.d.ts +0 -1
- package/dist/components/modal/modal.test.js +0 -35
- package/dist/components/select/select.stories.d.ts +0 -38
- package/dist/components/select/select.stories.js +0 -44
- package/dist/components/select/select.test.d.ts +0 -1
- package/dist/components/select/select.test.js +0 -36
- package/dist/components/spinner/spinner.stories.d.ts +0 -30
- package/dist/components/spinner/spinner.stories.js +0 -32
- package/dist/components/spinner/spinner.test.d.ts +0 -1
- package/dist/components/spinner/spinner.test.js +0 -21
- package/dist/formField-BdRLOA0x.js +0 -30
- package/dist/input-q5h2lA4L.js +0 -20
- package/dist/lib-JrI87syO.js +0 -5604
- package/dist/magic-string.es-D07BpzB1.js +0 -659
- package/dist/react.esm-CQZuoo0_.js +0 -31060
- /package/dist/{clsx-ROFf4vs9.js → clsx-CVy0r8TU.js} +0 -0
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import { StoryObj } from '@storybook/react-vite';
|
|
2
|
-
declare const meta: {
|
|
3
|
-
title: string;
|
|
4
|
-
component: ({ options, value, onChange, ariaLabel, variant, size, disabled, className, }: import('./select').SelectProps) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
-
parameters: {
|
|
6
|
-
layout: string;
|
|
7
|
-
};
|
|
8
|
-
tags: string[];
|
|
9
|
-
argTypes: {
|
|
10
|
-
variant: {
|
|
11
|
-
control: "select";
|
|
12
|
-
options: string[];
|
|
13
|
-
};
|
|
14
|
-
size: {
|
|
15
|
-
control: "select";
|
|
16
|
-
options: string[];
|
|
17
|
-
};
|
|
18
|
-
disabled: {
|
|
19
|
-
control: "boolean";
|
|
20
|
-
};
|
|
21
|
-
};
|
|
22
|
-
args: {
|
|
23
|
-
options: {
|
|
24
|
-
label: string;
|
|
25
|
-
value: string;
|
|
26
|
-
}[];
|
|
27
|
-
variant: "primary";
|
|
28
|
-
size: "md";
|
|
29
|
-
disabled: false;
|
|
30
|
-
};
|
|
31
|
-
};
|
|
32
|
-
export default meta;
|
|
33
|
-
type Story = StoryObj<typeof meta>;
|
|
34
|
-
export declare const Primary: Story;
|
|
35
|
-
export declare const Secondary: Story;
|
|
36
|
-
export declare const Small: Story;
|
|
37
|
-
export declare const Large: Story;
|
|
38
|
-
export declare const Disabled: Story;
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import { t as e } from "../../select-NHAc5xjZ.js";
|
|
2
|
-
//#region src/components/select/select.stories.ts
|
|
3
|
-
var t = {
|
|
4
|
-
title: "Components/Select",
|
|
5
|
-
component: e,
|
|
6
|
-
parameters: { layout: "centered" },
|
|
7
|
-
tags: ["autodocs"],
|
|
8
|
-
argTypes: {
|
|
9
|
-
variant: {
|
|
10
|
-
control: "select",
|
|
11
|
-
options: ["primary", "secondary"]
|
|
12
|
-
},
|
|
13
|
-
size: {
|
|
14
|
-
control: "select",
|
|
15
|
-
options: [
|
|
16
|
-
"sm",
|
|
17
|
-
"md",
|
|
18
|
-
"lg"
|
|
19
|
-
]
|
|
20
|
-
},
|
|
21
|
-
disabled: { control: "boolean" }
|
|
22
|
-
},
|
|
23
|
-
args: {
|
|
24
|
-
options: [
|
|
25
|
-
{
|
|
26
|
-
label: "Option 1",
|
|
27
|
-
value: "1"
|
|
28
|
-
},
|
|
29
|
-
{
|
|
30
|
-
label: "Option 2",
|
|
31
|
-
value: "2"
|
|
32
|
-
},
|
|
33
|
-
{
|
|
34
|
-
label: "Option 3",
|
|
35
|
-
value: "3"
|
|
36
|
-
}
|
|
37
|
-
],
|
|
38
|
-
variant: "primary",
|
|
39
|
-
size: "md",
|
|
40
|
-
disabled: !1
|
|
41
|
-
}
|
|
42
|
-
}, n = {}, r = { args: { variant: "secondary" } }, i = { args: { size: "sm" } }, a = { args: { size: "lg" } }, o = { args: { disabled: !0 } };
|
|
43
|
-
//#endregion
|
|
44
|
-
export { o as Disabled, a as Large, n as Primary, r as Secondary, i as Small, t as default };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import "../../lib-JrI87syO.js";
|
|
2
|
-
import { t as e } from "../../select-NHAc5xjZ.js";
|
|
3
|
-
import { a as t, i as n, n as r, o as i, r as a, s as o, t as s } from "../../react.esm-CQZuoo0_.js";
|
|
4
|
-
import { jsx as c } from "react/jsx-runtime";
|
|
5
|
-
//#region src/components/select/select.test.tsx
|
|
6
|
-
var l = [{
|
|
7
|
-
label: "Option 1",
|
|
8
|
-
value: "1"
|
|
9
|
-
}, {
|
|
10
|
-
label: "Option 2",
|
|
11
|
-
value: "2"
|
|
12
|
-
}];
|
|
13
|
-
i("Select Component", () => {
|
|
14
|
-
o("renders options correctly", () => {
|
|
15
|
-
r(/* @__PURE__ */ c(e, { options: l })), n(a.getByText("Option 1")).toBeInTheDocument(), n(a.getByText("Option 2")).toBeInTheDocument();
|
|
16
|
-
}), o("applies default variant", () => {
|
|
17
|
-
r(/* @__PURE__ */ c(e, { options: l })), n(a.getByRole("combobox")).toHaveAttribute("data-variant", "primary");
|
|
18
|
-
}), o("handles change event", () => {
|
|
19
|
-
let i = t.fn();
|
|
20
|
-
r(/* @__PURE__ */ c(e, {
|
|
21
|
-
options: l,
|
|
22
|
-
onChange: i
|
|
23
|
-
})), s.change(a.getByRole("combobox"), { target: { value: "2" } }), n(i).toHaveBeenCalledWith("2");
|
|
24
|
-
}), o("is disabled when disabled prop is true", () => {
|
|
25
|
-
r(/* @__PURE__ */ c(e, {
|
|
26
|
-
options: l,
|
|
27
|
-
disabled: !0
|
|
28
|
-
})), n(a.getByRole("combobox")).toBeDisabled();
|
|
29
|
-
}), o("applies size correctly", () => {
|
|
30
|
-
r(/* @__PURE__ */ c(e, {
|
|
31
|
-
options: l,
|
|
32
|
-
size: "lg"
|
|
33
|
-
})), n(a.getByRole("combobox")).toHaveAttribute("data-size", "lg");
|
|
34
|
-
});
|
|
35
|
-
});
|
|
36
|
-
//#endregion
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import { StoryObj } from '@storybook/react-vite';
|
|
2
|
-
declare const meta: {
|
|
3
|
-
title: string;
|
|
4
|
-
component: ({ size, variant, className, }: import('./spinner').SpinnerProps) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
-
parameters: {
|
|
6
|
-
layout: string;
|
|
7
|
-
};
|
|
8
|
-
tags: string[];
|
|
9
|
-
argTypes: {
|
|
10
|
-
size: {
|
|
11
|
-
control: "select";
|
|
12
|
-
options: string[];
|
|
13
|
-
};
|
|
14
|
-
variant: {
|
|
15
|
-
control: "select";
|
|
16
|
-
options: string[];
|
|
17
|
-
};
|
|
18
|
-
};
|
|
19
|
-
args: {
|
|
20
|
-
size: "md";
|
|
21
|
-
variant: "primary";
|
|
22
|
-
};
|
|
23
|
-
};
|
|
24
|
-
export default meta;
|
|
25
|
-
type Story = StoryObj<typeof meta>;
|
|
26
|
-
export declare const Default: Story;
|
|
27
|
-
export declare const Small: Story;
|
|
28
|
-
export declare const Large: Story;
|
|
29
|
-
export declare const Secondary: Story;
|
|
30
|
-
export declare const White: Story;
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
import { t as e } from "../../spinner-Co2caOhH.js";
|
|
2
|
-
//#region src/components/spinner/spinner.stories.ts
|
|
3
|
-
var t = {
|
|
4
|
-
title: "Components/Spinner",
|
|
5
|
-
component: e,
|
|
6
|
-
parameters: { layout: "centered" },
|
|
7
|
-
tags: ["autodocs"],
|
|
8
|
-
argTypes: {
|
|
9
|
-
size: {
|
|
10
|
-
control: "select",
|
|
11
|
-
options: [
|
|
12
|
-
"sm",
|
|
13
|
-
"md",
|
|
14
|
-
"lg"
|
|
15
|
-
]
|
|
16
|
-
},
|
|
17
|
-
variant: {
|
|
18
|
-
control: "select",
|
|
19
|
-
options: [
|
|
20
|
-
"primary",
|
|
21
|
-
"secondary",
|
|
22
|
-
"white"
|
|
23
|
-
]
|
|
24
|
-
}
|
|
25
|
-
},
|
|
26
|
-
args: {
|
|
27
|
-
size: "md",
|
|
28
|
-
variant: "primary"
|
|
29
|
-
}
|
|
30
|
-
}, n = {}, r = { args: { size: "sm" } }, i = { args: { size: "lg" } }, a = { args: { variant: "secondary" } }, o = { args: { variant: "white" } };
|
|
31
|
-
//#endregion
|
|
32
|
-
export { n as Default, i as Large, a as Secondary, r as Small, o as White, t as default };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import "../../lib-JrI87syO.js";
|
|
2
|
-
import { t as e } from "../../spinner-Co2caOhH.js";
|
|
3
|
-
import { i as t, n, o as r, r as i, s as a } from "../../react.esm-CQZuoo0_.js";
|
|
4
|
-
import { jsx as o } from "react/jsx-runtime";
|
|
5
|
-
//#region src/components/spinner/spinner.test.tsx
|
|
6
|
-
r("Spinner Component", () => {
|
|
7
|
-
a("renders correctly", () => {
|
|
8
|
-
n(/* @__PURE__ */ o(e, {})), t(i.getByTestId("spinner")).toBeInTheDocument();
|
|
9
|
-
}), a("applies default props", () => {
|
|
10
|
-
n(/* @__PURE__ */ o(e, {}));
|
|
11
|
-
let r = i.getByTestId("spinner");
|
|
12
|
-
t(r).toHaveAttribute("data-size", "md"), t(r).toHaveAttribute("data-variant", "primary");
|
|
13
|
-
}), a("applies different sizes", () => {
|
|
14
|
-
let { rerender: r } = n(/* @__PURE__ */ o(e, { size: "sm" })), a = i.getByTestId("spinner");
|
|
15
|
-
t(a).toHaveAttribute("data-size", "sm"), r(/* @__PURE__ */ o(e, { size: "lg" })), a = i.getByTestId("spinner"), t(a).toHaveAttribute("data-size", "lg");
|
|
16
|
-
}), a("applies different variants", () => {
|
|
17
|
-
let { rerender: r } = n(/* @__PURE__ */ o(e, { variant: "secondary" })), a = i.getByTestId("spinner");
|
|
18
|
-
t(a).toHaveAttribute("data-variant", "secondary"), r(/* @__PURE__ */ o(e, { variant: "white" })), a = i.getByTestId("spinner"), t(a).toHaveAttribute("data-variant", "white");
|
|
19
|
-
});
|
|
20
|
-
});
|
|
21
|
-
//#endregion
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import { t as e } from "./clsx-ROFf4vs9.js";
|
|
2
|
-
import { jsx as t, jsxs as n } from "react/jsx-runtime";
|
|
3
|
-
import './assets/formField.css';//#region src/components/formField/formField.module.sass
|
|
4
|
-
var r = "_wrapper_10d1v_1", i = "_label_10d1v_11", a = "_control_10d1v_17", o = "_message_10d1v_29", s = "_error_10d1v_34", c = {
|
|
5
|
-
wrapper: r,
|
|
6
|
-
label: i,
|
|
7
|
-
control: a,
|
|
8
|
-
"control--error": "_control--error_10d1v_25",
|
|
9
|
-
message: o,
|
|
10
|
-
error: s
|
|
11
|
-
}, l = ({ label: r, error: i, helperText: a, children: o, id: s }) => /* @__PURE__ */ n("div", {
|
|
12
|
-
className: c.wrapper,
|
|
13
|
-
children: [
|
|
14
|
-
r && /* @__PURE__ */ t("label", {
|
|
15
|
-
htmlFor: s,
|
|
16
|
-
className: c.label,
|
|
17
|
-
children: r
|
|
18
|
-
}),
|
|
19
|
-
/* @__PURE__ */ t("div", {
|
|
20
|
-
className: e(c.control, { [c["control--error"]]: i }),
|
|
21
|
-
children: o
|
|
22
|
-
}),
|
|
23
|
-
(i || a) && /* @__PURE__ */ t("span", {
|
|
24
|
-
className: e(c.message, { [c.error]: i }),
|
|
25
|
-
children: i || a
|
|
26
|
-
})
|
|
27
|
-
]
|
|
28
|
-
});
|
|
29
|
-
//#endregion
|
|
30
|
-
export { c as n, l as t };
|
package/dist/input-q5h2lA4L.js
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { t as e } from "./clsx-ROFf4vs9.js";
|
|
2
|
-
import { jsx as t } from "react/jsx-runtime";
|
|
3
|
-
import './assets/input.css';var n = {
|
|
4
|
-
input: "_input_1838g_1",
|
|
5
|
-
"input--disabled": "_input--disabled_1838g_13",
|
|
6
|
-
"input--sm": "_input--sm_1838g_17",
|
|
7
|
-
"input--md": "_input--md_1838g_20",
|
|
8
|
-
"input--lg": "_input--lg_1838g_23"
|
|
9
|
-
}, r = ({ id: r, value: i, onChange: a, placeholder: o, type: s = "text", disabled: c, size: l = "md", className: u }) => /* @__PURE__ */ t("input", {
|
|
10
|
-
id: r,
|
|
11
|
-
value: i,
|
|
12
|
-
onChange: (e) => a(e.target.value),
|
|
13
|
-
placeholder: o,
|
|
14
|
-
type: s,
|
|
15
|
-
disabled: c,
|
|
16
|
-
"data-size": l,
|
|
17
|
-
className: e(n.input, n[`input--${l}`], { [n["input--disabled"]]: c }, u)
|
|
18
|
-
});
|
|
19
|
-
//#endregion
|
|
20
|
-
export { r as t };
|