react-restyle-components 0.1.44 → 0.1.45

package/lib/esm/core-components/atoms/radio/radio.stories.js

@@ -1,23 +1,23 @@
-import { Radio } from './radio.component';
+import { Radio } from "./radio.component";
 const meta = {
-    title: 'Design System/Atoms/Radio',
-    component: Radio,
-    tags: ['autodocs'],
-    parameters: {
-        componentSubtitle: `import { Radio } from 'react-restyle-components'`,
-    },
+  title: "Design System/Atoms/Radio",
+  component: Radio,
+  tags: ["autodocs"],
+  parameters: {
+    componentSubtitle: `import { Radio } from 'react-restyle-components'`,
+  },
 };
 export default meta;
 export const Primary = {
-    args: {
-        title: 'Source',
-        data: [
-            { title: 'Salary', checked: false },
-            { title: 'Business', checked: false },
-        ],
-        onChange: (item) => {
-            console.log({ item });
-        },
+  args: {
+    title: "Source",
+    data: [
+      { title: "Salary", checked: false },
+      { title: "Business", checked: false },
+    ],
+    onChange: (item) => {
+      console.log({ item });
     },
+  },
 };
-//# sourceMappingURL=radio.stories.js.map
+//# sourceMappingURL=radio.stories.js.map

package/lib/esm/core-components/atoms/radio/radio.test.js

@@ -1,9 +1,15 @@
 /* eslint-disable testing-library/render-result-naming-convention */
-import React from 'react';
-import { render } from '@core-utils';
-import { Radio } from './radio.component';
-it('render Radio correctly', () => {
-    const radio = render(React.createElement(Radio, { title: "Title", data: [], onChange: () => jest.fn() }));
-    expect(radio).toMatchSnapshot();
+import React from "react";
+import { render } from "@core-utils";
+import { Radio } from "./radio.component";
+it("render Radio correctly", () => {
+  const radio = render(
+    React.createElement(Radio, {
+      title: "Title",
+      data: [],
+      onChange: () => jest.fn(),
+    }),
+  );
+  expect(radio).toMatchSnapshot();
 });
-//# sourceMappingURL=radio.test.js.map
+//# sourceMappingURL=radio.test.js.map

package/lib/esm/core-components/atoms/stepper/stepper.component.js

@@ -1,35 +1,77 @@
-import React from 'react';
-export const Stepper = ({ className = '', steps, currentStep = 1, onStepClick, }) => {
-    const finalClass = `${className} w-full px-4 sm:px-8`;
-    const progressClass = 'absolute my-4 top-1/2 left-0 h-0.5  transform -translate-y-1/2 bg-orange transition-width ease-in-out duration-500';
-    const Steps = steps === null || steps === void 0 ? void 0 : steps.map((step, index) => {
-        let stepClass = 'inline-block transform -translate-x-1/2 pt-1 w-8 h-8 rounded-full text-center';
-        if (index < currentStep)
+import React from "react";
+export const Stepper = ({
+  className = "",
+  steps,
+  currentStep = 1,
+  onStepClick,
+}) => {
+  const finalClass = `${className} w-full px-4 sm:px-8`;
+  const progressClass =
+    "absolute my-4 top-1/2 left-0 h-0.5  transform -translate-y-1/2 bg-orange transition-width ease-in-out duration-500";
+  const Steps =
+    steps === null || steps === void 0
+      ? void 0
+      : steps.map((step, index) => {
+          let stepClass =
+            "inline-block transform -translate-x-1/2 pt-1 w-8 h-8 rounded-full text-center";
+          if (index < currentStep)
             stepClass +=
-                ' font-medium border border-orange  bg-background-secondary text-gray';
-        else if (index > currentStep)
+              " font-medium border border-orange  bg-background-secondary text-gray";
+          else if (index > currentStep)
             stepClass +=
-                ' font-medium border border-gray-dark-secondary text-gray bg-background-secondary';
-        else if (currentStep === index)
-            stepClass += ' font-medium bg-orange text-white';
-        if (typeof onStepClick === 'function')
-            stepClass += ' cursor-pointer';
-        return (React.createElement("div", { key: step, style: { left: `${(index / (steps.length - 1)) * 100}%` }, className: "absolute" },
-            React.createElement("span", { className: `${stepClass} font-nunitoSansRegular  text-4xs text-center`, onClick: () => {
-                    if (typeof onStepClick === 'function')
-                        onStepClick(index + 1, step);
-                } }, step)));
-    });
-    return (React.createElement("div", { className: finalClass },
-        React.createElement("div", { className: "w-full relative" },
-            React.createElement("div", { className: progressClass, style: {
-                    width: `${(currentStep / (steps.length - 1)) * 100}%`,
-                } },
-                React.createElement("div", { className: "w-3 h-3 bg-orange rounded-full absolute right-0 top-1/2 transform translate-x-1/2 -translate-y-1/2" })),
-            React.createElement("div", { className: 'absolute h-0.5 my-4 top-1/2 left-0 transform -translate-y-1/2 bg-gray-dark-secondary transition-width ease-in-out duration-500', style: {
-                    marginLeft: `${(currentStep / (steps.length - 1)) * 100}%`,
-                    width: `${100 - (currentStep / (steps.length - 1)) * 100}%`,
-                } })),
-        React.createElement("div", { className: "relative sm:block" }, Steps)));
+              " font-medium border border-gray-dark-secondary text-gray bg-background-secondary";
+          else if (currentStep === index)
+            stepClass += " font-medium bg-orange text-white";
+          if (typeof onStepClick === "function") stepClass += " cursor-pointer";
+          return React.createElement(
+            "div",
+            {
+              key: step,
+              style: { left: `${(index / (steps.length - 1)) * 100}%` },
+              className: "absolute",
+            },
+            React.createElement(
+              "span",
+              {
+                className: `${stepClass} font-nunitoSansRegular  text-4xs text-center`,
+                onClick: () => {
+                  if (typeof onStepClick === "function")
+                    onStepClick(index + 1, step);
+                },
+              },
+              step,
+            ),
+          );
+        });
+  return React.createElement(
+    "div",
+    { className: finalClass },
+    React.createElement(
+      "div",
+      { className: "w-full relative" },
+      React.createElement(
+        "div",
+        {
+          className: progressClass,
+          style: {
+            width: `${(currentStep / (steps.length - 1)) * 100}%`,
+          },
+        },
+        React.createElement("div", {
+          className:
+            "w-3 h-3 bg-orange rounded-full absolute right-0 top-1/2 transform translate-x-1/2 -translate-y-1/2",
+        }),
+      ),
+      React.createElement("div", {
+        className:
+          "absolute h-0.5 my-4 top-1/2 left-0 transform -translate-y-1/2 bg-gray-dark-secondary transition-width ease-in-out duration-500",
+        style: {
+          marginLeft: `${(currentStep / (steps.length - 1)) * 100}%`,
+          width: `${100 - (currentStep / (steps.length - 1)) * 100}%`,
+        },
+      }),
+    ),
+    React.createElement("div", { className: "relative sm:block" }, Steps),
+  );
 };
-//# sourceMappingURL=stepper.component.js.map
+//# sourceMappingURL=stepper.component.js.map

package/lib/esm/core-components/atoms/stepper/stepper.stories.js

@@ -1,19 +1,19 @@
-import { Stepper } from './stepper.component';
+import { Stepper } from "./stepper.component";
 const meta = {
-    title: 'Design System/Atoms/Stepper',
-    component: Stepper,
-    tags: ['autodocs'],
-    parameters: {
-        componentSubtitle: `import { Stepper } from 'react-restyle-components'`,
-    },
+  title: "Design System/Atoms/Stepper",
+  component: Stepper,
+  tags: ["autodocs"],
+  parameters: {
+    componentSubtitle: `import { Stepper } from 'react-restyle-components'`,
+  },
 };
 export default meta;
 export const Primary = {
-    args: {
-        steps: ['1', '2', '3', '4'],
-        currentStep: 2,
-        onStepClick: (currentStep, step) => { },
-        className: 'mt-4',
-    },
+  args: {
+    steps: ["1", "2", "3", "4"],
+    currentStep: 2,
+    onStepClick: (currentStep, step) => {},
+    className: "mt-4",
+  },
 };
-//# sourceMappingURL=stepper.stories.js.map
+//# sourceMappingURL=stepper.stories.js.map

package/lib/esm/core-components/atoms/stepper/stepper.test.js

@@ -1,8 +1,15 @@
-import React from 'react';
-import { render } from '@core-utils';
-import { Stepper } from './stepper.component';
-it('rende Stepper correctly', () => {
-    const stepper = render(React.createElement(Stepper, { steps: ['1', '2', '3', '4'], currentStep: 3, onStepClick: () => jest.fn(), className: "mt-4" }));
-    expect(stepper).toMatchSnapshot();
+import React from "react";
+import { render } from "@core-utils";
+import { Stepper } from "./stepper.component";
+it("render Stepper correctly", () => {
+  const stepper = render(
+    React.createElement(Stepper, {
+      steps: ["1", "2", "3", "4"],
+      currentStep: 3,
+      onStepClick: () => jest.fn(),
+      className: "mt-4",
+    }),
+  );
+  expect(stepper).toMatchSnapshot();
 });
-//# sourceMappingURL=stepper.test.js.map
+//# sourceMappingURL=stepper.test.js.map

package/lib/esm/core-components/atoms/stepper/stepper.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.test.js","sourceRoot":"","sources":["../../../../../src/core-components/atoms/stepper/stepper.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,aAAa,CAAC;AACnC,OAAO,EAAC,OAAO,EAAC,MAAM,qBAAqB,CAAC;AAC5C,EAAE,CAAC,yBAAyB,EAAE,GAAG,EAAE;IACjC,MAAM,OAAO,GAAG,MAAM,CACpB,oBAAC,OAAO,IACN,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,EAC3B,WAAW,EAAE,CAAC,EACd,WAAW,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,EAAE,EAAE,EAC5B,SAAS,EAAC,MAAM,GAChB,CACH,CAAC;IACF,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,EAAE,CAAC;AACpC,CAAC,CAAC,CAAC"}
+{"version":3,"file":"stepper.test.js","sourceRoot":"","sources":["../../../../../src/core-components/atoms/stepper/stepper.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,aAAa,CAAC;AACnC,OAAO,EAAC,OAAO,EAAC,MAAM,qBAAqB,CAAC;AAC5C,EAAE,CAAC,0BAA0B,EAAE,GAAG,EAAE;IAClC,MAAM,OAAO,GAAG,MAAM,CACpB,oBAAC,OAAO,IACN,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,EAC3B,WAAW,EAAE,CAAC,EACd,WAAW,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,EAAE,EAAE,EAC5B,SAAS,EAAC,MAAM,GAChB,CACH,CAAC;IACF,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,EAAE,CAAC;AACpC,CAAC,CAAC,CAAC"}

package/lib/esm/core-components/atoms/tabs/tabs.component.js

@@ -0,0 +1,47 @@
+import React, { useState } from "react";
+import { Icon } from "../..";
+export const Tabs = ({ options, onSelect }) => {
+  const [selected, setSelected] = useState(options[0].title);
+  return React.createElement(
+    "div",
+    { className: "flex justify-center" },
+    React.createElement(
+      "ul",
+      {
+        className:
+          "flex flex-wrap items-center justify-center -mb-px text-sm font-medium text-center text-black cursor-pointer gap-2",
+      },
+      options === null || options === void 0
+        ? void 0
+        : options.map((item, index) =>
+            React.createElement(
+              "li",
+              { key: index, className: "bg-[#EF4444] rounded-md" },
+              React.createElement(
+                "div",
+                {
+                  className: `inline-flex items-center justify-center p-3 border-b-2 gap-1 ${
+                    item.title == selected
+                      ? "text-white font-bold md:text-md  border-primary active"
+                      : " text-gray-200  md:text-md border-transparent"
+                  }`,
+                  onClick: () => {
+                    setSelected(item.title);
+                    onSelect(item.title);
+                  },
+                },
+                React.createElement(Icon, {
+                  nameIcon: item.icon,
+                  propsIcon: {
+                    color: item.title == selected ? "#ffffff" : "#000000",
+                    size: 24,
+                  },
+                }),
+                item.title,
+              ),
+            ),
+          ),
+    ),
+  );
+};
+//# sourceMappingURL=tabs.component.js.map

package/lib/esm/core-components/atoms/tabs/tabs.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.component.js","sourceRoot":"","sources":["../../../../../src/core-components/atoms/tabs/tabs.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAC,QAAQ,EAAC,MAAM,OAAO,CAAC;AACtC,OAAO,EAAC,IAAI,EAAC,MAAM,OAAO,CAAC;AAO3B,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EAAC,OAAO,EAAE,QAAQ,EAAY,EAAE,EAAE;IACrD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IAC3D,OAAO,CACL,6BAAK,SAAS,EAAC,qBAAqB;QAClC,4BAAI,SAAS,EAAC,mHAAmH,IAC9H,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAC7B,4BAAI,GAAG,EAAE,KAAK,EAAE,SAAS,EAAC,yBAAyB;YACjD,6BACE,SAAS,EAAE,gEACT,IAAI,CAAC,KAAK,IAAI,QAAQ;oBACpB,CAAC,CAAC,wDAAwD;oBAC1D,CAAC,CAAC,+CACN,EAAE,EACF,OAAO,EAAE,GAAG,EAAE;oBACZ,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;oBACxB,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBACvB,CAAC;gBAED,oBAAC,IAAI,IACH,QAAQ,EAAE,IAAI,CAAC,IAAI,EACnB,SAAS,EAAE;wBACT,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;wBACrD,IAAI,EAAE,EAAE;qBACT,GACD;gBACD,IAAI,CAAC,KAAK,CACP,CACH,CACN,CAAC,CACC,CACD,CACP,CAAC;AACJ,CAAC,CAAC"}

package/lib/esm/core-components/atoms/tabs/tabs.stories.js

@@ -0,0 +1,23 @@
+import { Tabs } from "./tabs.component";
+const meta = {
+  title: "Design System/Atoms/Tabs",
+  component: Tabs,
+  tags: ["autodocs"],
+  parameters: {
+    componentSubtitle: `import { Tabs } from 'react-restyle-components'`,
+  },
+};
+export default meta;
+export const Primary = {
+  args: {
+    options: [
+      { title: "Work History", icon: "FaHistory" },
+      { title: "Book Order", icon: "FaBook" },
+      { title: "Make Frame", icon: "MdFilterFrames" },
+    ],
+    onSelect: (item) => {
+      console.log({ item });
+    },
+  },
+};
+//# sourceMappingURL=tabs.stories.js.map

package/lib/esm/core-components/atoms/tabs/tabs.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.stories.js","sourceRoot":"","sources":["../../../../../src/core-components/atoms/tabs/tabs.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,IAAI,EAAC,MAAM,kBAAkB,CAAC;AAEtC,MAAM,IAAI,GAAsB;IAC9B,KAAK,EAAE,0BAA0B;IACjC,SAAS,EAAE,IAAI;IACf,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,iBAAiB,EAAE,iDAAiD;KACrE;CACF,CAAC;AACF,eAAe,IAAI,CAAC;AAGpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,OAAO,EAAC;YACN,EAAC,KAAK,EAAE,cAAc,EAAE,IAAI,EAAE,WAAW,EAAC;YAC1C,EAAC,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAC;YACrC,EAAC,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,gBAAgB,EAAC;SAC9C;QACD,QAAQ,EAAC,CAAC,IAAI,EAAE,EAAE;YAChB,OAAO,CAAC,GAAG,CAAC,EAAC,IAAI,EAAC,CAAC,CAAC;QAEtB,CAAC;KACF;CACF,CAAC"}

package/lib/esm/core-components/atoms/tabs/tabs.test.js

@@ -0,0 +1,19 @@
+import React from "react";
+import { render } from "@core-utils";
+import { Tabs } from "./tabs.component";
+it("render Tabs correctly", () => {
+  const tabs = render(
+    React.createElement(Tabs, {
+      options: [
+        { title: "Work History", icon: "FaHistory" },
+        { title: "Book Order", icon: "FaBook" },
+        { title: "Make Frame", icon: "MdFilterFrames" },
+      ],
+      onSelect: (item) => {
+        console.log({ item });
+      },
+    }),
+  );
+  expect(tabs).toMatchSnapshot();
+});
+//# sourceMappingURL=tabs.test.js.map

package/lib/esm/core-components/atoms/tabs/tabs.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.test.js","sourceRoot":"","sources":["../../../../../src/core-components/atoms/tabs/tabs.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,MAAM,EAAC,MAAM,aAAa,CAAC;AACnC,OAAO,EAAC,IAAI,EAAC,MAAM,kBAAkB,CAAC;AACtC,EAAE,CAAC,uBAAuB,EAAE,GAAG,EAAE;IAC/B,MAAM,IAAI,GAAG,MAAM,CACjB,oBAAC,IAAI,IACL,OAAO,EAAE;YACP,EAAC,KAAK,EAAE,cAAc,EAAE,IAAI,EAAE,WAAW,EAAC;YAC1C,EAAC,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,QAAQ,EAAC;YACrC,EAAC,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,gBAAgB,EAAC;SAC9C,EACD,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE;YACjB,OAAO,CAAC,GAAG,CAAC,EAAC,IAAI,EAAC,CAAC,CAAC;QAEtB,CAAC,GACC,CACH,CAAC;IACF,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;AACjC,CAAC,CAAC,CAAC"}

package/lib/esm/core-components/atoms/timer/timer.component.js

@@ -1,80 +1,86 @@
 /* eslint-disable react/prop-types */
 /* eslint-disable @typescript-eslint/no-unused-expressions */
-import React, { useEffect, useState, useImperativeHandle } from 'react';
-import { TimerSVG } from '../../../library/assets/svg';
+import React, { useEffect, useState, useImperativeHandle } from "react";
+import { TimerSVG } from "../../../library/assets/svg";
 // eslint-disable-next-line react/display-name
 export const Timer = React.forwardRef(({ onClear }, ref) => {
-    const width = 15;
-    const [minute, setMinute] = useState('00');
-    const [second, setSecond] = useState('10');
-    useEffect(() => {
-        const sec = parseInt(second);
-        const min = parseInt(minute);
-        const countDown = setInterval(() => {
-            if (min === 0 && sec === 0) {
-                setMinute('00');
-                setSecond('00');
-                clearInterval(countDown);
-                onClear && onClear();
-            }
-            else {
-                let secondstTmp = (sec - 1).toString();
-                if (secondstTmp.length === 1) {
-                    secondstTmp = '0'.concat(secondstTmp);
-                }
-                setSecond(secondstTmp);
-                if (sec === 0) {
-                    setSecond('59');
-                    const m = (min - 1).toString();
-                    setMinute('0' + m);
-                }
-            }
-        }, 1000);
-        return () => {
-            clearInterval(countDown);
-        };
-    });
-    useImperativeHandle(ref, () => ({
-        updateState() {
-            setMinute('02');
-            setSecond('00');
-        },
-        resetTimer() {
-            // eslint-disable-next-line no-console
-            const sec = parseInt(second);
-            const min = parseInt(minute === '00' ? '02' : minute);
-            const countDown = setInterval(() => {
-                // eslint-disable-next-line no-console
-                if (min === 0 && sec === 0) {
-                    setMinute('00');
-                    setSecond('00');
-                    clearInterval(countDown);
-                    onClear && onClear();
-                }
-                else {
-                    let secondstTmp = (sec - 1).toString();
-                    if (secondstTmp.length === 1) {
-                        secondstTmp = '0'.concat(secondstTmp);
-                    }
-                    setSecond(secondstTmp);
-                    if (sec === 0) {
-                        setSecond('59');
-                        const m = (min - 1).toString();
-                        setMinute('0' + m);
-                    }
-                }
-            }, 1000);
-            return () => {
-                clearInterval(countDown);
-            };
-        },
-    }));
-    return (React.createElement("div", { className: "flex flex-row items-center" },
-        React.createElement(TimerSVG, { width: width, height: width, fill: "#E7503D" }),
-        React.createElement("div", { className: "ml-2 flex flex-row" },
-            React.createElement("span", null,
-                minute,
-                ":"),
-            React.createElement("span", null, second))));
+  const width = 15;
+  const [minute, setMinute] = useState("00");
+  const [second, setSecond] = useState("10");
+  useEffect(() => {
+    const sec = parseInt(second);
+    const min = parseInt(minute);
+    const countDown = setInterval(() => {
+      if (min === 0 && sec === 0) {
+        setMinute("00");
+        setSecond("00");
+        clearInterval(countDown);
+        onClear && onClear();
+      } else {
+        let secondstTmp = (sec - 1).toString();
+        if (secondstTmp.length === 1) {
+          secondstTmp = "0".concat(secondstTmp);
+        }
+        setSecond(secondstTmp);
+        if (sec === 0) {
+          setSecond("59");
+          const m = (min - 1).toString();
+          setMinute("0" + m);
+        }
+      }
+    }, 1000);
+    return () => {
+      clearInterval(countDown);
+    };
+  });
+  useImperativeHandle(ref, () => ({
+    updateState() {
+      setMinute("02");
+      setSecond("00");
+    },
+    resetTimer() {
+      // eslint-disable-next-line no-console
+      const sec = parseInt(second);
+      const min = parseInt(minute === "00" ? "02" : minute);
+      const countDown = setInterval(() => {
+        // eslint-disable-next-line no-console
+        if (min === 0 && sec === 0) {
+          setMinute("00");
+          setSecond("00");
+          clearInterval(countDown);
+          onClear && onClear();
+        } else {
+          let secondstTmp = (sec - 1).toString();
+          if (secondstTmp.length === 1) {
+            secondstTmp = "0".concat(secondstTmp);
+          }
+          setSecond(secondstTmp);
+          if (sec === 0) {
+            setSecond("59");
+            const m = (min - 1).toString();
+            setMinute("0" + m);
+          }
+        }
+      }, 1000);
+      return () => {
+        clearInterval(countDown);
+      };
+    },
+  }));
+  return React.createElement(
+    "div",
+    { className: "flex flex-row items-center" },
+    React.createElement(TimerSVG, {
+      width: width,
+      height: width,
+      fill: "#E7503D",
+    }),
+    React.createElement(
+      "div",
+      { className: "ml-2 flex flex-row" },
+      React.createElement("span", null, minute, ":"),
+      React.createElement("span", null, second),
+    ),
+  );
 });
-//# sourceMappingURL=timer.component.js.map
+//# sourceMappingURL=timer.component.js.map

package/lib/esm/core-components/atoms/timer/timer.test.js

@@ -1,15 +1,15 @@
 /* eslint-disable testing-library/await-async-query */
 /* eslint-disable testing-library/prefer-screen-queries */
 /* eslint-disable testing-library/render-result-naming-convention */
-import React from 'react';
-import { render } from '@core-utils';
-import { Timer as TimerComp } from './timer.component';
-it('render Timer correctly', () => {
-    const time = render(React.createElement(TimerComp, { onClear: () => { } }));
-    expect(time).toMatchSnapshot();
+import React from "react";
+import { render } from "@core-utils";
+import { Timer as TimerComp } from "./timer.component";
+it("render Timer correctly", () => {
+  const time = render(React.createElement(TimerComp, { onClear: () => {} }));
+  expect(time).toMatchSnapshot();
 });
-it('render Timer with minute correctly', () => {
-    const time = render(React.createElement(TimerComp, { onClear: () => { } }));
-    expect(time.findByText('minute')).toBeTruthy();
+it("render Timer with minute correctly", () => {
+  const time = render(React.createElement(TimerComp, { onClear: () => {} }));
+  expect(time.findByText("minute")).toBeTruthy();
 });
-//# sourceMappingURL=timer.test.js.map
+//# sourceMappingURL=timer.test.js.map

package/lib/esm/core-components/atoms/tooltip/tooltip.component.js

@@ -1,26 +1,47 @@
-import React from 'react';
-import * as Material from '@mui/material';
-export const Tooltip = ({ tooltipText, position = 'bottom-start', children, }) => {
-    const positionRef = React.useRef({
-        x: 0,
-        y: 0,
-    });
-    const popperRef = React.useRef(null);
-    const areaRef = React.useRef(null);
-    const handleMouseMove = (event) => {
-        positionRef.current = { x: event.clientX, y: event.clientY };
-        if (popperRef.current != null) {
-            popperRef.current.update();
-        }
-    };
-    return (React.createElement(Material.Tooltip, { title: tooltipText, placement: "bottom-start", arrow: true, PopperProps: {
-            popperRef,
-            anchorEl: {
-                getBoundingClientRect: () => {
-                    return new DOMRect(positionRef.current.x, areaRef.current.getBoundingClientRect().y + 22, 0, 0);
-                },
-            },
-        } },
-        React.createElement(Material.Box, { ref: areaRef, onMouseMove: handleMouseMove }, children)));
+import React from "react";
+import * as Material from "@mui/material";
+export const Tooltip = ({
+  tooltipText,
+  position = "bottom-start",
+  children,
+}) => {
+  const positionRef = React.useRef({
+    x: 0,
+    y: 0,
+  });
+  const popperRef = React.useRef(null);
+  const areaRef = React.useRef(null);
+  const handleMouseMove = (event) => {
+    positionRef.current = { x: event.clientX, y: event.clientY };
+    if (popperRef.current != null) {
+      popperRef.current.update();
+    }
+  };
+  return React.createElement(
+    Material.Tooltip,
+    {
+      title: tooltipText,
+      placement: "bottom-start",
+      arrow: true,
+      PopperProps: {
+        popperRef,
+        anchorEl: {
+          getBoundingClientRect: () => {
+            return new DOMRect(
+              positionRef.current.x,
+              areaRef.current.getBoundingClientRect().y + 22,
+              0,
+              0,
+            );
+          },
+        },
+      },
+    },
+    React.createElement(
+      Material.Box,
+      { ref: areaRef, onMouseMove: handleMouseMove },
+      children,
+    ),
+  );
 };
-//# sourceMappingURL=tooltip.component.js.map
+//# sourceMappingURL=tooltip.component.js.map

package/lib/esm/core-components/atoms/tooltip/tooltip.component.test.js

@@ -1,10 +1,10 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import { Tooltip } from './tooltip.component';
-describe('Tooltip component', () => {
-    it('render tooltip correctly', () => {
-        const tooltip = render(React.createElement(Tooltip, null));
-        expect(tooltip).toMatchSnapshot();
-    });
+import React from "react";
+import { render } from "@testing-library/react";
+import { Tooltip } from "./tooltip.component";
+describe("Tooltip component", () => {
+  it("render tooltip correctly", () => {
+    const tooltip = render(React.createElement(Tooltip, null));
+    expect(tooltip).toMatchSnapshot();
+  });
 });
-//# sourceMappingURL=tooltip.component.test.js.map
+//# sourceMappingURL=tooltip.component.test.js.map