@memori.ai/memori-react 1.0.0-alpha.1

package/dist/components/ui/Button.stories.d.ts

@@ -0,0 +1,17 @@
+import { Meta, Story } from '@storybook/react';
+import { Props } from './Button';
+declare const meta: Meta;
+export default meta;
+export declare const Default: Story<Props>;
+export declare const Primary: Story<Props>;
+export declare const Outlined: Story<Props>;
+export declare const Ghost: Story<Props>;
+export declare const PrimaryOutlined: Story<Props>;
+export declare const Square: Story<Props>;
+export declare const Padded: Story<Props>;
+export declare const Block: Story<Props>;
+export declare const Circle: Story<Props>;
+export declare const WithIcon: Story<Props>;
+export declare const Danger: Story<Props>;
+export declare const Loading: Story<Props>;
+export declare const Disabled: Story<Props>;

package/dist/components/ui/Button.stories.js

@@ -0,0 +1,141 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Disabled = exports.Loading = exports.Danger = exports.WithIcon = exports.Circle = exports.Block = exports.Padded = exports.Square = exports.PrimaryOutlined = exports.Ghost = exports.Outlined = exports.Primary = exports.Default = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const Button_1 = tslib_1.__importDefault(require("./Button"));
+const Eye_1 = tslib_1.__importDefault(require("../icons/Eye"));
+const meta = {
+    title: 'UI/Button',
+    component: Button_1.default,
+    argTypes: {
+        children: {
+            control: {
+                type: 'text',
+            },
+        },
+        className: {
+            control: {
+                type: 'text',
+            },
+        },
+        type: {
+            control: {
+                type: 'select',
+                options: ['button', 'submit', 'reset'],
+            },
+        },
+        primary: {
+            control: {
+                type: 'boolean',
+            },
+        },
+        outlined: {
+            control: {
+                type: 'boolean',
+            },
+        },
+        ghost: {
+            control: {
+                type: 'boolean',
+            },
+        },
+        padded: {
+            control: {
+                type: 'boolean',
+            },
+        },
+        block: {
+            control: {
+                type: 'boolean',
+            },
+        },
+        danger: {
+            control: {
+                type: 'boolean',
+            },
+        },
+        loading: {
+            control: {
+                type: 'boolean',
+            },
+        },
+        disabled: {
+            control: {
+                type: 'boolean',
+            },
+        },
+    },
+    parameters: {
+        controls: { expanded: true },
+    },
+};
+exports.default = meta;
+const Template = args => react_1.default.createElement(Button_1.default, { ...args });
+exports.Default = Template.bind({});
+exports.Default.args = {
+    children: 'Click me',
+};
+exports.Primary = Template.bind({});
+exports.Primary.args = {
+    children: 'Click me',
+    primary: true,
+};
+exports.Outlined = Template.bind({});
+exports.Outlined.args = {
+    children: 'Click me',
+    outlined: true,
+};
+exports.Ghost = Template.bind({});
+exports.Ghost.args = {
+    children: 'Click me',
+    ghost: true,
+};
+exports.PrimaryOutlined = Template.bind({});
+exports.PrimaryOutlined.args = {
+    children: 'Click me',
+    primary: true,
+    outlined: true,
+};
+exports.Square = Template.bind({});
+exports.Square.args = {
+    children: 'Click me',
+    shape: 'square',
+};
+exports.Padded = Template.bind({});
+exports.Padded.args = {
+    children: 'Click me',
+    padded: true,
+};
+exports.Block = Template.bind({});
+exports.Block.args = {
+    children: 'Click me',
+    block: true,
+};
+exports.Circle = Template.bind({});
+exports.Circle.args = {
+    shape: 'circle',
+    icon: react_1.default.createElement(Eye_1.default, null),
+    padded: false,
+};
+exports.WithIcon = Template.bind({});
+exports.WithIcon.args = {
+    children: 'Click me',
+    icon: react_1.default.createElement(Eye_1.default, null),
+};
+exports.Danger = Template.bind({});
+exports.Danger.args = {
+    children: 'Click me',
+    danger: true,
+};
+exports.Loading = Template.bind({});
+exports.Loading.args = {
+    children: 'Click me',
+    loading: true,
+};
+exports.Disabled = Template.bind({});
+exports.Disabled.args = {
+    children: 'Click me',
+    disabled: true,
+};
+//# sourceMappingURL=Button.stories.js.map

package/dist/components/ui/Button.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../../src/components/ui/Button.stories.tsx"],"names":[],"mappings":"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"}

package/dist/components/ui/Button.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/ui/Button.test.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const react_2 = require("@testing-library/react");
+const Button_1 = tslib_1.__importDefault(require("./Button"));
+const Loading_1 = tslib_1.__importDefault(require("../icons/Loading"));
+it('renders empty Button unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, null));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, null, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button primary unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { primary: true }, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button outlined unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { outlined: true }, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button padded unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { padded: true }, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button block unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { block: true }, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button with icon unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { icon: react_1.default.createElement(Loading_1.default, null) }, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button with icon only unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { icon: react_1.default.createElement(Loading_1.default, null) }));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button danger unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { danger: true }, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button loading unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { loading: true }, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button disabled unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { disabled: true }, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button with title unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { title: "Button title" }, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button square unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { shape: "square" }, "Click me"));
+    expect(container).toMatchSnapshot();
+});
+it('renders Button circle unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Button_1.default, { shape: "circle", icon: react_1.default.createElement(Loading_1.default, null) }));
+    expect(container).toMatchSnapshot();
+});
+//# sourceMappingURL=Button.test.js.map

package/dist/components/ui/Button.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.test.js","sourceRoot":"","sources":["../../../src/components/ui/Button.test.tsx"],"names":[],"mappings":"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"}

package/dist/components/ui/Card.css

@@ -0,0 +1,60 @@
+.memori-card {
+    display: flex;
+    overflow: hidden;
+    flex-direction: column;
+    border-radius: 10px;
+    margin: 0 0 1rem;
+    background-color: #fff;
+    box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1);
+}
+
+.memori-card--hoverable {
+    transition: box-shadow 0.3s;
+}
+
+.memori-card--hoverable:hover {
+    box-shadow: 0 0.2rem 0 rgba(0, 0, 0, 0.1), 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.2);
+}
+
+.memori-card--hoverable:focus,
+.memori-card--hoverable:focus-within {
+    outline-color: var(--memori-primary);
+}
+
+.memori-card--cover {
+    display: flex;
+    overflow: hidden;
+    height: 200px;
+    align-items: center;
+    justify-content: center;
+    border-radius: 10px 10px 0 0;
+    background-color: #eee;
+}
+
+.memori-card--cover img {
+    min-width: 100%;
+    min-height: 100%;
+    object-fit: cover;
+    object-position: center;
+}
+
+.memori-card--content {
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    justify-content: space-between;
+    padding: 1.5rem 1rem;
+}
+
+.memori-card--title {
+    margin: 0 0 0.5rem;
+    font-size: 1.25rem;
+    font-weight: 600;
+}
+
+.memori-card--description {
+    margin: 0;
+    color: #999;
+    font-size: 0.875rem;
+    font-weight: 400;
+}

package/dist/components/ui/Card.d.ts

@@ -0,0 +1,13 @@
+import React, { FC } from 'react';
+import './Card.css';
+export interface Props {
+    children?: React.ReactChild;
+    loading?: boolean;
+    className?: string;
+    title?: string;
+    description?: string;
+    cover?: JSX.Element | React.ReactNode | string;
+    hoverable?: boolean;
+}
+declare const Card: FC<Props>;
+export default Card;

package/dist/components/ui/Card.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+const Spin_1 = tslib_1.__importDefault(require("./Spin"));
+require("./Card.css");
+const Card = ({ loading = false, className, title, description, cover, hoverable = false, children, }) => (react_1.default.createElement("div", { className: (0, classnames_1.default)('memori-card', className, {
+        'memori-card--loading': loading,
+        'memori-card--with-cover': cover,
+        'memori-card--hoverable': hoverable,
+    }) },
+    react_1.default.createElement(Spin_1.default, { spinning: loading },
+        cover && react_1.default.createElement("div", { className: "memori-card--cover" }, cover),
+        react_1.default.createElement("div", { className: "memori-card--content" },
+            title && react_1.default.createElement("h3", { className: "memori-card--title" }, title),
+            description && (react_1.default.createElement("p", { className: "memori-card--description" }, description)),
+            react_1.default.createElement("div", { className: "memori-card--children" }, children)))));
+exports.default = Card;
+//# sourceMappingURL=Card.js.map

package/dist/components/ui/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/ui/Card.tsx"],"names":[],"mappings":";;;AAAA,0DAAkC;AAClC,oEAA4B;AAC5B,0DAA0B;AAC1B,sBAAoB;AAYpB,MAAM,IAAI,GAAc,CAAC,EACvB,OAAO,GAAG,KAAK,EACf,SAAS,EACT,KAAK,EACL,WAAW,EACX,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,QAAQ,GACT,EAAE,EAAE,CAAC,CACJ,uCACE,SAAS,EAAE,IAAA,oBAAE,EAAC,aAAa,EAAE,SAAS,EAAE;QACtC,sBAAsB,EAAE,OAAO;QAC/B,yBAAyB,EAAE,KAAK;QAChC,wBAAwB,EAAE,SAAS;KACpC,CAAC;IAEF,8BAAC,cAAI,IAAC,QAAQ,EAAE,OAAO;QACpB,KAAK,IAAI,uCAAK,SAAS,EAAC,oBAAoB,IAAE,KAAK,CAAO;QAC3D,uCAAK,SAAS,EAAC,sBAAsB;YAClC,KAAK,IAAI,sCAAI,SAAS,EAAC,oBAAoB,IAAE,KAAK,CAAM;YACxD,WAAW,IAAI,CACd,qCAAG,SAAS,EAAC,0BAA0B,IAAE,WAAW,CAAK,CAC1D;YACD,uCAAK,SAAS,EAAC,uBAAuB,IAAE,QAAQ,CAAO,CACnD,CACD,CACH,CACP,CAAC;AAEF,kBAAe,IAAI,CAAC"}

package/dist/components/ui/Card.stories.d.ts

@@ -0,0 +1,10 @@
+import { Meta, Story } from '@storybook/react';
+import { Props } from './Card';
+declare const meta: Meta;
+export default meta;
+export declare const Default: Story<Props>;
+export declare const WithTitleAndDescription: Story<Props>;
+export declare const Loading: Story<Props>;
+export declare const WithCover: Story<Props>;
+export declare const WithChildren: Story<Props>;
+export declare const Hoverable: Story<Props>;

package/dist/components/ui/Card.stories.js

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Hoverable = exports.WithChildren = exports.WithCover = exports.Loading = exports.WithTitleAndDescription = exports.Default = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const Card_1 = tslib_1.__importDefault(require("./Card"));
+const Button_1 = tslib_1.__importDefault(require("./Button"));
+const meta = {
+    title: 'UI/Card',
+    component: Card_1.default,
+    argTypes: {
+        title: {
+            control: {
+                type: 'text',
+            },
+        },
+        description: {
+            control: {
+                type: 'text',
+            },
+        },
+        children: {
+            control: {
+                type: 'text',
+            },
+        },
+        className: {
+            control: {
+                type: 'text',
+            },
+        },
+        loading: {
+            control: {
+                type: 'boolean',
+            },
+        },
+    },
+    parameters: {
+        controls: { expanded: true },
+    },
+};
+exports.default = meta;
+const Template = args => react_1.default.createElement(Card_1.default, { ...args });
+exports.Default = Template.bind({});
+exports.Default.args = {
+    title: 'Card title',
+    loading: false,
+};
+exports.WithTitleAndDescription = Template.bind({});
+exports.WithTitleAndDescription.args = {
+    title: 'Card title',
+    description: 'Card description',
+    loading: false,
+};
+exports.Loading = Template.bind({});
+exports.Loading.args = {
+    title: 'Card title',
+    description: 'Card description',
+    loading: true,
+};
+exports.WithCover = Template.bind({});
+exports.WithCover.args = {
+    title: 'Card title',
+    description: 'Card description',
+    cover: react_1.default.createElement("img", { src: "https://picsum.photos/200/300", alt: "cover" }),
+    loading: false,
+};
+exports.WithChildren = Template.bind({});
+exports.WithChildren.args = {
+    title: 'Card title',
+    description: 'Card description',
+    children: (react_1.default.createElement("div", null,
+        react_1.default.createElement("p", null, "Some text"),
+        react_1.default.createElement(Button_1.default, { primary: true }, "Show more"))),
+    loading: false,
+};
+exports.Hoverable = Template.bind({});
+exports.Hoverable.args = {
+    title: 'Card title',
+    description: 'Card description',
+    loading: false,
+    hoverable: true,
+};
+//# sourceMappingURL=Card.stories.js.map

package/dist/components/ui/Card.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.stories.js","sourceRoot":"","sources":["../../../src/components/ui/Card.stories.tsx"],"names":[],"mappings":";;;;AAAA,0DAA0B;AAE1B,0DAAqC;AACrC,8DAA8B;AAE9B,MAAM,IAAI,GAAS;IACjB,KAAK,EAAE,SAAS;IAChB,SAAS,EAAE,cAAI;IACf,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF;QACD,WAAW,EAAE;YACX,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF;QACD,QAAQ,EAAE;YACR,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF;QACD,SAAS,EAAE;YACT,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF;QACD,OAAO,EAAE;YACP,OAAO,EAAE;gBACP,IAAI,EAAE,SAAS;aAChB;SACF;KACF;IACD,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC7B;CACF,CAAC;AAEF,kBAAe,IAAI,CAAC;AAEpB,MAAM,QAAQ,GAAiB,IAAI,CAAC,EAAE,CAAC,8BAAC,cAAI,OAAK,IAAI,GAAI,CAAC;AAI7C,QAAA,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,eAAO,CAAC,IAAI,GAAG;IACb,KAAK,EAAE,YAAY;IACnB,OAAO,EAAE,KAAK;CACf,CAAC;AAEW,QAAA,uBAAuB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzD,+BAAuB,CAAC,IAAI,GAAG;IAC7B,KAAK,EAAE,YAAY;IACnB,WAAW,EAAE,kBAAkB;IAC/B,OAAO,EAAE,KAAK;CACf,CAAC;AAEW,QAAA,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,eAAO,CAAC,IAAI,GAAG;IACb,KAAK,EAAE,YAAY;IACnB,WAAW,EAAE,kBAAkB;IAC/B,OAAO,EAAE,IAAI;CACd,CAAC;AAEW,QAAA,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,iBAAS,CAAC,IAAI,GAAG;IACf,KAAK,EAAE,YAAY;IACnB,WAAW,EAAE,kBAAkB;IAC/B,KAAK,EAAE,uCAAK,GAAG,EAAC,+BAA+B,EAAC,GAAG,EAAC,OAAO,GAAG;IAC9D,OAAO,EAAE,KAAK;CACf,CAAC;AAEW,QAAA,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC9C,oBAAY,CAAC,IAAI,GAAG;IAClB,KAAK,EAAE,YAAY;IACnB,WAAW,EAAE,kBAAkB;IAC/B,QAAQ,EAAE,CACR;QACE,qDAAgB;QAChB,8BAAC,gBAAM,IAAC,OAAO,sBAAmB,CAC9B,CACP;IACD,OAAO,EAAE,KAAK;CACf,CAAC;AAEW,QAAA,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,iBAAS,CAAC,IAAI,GAAG;IACf,KAAK,EAAE,YAAY;IACnB,WAAW,EAAE,kBAAkB;IAC/B,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,IAAI;CAChB,CAAC"}

package/dist/components/ui/Card.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/ui/Card.test.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const react_2 = require("@testing-library/react");
+const Card_1 = tslib_1.__importDefault(require("./Card"));
+it('renders Card unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Card_1.default, null));
+    expect(container).toMatchSnapshot();
+});
+it('renders Card with title unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Card_1.default, { title: "Card title" }));
+    expect(container).toMatchSnapshot();
+});
+it('renders Card with description unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Card_1.default, { description: "Card description" }));
+    expect(container).toMatchSnapshot();
+});
+it('renders Card with cover unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Card_1.default, { cover: react_1.default.createElement("img", { src: "#", alt: "" }) }));
+    expect(container).toMatchSnapshot();
+});
+it('renders Card with children unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Card_1.default, null,
+        react_1.default.createElement("p", null, "Ciao")));
+    expect(container).toMatchSnapshot();
+});
+it('renders Card loading unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Card_1.default, { title: "Card title", loading: true }));
+    expect(container).toMatchSnapshot();
+});
+it('renders Card with custom CSS class unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Card_1.default, { className: "lorem-ipsum" }));
+    expect(container).toMatchSnapshot();
+});
+it('renders Card hoverable unchanged', () => {
+    const { container } = (0, react_2.render)(react_1.default.createElement(Card_1.default, { title: "lorem-ipsum", hoverable: true }));
+    expect(container).toMatchSnapshot();
+});
+//# sourceMappingURL=Card.test.js.map

package/dist/components/ui/Card.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.test.js","sourceRoot":"","sources":["../../../src/components/ui/Card.test.tsx"],"names":[],"mappings":";;;AAAA,0DAA0B;AAC1B,kDAAgD;AAChD,0DAA0B;AAE1B,EAAE,CAAC,wBAAwB,EAAE,GAAG,EAAE;IAChC,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,cAAI,OAAG,CAAC,CAAC;IACvC,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAC;AACtC,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,mCAAmC,EAAE,GAAG,EAAE;IAC3C,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,cAAI,IAAC,KAAK,EAAC,YAAY,GAAG,CAAC,CAAC;IAC1D,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAC;AACtC,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,yCAAyC,EAAE,GAAG,EAAE;IACjD,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,cAAI,IAAC,WAAW,EAAC,kBAAkB,GAAG,CAAC,CAAC;IACtE,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAC;AACtC,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,mCAAmC,EAAE,GAAG,EAAE;IAC3C,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,cAAI,IAAC,KAAK,EAAE,uCAAK,GAAG,EAAC,GAAG,EAAC,GAAG,EAAC,EAAE,GAAG,GAAI,CAAC,CAAC;IACtE,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAC;AACtC,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,sCAAsC,EAAE,GAAG,EAAE;IAC9C,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAC1B,8BAAC,cAAI;QACH,gDAAW,CACN,CACR,CAAC;IACF,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAC;AACtC,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,gCAAgC,EAAE,GAAG,EAAE;IACxC,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,cAAI,IAAC,KAAK,EAAC,YAAY,EAAC,OAAO,SAAG,CAAC,CAAC;IAClE,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAC;AACtC,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,8CAA8C,EAAE,GAAG,EAAE;IACtD,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,cAAI,IAAC,SAAS,EAAC,aAAa,GAAG,CAAC,CAAC;IAC/D,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAC;AACtC,CAAC,CAAC,CAAC;AAEH,EAAE,CAAC,kCAAkC,EAAE,GAAG,EAAE;IAC1C,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,cAAI,IAAC,KAAK,EAAC,aAAa,EAAC,SAAS,SAAG,CAAC,CAAC;IACrE,MAAM,CAAC,SAAS,CAAC,CAAC,eAAe,EAAE,CAAC;AACtC,CAAC,CAAC,CAAC"}

package/dist/components/ui/Checkbox.css

@@ -0,0 +1,111 @@
+:root,
+#root {
+    --memori-primary: rgb(102, 103, 171);
+    --memori-primary-text: #fff;
+}
+
+.memori-checkbox {
+    display: inline-flex;
+    box-sizing: border-box;
+    align-items: baseline;
+    padding: 0;
+    margin: 0;
+    color: rgba(0, 0, 0, 0.88);
+    cursor: pointer;
+    font-family: 'Exo 2', sans-serif;
+    font-size: 14px;
+    line-height: unset;
+    list-style: none;
+}
+
+.memori-checkbox--input-wrapper {
+    position: relative;
+    top: 0.2em;
+    cursor: pointer;
+    white-space: nowrap;
+}
+
+.memori-checkbox--inner {
+    position: relative;
+    top: 0;
+    display: block;
+    width: 16px;
+    height: 16px;
+    box-sizing: border-box;
+    border: 1px solid #d9d9d9;
+    border-radius: 4px;
+    border-top-color: rgb(217, 217, 217);
+    border-right-color: rgb(217, 217, 217);
+    border-bottom-color: rgb(217, 217, 217);
+    border-left-color: rgb(217, 217, 217);
+    background-color: #fff;
+    border-collapse: separate;
+    direction: ltr;
+    inset-inline-start: 0;
+    transition: all 0.3s;
+}
+
+.memori-checkbox--inner::after {
+    position: absolute;
+    top: 50%;
+    display: table;
+    width: 5.7142857142857135px;
+    height: 9.142857142857142px;
+    box-sizing: border-box;
+    border: 2px solid #fff;
+    border-top: 0;
+    border-inline-start: 0;
+    content: '';
+    inset-inline-start: 21.5%;
+    opacity: 0;
+    transform: rotate(45deg) scale(0) translate(-50%, -50%);
+    transition: all 0.1s cubic-bezier(0.71, -0.46, 0.88, 0.6), opacity 0.1s;
+}
+
+.memori-checkbox--input {
+    position: absolute;
+    z-index: 1;
+    width: 100%;
+    height: 100%;
+    cursor: pointer;
+    inset: 0;
+    opacity: 0;
+}
+
+.memori-checkbox--text {
+    padding-inline-end: 8px;
+    padding-inline-start: 8px;
+}
+
+.memori-checkbox--disabled {
+    cursor: not-allowed;
+}
+
+.memori-checkbox--disabled .memori-checkbox--input {
+    cursor: not-allowed;
+}
+
+.memori-checkbox--disabled .memori-checkbox--inner {
+    border-color: #d9d9d9;
+    background: rgba(0, 0, 0, 0.04);
+}
+
+.memori-checkbox--disabled .memori-checkbox--inner::after {
+    border-color: rgba(0, 0, 0, 0.25);
+}
+
+.memori-checkbox--disabled .memori-checkbox--text {
+    color: rgba(0, 0, 0, 0.25);
+}
+
+.memori-checkbox--input:checked:not(:disabled) + .memori-checkbox--inner {
+    z-index: 2;
+    border-color: var(--memori-primary);
+    background-color: var(--memori-primary);
+}
+
+.memori-checkbox--input:checked + .memori-checkbox--inner::after {
+    opacity: 1;
+    transform: rotate(45deg) scale(1) translate(-50%, -50%);
+    transition: all 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46) 0.1s;
+}

package/dist/components/ui/Checkbox.d.ts

@@ -0,0 +1,9 @@
+import React, { FC } from 'react';
+import './Checkbox.css';
+export interface Props extends React.HTMLAttributes<HTMLInputElement> {
+    label: string;
+    checked?: boolean;
+    disabled?: boolean;
+}
+declare const Checkbox: FC<Props>;
+export default Checkbox;

package/dist/components/ui/Checkbox.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const classnames_1 = tslib_1.__importDefault(require("classnames"));
+require("./Checkbox.css");
+const Checkbox = ({ label, className, disabled = false, checked, children, ...props }) => (react_1.default.createElement("label", { className: (0, classnames_1.default)('memori-checkbox', className, {
+        'memori-checkbox--disabled': disabled,
+    }) },
+    react_1.default.createElement("span", { className: "memori-checkbox--input-wrapper" },
+        react_1.default.createElement("input", { type: "checkbox", ...props, disabled: disabled, defaultChecked: checked, className: "memori-checkbox--input" }),
+        react_1.default.createElement("span", { className: "memori-checkbox--inner" })),
+    react_1.default.createElement("span", { className: "memori-checkbox--text" }, label)));
+exports.default = Checkbox;
+//# sourceMappingURL=Checkbox.js.map

package/dist/components/ui/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/components/ui/Checkbox.tsx"],"names":[],"mappings":";;;AAAA,0DAAkC;AAClC,oEAA4B;AAC5B,0BAAwB;AAQxB,MAAM,QAAQ,GAAc,CAAC,EAC3B,KAAK,EACL,SAAS,EACT,QAAQ,GAAG,KAAK,EAChB,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,EAAE,CAAC,CACJ,yCACE,SAAS,EAAE,IAAA,oBAAE,EAAC,iBAAiB,EAAE,SAAS,EAAE;QAC1C,2BAA2B,EAAE,QAAQ;KACtC,CAAC;IAEF,wCAAM,SAAS,EAAC,gCAAgC;QAC9C,yCACE,IAAI,EAAC,UAAU,KACX,KAAK,EACT,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,OAAO,EACvB,SAAS,EAAC,wBAAwB,GAClC;QACF,wCAAM,SAAS,EAAC,wBAAwB,GAAG,CACtC;IACP,wCAAM,SAAS,EAAC,uBAAuB,IAAE,KAAK,CAAQ,CAChD,CACT,CAAC;AAEF,kBAAe,QAAQ,CAAC"}

package/dist/components/ui/Checkbox.stories.d.ts

@@ -0,0 +1,8 @@
+import { Meta, Story } from '@storybook/react';
+import { Props } from './Checkbox';
+declare const meta: Meta;
+export default meta;
+export declare const Default: Story<Props>;
+export declare const Checked: Story<Props>;
+export declare const Disabled: Story<Props>;
+export declare const DisabledChecked: Story<Props>;