podo-ui 0.8.4 → 0.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/cdn/podo-datepicker.css +1 -1
  2. package/cdn/podo-datepicker.js +1 -1
  3. package/cdn/podo-datepicker.min.css +1 -1
  4. package/cdn/podo-datepicker.min.js +1 -1
  5. package/cdn/podo-ui.css +10 -7
  6. package/cdn/podo-ui.min.css +2 -2
  7. package/dist/index.d.ts +19 -1
  8. package/dist/index.d.ts.map +1 -1
  9. package/dist/index.js +17 -1
  10. package/dist/react/atom/button.d.ts +28 -0
  11. package/dist/react/atom/button.d.ts.map +1 -0
  12. package/dist/react/atom/button.js +17 -0
  13. package/dist/react/atom/checkbox.d.ts +17 -0
  14. package/dist/react/atom/checkbox.d.ts.map +1 -0
  15. package/dist/react/atom/checkbox.js +20 -0
  16. package/dist/react/atom/editor-view.d.ts.map +1 -1
  17. package/dist/react/atom/editor.d.ts.map +1 -1
  18. package/dist/react/atom/file.d.ts +20 -0
  19. package/dist/react/atom/file.d.ts.map +1 -0
  20. package/dist/react/atom/file.js +12 -0
  21. package/dist/react/atom/input.d.ts.map +1 -1
  22. package/dist/react/atom/input.js +2 -2
  23. package/dist/react/atom/input.module.scss +80 -24
  24. package/dist/react/atom/label.d.ts +19 -0
  25. package/dist/react/atom/label.d.ts.map +1 -0
  26. package/dist/react/atom/label.js +15 -0
  27. package/dist/react/atom/radio.d.ts +44 -0
  28. package/dist/react/atom/radio.d.ts.map +1 -0
  29. package/dist/react/atom/radio.js +19 -0
  30. package/dist/react/atom/select.d.ts +31 -0
  31. package/dist/react/atom/select.d.ts.map +1 -0
  32. package/dist/react/atom/select.js +15 -0
  33. package/dist/react/atom/toggle.d.ts +15 -0
  34. package/dist/react/atom/toggle.d.ts.map +1 -0
  35. package/dist/react/atom/toggle.js +12 -0
  36. package/dist/react/molecule/field.d.ts.map +1 -1
  37. package/dist/react/molecule/tab.d.ts +38 -0
  38. package/dist/react/molecule/tab.d.ts.map +1 -0
  39. package/dist/react/molecule/tab.js +28 -0
  40. package/dist/react/molecule/table.d.ts +37 -0
  41. package/dist/react/molecule/table.d.ts.map +1 -0
  42. package/dist/react/molecule/table.js +20 -0
  43. package/global.scss +8 -0
  44. package/package.json +16 -15
@@ -0,0 +1,28 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useState } from 'react';
3
+ const Tab = ({ items, activeKey: controlledActiveKey, defaultActiveKey, fill, onChange, className, }) => {
4
+ const [internalActiveKey, setInternalActiveKey] = useState(defaultActiveKey || items[0]?.key);
5
+ const activeKey = controlledActiveKey ?? internalActiveKey;
6
+ const handleClick = (key, disabled) => {
7
+ if (disabled)
8
+ return;
9
+ setInternalActiveKey(key);
10
+ onChange?.(key);
11
+ };
12
+ const tabsClass = ['tabs', fill && 'fill', className]
13
+ .filter(Boolean)
14
+ .join(' ');
15
+ 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) => {
16
+ e.preventDefault();
17
+ handleClick(item.key, item.disabled);
18
+ }, "aria-disabled": item.disabled, tabIndex: item.disabled ? -1 : 0, children: item.label }) }, item.key))) }));
19
+ };
20
+ const TabPanel = ({ tabKey, activeKey, children, className, }) => {
21
+ if (tabKey !== activeKey)
22
+ return null;
23
+ return _jsx("div", { className: className, children: children });
24
+ };
25
+ TabPanel.displayName = 'TabPanel';
26
+ Tab.Panel = TabPanel;
27
+ Tab.displayName = 'Tab';
28
+ export default Tab;
@@ -0,0 +1,37 @@
1
+ import React from 'react';
2
+ export interface TableColumn<T> {
3
+ /** Column key */
4
+ key: string;
5
+ /** Header text */
6
+ title: React.ReactNode;
7
+ /** Custom render function */
8
+ render?: (value: unknown, record: T, index: number) => React.ReactNode;
9
+ /** Column width */
10
+ width?: string | number;
11
+ /** Text alignment */
12
+ align?: 'left' | 'center' | 'right';
13
+ }
14
+ export interface TableProps<T extends Record<string, unknown>> {
15
+ /** Column definitions */
16
+ columns: TableColumn<T>[];
17
+ /** Data source */
18
+ dataSource: T[];
19
+ /** Row key extractor */
20
+ rowKey: keyof T | ((record: T) => string);
21
+ /** Clickable rows (hover effect) */
22
+ list?: boolean;
23
+ /** Row border */
24
+ border?: boolean;
25
+ /** Filled background */
26
+ fill?: boolean;
27
+ /** Row click callback */
28
+ onRowClick?: (record: T, index: number) => void;
29
+ /** Additional class name */
30
+ className?: string;
31
+ }
32
+ declare function Table<T extends Record<string, unknown>>({ columns, dataSource, rowKey, list, border, fill, onRowClick, className, }: TableProps<T>): import("react/jsx-runtime").JSX.Element;
33
+ declare namespace Table {
34
+ var displayName: string;
35
+ }
36
+ export default Table;
37
+ //# sourceMappingURL=table.d.ts.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,20 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ function Table({ columns, dataSource, rowKey, list, border, fill, onRowClick, className, }) {
3
+ const getRowKey = (record, index) => {
4
+ if (typeof rowKey === 'function') {
5
+ return rowKey(record);
6
+ }
7
+ return String(record[rowKey] ?? index);
8
+ };
9
+ const tableClass = [list && 'list', border && 'border', fill && 'fill', className]
10
+ .filter(Boolean)
11
+ .join(' ');
12
+ return (_jsxs("table", { className: tableClass || undefined, children: [_jsx("thead", { children: _jsx("tr", { children: columns.map((col) => (_jsx("th", { style: {
13
+ width: col.width,
14
+ textAlign: col.align,
15
+ }, 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
16
+ ? col.render(record[col.key], record, index)
17
+ : record[col.key] }, col.key))) }, getRowKey(record, index)))) })] }));
18
+ }
19
+ Table.displayName = 'Table';
20
+ export default Table;
package/global.scss CHANGED
@@ -55,6 +55,14 @@
55
55
  @forward './scss/form/toggle';
56
56
  @forward './scss/form/label';
57
57
 
58
+ @use './scss/form/checkbox-radio';
59
+ @use './scss/form/file';
60
+ @use './scss/form/input';
61
+ @use './scss/form/textarea';
62
+ @use './scss/form/select';
63
+ @use './scss/form/toggle';
64
+ @use './scss/form/label';
65
+
58
66
  /*
59
67
  Molecule
60
68
  */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "podo-ui",
3
- "version": "0.8.4",
3
+ "version": "0.9.0",
4
4
  "type": "module",
5
5
  "author": "hada0127 <work@tarucy.net>",
6
6
  "license": "MIT",
@@ -69,19 +69,17 @@
69
69
  "./vanilla/datepicker.css": "./vanilla/datepicker.css"
70
70
  },
71
71
  "scripts": {
72
- "dev": "next dev -p 5432",
73
- "build": "next build",
72
+ "dev": "vite",
73
+ "build": "vite build && vike prerender",
74
+ "preview": "vite preview",
74
75
  "build:lib": "node ./cli/build-lib.js",
75
76
  "build:cdn": "node ./cli/build-cdn.js",
76
77
  "build:cdn-js": "node ./cli/build-cdn-js.js",
77
78
  "build:all": "npm run build:lib && npm run build:cdn && npm run build:cdn-js",
78
79
  "prepublishOnly": "npm run build:all",
79
- "start": "next start",
80
- "lint": "next lint",
80
+ "lint": "eslint .",
81
81
  "icon": "node ./cli/icon-scss.js",
82
- "pages:build": "npx @cloudflare/next-on-pages",
83
- "preview": "npm run pages:build && wrangler pages dev",
84
- "deploy": "npm run pages:build && wrangler pages deploy"
82
+ "deploy": "vite build && wrangler pages deploy dist/client"
85
83
  },
86
84
  "peerDependencies": {
87
85
  "react": "^18.0.0 || ^19.0.0",
@@ -100,16 +98,11 @@
100
98
  }
101
99
  },
102
100
  "dependencies": {
101
+ "shiki": "^3.19.0",
103
102
  "uuid": "^11.0.3",
104
103
  "zod": "^3.23.8"
105
104
  },
106
105
  "devDependencies": {
107
- "next": "14.1.0",
108
- "next-intl": "^4.5.3",
109
- "react": "^18.3.1",
110
- "react-dom": "^18.3.1",
111
- "sass": "^1.83.0",
112
- "@cloudflare/next-on-pages": "^1.13.8",
113
106
  "@eslint/js": "^9.8.0",
114
107
  "@playwright/test": "^1.56.1",
115
108
  "@types/node": "22.10.2",
@@ -121,11 +114,19 @@
121
114
  "eslint-plugin-react-refresh": "^0.4.9",
122
115
  "glob": "^11.0.3",
123
116
  "globals": "^15.9.0",
117
+ "i18next": "^24.0.0",
124
118
  "opentype.js": "^1.3.4",
125
119
  "prettier": "^3.3.3",
120
+ "react": "^18.3.1",
121
+ "react-dom": "^18.3.1",
122
+ "react-i18next": "^15.0.0",
123
+ "sass": "^1.83.0",
126
124
  "sass-embedded": "^1.77.8",
127
125
  "scss": "^0.2.4",
128
126
  "typescript": "^5.5.3",
129
- "typescript-eslint": "^8.0.0"
127
+ "typescript-eslint": "^8.0.0",
128
+ "vike": "^0.4.182",
129
+ "vike-react": "^0.4.18",
130
+ "vite": "^5.4.0"
130
131
  }
131
132
  }