podo-ui 0.8.4 → 0.9.2

package/dist/react/molecule/tab.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+const Tab = ({ items, activeKey: controlledActiveKey, defaultActiveKey, fill, onChange, className, }) => {
+    const [internalActiveKey, setInternalActiveKey] = useState(defaultActiveKey || items[0]?.key);
+    const activeKey = controlledActiveKey ?? internalActiveKey;
+    const handleClick = (key, disabled) => {
+        if (disabled)
+            return;
+        setInternalActiveKey(key);
+        onChange?.(key);
+    };
+    const tabsClass = ['tabs', fill && 'fill', className]
+        .filter(Boolean)
+        .join(' ');
+    return (_jsx("ul", { className: tabsClass, children: items.map((item) => (_jsx("li", { className: activeKey === item.key ? 'on' : undefined, children: _jsx("a", { href: `#${item.key}`, onClick: (e) => {
+                    e.preventDefault();
+                    handleClick(item.key, item.disabled);
+                }, "aria-disabled": item.disabled, tabIndex: item.disabled ? -1 : 0, children: item.label }) }, item.key))) }));
+};
+const TabPanel = ({ tabKey, activeKey, children, className, }) => {
+    if (tabKey !== activeKey)
+        return null;
+    return _jsx("div", { className: className, children: children });
+};
+TabPanel.displayName = 'TabPanel';
+Tab.Panel = TabPanel;
+Tab.displayName = 'Tab';
+export default Tab;

package/dist/react/molecule/table.d.ts

@@ -0,0 +1,37 @@
+import React from 'react';
+export interface TableColumn<T> {
+    /** Column key */
+    key: string;
+    /** Header text */
+    title: React.ReactNode;
+    /** Custom render function */
+    render?: (value: unknown, record: T, index: number) => React.ReactNode;
+    /** Column width */
+    width?: string | number;
+    /** Text alignment */
+    align?: 'left' | 'center' | 'right';
+}
+export interface TableProps<T extends Record<string, unknown>> {
+    /** Column definitions */
+    columns: TableColumn<T>[];
+    /** Data source */
+    dataSource: T[];
+    /** Row key extractor */
+    rowKey: keyof T | ((record: T) => string);
+    /** Clickable rows (hover effect) */
+    list?: boolean;
+    /** Row border */
+    border?: boolean;
+    /** Filled background */
+    fill?: boolean;
+    /** Row click callback */
+    onRowClick?: (record: T, index: number) => void;
+    /** Additional class name */
+    className?: string;
+}
+declare function Table<T extends Record<string, unknown>>({ columns, dataSource, rowKey, list, border, fill, onRowClick, className, }: TableProps<T>): import("react/jsx-runtime").JSX.Element;
+declare namespace Table {
+    var displayName: string;
+}
+export default Table;
+//# sourceMappingURL=table.d.ts.map

package/dist/react/molecule/table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../../react/molecule/table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,WAAW,CAAC,CAAC;IAC5B,iBAAiB;IACjB,GAAG,EAAE,MAAM,CAAC;IACZ,kBAAkB;IAClB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,6BAA6B;IAC7B,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;IACvE,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,qBAAqB;IACrB,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;CACrC;AAED,MAAM,WAAW,UAAU,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC3D,yBAAyB;IACzB,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IAC1B,kBAAkB;IAClB,UAAU,EAAE,CAAC,EAAE,CAAC;IAChB,wBAAwB;IACxB,MAAM,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,KAAK,MAAM,CAAC,CAAC;IAC1C,oCAAoC;IACpC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,iBAAiB;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,wBAAwB;IACxB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,yBAAyB;IACzB,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,4BAA4B;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,iBAAS,KAAK,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,EAChD,OAAO,EACP,UAAU,EACV,MAAM,EACN,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,UAAU,EACV,SAAS,GACV,EAAE,UAAU,CAAC,CAAC,CAAC,2CAgDf;kBAzDQ,KAAK;;;AA6Dd,eAAe,KAAK,CAAC"}

package/dist/react/molecule/table.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function Table({ columns, dataSource, rowKey, list, border, fill, onRowClick, className, }) {
+    const getRowKey = (record, index) => {
+        if (typeof rowKey === 'function') {
+            return rowKey(record);
+        }
+        return String(record[rowKey] ?? index);
+    };
+    const tableClass = [list && 'list', border && 'border', fill && 'fill', className]
+        .filter(Boolean)
+        .join(' ');
+    return (_jsxs("table", { className: tableClass || undefined, children: [_jsx("thead", { children: _jsx("tr", { children: columns.map((col) => (_jsx("th", { style: {
+                            width: col.width,
+                            textAlign: col.align,
+                        }, children: col.title }, col.key))) }) }), _jsx("tbody", { children: dataSource.map((record, index) => (_jsx("tr", { onClick: () => onRowClick?.(record, index), style: onRowClick ? { cursor: 'pointer' } : undefined, children: columns.map((col) => (_jsx("td", { style: { textAlign: col.align }, children: col.render
+                            ? col.render(record[col.key], record, index)
+                            : record[col.key] }, col.key))) }, getRowKey(record, index)))) })] }));
+}
+Table.displayName = 'Table';
+export default Table;

package/global.scss

@@ -55,6 +55,14 @@
 @forward './scss/form/toggle';
 @forward './scss/form/label';
 
+@use './scss/form/checkbox-radio';
+@use './scss/form/file';
+@use './scss/form/input';
+@use './scss/form/textarea';
+@use './scss/form/select';
+@use './scss/form/toggle';
+@use './scss/form/label';
+
 /*
   Molecule
 */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "podo-ui",
-  "version": "0.8.4",
+  "version": "0.9.2",
   "type": "module",
   "author": "hada0127 <work@tarucy.net>",
   "license": "MIT",
@@ -13,6 +13,7 @@
   },
   "homepage": "https://podoui.com",
   "main": "dist/index.js",
+  "module": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
     "dist",
@@ -29,6 +30,7 @@
     ".": {
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js",
+      "require": "./dist/index.js",
       "default": "./dist/index.js"
     },
     "./react/atom/*": {
@@ -69,19 +71,17 @@
     "./vanilla/datepicker.css": "./vanilla/datepicker.css"
   },
   "scripts": {
-    "dev": "next dev -p 5432",
-    "build": "next build",
+    "dev": "vite",
+    "build": "vite build && vike prerender",
+    "preview": "vite preview",
     "build:lib": "node ./cli/build-lib.js",
     "build:cdn": "node ./cli/build-cdn.js",
     "build:cdn-js": "node ./cli/build-cdn-js.js",
     "build:all": "npm run build:lib && npm run build:cdn && npm run build:cdn-js",
     "prepublishOnly": "npm run build:all",
-    "start": "next start",
-    "lint": "next lint",
+    "lint": "eslint .",
     "icon": "node ./cli/icon-scss.js",
-    "pages:build": "npx @cloudflare/next-on-pages",
-    "preview": "npm run pages:build && wrangler pages dev",
-    "deploy": "npm run pages:build && wrangler pages deploy"
+    "deploy": "vite build && wrangler pages deploy dist/client"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
@@ -100,16 +100,11 @@
     }
   },
   "dependencies": {
+    "shiki": "^3.19.0",
     "uuid": "^11.0.3",
     "zod": "^3.23.8"
   },
   "devDependencies": {
-    "next": "14.1.0",
-    "next-intl": "^4.5.3",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "sass": "^1.83.0",
-    "@cloudflare/next-on-pages": "^1.13.8",
     "@eslint/js": "^9.8.0",
     "@playwright/test": "^1.56.1",
     "@types/node": "22.10.2",
@@ -121,11 +116,19 @@
     "eslint-plugin-react-refresh": "^0.4.9",
     "glob": "^11.0.3",
     "globals": "^15.9.0",
+    "i18next": "^24.0.0",
     "opentype.js": "^1.3.4",
     "prettier": "^3.3.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-i18next": "^15.0.0",
+    "sass": "^1.83.0",
     "sass-embedded": "^1.77.8",
     "scss": "^0.2.4",
     "typescript": "^5.5.3",
-    "typescript-eslint": "^8.0.0"
+    "typescript-eslint": "^8.0.0",
+    "vike": "^0.4.182",
+    "vike-react": "^0.4.18",
+    "vite": "^5.4.0"
   }
 }

package/scss/icon/icon-name.scss

@@ -145,4 +145,7 @@ $icon-name: (
   login: \e97a,
   margin-horizontal: \e97b,
   margin-vertical: \e97c,
+  button: \e97d,
+  desktop: \e9a0,
+  mobile: \e9a1,
 );