@deepnoid/ui 0.1.19 → 0.1.20

package/dist/components/table/form-table.d.ts

@@ -0,0 +1,52 @@
+import * as tailwind_variants from 'tailwind-variants';
+import * as tailwind_merge from 'tailwind-merge';
+import * as react from 'react';
+import { ReactNode, FormEvent } from 'react';
+import { SlotsToClasses } from '../../utils/types.js';
+
+type TableRow = {
+    columns: ReactNode[];
+    columnClasses?: string[];
+};
+interface FormTableProps {
+    rows: TableRow[];
+    onSubmit?: (e: FormEvent<HTMLFormElement>) => void;
+    footer?: ReactNode;
+    classNames?: SlotsToClasses<FormTableSlots>;
+}
+declare const FormTable: react.ForwardRefExoticComponent<FormTableProps & react.RefAttributes<HTMLDivElement | HTMLFormElement>>;
+
+declare const formTableStyle: tailwind_variants.TVReturnType<{
+    [key: string]: {
+        [key: string]: tailwind_merge.ClassNameValue | {
+            base?: tailwind_merge.ClassNameValue;
+            table?: tailwind_merge.ClassNameValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: tailwind_merge.ClassNameValue | {
+            base?: tailwind_merge.ClassNameValue;
+            table?: tailwind_merge.ClassNameValue;
+        };
+    };
+} | {}, {
+    base: string[];
+    table: string[];
+}, undefined, {
+    [key: string]: {
+        [key: string]: tailwind_merge.ClassNameValue | {
+            base?: tailwind_merge.ClassNameValue;
+            table?: tailwind_merge.ClassNameValue;
+        };
+    };
+} | {}, {
+    base: string[];
+    table: string[];
+}, tailwind_variants.TVReturnType<unknown, {
+    base: string[];
+    table: string[];
+}, undefined, unknown, unknown, undefined>>;
+type FormTableSlots = keyof ReturnType<typeof formTableStyle>;
+
+export { FormTable as default };

package/dist/components/table/form-table.js

@@ -0,0 +1,365 @@
+"use client";
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __commonJS = (cb, mod) => function __require() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// ../../node_modules/tailwindcss/lib/util/createPlugin.js
+var require_createPlugin = __commonJS({
+  "../../node_modules/tailwindcss/lib/util/createPlugin.js"(exports2) {
+    "use strict";
+    Object.defineProperty(exports2, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports2, "default", {
+      enumerable: true,
+      get: function() {
+        return _default;
+      }
+    });
+    function createPlugin(plugin2, config) {
+      return {
+        handler: plugin2,
+        config
+      };
+    }
+    createPlugin.withOptions = function(pluginFunction, configFunction = () => ({})) {
+      const optionsFunction = function(options) {
+        return {
+          __options: options,
+          handler: pluginFunction(options),
+          config: configFunction(options)
+        };
+      };
+      optionsFunction.__isOptionsFunction = true;
+      optionsFunction.__pluginFunction = pluginFunction;
+      optionsFunction.__configFunction = configFunction;
+      return optionsFunction;
+    };
+    var _default = createPlugin;
+  }
+});
+
+// ../../node_modules/tailwindcss/lib/public/create-plugin.js
+var require_create_plugin = __commonJS({
+  "../../node_modules/tailwindcss/lib/public/create-plugin.js"(exports2) {
+    "use strict";
+    Object.defineProperty(exports2, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports2, "default", {
+      enumerable: true,
+      get: function() {
+        return _default;
+      }
+    });
+    var _createPlugin = /* @__PURE__ */ _interop_require_default(require_createPlugin());
+    function _interop_require_default(obj) {
+      return obj && obj.__esModule ? obj : {
+        default: obj
+      };
+    }
+    var _default = _createPlugin.default;
+  }
+});
+
+// ../../node_modules/tailwindcss/plugin.js
+var require_plugin = __commonJS({
+  "../../node_modules/tailwindcss/plugin.js"(exports2, module2) {
+    "use strict";
+    var createPlugin = require_create_plugin();
+    module2.exports = (createPlugin.__esModule ? createPlugin : { default: createPlugin }).default;
+  }
+});
+
+// src/components/table/form-table.tsx
+var form_table_exports = {};
+__export(form_table_exports, {
+  default: () => form_table_default
+});
+module.exports = __toCommonJS(form_table_exports);
+var import_react = require("react");
+
+// src/utils/tailwind-variants.ts
+var import_tailwind_variants = require("tailwind-variants");
+
+// ../tailwind-config/src/plugin.ts
+var import_plugin = __toESM(require_plugin());
+
+// ../tailwind-config/src/typography/font.ts
+var fontSize = {
+  h1: [
+    "40px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h2: [
+    "34px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h3: [
+    "28px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h4: [
+    "24px",
+    {
+      fontWeight: "700"
+    }
+  ],
+  h5: [
+    "20px",
+    {
+      fontWeight: "600"
+    }
+  ],
+  sm: [
+    "12px",
+    {
+      lineHeight: "18px",
+      fontWeight: "400"
+    }
+  ],
+  md: [
+    "14px",
+    {
+      lineHeight: "21px",
+      fontWeight: "400"
+    }
+  ],
+  lg: [
+    "16px",
+    {
+      lineHeight: "24px",
+      fontWeight: "400"
+    }
+  ],
+  xl: [
+    "18px",
+    {
+      lineHeight: "27px",
+      fontWeight: "400"
+    }
+  ]
+};
+
+// ../tailwind-config/src/animation/slide.ts
+var sliceAnimation = {
+  slideInFromTop: "slideInFromTop 0.5s ease-out",
+  slideInFromBottom: "slideInFromBottom 0.5s ease-out",
+  slideInFromLeft: "slideInFromLeft 0.5s ease-out",
+  slideInFromRight: "slideInFromRight 0.5s ease-out",
+  slideOutToTop: "slideOutToTop 0.5s ease-in",
+  slideOutToBottom: "slideOutToBottom 0.5s ease-in",
+  slideOutToLeft: "slideOutToLeft 0.5s ease-in",
+  slideOutToRight: "slideOutToRight 0.5s ease-in"
+};
+var sliceKeyframe = {
+  slideInFromTop: {
+    "0%": {
+      transform: "translateY(-10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    }
+  },
+  slideInFromBottom: {
+    "0%": {
+      transform: "translateY(10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    }
+  },
+  slideInFromLeft: {
+    "0%": {
+      transform: "translateX(-10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    }
+  },
+  slideInFromRight: {
+    "0%": {
+      transform: "translateX(10px)",
+      opacity: "0"
+    },
+    "100%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    }
+  },
+  slideOutToTop: {
+    "0%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateY(-10px)",
+      opacity: "0"
+    }
+  },
+  slideOutToBottom: {
+    "0%": {
+      transform: "translateY(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateY(10px)",
+      opacity: "0"
+    }
+  },
+  slideOutToLeft: {
+    "0%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateX(-10px)",
+      opacity: "0"
+    }
+  },
+  slideOutToRight: {
+    "0%": {
+      transform: "translateX(0)",
+      opacity: "1"
+    },
+    "100%": {
+      transform: "translateX(10px)",
+      opacity: "0"
+    }
+  }
+};
+
+// ../tailwind-config/src/animation/index.ts
+var animation = { ...sliceAnimation };
+var keyframes = { ...sliceKeyframe };
+
+// ../tailwind-config/src/shadow/index.ts
+var boxShadow = {
+  "border-1": "inner 0 0 0 1px inset",
+  "border-2": "inner 0 0 0 2px inset",
+  "border-3": "inner 0 0 0 3px inset",
+  "border-4": "inner 0 0 0 4px inset",
+  "border-5": "inner 0 0 0 5px inset",
+  "border-6": "inner 0 0 0 6px inset",
+  "border-7": "inner 0 0 0 7px inset",
+  "border-8": "inner 0 0 0 8px inset",
+  "border-9": "inner 0 0 0 9px inset",
+  "border-10": "inner 0 0 0 10px inset",
+  inner: "inset 0 4px 8px 0 rgba(36, 39, 44, 0.2)",
+  drop: "0 20px 40px 0 rgba(36, 39, 44, 0.2)"
+};
+
+// ../tailwind-config/src/border/radius.ts
+var borderRadius = {
+  sm: "4px",
+  md: "6px",
+  lg: "8px",
+  xl: "10px",
+  none: "0",
+  full: "9999px"
+};
+
+// ../tailwind-config/src/space/gap.ts
+var gap = {
+  sm: "4px",
+  md: "6px",
+  lg: "8px",
+  xl: "10px"
+};
+
+// src/utils/tailwind-variants.ts
+function typedKeys(obj) {
+  return Object.keys(obj);
+}
+var COMMON_SIZE = ["sm", "md", "lg", "xl"];
+var tv = (0, import_tailwind_variants.createTV)({
+  twMergeConfig: {
+    classGroups: {
+      fontSize: [{ text: [...typedKeys(fontSize)] }],
+      borderRadius: [{ rounded: [...typedKeys(borderRadius)] }],
+      boxShadow: [{ shadow: [...typedKeys(boxShadow)] }],
+      padding: [{ p: [...COMMON_SIZE] }],
+      gap: [{ gap: [...typedKeys(gap)] }]
+    }
+  }
+});
+
+// src/components/table/form-table.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var DEFAULT_COLUMN_CLASSES = [
+  "w-[120px] h-[50px] px-[10px] font-bold text-md text-body-foreground border-r border-neutral-light",
+  "px-[10px]"
+];
+var FormTableRow = ({ columns, columnClasses = [] }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("tr", { className: "border-neutral-light border-b", children: columns.map((col, index) => {
+  var _a;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { className: (_a = columnClasses[index]) != null ? _a : DEFAULT_COLUMN_CLASSES[index], children: col }, index);
+}) });
+var FormTable = (0, import_react.forwardRef)(
+  ({ rows, onSubmit, footer, classNames }, ref) => {
+    const slots = (0, import_react.useMemo)(() => formTableStyle(), []);
+    const content = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("table", { className: slots.table({ class: classNames == null ? void 0 : classNames.table }), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("tbody", { children: rows.map((row, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FormTableRow, { ...row }, i)) }) }),
+      footer && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: footer })
+    ] });
+    if (onSubmit) {
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "form",
+        {
+          ref,
+          onSubmit,
+          className: slots.base({ class: classNames == null ? void 0 : classNames.base }),
+          children: content
+        }
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: content });
+  }
+);
+FormTable.displayName = "FormTable";
+var form_table_default = FormTable;
+var formTableStyle = tv({
+  slots: {
+    base: ["flex", "flex-col", "gap-[30px]"],
+    table: ["w-full", "table-fixed", "border", "border-neutral-light"]
+  }
+});

package/dist/components/table/form-table.mjs

@@ -0,0 +1,9 @@
+"use client";
+import {
+  form_table_default
+} from "../../chunk-3BKCODIL.mjs";
+import "../../chunk-4ZJFD3L3.mjs";
+import "../../chunk-AC6TWLRT.mjs";
+export {
+  form_table_default as default
+};

package/dist/components/table/index.d.mts

@@ -1,4 +1,6 @@
 export { default as Table, TableColumn, TableRef, TableRow } from './table.mjs';
+export { default as FormTable } from './form-table.mjs';
 import 'tailwind-variants';
 import 'react';
 import '../../utils/types.mjs';
+import 'tailwind-merge';

package/dist/components/table/index.d.ts

@@ -1,4 +1,6 @@
 export { default as Table, TableColumn, TableRef, TableRow } from './table.js';
+export { default as FormTable } from './form-table.js';
 import 'tailwind-variants';
 import 'react';
 import '../../utils/types.js';
+import 'tailwind-merge';

package/dist/components/table/index.js

@@ -102,6 +102,7 @@ var require_plugin = __commonJS({
 // src/components/table/index.ts
 var table_exports = {};
 __export(table_exports, {
+  FormTable: () => form_table_default,
   Table: () => table_default
 });
 module.exports = __toCommonJS(table_exports);
@@ -1167,23 +1168,89 @@ var template = {
       }
     );
   },
-  // ----------------------------------- old ---------------------------------
-  // ** Status **
-  plus: ({ className, fill }) => {
+  exclamation: ({ className, fill }) => {
     return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       "svg",
       {
-        width: "24",
-        height: "24",
-        viewBox: "0 0 24 24",
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "18",
+        height: "18",
+        viewBox: "0 0 18 18",
         fill: "none",
+        className,
+        children: fill ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            "path",
+            {
+              d: "M11.264 2.37077C11.2832 2.37715 11.3024 2.38353 11.3223 2.3901C12.3182 2.72483 13.1824 3.30575 13.9306 4.03468C13.9575 4.06039 13.9843 4.08609 14.0119 4.11257C14.1806 4.27693 14.33 4.45208 14.4754 4.63713C14.4981 4.66509 14.5208 4.69305 14.5442 4.72185C15.0188 5.31801 15.3774 6.01161 15.6224 6.73137C15.6303 6.75453 15.6382 6.77768 15.6464 6.80155C16.1308 8.2413 16.1125 9.82918 15.6224 11.2641C15.6105 11.2995 15.6105 11.2995 15.5983 11.3356C15.3948 11.9315 15.1066 12.5059 14.7335 13.0141C14.7221 13.0297 14.7107 13.0453 14.6989 13.0614C14.313 13.5865 13.8736 14.0779 13.3571 14.4772C13.3155 14.5109 13.3155 14.5109 13.273 14.5454C12.6801 15.0224 11.982 15.3801 11.264 15.6247C11.2408 15.6326 11.2177 15.6406 11.1938 15.6487C9.43757 16.2402 7.50979 16.0678 5.85241 15.2592C4.96204 14.8102 4.13267 14.1489 3.52213 13.3583C3.49962 13.3305 3.47711 13.3028 3.45392 13.2742C2.32855 11.8738 1.85507 9.99621 2.03839 8.22438C2.17342 7.0638 2.58402 5.9339 3.26407 4.98139C3.27714 4.96288 3.29022 4.94436 3.30369 4.92529C3.51689 4.62523 3.75292 4.35545 4.00958 4.09206C4.03773 4.06274 4.06588 4.03342 4.09403 4.00409C4.26597 3.8279 4.44681 3.67012 4.6404 3.5183C4.6683 3.49563 4.69621 3.47296 4.72496 3.4496C6.54339 2.00006 9.08031 1.63201 11.264 2.37077Z",
+              fill: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            "path",
+            {
+              d: "M9.36648 5.85289C9.53634 5.9647 9.6533 6.12598 9.71812 6.32867C9.73452 6.40467 9.74201 6.47516 9.74238 6.55312C9.74254 6.57462 9.74269 6.59612 9.74284 6.61826C9.7429 6.64157 9.74296 6.66489 9.74302 6.68891C9.74315 6.71368 9.74329 6.73845 9.74344 6.76397C9.74385 6.84591 9.7441 6.92785 9.74431 7.00979C9.7444 7.03785 9.74448 7.06592 9.74457 7.09484C9.74497 7.22817 9.74528 7.3615 9.74545 7.49483C9.74568 7.66315 9.74639 7.83146 9.74732 7.99978C9.74787 8.11787 9.74805 8.23596 9.74812 8.35405C9.74823 8.41042 9.74847 8.46679 9.74886 8.52316C9.75351 9.23268 9.75351 9.23268 9.54833 9.48966C9.39246 9.65505 9.20768 9.73677 8.98973 9.75C8.78199 9.74035 8.59485 9.64627 8.44906 9.48814C8.28258 9.27909 8.24899 9.03597 8.25049 8.7678C8.25038 8.7429 8.25027 8.718 8.25015 8.69234C8.24987 8.61081 8.25006 8.5293 8.25027 8.44777C8.25023 8.39068 8.25017 8.33358 8.25009 8.27649C8.24999 8.15716 8.25013 8.03783 8.25043 7.9185C8.25079 7.76594 8.25058 7.6134 8.2502 7.46085C8.24997 7.34306 8.25004 7.22527 8.25021 7.10748C8.25025 7.05125 8.2502 6.99501 8.25005 6.93877C8.24989 6.86005 8.25014 6.78135 8.25049 6.70263C8.25036 6.67965 8.25023 6.65668 8.2501 6.63301C8.25225 6.37163 8.32078 6.1648 8.48128 5.96879C8.72644 5.71507 9.07274 5.68973 9.36648 5.85289Z",
+              fill: "white"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            "path",
+            {
+              d: "M9.34541 10.8369C9.52938 10.9471 9.67125 11.1068 9.73271 11.3148C9.77656 11.529 9.73613 11.7317 9.62145 11.916C9.49889 12.0867 9.3528 12.1846 9.14957 12.2412C8.92053 12.2704 8.73922 12.2283 8.55045 12.0972C8.38043 11.959 8.27865 11.7781 8.25072 11.5592C8.24266 11.3506 8.30179 11.162 8.43381 10.9998C8.68322 10.7451 9.02878 10.6749 9.34541 10.8369Z",
+              fill: "white"
+            }
+          )
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            "path",
+            {
+              d: "M5.03711 3.84082C6.60875 2.5881 8.77805 2.2038 10.7188 2.72754L11.1035 2.84473L11.1064 2.8457C11.125 2.85187 11.144 2.85694 11.1631 2.86328V2.86426C11.9606 3.13233 12.6739 3.57547 13.3125 4.14258L13.582 4.39258L13.585 4.39551L13.666 4.47363C13.7385 4.54442 13.8078 4.61844 13.876 4.69629L14.082 4.94629L14.0869 4.95215L14.1562 5.03711C14.5346 5.51326 14.8361 6.06221 15.0586 6.6416L15.1494 6.89258V6.89355L15.1738 6.96387C15.5931 8.21222 15.6047 9.58552 15.2295 10.8506L15.1494 11.1025L15.1484 11.1045C15.1368 11.1391 15.1363 11.1401 15.125 11.1738C14.9596 11.6581 14.7354 12.1232 14.4541 12.542L14.3301 12.7178L14.3291 12.7197C14.3181 12.7348 14.3072 12.7501 14.2959 12.7656C13.9281 13.2659 13.5205 13.7197 13.0518 14.082L13.3457 14.4629L13.0508 14.0811L13.042 14.0889L12.958 14.1572C12.4859 14.5367 11.9342 14.8378 11.3535 15.0605L11.1025 15.1514H11.1016C11.0793 15.159 11.0571 15.1669 11.0342 15.1748C9.51234 15.6873 7.84224 15.5817 6.36426 14.9443L6.07129 14.8096C5.3482 14.4439 4.67072 13.9288 4.1377 13.3203L3.91797 13.0527L3.91016 13.0439L3.84277 12.959H3.8418C2.81057 11.6744 2.36571 9.93549 2.53516 8.28223C2.64545 7.33424 2.95228 6.41319 3.44727 5.60938L3.6709 5.27148L3.67285 5.26953C3.6858 5.2512 3.69858 5.23275 3.71191 5.21387L3.71094 5.21289C3.85636 5.00834 4.01615 4.81758 4.18945 4.62891L4.36816 4.44141L4.37012 4.43848C4.39734 4.41013 4.42493 4.38187 4.45215 4.35352C4.52879 4.27498 4.60794 4.19996 4.69043 4.12695L4.94922 3.91211L4.95605 3.90625C4.98272 3.88459 5.00872 3.86211 5.03613 3.83984L5.03711 3.84082Z",
+              stroke: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            "path",
+            {
+              d: "M9.36648 5.85289C9.53634 5.9647 9.6533 6.12598 9.71812 6.32867C9.73452 6.40467 9.74201 6.47516 9.74238 6.55312C9.74254 6.57462 9.74269 6.59612 9.74284 6.61826C9.7429 6.64157 9.74296 6.66489 9.74302 6.68891C9.74315 6.71368 9.74329 6.73845 9.74344 6.76397C9.74385 6.84591 9.7441 6.92785 9.74431 7.00979C9.7444 7.03785 9.74448 7.06592 9.74457 7.09484C9.74497 7.22817 9.74528 7.3615 9.74545 7.49483C9.74568 7.66315 9.74639 7.83146 9.74732 7.99978C9.74787 8.11787 9.74805 8.23596 9.74812 8.35405C9.74823 8.41042 9.74847 8.46679 9.74886 8.52316C9.75351 9.23268 9.75351 9.23268 9.54833 9.48966C9.39246 9.65505 9.20768 9.73677 8.98973 9.75C8.78199 9.74035 8.59485 9.64627 8.44906 9.48814C8.28258 9.27909 8.24899 9.03597 8.25049 8.7678C8.25038 8.7429 8.25027 8.718 8.25015 8.69234C8.24987 8.61081 8.25006 8.5293 8.25027 8.44777C8.25023 8.39068 8.25017 8.33358 8.25009 8.27649C8.24999 8.15716 8.25013 8.03783 8.25043 7.9185C8.25079 7.76594 8.25058 7.6134 8.2502 7.46085C8.24997 7.34306 8.25004 7.22527 8.25021 7.10748C8.25025 7.05125 8.2502 6.99501 8.25005 6.93877C8.24989 6.86005 8.25014 6.78135 8.25049 6.70263C8.25036 6.67965 8.25023 6.65668 8.2501 6.63301C8.25225 6.37163 8.32078 6.1648 8.48128 5.96879C8.72644 5.71507 9.07274 5.68973 9.36648 5.85289Z",
+              fill: "currentColor"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+            "path",
+            {
+              d: "M9.34541 10.8369C9.52938 10.9471 9.67125 11.1068 9.73271 11.3148C9.77656 11.529 9.73613 11.7317 9.62145 11.916C9.49889 12.0867 9.3528 12.1846 9.14957 12.2412C8.92053 12.2704 8.73922 12.2283 8.55045 12.0972C8.38043 11.959 8.27865 11.7781 8.25072 11.5592C8.24266 11.3506 8.30179 11.162 8.43381 10.9998C8.68322 10.7451 9.02878 10.6749 9.34541 10.8369Z",
+              fill: "currentColor"
+            }
+          )
+        ] })
+      }
+    );
+  },
+  close: ({ className }) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      "svg",
+      {
         xmlns: "http://www.w3.org/2000/svg",
+        width: "27",
+        height: "27",
+        viewBox: "0 0 27 27",
+        fill: "none",
         className,
-        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M12 4.5V19.5M19.5 12H4.5", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "path",
+          {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M6.24339 6.2645C6.39943 6.10887 6.61095 6.02146 6.83149 6.02146C7.05203 6.02146 7.26355 6.10887 7.41959 6.2645L13.4893 12.3255L19.5589 6.2645C19.6351 6.18285 19.727 6.11736 19.8291 6.07194C19.9312 6.02652 20.0414 6.0021 20.1531 6.00013C20.2648 5.99816 20.3758 6.01869 20.4795 6.06048C20.5831 6.10228 20.6772 6.16449 20.7562 6.2434C20.8353 6.32232 20.8976 6.41632 20.9394 6.51979C20.9813 6.62327 21.0018 6.73411 20.9999 6.84569C20.9979 6.95727 20.9734 7.06732 20.928 7.16926C20.8825 7.27119 20.8169 7.36294 20.7351 7.43902L14.6655 13.5L20.7351 19.561C20.8169 19.6371 20.8825 19.7288 20.928 19.8307C20.9734 19.9327 20.9979 20.0427 20.9999 20.1543C21.0018 20.2659 20.9813 20.3767 20.9394 20.4802C20.8976 20.5837 20.8353 20.6777 20.7562 20.7566C20.6772 20.8355 20.5831 20.8977 20.4795 20.9395C20.3758 20.9813 20.2648 21.0018 20.1531 20.9999C20.0414 20.9979 19.9312 20.9735 19.8291 20.9281C19.727 20.8826 19.6351 20.8172 19.5589 20.7355L13.4893 14.6745L7.41959 20.7355C7.26183 20.8823 7.05317 20.9622 6.83757 20.9584C6.62196 20.9546 6.41626 20.8674 6.26378 20.7151C6.1113 20.5629 6.02396 20.3575 6.02016 20.1422C6.01635 19.9269 6.09638 19.7185 6.24339 19.561L12.313 13.5L6.24339 7.43902C6.08754 7.2832 6 7.07198 6 6.85176C6 6.63154 6.08754 6.42032 6.24339 6.2645Z",
+            fill: "currentColor"
+          }
+        )
       }
     );
   },
-  close: ({ className, fill }) => {
+  // ----------------------------------- old ---------------------------------
+  // ** Status **
+  plus: ({ className, fill }) => {
     return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       "svg",
       {
@@ -1193,7 +1260,7 @@ var template = {
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg",
         className,
-        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M6 18L18 6M6 6L18 18", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M12 4.5V19.5M19.5 12H4.5", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round" })
       }
     );
   },
@@ -4735,7 +4802,7 @@ var input_default = Input;
 var inputStyle = tv(
   {
     slots: {
-      base: ["group/input", "flex"],
+      base: ["group/input", "flex select-none"],
       vertical: ["flex-col"],
       horizon: ["flex-row", "gap-0"],
       label: ["flex", "items-center", "font-bold", "text-body-foreground", "min-w-[80px]"],
@@ -5553,7 +5620,49 @@ var tableStyle = (0, import_tailwind_variants6.tv)({
     height: "narrow"
   }
 });
+
+// src/components/table/form-table.tsx
+var import_react8 = require("react");
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var DEFAULT_COLUMN_CLASSES = [
+  "w-[120px] h-[50px] px-[10px] font-bold text-md text-body-foreground border-r border-neutral-light",
+  "px-[10px]"
+];
+var FormTableRow = ({ columns, columnClasses = [] }) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("tr", { className: "border-neutral-light border-b", children: columns.map((col, index) => {
+  var _a;
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("td", { className: (_a = columnClasses[index]) != null ? _a : DEFAULT_COLUMN_CLASSES[index], children: col }, index);
+}) });
+var FormTable = (0, import_react8.forwardRef)(
+  ({ rows, onSubmit, footer, classNames }, ref) => {
+    const slots = (0, import_react8.useMemo)(() => formTableStyle(), []);
+    const content = /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("table", { className: slots.table({ class: classNames == null ? void 0 : classNames.table }), children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("tbody", { children: rows.map((row, i) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FormTableRow, { ...row }, i)) }) }),
+      footer && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { children: footer })
+    ] });
+    if (onSubmit) {
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+        "form",
+        {
+          ref,
+          onSubmit,
+          className: slots.base({ class: classNames == null ? void 0 : classNames.base }),
+          children: content
+        }
+      );
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { ref, className: slots.base({ class: classNames == null ? void 0 : classNames.base }), children: content });
+  }
+);
+FormTable.displayName = "FormTable";
+var form_table_default = FormTable;
+var formTableStyle = tv({
+  slots: {
+    base: ["flex", "flex-col", "gap-[30px]"],
+    table: ["w-full", "table-fixed", "border", "border-neutral-light"]
+  }
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  FormTable,
   Table
 });

package/dist/components/table/index.mjs

@@ -1,26 +1,30 @@
 "use client";
-import "../../chunk-2UUH2MBF.mjs";
+import "../../chunk-DX3KXNP6.mjs";
+import {
+  form_table_default
+} from "../../chunk-3BKCODIL.mjs";
 import {
   table_default
-} from "../../chunk-3TJAGKKY.mjs";
+} from "../../chunk-LNYMVBV5.mjs";
 import "../../chunk-63WXGSTV.mjs";
 import "../../chunk-3DPVPTHL.mjs";
 import "../../chunk-DQRAFUDA.mjs";
 import "../../chunk-M37VBNB3.mjs";
 import "../../chunk-7B7LRG5J.mjs";
-import "../../chunk-UHFJ7ZFM.mjs";
+import "../../chunk-EGHTZLZJ.mjs";
 import "../../chunk-F3HENRVM.mjs";
 import "../../chunk-2GCSFWHD.mjs";
-import "../../chunk-7TXQPX4O.mjs";
+import "../../chunk-JOCMCOEK.mjs";
 import "../../chunk-QZ3LVYJW.mjs";
-import "../../chunk-D6QI3DJG.mjs";
 import "../../chunk-ZYIIXWVY.mjs";
-import "../../chunk-DADMVOYI.mjs";
-import "../../chunk-A7OXEUCC.mjs";
+import "../../chunk-HWL7TPUN.mjs";
+import "../../chunk-D6QI3DJG.mjs";
+import "../../chunk-3IU2RPSM.mjs";
 import "../../chunk-4ZJFD3L3.mjs";
 import "../../chunk-27Y6K5NK.mjs";
 import "../../chunk-E3G5QXSH.mjs";
 import "../../chunk-AC6TWLRT.mjs";
 export {
+  form_table_default as FormTable,
   table_default as Table
 };