@twreporter/react-typescript-components 0.1.0-beta.7 → 0.1.0-beta.9

package/lib/title-bar/index.mjs

@@ -1,30 +1,145 @@
-import { title_tab_default } from '../chunk-7NJDHQ2X.mjs';
-export { title_tab_default as TitleTab } from '../chunk-7NJDHQ2X.mjs';
-import '../chunk-GQWO45DN.mjs';
-import '../chunk-FF422IYY.mjs';
-import { title1_default } from '../chunk-ZALXWB2J.mjs';
-export { title1_default as Title1 } from '../chunk-ZALXWB2J.mjs';
-import { title2_default } from '../chunk-6DXA3EX7.mjs';
-export { title2_default as Title2 } from '../chunk-6DXA3EX7.mjs';
-import '../chunk-JHLT5GDV.mjs';
-import '../chunk-ELECTE3D.mjs';
-import '../chunk-U22UKMAJ.mjs';
-import '../chunk-FVKIUNIP.mjs';
-import '../chunk-HQG6Q2EY.mjs';
-import '../chunk-UM7RNC2Y.mjs';
-import '../chunk-JB4TYHDE.mjs';
-import '../chunk-URJXIWFX.mjs';
-import '../chunk-JFT6JILC.mjs';
-import '../chunk-X2UWIBNH.mjs';
-import '../chunk-XO7SDD7W.mjs';
+import { internal_link_default } from "../internal-link-NQb751uB.mjs";
+import "../constants-oTHAnh6r.mjs";
+import "../constants-BWFuBApI.mjs";
+import { P1, P2 } from "../paragraph-BWXQNQtX.mjs";
+import "../theme-BG6yZVj-.mjs";
+import { text_button_default } from "../button-DL6w1ghn.mjs";
+import { external_link_default } from "../external-link-Cx9S31Ye.mjs";
+import "../customized-link-BkuKVCKQ.mjs";
+import { H1, H2, H5 } from "../heading-Dt90Ed74.mjs";
+import { createElement, useEffect, useRef, useState } from "react";
+import clsx from "clsx";
+import { jsx, jsxs } from "react/jsx-runtime";
 
-// src/title-bar/index.ts
+//#region src/title-bar/components/title2.tsx
+const Title2 = ({ title, subtitle = "", renderButton = null, className = "" }) => {
+	return /* @__PURE__ */ jsxs("div", {
+		className: clsx("flex justify-between flex-col", className),
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "flex flex-row justify-between",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: clsx("flex items-baseline gap-[16px]"),
+				children: [/* @__PURE__ */ jsx(H5, {
+					className: "text-gray-800",
+					text: title
+				}), subtitle ? /* @__PURE__ */ jsx(P2, {
+					className: "text-gray-600",
+					text: subtitle
+				}) : null]
+			}), renderButton || null]
+		}), /* @__PURE__ */ jsx("div", { className: clsx("w-full h-[1px] bg-gray-800 mt-[8px]", "desktop:mt-[16px]") })]
+	});
+};
+var title2_default = Title2;
+
+//#endregion
+//#region src/title-bar/components/title1.tsx
+const Title1 = ({ title, subtitle = "", className = "" }) => {
+	return /* @__PURE__ */ jsxs("div", {
+		className: clsx("flex justify-between flex-col", className),
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: clsx("flex items-baseline gap-[16px]"),
+			children: [/* @__PURE__ */ jsx(H2, {
+				className: "text-gray-800",
+				text: title
+			}), subtitle ? /* @__PURE__ */ jsx(P1, {
+				className: "text-gray-600",
+				text: subtitle
+			}) : null]
+		}), /* @__PURE__ */ jsx("div", { className: clsx("w-full h-[1px] bg-gray-300 mt-[8px]", "desktop:mt-[16px]") })]
+	});
+};
+var title1_default = Title1;
+
+//#endregion
+//#region src/title-bar/components/title-tab/hook.ts
+const useScrollStatus = (setShowNext) => {
+	const ref = useRef(null);
+	useEffect(() => {
+		if (!ref.current) return;
+		if (ref.current.scrollWidth > ref.current.clientWidth) setShowNext(true);
+	}, [setShowNext]);
+	useEffect(() => {
+		if (!ref.current) return;
+		const refEle = ref.current;
+		const handleScroll = () => {
+			if (refEle.offsetWidth + refEle.scrollLeft >= refEle.scrollWidth) setShowNext(false);
+			else setShowNext(true);
+		};
+		refEle.addEventListener("scroll", handleScroll);
+		return () => {
+			refEle.removeEventListener("scroll", handleScroll);
+		};
+	}, [setShowNext]);
+	return ref;
+};
+
+//#endregion
+//#region src/title-bar/components/title-tab/tab-item.tsx
+const TabItem = ({ text, link, isExternal = false, isActive = false, onClick, className = "" }) => {
+	const CustomizedLink = isExternal ? external_link_default : internal_link_default;
+	return /* @__PURE__ */ jsx("button", {
+		className: clsx("flex shrink-0 mr-[24px] last:mr-0", className),
+		onClick,
+		type: "button",
+		children: /* @__PURE__ */ jsx(CustomizedLink, {
+			to: link,
+			children: /* @__PURE__ */ jsx(text_button_default, {
+				text,
+				active: isActive,
+				size: text_button_default.Size.l,
+				className: "py-[16px]"
+			})
+		})
+	});
+};
+var tab_item_default = TabItem;
+
+//#endregion
+//#region src/title-bar/components/title-tab/index.tsx
+const TitleTab = ({ title, tabs = [], activeTabIndex = 0 }) => {
+	const [activeIndex, setActiveIndex] = useState(activeTabIndex);
+	const [showGradientMask, setShowGradientMask] = useState(false);
+	const ref = useScrollStatus(setShowGradientMask);
+	useEffect(() => {
+		setActiveIndex(activeTabIndex);
+	}, [activeTabIndex]);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col w-full text-gray-800",
+		children: [
+			/* @__PURE__ */ jsx(H1, { text: title }),
+			tabs.length > 0 ? /* @__PURE__ */ jsx("div", {
+				ref,
+				className: clsx("flex items-center", "overflow-x-scroll scrollbar:!w-0", { "[mask-image:linear-gradient(to_left,rgba(241,241,241,0),#f1f1f1_48px)] [-webkit-mask-image:linear-gradient(to_left,rgba(241,241,241,0),#f1f1f1_48px)]": showGradientMask }),
+				children: tabs.map((tab, index) => {
+					const tabProps = {
+						...tab,
+						isActive: index === activeIndex
+					};
+					const handleClick = () => {
+						setActiveIndex(index);
+					};
+					return /* @__PURE__ */ createElement(tab_item_default, {
+						...tabProps,
+						key: `tab-${tab.text}-${index}`,
+						onClick: handleClick
+					});
+				})
+			}) : null,
+			/* @__PURE__ */ jsx("div", { className: clsx("w-full h-[1px] bg-gray-300 mt-[0px]", "desktop:mt-[0px]") })
+		]
+	});
+};
+var title_tab_default = TitleTab;
+
+//#endregion
+//#region src/title-bar/index.ts
 var title_bar_default = {
-  Title2: title2_default,
-  Title1: title1_default,
-  TitleTab: title_tab_default
+	Title2: title2_default,
+	Title1: title1_default,
+	TitleTab: title_tab_default
 };
 
-export { title_bar_default as default };
-//# sourceMappingURL=index.mjs.map
+//#endregion
+export { title1_default as Title1, title2_default as Title2, title_tab_default as TitleTab, title_bar_default as default };
 //# sourceMappingURL=index.mjs.map

package/lib/title-bar/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/title-bar/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAMA,IAAO,iBAAA,GAAQ;AAAA,EACb,MAAA,EAAA,cAAA;AAAA,EACA,MAAA,EAAA,cAAA;AAAA,EACA,QAAA,EAAA;AACF","file":"index.mjs","sourcesContent":["import Title2 from './components/title2'\nimport Title1 from './components/title1'\nimport TitleTab from './components/title-tab'\n\nexport { Title2, Title1, TitleTab }\n\nexport default {\n  Title2,\n  Title1,\n  TitleTab,\n}\n"]}
+{"version":3,"file":"index.mjs","names":["Title2: React.FC<Title2Props>","Title1: FC<Title1Props>","handleScroll: EventListener","TabItem: FC<TabItemProps>","ExternalLink","InternalLink","TextButton","TitleTab: FC<TitleTabProps>","TabItem"],"sources":["../../src/title-bar/components/title2.tsx","../../src/title-bar/components/title1.tsx","../../src/title-bar/components/title-tab/hook.ts","../../src/title-bar/components/title-tab/tab-item.tsx","../../src/title-bar/components/title-tab/index.tsx","../../src/title-bar/index.ts"],"sourcesContent":["import clsx from 'clsx'\nimport type React from 'react'\n// components\nimport { H5 } from '../../text/heading'\nimport { P2 } from '../../text/paragraph'\n\ntype Title2Props = {\n  title: string\n  subtitle?: string\n  renderButton?: React.ReactNode\n  className?: string\n}\n\nconst Title2: React.FC<Title2Props> = ({\n  title,\n  subtitle = '',\n  renderButton = null,\n  className = '',\n}) => {\n  return (\n    <div className={clsx('flex justify-between flex-col', className)}>\n      <div className=\"flex flex-row justify-between\">\n        <div className={clsx('flex items-baseline gap-[16px]')}>\n          <H5 className=\"text-gray-800\" text={title} />\n          {subtitle ? <P2 className=\"text-gray-600\" text={subtitle} /> : null}\n        </div>\n        {renderButton || null}\n      </div>\n      <div\n        className={clsx(\n          'w-full h-[1px] bg-gray-800 mt-[8px]',\n          'desktop:mt-[16px]'\n        )}\n      />\n    </div>\n  )\n}\n\nexport default Title2\n","import clsx from 'clsx'\nimport type { FC } from 'react'\n// components\nimport { H2 } from '../../text/heading'\nimport { P1 } from '../../text/paragraph'\n\ntype Title1Props = {\n  title: string\n  subtitle?: string\n  className?: string\n}\n\nconst Title1: FC<Title1Props> = ({ title, subtitle = '', className = '' }) => {\n  return (\n    <div className={clsx('flex justify-between flex-col', className)}>\n      <div className={clsx('flex items-baseline gap-[16px]')}>\n        <H2 className=\"text-gray-800\" text={title} />\n        {subtitle ? <P1 className=\"text-gray-600\" text={subtitle} /> : null}\n      </div>\n      <div\n        className={clsx(\n          'w-full h-[1px] bg-gray-300 mt-[8px]',\n          'desktop:mt-[16px]'\n        )}\n      />\n    </div>\n  )\n}\n\nexport default Title1\n","import { useRef, useEffect } from 'react'\n\nexport const useScrollStatus = (setShowNext: (show: boolean) => void) => {\n  const ref = useRef<HTMLDivElement>(null)\n\n  useEffect(() => {\n    if (!ref.current) return\n\n    if (ref.current.scrollWidth > ref.current.clientWidth) {\n      // scrollbar occur\n      setShowNext(true)\n    }\n  }, [setShowNext])\n\n  useEffect(() => {\n    if (!ref.current) return\n\n    const refEle = ref.current\n    const handleScroll: EventListener = () => {\n      if (refEle.offsetWidth + refEle.scrollLeft >= refEle.scrollWidth) {\n        // scroll to end\n        setShowNext(false)\n      } else {\n        setShowNext(true)\n      }\n    }\n\n    refEle.addEventListener('scroll', handleScroll)\n\n    return () => {\n      refEle.removeEventListener('scroll', handleScroll)\n    }\n  }, [setShowNext])\n\n  return ref\n}\n","import clsx from 'clsx'\nimport type { FC } from 'react'\n// type\nimport type { Tab } from './type'\n// component\nimport { ExternalLink, InternalLink } from '../../../customized-link'\nimport { TextButton } from '../../../button'\n\ntype TabItemProps = Tab & {\n  onClick: () => void\n  className?: string\n}\nconst TabItem: FC<TabItemProps> = ({\n  text,\n  link,\n  isExternal = false,\n  isActive = false,\n  onClick,\n  className = '',\n}) => {\n  const CustomizedLink = isExternal ? ExternalLink : InternalLink\n  return (\n    <button\n      className={clsx('flex shrink-0 mr-[24px] last:mr-0', className)}\n      onClick={onClick}\n      type=\"button\"\n    >\n      <CustomizedLink to={link}>\n        <TextButton\n          text={text}\n          active={isActive}\n          size={TextButton.Size.l}\n          className=\"py-[16px]\"\n        />\n      </CustomizedLink>\n    </button>\n  )\n}\n\nexport default TabItem\n","import clsx from 'clsx'\nimport { type FC, useState, useEffect } from 'react'\n// hook\nimport { useScrollStatus } from './hook'\n// components\nimport TabItem from './tab-item'\nimport { H1 } from '../../../text/heading'\n// type\nimport type { Tab } from './type'\n\ntype TitleTabProps = {\n  title: string\n  tabs: Tab[]\n  activeTabIndex?: number\n}\nconst TitleTab: FC<TitleTabProps> = ({\n  title,\n  tabs = [],\n  activeTabIndex = 0,\n}) => {\n  const [activeIndex, setActiveIndex] = useState(activeTabIndex)\n  const [showGradientMask, setShowGradientMask] = useState(false)\n\n  const ref = useScrollStatus(setShowGradientMask)\n\n  useEffect(() => {\n    setActiveIndex(activeTabIndex)\n  }, [activeTabIndex])\n\n  return (\n    <div className=\"flex flex-col w-full text-gray-800\">\n      <H1 text={title} />\n      {tabs.length > 0 ? (\n        <div\n          ref={ref}\n          className={clsx(\n            'flex items-center',\n            'overflow-x-scroll scrollbar:!w-0',\n            {\n              '[mask-image:linear-gradient(to_left,rgba(241,241,241,0),#f1f1f1_48px)] [-webkit-mask-image:linear-gradient(to_left,rgba(241,241,241,0),#f1f1f1_48px)]':\n                showGradientMask,\n            }\n          )}\n        >\n          {tabs.map((tab, index) => {\n            const tabProps = { ...tab, isActive: index === activeIndex }\n            const handleClick = () => {\n              setActiveIndex(index)\n            }\n            return (\n              <TabItem {...tabProps} key={`tab-${tab.text}-${index}`} onClick={handleClick} />\n            )\n          })}\n        </div>\n      ) : null}\n      <div\n        className={clsx(\n          'w-full h-[1px] bg-gray-300 mt-[0px]',\n          'desktop:mt-[0px]'\n        )}\n      />\n    </div>\n  )\n}\n\nexport default TitleTab\n","import Title2 from './components/title2'\nimport Title1 from './components/title1'\nimport TitleTab from './components/title-tab'\n\nexport { Title2, Title1, TitleTab }\n\nexport default {\n  Title2,\n  Title1,\n  TitleTab,\n}\n"],"mappings":";;;;;;;;;;;;;;AAaA,MAAMA,UAAiC,EACrC,OACA,WAAW,IACX,eAAe,MACf,YAAY,SACR;AACJ,QACE,qBAAC;EAAI,WAAW,KAAK,iCAAiC,UAAU;aAC9D,qBAAC;GAAI,WAAU;cACb,qBAAC;IAAI,WAAW,KAAK,iCAAiC;eACpD,oBAAC;KAAG,WAAU;KAAgB,MAAM;MAAS,EAC5C,WAAW,oBAAC;KAAG,WAAU;KAAgB,MAAM;MAAY,GAAG;KAC3D,EACL,gBAAgB;IACb,EACN,oBAAC,SACC,WAAW,KACT,uCACA,oBACD,GACD;GACE;;AAIV,qBAAe;;;;AC1Bf,MAAMC,UAA2B,EAAE,OAAO,WAAW,IAAI,YAAY,SAAS;AAC5E,QACE,qBAAC;EAAI,WAAW,KAAK,iCAAiC,UAAU;aAC9D,qBAAC;GAAI,WAAW,KAAK,iCAAiC;cACpD,oBAAC;IAAG,WAAU;IAAgB,MAAM;KAAS,EAC5C,WAAW,oBAAC;IAAG,WAAU;IAAgB,MAAM;KAAY,GAAG;IAC3D,EACN,oBAAC,SACC,WAAW,KACT,uCACA,oBACD,GACD;GACE;;AAIV,qBAAe;;;;AC3Bf,MAAa,mBAAmB,gBAAyC;CACvE,MAAM,MAAM,OAAuB,KAAK;AAExC,iBAAgB;AACd,MAAI,CAAC,IAAI,QAAS;AAElB,MAAI,IAAI,QAAQ,cAAc,IAAI,QAAQ,YAExC,aAAY,KAAK;IAElB,CAAC,YAAY,CAAC;AAEjB,iBAAgB;AACd,MAAI,CAAC,IAAI,QAAS;EAElB,MAAM,SAAS,IAAI;EACnB,MAAMC,qBAAoC;AACxC,OAAI,OAAO,cAAc,OAAO,cAAc,OAAO,YAEnD,aAAY,MAAM;OAElB,aAAY,KAAK;;AAIrB,SAAO,iBAAiB,UAAU,aAAa;AAE/C,eAAa;AACX,UAAO,oBAAoB,UAAU,aAAa;;IAEnD,CAAC,YAAY,CAAC;AAEjB,QAAO;;;;;ACtBT,MAAMC,WAA6B,EACjC,MACA,MACA,aAAa,OACb,WAAW,OACX,SACA,YAAY,SACR;CACJ,MAAM,iBAAiB,aAAaC,wBAAeC;AACnD,QACE,oBAAC;EACC,WAAW,KAAK,qCAAqC,UAAU;EACtD;EACT,MAAK;YAEL,oBAAC;GAAe,IAAI;aAClB,oBAACC;IACO;IACN,QAAQ;IACR,MAAMA,oBAAW,KAAK;IACtB,WAAU;KACV;IACa;GACV;;AAIb,uBAAe;;;;ACxBf,MAAMC,YAA+B,EACnC,OACA,OAAO,EAAE,EACT,iBAAiB,QACb;CACJ,MAAM,CAAC,aAAa,kBAAkB,SAAS,eAAe;CAC9D,MAAM,CAAC,kBAAkB,uBAAuB,SAAS,MAAM;CAE/D,MAAM,MAAM,gBAAgB,oBAAoB;AAEhD,iBAAgB;AACd,iBAAe,eAAe;IAC7B,CAAC,eAAe,CAAC;AAEpB,QACE,qBAAC;EAAI,WAAU;;GACb,oBAAC,MAAG,MAAM,QAAS;GAClB,KAAK,SAAS,IACb,oBAAC;IACM;IACL,WAAW,KACT,qBACA,oCACA,EACE,yJACE,kBACH,CACF;cAEA,KAAK,KAAK,KAAK,UAAU;KACxB,MAAM,WAAW;MAAE,GAAG;MAAK,UAAU,UAAU;MAAa;KAC5D,MAAM,oBAAoB;AACxB,qBAAe,MAAM;;AAEvB,YACE,8BAACC;MAAQ,GAAI;MAAU,KAAK,OAAO,IAAI,KAAK,GAAG;MAAS,SAAS;OAAe;MAElF;KACE,GACJ;GACJ,oBAAC,SACC,WAAW,KACT,uCACA,mBACD,GACD;;GACE;;AAIV,wBAAe;;;;AC3Df,wBAAe;CACb;CACA;CACA;CACD"}

package/lib/type-C4hJK9H9.d.ts

@@ -0,0 +1,11 @@
+//#region src/customized-link/type.d.ts
+type LinkTarget = '_blank' | '_self' | '_parent' | '_top';
+type CustomizedLinkProps = {
+  to: string;
+  target?: LinkTarget;
+  className?: string;
+  children?: React.ReactNode;
+};
+//#endregion
+export { CustomizedLinkProps, LinkTarget };
+//# sourceMappingURL=type-C4hJK9H9.d.ts.map

package/lib/type-DeNBwt-o.d.mts

@@ -0,0 +1,11 @@
+//#region src/customized-link/type.d.ts
+type LinkTarget = '_blank' | '_self' | '_parent' | '_top';
+type CustomizedLinkProps = {
+  to: string;
+  target?: LinkTarget;
+  className?: string;
+  children?: React.ReactNode;
+};
+//#endregion
+export { CustomizedLinkProps, LinkTarget };
+//# sourceMappingURL=type-DeNBwt-o.d.mts.map

package/lib/types/index.d.mts

@@ -1,3 +1,2 @@
-type ValuesOf<T> = T[keyof T];
-
-export type { ValuesOf };
+import { ValuesOf } from "../index-Ej3agYJF.mjs";
+export { ValuesOf };

package/lib/types/index.d.ts

@@ -1,3 +1,2 @@
-type ValuesOf<T> = T[keyof T];
-
-export type { ValuesOf };
+import { ValuesOf } from "../index-H3peA2d_.js";
+export { ValuesOf };

package/lib/types/index.js

@@ -1,4 +0,0 @@
-'use strict';
-
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map

package/lib/types/index.mjs

@@ -1,3 +1 @@
-
-//# sourceMappingURL=index.mjs.map
-//# sourceMappingURL=index.mjs.map
+export {  };

package/package.json

@@ -3,12 +3,12 @@
   "description": "React components using TypeScript and Tailwind CSS",
   "author": "twreporter <developer@twreporter.org>",
   "license": "MIT",
-  "version": "0.1.0-beta.7",
+  "version": "0.1.0-beta.9",
   "type": "commonjs",
   "scripts": {
     "clean": "rm -rf lib",
     "build:styles": "tailwindcss -i ./src/styles.css -o ./lib/styles.css",
-    "build:components": "tsup src/* --outDir lib",
+    "build:components": "tsdown",
     "build": "yarn clean && yarn build:components && yarn build:styles",
     "prepublishOnly": "yarn build",
     "storybook": "storybook dev -p 6006",
@@ -20,19 +20,24 @@
     "tailwindcss": "^4.1.11"
   },
   "dependencies": {
-    "clsx": "^2.1.1"
+    "clsx": "^2.1.1",
+    "lodash": "^4.17.21",
+    "react-transition-group": "^4.4.5"
   },
   "devDependencies": {
     "@storybook/addon-docs": "^9.1.3",
     "@storybook/react-vite": "^9.1.3",
     "@tailwindcss/cli": "^4.1.11",
     "@tailwindcss/postcss": "^4.1.11",
-    "@twreporter/tailwind-config": "^0.1.0-beta.5",
+    "@twreporter/tailwind-config": "^0.1.0-beta.6",
+    "@types/lodash": "^4",
     "@types/react": "^19",
     "@types/react-dom": "^19",
+    "@types/react-transition-group": "^4",
     "autoprefixer": "^10.4.21",
     "storybook": "^9.1.3",
-    "tsup": "^8.5.0",
+    "tailwind-scrollbar": "^4.0.2",
+    "tsdown": "^0.15.2",
     "typescript": "^5",
     "vite": "^7.1.3"
   },
@@ -44,5 +49,5 @@
     "url": "git+https://github.com/twreporter/www-public-monorepo.git",
     "directory": "packages/react-typescript-components"
   },
-  "gitHead": "80c85301804c9dae5cdb00017c32c8f895e672da"
+  "gitHead": "de7cf50f35ecfdce963916a2d9a69c6edeb2a95d"
 }

package/lib/button/components/text-button/index.d.mts

@@ -1,24 +0,0 @@
-import { FC, ReactElement } from 'react';
-import { Size, Style } from '../../enum.mjs';
-import { Theme, THEME } from '../../constant.mjs';
-import '../../../types/index.mjs';
-
-type TextButtonProps = {
-    text: string;
-    leftIconComponent?: ReactElement;
-    rightIconComponent?: ReactElement;
-    size?: Size;
-    style?: Style;
-    theme?: Theme;
-    active?: boolean;
-    disabled?: boolean;
-    loading?: boolean;
-    className?: string;
-};
-declare const TextButton: FC<TextButtonProps> & {
-    Size: typeof Size;
-    Style: typeof Style;
-    THEME: typeof THEME;
-};
-
-export { TextButton as default };

package/lib/button/components/text-button/index.d.ts

@@ -1,24 +0,0 @@
-import { FC, ReactElement } from 'react';
-import { Size, Style } from '../../enum.js';
-import { Theme, THEME } from '../../constant.js';
-import '../../../types/index.js';
-
-type TextButtonProps = {
-    text: string;
-    leftIconComponent?: ReactElement;
-    rightIconComponent?: ReactElement;
-    size?: Size;
-    style?: Style;
-    theme?: Theme;
-    active?: boolean;
-    disabled?: boolean;
-    loading?: boolean;
-    className?: string;
-};
-declare const TextButton: FC<TextButtonProps> & {
-    Size: typeof Size;
-    Style: typeof Style;
-    THEME: typeof THEME;
-};
-
-export { TextButton as default };

package/lib/button/components/text-button/index.js

@@ -1,202 +0,0 @@
-'use strict';
-
-var react = require('react');
-var clsx2 = require('clsx');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var clsx2__default = /*#__PURE__*/_interopDefault(clsx2);
-
-// src/button/components/text-button/index.tsx
-
-// src/text/enum/index.ts
-var WEIGHT = {
-  extraLight: "extra-light",
-  normal: "normal",
-  bold: "bold"
-};
-var baseClass = "font-default leading-[150%] flex items-center m-0";
-var variantClass = {
-  P1: "text-[16px]",
-  P2: "text-[14px]",
-  P3: "text-[12px]",
-  P4: "text-[10px]"
-};
-var ParagraphVariant = (variant) => {
-  const Component = ({
-    text = "",
-    weight = WEIGHT.normal,
-    className = "",
-    ...props
-  }) => /* @__PURE__ */ jsxRuntime.jsx(
-    "p",
-    {
-      className: clsx2__default.default(
-        baseClass,
-        variantClass[variant],
-        `font-${weight}`,
-        className
-      ),
-      ...props,
-      children: text
-    }
-  );
-  Component.displayName = variant;
-  Component.Weight = WEIGHT;
-  return Component;
-};
-var P1 = ParagraphVariant("P1");
-var P2 = ParagraphVariant("P2");
-ParagraphVariant("P3");
-ParagraphVariant("P4");
-
-// src/button/enum.ts
-var Size = /* @__PURE__ */ ((Size2) => {
-  Size2[Size2["S"] = 0] = "S";
-  Size2[Size2["L"] = 1] = "L";
-  return Size2;
-})(Size || {});
-var Style = /* @__PURE__ */ ((Style2) => {
-  Style2[Style2["BRAND"] = 0] = "BRAND";
-  Style2[Style2["DARK"] = 1] = "DARK";
-  Style2[Style2["LIGHT"] = 2] = "LIGHT";
-  return Style2;
-})(Style || {});
-
-// src/button/constant.ts
-var THEME = {
-  normal: "normal",
-  photography: "photography",
-  transparent: "transparent",
-  index: "index"
-};
-
-// src/button/components/text-button/theme.ts
-var getDisabledContainerTheme = (theme) => {
-  return [
-    // default theme
-    "text-gray-400 hover:text-gray-400",
-    // photography & transparent theme
-    {
-      "text-gray-500 hover:text-gray-500": theme === THEME.photography || theme === THEME.transparent
-    }
-  ];
-};
-var getActiveContainerTheme = (theme, style) => {
-  return [
-    // default theme
-    {
-      "text-gray-800 hover:text-gray-800": style === 2 /* LIGHT */,
-      "text-brand-heavy hover:text-brand-heavy": style === 1 /* DARK */,
-      "text-brand-dark hover:text-brand-dark": style === 0 /* BRAND */
-    },
-    // photography theme
-    {
-      "text-gray-400 hover:text-gray-400": theme === THEME.photography && style === 2 /* LIGHT */,
-      "text-supportive-pastel hover:text-supportive-pastel": theme === THEME.photography && style !== 2 /* LIGHT */
-    },
-    // transparent theme
-    {
-      "text-gray-black hover:text-gray-black": theme === THEME.transparent && style === 2 /* LIGHT */,
-      "text-gray-200 hover:text-gray-200": theme === THEME.transparent && style !== 2 /* LIGHT */
-    }
-  ];
-};
-var getContainerTheme = (theme, style) => {
-  return [
-    // default theme
-    {
-      "text-gray-600 hover:text-gray-800": style === 2 /* LIGHT */,
-      "text-gray-800 hover:text-brand-heavy": style === 1 /* DARK */,
-      "text-brand-heavy hover:text-brand-dark": style === 0 /* BRAND */
-    },
-    // photography
-    {
-      "text-gray-300 hover:text-gray-400": theme === THEME.photography && style === 2 /* LIGHT */,
-      "text-gray-white hover:text-supportive-pastel": theme === THEME.photography && style === 1 /* DARK */,
-      "text-supportive-faded hover:text-supportive-pastel": theme === THEME.photography && style === 0 /* BRAND */
-    },
-    // transparent theme
-    {
-      "text-gray-800 hover:text-gray-black": theme === THEME.transparent && style === 2 /* LIGHT */,
-      "text-gray-white hover:text-gray-200": theme === THEME.transparent && style !== 2 /* LIGHT */
-    }
-  ];
-};
-var TextButton = ({
-  text,
-  leftIconComponent,
-  rightIconComponent,
-  size = 0 /* S */,
-  theme = THEME.normal,
-  style = 1 /* DARK */,
-  active = false,
-  disabled = false,
-  loading = false,
-  className = ""
-}) => {
-  const TextJSX = react.useMemo(
-    () => size === 0 /* S */ ? /* @__PURE__ */ jsxRuntime.jsx(P2, { text, weight: P2.Weight.bold }) : /* @__PURE__ */ jsxRuntime.jsx(P1, { text, weight: P1.Weight.bold }),
-    [size, text]
-  );
-  const themeClass = react.useMemo(() => {
-    const themeFunc = disabled ? getDisabledContainerTheme : active ? getActiveContainerTheme : getContainerTheme;
-    return themeFunc(theme, style);
-  }, [disabled, active, theme, style]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: clsx2__default.default(
-        "flex items-center",
-        {
-          "cursor-default": disabled,
-          "cursor-pointer": !disabled
-        },
-        themeClass,
-        className
-      ),
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex justify-center items-center", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          "div",
-          {
-            className: clsx2__default.default("flex justify-center items-center", {
-              "opacity-0": loading,
-              "opacity-100": !loading
-            }),
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center mr-[4px]", children: leftIconComponent }),
-              TextJSX,
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center ml-[4px]", children: rightIconComponent })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "span",
-          {
-            className: clsx2__default.default(
-              "inline-block absolute box-border animation-spin",
-              "border-2 border-solid border-gray-400 border-t-gray-600 rounded-[50%]",
-              {
-                "size-[18px]": size === 0 /* S */,
-                "size-[24px]": size === 1 /* L */
-              },
-              {
-                "opacity-0": !loading,
-                "opacity-100": loading
-              }
-            )
-          }
-        )
-      ] })
-    }
-  );
-};
-TextButton.Size = Size;
-TextButton.Style = Style;
-TextButton.THEME = THEME;
-var text_button_default = TextButton;
-
-module.exports = text_button_default;
-//# sourceMappingURL=index.js.map
-//# sourceMappingURL=index.js.map

package/lib/button/components/text-button/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/text/enum/index.ts","../../../../src/text/paragraph.tsx","../../../../src/button/enum.ts","../../../../src/button/constant.ts","../../../../src/button/components/text-button/theme.ts","../../../../src/button/components/text-button/index.tsx"],"names":["jsx","clsx","Size","Style","useMemo","jsxs"],"mappings":"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","file":"index.js","sourcesContent":["import type { ValuesOf } from '../../types'\n\nexport const TYPE = {\n  default: 'default',\n  article: 'article',\n} as const\n\nexport type Type = ValuesOf<typeof TYPE>\n\nexport const WEIGHT = {\n  extraLight: 'extra-light',\n  normal: 'normal',\n  bold: 'bold',\n} as const\n\nexport type Weight = ValuesOf<typeof WEIGHT>\n","import clsx from 'clsx'\nimport type React from 'react'\nimport { WEIGHT, type Weight } from './enum'\n\ntype ParagraphProps = React.HTMLAttributes<HTMLParagraphElement> & {\n  text?: string\n  weight?: Weight\n  className?: string\n}\n\nconst baseClass = 'font-default leading-[150%] flex items-center m-0'\n\nconst variantClass = {\n  P1: 'text-[16px]',\n  P2: 'text-[14px]',\n  P3: 'text-[12px]',\n  P4: 'text-[10px]',\n}\n\nconst ParagraphVariant = (variant: keyof typeof variantClass) => {\n  const Component: React.FC<ParagraphProps> & { Weight: typeof WEIGHT } = ({\n    text = '',\n    weight = WEIGHT.normal,\n    className = '',\n    ...props\n  }) => (\n    <p\n      className={clsx(\n        baseClass,\n        variantClass[variant],\n        `font-${weight}`,\n        className\n      )}\n      {...props}\n    >\n      {text}\n    </p>\n  )\n  Component.displayName = variant\n  Component.Weight = WEIGHT\n  return Component\n}\n\nconst P1 = ParagraphVariant('P1')\nconst P2 = ParagraphVariant('P2')\nconst P3 = ParagraphVariant('P3')\nconst P4 = ParagraphVariant('P4')\n\nexport { P1, P2, P3, P4 }\n","export enum Size {\n  S,\n  L,\n}\n\nexport enum Style {\n  BRAND,\n  DARK,\n  LIGHT,\n}\n","import type { ValuesOf } from '../types'\n\nexport const THEME = {\n  normal: 'normal',\n  photography: 'photography',\n  transparent: 'transparent',\n  index: 'index',\n} as const\n\nexport type Theme = ValuesOf<typeof THEME>\n","// constants\nimport { THEME } from '../../constant'\n// type\nimport type { Theme } from '../../constant'\nimport type { ClassArray } from 'clsx'\n// enum\nimport { Style } from '../../enum'\n\ntype ThemeFunc = (theme: Theme, style?: Style) => ClassArray\n\nexport const getDisabledContainerTheme: ThemeFunc = (theme) => {\n  return [\n    // default theme\n    'text-gray-400 hover:text-gray-400',\n    // photography & transparent theme\n    {\n      'text-gray-500 hover:text-gray-500': theme === THEME.photography || theme === THEME.transparent,\n    }\n  ]\n}\n\nexport const getActiveContainerTheme: ThemeFunc = (theme, style) => {\n  return [\n    // default theme\n    {\n      'text-gray-800 hover:text-gray-800': style === Style.LIGHT,\n      'text-brand-heavy hover:text-brand-heavy': style === Style.DARK,\n      'text-brand-dark hover:text-brand-dark': style === Style.BRAND,\n    },\n    // photography theme\n    {\n      'text-gray-400 hover:text-gray-400': theme === THEME.photography && style === Style.LIGHT,\n      'text-supportive-pastel hover:text-supportive-pastel': theme === THEME.photography && style !== Style.LIGHT,\n    },\n    // transparent theme\n    {\n      'text-gray-black hover:text-gray-black': theme === THEME.transparent && style === Style.LIGHT,\n      'text-gray-200 hover:text-gray-200': theme === THEME.transparent && style !== Style.LIGHT,\n    },\n  ]\n}\n\nexport const getContainerTheme: ThemeFunc = (theme, style) => {\n  return [\n    // default theme\n    {\n      'text-gray-600 hover:text-gray-800': style === Style.LIGHT,\n      'text-gray-800 hover:text-brand-heavy': style === Style.DARK,\n      'text-brand-heavy hover:text-brand-dark': style === Style.BRAND,\n    },\n    // photography\n    {\n      'text-gray-300 hover:text-gray-400': theme === THEME.photography && style === Style.LIGHT,\n      'text-gray-white hover:text-supportive-pastel': theme === THEME.photography && style === Style.DARK,\n      'text-supportive-faded hover:text-supportive-pastel': theme === THEME.photography && style === Style.BRAND,\n    },\n    // transparent theme\n    {\n      'text-gray-800 hover:text-gray-black': theme === THEME.transparent && style === Style.LIGHT,\n      'text-gray-white hover:text-gray-200': theme === THEME.transparent && style !== Style.LIGHT,\n    },\n  ]\n}","import { type FC, type ReactElement, useMemo } from 'react'\nimport clsx from 'clsx'\n// components\nimport { P1, P2 } from '../../../text/paragraph'\n// enums\nimport { Size, Style } from '../../enum'\n// type\nimport type { Theme } from '../../constant'\n// constants\nimport { THEME } from '../../constant'\n// utils\nimport { getContainerTheme, getActiveContainerTheme, getDisabledContainerTheme } from './theme'\n\ntype TextButtonProps = {\n  text: string\n  leftIconComponent?: ReactElement\n  rightIconComponent?: ReactElement\n  size?: Size\n  style?: Style\n  theme?: Theme\n  active?: boolean\n  disabled?: boolean\n  loading?: boolean\n  className?: string\n}\nconst TextButton: FC<TextButtonProps> & {\n  Size: typeof Size\n  Style: typeof Style\n  THEME: typeof THEME\n} = ({\n  text,\n  leftIconComponent,\n  rightIconComponent,\n  size = Size.S,\n  theme = THEME.normal,\n  style = Style.DARK,\n  active = false,\n  disabled = false,\n  loading = false,\n  className = '',\n}) => {\n  const TextJSX = useMemo(\n    () => (size === Size.S ? <P2 text={text} weight={P2.Weight.bold} /> : <P1 text={text} weight={P1.Weight.bold} />),\n    [size, text]\n  )\n  const themeClass = useMemo(() => {\n    const themeFunc = disabled ? getDisabledContainerTheme : (active ? getActiveContainerTheme : getContainerTheme)\n    return themeFunc(theme, style)\n  }, [disabled, active, theme, style])\n\n  return (\n    <div\n      className={clsx(\n        'flex items-center',\n        {\n          'cursor-default': disabled,\n          'cursor-pointer': !disabled,\n        },\n        themeClass,\n        className\n      )}\n    >\n      <div className=\"relative flex justify-center items-center\">\n        <div\n          className={clsx('flex justify-center items-center', {\n            'opacity-0': loading,\n            'opacity-100': !loading,\n          })}\n        >\n          <div className=\"flex items-center mr-[4px]\">{leftIconComponent}</div>\n          {TextJSX}\n          <div className=\"flex items-center ml-[4px]\">{rightIconComponent}</div>\n        </div>\n        <span\n          className={clsx(\n            'inline-block absolute box-border animation-spin',\n            'border-2 border-solid border-gray-400 border-t-gray-600 rounded-[50%]',\n            {\n              'size-[18px]': size === Size.S,\n              'size-[24px]': size === Size.L,\n            },\n            {\n              'opacity-0': !loading,\n              'opacity-100': loading,\n            }\n          )}\n        />\n      </div>\n    </div>\n  )\n}\nTextButton.Size = Size\nTextButton.Style = Style\nTextButton.THEME = THEME\n\nexport default TextButton\n"]}

package/lib/button/components/text-button/index.mjs

@@ -1,8 +0,0 @@
-export { text_button_default as default } from '../../../chunk-U22UKMAJ.mjs';
-import '../../../chunk-FVKIUNIP.mjs';
-import '../../../chunk-HQG6Q2EY.mjs';
-import '../../../chunk-UM7RNC2Y.mjs';
-import '../../../chunk-JB4TYHDE.mjs';
-import '../../../chunk-URJXIWFX.mjs';
-//# sourceMappingURL=index.mjs.map
-//# sourceMappingURL=index.mjs.map

package/lib/button/components/text-button/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.mjs"}

package/lib/button/components/text-button/theme.d.mts

@@ -1,11 +0,0 @@
-import { Theme } from '../../constant.mjs';
-import { ClassArray } from 'clsx';
-import { Style } from '../../enum.mjs';
-import '../../../types/index.mjs';
-
-type ThemeFunc = (theme: Theme, style?: Style) => ClassArray;
-declare const getDisabledContainerTheme: ThemeFunc;
-declare const getActiveContainerTheme: ThemeFunc;
-declare const getContainerTheme: ThemeFunc;
-
-export { getActiveContainerTheme, getContainerTheme, getDisabledContainerTheme };

package/lib/button/components/text-button/theme.d.ts

@@ -1,11 +0,0 @@
-import { Theme } from '../../constant.js';
-import { ClassArray } from 'clsx';
-import { Style } from '../../enum.js';
-import '../../../types/index.js';
-
-type ThemeFunc = (theme: Theme, style?: Style) => ClassArray;
-declare const getDisabledContainerTheme: ThemeFunc;
-declare const getActiveContainerTheme: ThemeFunc;
-declare const getContainerTheme: ThemeFunc;
-
-export { getActiveContainerTheme, getContainerTheme, getDisabledContainerTheme };