antd-solid 0.0.6 → 0.0.8

package/es/index.d.ts

@@ -0,0 +1,42 @@
+export { default as Button } from './Button';
+export { default as Input } from './Input';
+export type { InputProps } from './Input';
+export { default as InputNumber } from './InputNumber';
+export type { InputNumberProps } from './InputNumber';
+export { default as Timeline } from './Timeline';
+export { default as Modal } from './Modal';
+export type { ModalInstance } from './Modal';
+export { default as DatePicker } from './DatePicker';
+export { default as Select } from './Select';
+export { default as Tree } from './Tree';
+export type { TreeProps } from './Tree';
+export { default as Popover } from './Popover';
+export { default as Tooltip } from './Tooltip';
+export { default as ColorPicker } from './ColorPicker';
+export type { ColorPickerProps } from './ColorPicker';
+export { default as Result } from './Result';
+export { default as Progress } from './Progress';
+export { default as Tabs } from './Tabs';
+export type { TabsProps, Tab } from './Tabs';
+export { default as Popconfirm } from './Popconfirm';
+export { default as Upload } from './Upload';
+export type { UploadProps, UploadFile } from './Upload';
+export { default as Radio } from './Radio';
+export type { RadioProps, RadioGroupProps } from './Radio';
+export { default as Form } from './form';
+export type { FormInstance, FormProps, FormItemProps, FormItemComponentProps } from './form';
+export { default as Switch } from './Switch';
+export type { SwitchProps } from './Switch';
+export { default as Skeleton } from './Skeleton';
+export { default as Spin } from './Spin';
+export { default as Image } from './Image';
+export { default as Table } from './Table';
+export type { TableProps, TableColumn } from './Table';
+export { default as Compact } from './Compact';
+export type { CollapseProps, CollapseItem } from './Collapse';
+export { default as Collapse } from './Collapse';
+export { default as Empty } from './Empty';
+export type { SegmentedProps } from './Segmented';
+export { default as Segmented } from './Segmented';
+export { default as createControllableValue } from './hooks/createControllableValue';
+export { message } from 'antd';

package/es/index.js

@@ -0,0 +1,29 @@
+export { default as Button } from './Button.js';
+export { default as Input } from './Input.js';
+export { default as InputNumber } from './InputNumber.js';
+export { default as Timeline } from './Timeline.js';
+export { default as Modal } from './Modal.js';
+export { default as DatePicker } from './DatePicker.js';
+export { default as Select } from './Select.js';
+export { default as Tree } from './Tree.js';
+export { default as Popover } from './Popover.js';
+export { default as Tooltip } from './Tooltip.js';
+export { default as ColorPicker } from './ColorPicker.js';
+export { default as Result } from './Result.js';
+export { default as Progress } from './Progress.js';
+export { default as Tabs } from './Tabs.js';
+export { default as Popconfirm } from './Popconfirm.js';
+export { default as Upload } from './Upload.js';
+export { default as Radio } from './Radio.js';
+export { default as Form } from './form/index.js';
+export { default as Switch } from './Switch.js';
+export { default as Skeleton } from './Skeleton.js';
+export { default as Spin } from './Spin.js';
+export { default as Image } from './Image.js';
+export { default as Table } from './Table.js';
+export { default as Compact } from './Compact.js';
+export { default as Collapse } from './Collapse/index.js';
+export { default as Empty } from './Empty/index.js';
+export { default as Segmented } from './Segmented/index.js';
+export { default as createControllableValue } from './hooks/createControllableValue.js';
+export { message } from 'antd';

package/es/types/index.d.ts

@@ -0,0 +1,3 @@
+import { type JSXElement } from 'solid-js';
+export type Key = string | number;
+export type StringOrJSXElement = string | number | undefined | null | (() => JSXElement);

package/es/types/index.js

@@ -0,0 +1 @@
+

package/es/utils/EventEmitter.d.ts

@@ -0,0 +1,7 @@
+type Subscription<T> = (val: T) => void;
+export default class EventEmitter<T> {
+    private readonly subscriptions;
+    emit: (val: T) => void;
+    subscription: (callback: Subscription<T>) => void;
+}
+export {};

package/es/utils/EventEmitter.js

@@ -0,0 +1,13 @@
+class EventEmitter {
+  subscriptions = new Set();
+  emit = val => {
+    for (const subscription of this.subscriptions) {
+      subscription(val);
+    }
+  };
+  subscription = callback => {
+    this.subscriptions.add(callback);
+  };
+}
+
+export { EventEmitter as default };

package/es/utils/ReactToSolid.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface ReactToSolidProps<P extends {} = {}> {
+    component: React.FunctionComponent<P> | React.ComponentClass<P>;
+    props: P;
+    container?: Element;
+}
+declare function ReactToSolid<P extends {} = {}>(props: ReactToSolidProps<P>): import("solid-js").JSX.Element;
+export default ReactToSolid;

package/es/utils/ReactToSolid.js

@@ -0,0 +1,30 @@
+import { template } from 'solid-js/web';
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+import { createMemo, onMount, onCleanup, createEffect } from 'solid-js';
+
+const _tmpl$ = /*#__PURE__*/template(`<div role="ReactToSolid">`);
+function ReactToSolid(props) {
+  let root;
+  const rootEle = createMemo(() => props.container ?? _tmpl$());
+  onMount(() => {
+    root = createRoot(rootEle());
+    onCleanup(() => {
+      root.unmount();
+    });
+  });
+  createEffect(() => {
+    root.render(React.createElement(props.component, {
+      ...props.props
+    }));
+  });
+  // if (import.meta.env.SSR) {
+  //   // eslint-disable-next-line solid/reactivity
+  //   const node = React.createElement(props.component, { ...props.props })
+  //   // eslint-disable-next-line solid/components-return-once, solid/no-innerhtml
+  //   return <div innerHTML={renderToString(node)} />
+  // }
+  return rootEle;
+}
+
+export { ReactToSolid as default };

package/es/utils/SolidToReact.d.ts

@@ -0,0 +1,8 @@
+import { type FunctionComponent, type ReactElement } from 'react';
+import { type JSX } from 'solid-js';
+export interface SolidToReactProps {
+    children?: JSX.Element;
+    container?: ReactElement;
+}
+declare const SolidToReact: FunctionComponent<SolidToReactProps>;
+export default SolidToReact;

package/es/utils/SolidToReact.js

@@ -0,0 +1,23 @@
+import React, { useRef, useEffect } from 'react';
+import { render } from 'solid-js/web';
+
+const SolidToReact = ({
+  children,
+  container
+}) => {
+  const ref = useRef();
+  useEffect(() => render(() => children, ref.current), []);
+  // if (import.meta.env.SSR) {
+  //   return React.createElement('div', {
+  //     dangerouslySetInnerHTML: { __html: renderToString(() => children) },
+  //   })
+  // }
+  return container ? React.cloneElement(container, {
+    ref
+  }) : React.createElement('div', {
+    ref,
+    role: 'SolidToReact'
+  });
+};
+
+export { SolidToReact as default };

package/es/utils/array.d.ts

@@ -0,0 +1,15 @@
+/**
+ * 如果传入一个非数组字段，则将其转化为数组
+ * @param value
+ * @returns
+ */
+export declare function toArray<T>(value: T | T[]): T[];
+export interface StandardNode {
+    children?: this[];
+}
+/**
+ * 将数组中每个对象的 children 拍扁后返回
+ * @param nodes
+ * @returns
+ */
+export declare function flatChildren<T extends StandardNode = StandardNode>(nodes: T[] | undefined): T[];

package/es/utils/array.js

@@ -0,0 +1,19 @@
+/**
+ * 如果传入一个非数组字段，则将其转化为数组
+ * @param value
+ * @returns
+ */
+function toArray(value) {
+  return Array.isArray(value) ? value : [value];
+}
+/**
+ * 将数组中每个对象的 children 拍扁后返回
+ * @param nodes
+ * @returns
+ */
+function flatChildren(nodes) {
+  if (!nodes) return [];
+  return nodes.flatMap(node => [node, ...flatChildren(node.children)]);
+}
+
+export { flatChildren, toArray };

package/es/utils/component.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import { type Component, type JSXElement } from 'solid-js';
+import { type ConfigProviderProps } from 'antd/es/config-provider';
+/**
+ * 将组件 props 中的 className 替换为 class
+ * @param C
+ * @returns
+ */
+export declare function replaceClassName<T extends {
+    className?: string;
+}, Target extends Omit<T, 'className'> & {
+    class?: string;
+}>(C: Component<T>): Component<Target>;
+/**
+ * 将组件 props 中的 children 替换为 JSXElement
+ * @param C
+ * @returns
+ */
+export declare function replaceChildren<T extends {
+    children?: React.ReactNode;
+}, Target extends Omit<T, 'children'> & {
+    children?: JSXElement;
+}>(C: Component<T>): Component<Target>;
+export declare function reactToSolidComponent<P extends {} = {}>(component: React.FunctionComponent<P> | React.ComponentClass<P>, container?: Element | (() => Element)): (props: P) => import("solid-js").JSX.Element;
+/**
+ * 返回被 ConfigProvider 包裹后的 component
+ * @param component
+ * @param configProviderProps
+ * @returns
+ */
+export declare function configProvider<P extends {} = {}>(component: React.FunctionComponent<P> | React.ComponentClass<P>, configProviderProps?: ConfigProviderProps): (props: P) => React.FunctionComponentElement<ConfigProviderProps>;

package/es/utils/component.js

@@ -0,0 +1,68 @@
+import { createComponent, mergeProps } from 'solid-js/web';
+import React from 'react';
+import { createMemo } from 'solid-js';
+import { omit } from 'lodash-es';
+import { solidToReact } from './solid.js';
+import ReactToSolid from './ReactToSolid.js';
+import { ConfigProvider } from 'antd';
+import zhCN from './zh_CN.js';
+
+/**
+ * 将组件 props 中的 className 替换为 class
+ * @param C
+ * @returns
+ */
+function replaceClassName(C) {
+  return function (_props) {
+    const props = createMemo(() => {
+      return {
+        ...omit(_props, 'class'),
+        className: _props.class
+      };
+    });
+    return createComponent(C, mergeProps(props));
+  };
+}
+/**
+ * 将组件 props 中的 children 替换为 JSXElement
+ * @param C
+ * @returns
+ */
+function replaceChildren(C) {
+  return function (_props) {
+    const props = createMemo(() => {
+      return {
+        ..._props,
+        children: solidToReact(_props.children)
+      };
+    });
+    return createComponent(C, mergeProps(props));
+  };
+}
+function reactToSolidComponent(component, container) {
+  return function (props) {
+    return createComponent(ReactToSolid, {
+      component: component,
+      props: props,
+      get container() {
+        return typeof container === 'function' ? container() : container;
+      }
+    });
+  };
+}
+/**
+ * 返回被 ConfigProvider 包裹后的 component
+ * @param component
+ * @param configProviderProps
+ * @returns
+ */
+function configProvider(component, configProviderProps) {
+  return function (props) {
+    return React.createElement(ConfigProvider, {
+      locale: zhCN,
+      ...configProviderProps
+    }, React.createElement(component, props));
+  };
+}
+
+export { configProvider, reactToSolidComponent, replaceChildren, replaceClassName };

package/es/utils/solid.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { type JSXElement, type JSX } from 'solid-js';
+import { type StringOrJSXElement } from '../types';
+/**
+ * 判断 JSXElement 是否是基础类型
+ * @param value JSXElement
+ * @returns
+ */
+export declare function isBaseType(value: JSXElement): value is string | number | boolean | null | undefined;
+export declare function solidToReact(children: JSXElement): number | boolean | (string & {}) | React.FunctionComponentElement<import("./SolidToReact").SolidToReactProps> | null | undefined;
+export declare function dispatchEventHandlerUnion<T, E extends Event>(handler: JSX.EventHandlerUnion<T, E> | undefined, e: E & {
+    currentTarget: T;
+    target: Element;
+}): void;
+export declare function unwrapStringOrJSXElement(value: StringOrJSXElement): JSXElement;

package/es/utils/solid.js

@@ -0,0 +1,32 @@
+import React from 'react';
+import { isNil } from 'lodash-es';
+import SolidToReact from './SolidToReact.js';
+
+/**
+ * 判断 JSXElement 是否是基础类型
+ * @param value JSXElement
+ * @returns
+ */
+function isBaseType(value) {
+  return typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean' || value === null || value === undefined;
+}
+function solidToReact(children) {
+  return isBaseType(children) ? children : React.createElement(SolidToReact, {
+    children
+  });
+}
+function dispatchEventHandlerUnion(handler, e) {
+  if (isNil(handler)) {
+    return;
+  }
+  if (typeof handler === 'function') {
+    handler(e);
+    return;
+  }
+  handler[0](handler[1], e);
+}
+function unwrapStringOrJSXElement(value) {
+  return typeof value === 'function' ? value() : value;
+}
+
+export { dispatchEventHandlerUnion, isBaseType, solidToReact, unwrapStringOrJSXElement };

package/es/utils/zh_CN.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("antd/es/locale").Locale | undefined;
+export default _default;

package/{src/utils/zh_CN.ts → es/utils/zh_CN.js}

@@ -1,6 +1,4 @@
-import { type ConfigProviderProps } from 'antd/es/config-provider'
-
-export default {
+var zhCN = {
   locale: 'zh-cn',
   Pagination: {
     items_per_page: '条/页',
@@ -13,7 +11,7 @@ export default {
     next_5: '向后 5 页',
     prev_3: '向前 3 页',
     next_3: '向后 3 页',
-    page_size: '页码',
+    page_size: '页码'
   },
   DatePicker: {
     lang: {
@@ -52,16 +50,16 @@ export default {
       previousDecade: '上一年代',
       nextDecade: '下一年代',
       previousCentury: '上一世纪',
-      nextCentury: '下一世纪',
+      nextCentury: '下一世纪'
     },
     timePickerLocale: {
       placeholder: '请选择时间',
-      rangePlaceholder: ['开始时间', '结束时间'],
-    },
+      rangePlaceholder: ['开始时间', '结束时间']
+    }
   },
   TimePicker: {
     placeholder: '请选择时间',
-    rangePlaceholder: ['开始时间', '结束时间'],
+    rangePlaceholder: ['开始时间', '结束时间']
   },
   Calendar: {
     lang: {
@@ -100,15 +98,15 @@ export default {
       previousDecade: '上一年代',
       nextDecade: '下一年代',
       previousCentury: '上一世纪',
-      nextCentury: '下一世纪',
+      nextCentury: '下一世纪'
     },
     timePickerLocale: {
       placeholder: '请选择时间',
-      rangePlaceholder: ['开始时间', '结束时间'],
-    },
+      rangePlaceholder: ['开始时间', '结束时间']
+    }
   },
   global: {
-    placeholder: '请选择',
+    placeholder: '请选择'
   },
   Table: {
     filterTitle: '筛选',
@@ -126,21 +124,21 @@ export default {
     collapse: '关闭行',
     triggerDesc: '点击降序',
     triggerAsc: '点击升序',
-    cancelSort: '取消排序',
+    cancelSort: '取消排序'
   },
   Modal: {
     okText: '确定',
     cancelText: '取消',
-    justOkText: '知道了',
+    justOkText: '知道了'
   },
   Tour: {
     Next: '下一步',
     Previous: '上一步',
-    Finish: '结束导览',
+    Finish: '结束导览'
   },
   Popconfirm: {
     cancelText: '取消',
-    okText: '确定',
+    okText: '确定'
   },
   Transfer: {
     titles: ['', ''],
@@ -152,29 +150,29 @@ export default {
     removeCurrent: '删除当页',
     selectAll: '全选所有',
     removeAll: '删除全部',
-    selectInvert: '反选当页',
+    selectInvert: '反选当页'
   },
   Upload: {
     uploading: '文件上传中',
     removeFile: '删除文件',
     uploadError: '上传错误',
     previewFile: '预览文件',
-    downloadFile: '下载文件',
+    downloadFile: '下载文件'
   },
   Empty: {
-    description: '暂无数据',
+    description: '暂无数据'
   },
   Icon: {
-    icon: '图标',
+    icon: '图标'
   },
   Text: {
     edit: '编辑',
     copy: '复制',
     copied: '复制成功',
-    expand: '展开',
+    expand: '展开'
   },
   PageHeader: {
-    back: '返回',
+    back: '返回'
   },
   Form: {
     optional: '（可选）',
@@ -186,7 +184,7 @@ export default {
       date: {
         format: '${label}日期格式无效',
         parse: '${label}不能转换为日期',
-        invalid: '${label}是一个无效日期',
+        invalid: '${label}是一个无效日期'
       },
       types: {
         string: '${label}不是一个有效的${type}',
@@ -201,36 +199,38 @@ export default {
         regexp: '${label}不是一个有效的${type}',
         email: '${label}不是一个有效的${type}',
         url: '${label}不是一个有效的${type}',
-        hex: '${label}不是一个有效的${type}',
+        hex: '${label}不是一个有效的${type}'
       },
       string: {
         len: '${label}须为${len}个字符',
         min: '${label}最少${min}个字符',
         max: '${label}最多${max}个字符',
-        range: '${label}须在${min}-${max}字符之间',
+        range: '${label}须在${min}-${max}字符之间'
       },
       number: {
         len: '${label}必须等于${len}',
         min: '${label}最小值为${min}',
         max: '${label}最大值为${max}',
-        range: '${label}须在${min}-${max}之间',
+        range: '${label}须在${min}-${max}之间'
       },
       array: {
         len: '须为${len}个${label}',
         min: '最少${min}个${label}',
         max: '最多${max}个${label}',
-        range: '${label}数量须在${min}-${max}之间',
+        range: '${label}数量须在${min}-${max}之间'
       },
       pattern: {
-        mismatch: '${label}与模式不匹配${pattern}',
-      },
-    },
+        mismatch: '${label}与模式不匹配${pattern}'
+      }
+    }
   },
   Image: {
-    preview: '预览',
+    preview: '预览'
   },
   QRCode: {
     expired: '二维码过期',
-    refresh: '点击刷新',
-  },
-} as ConfigProviderProps['locale']
+    refresh: '点击刷新'
+  }
+};
+
+export { zhCN as default };

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "antd-solid",
-  "version": "0.0.6",
+  "version": "0.0.8",
   "description": "",
-  "main": "src/index.ts",
-  "types": "src/index.ts",
+  "main": "es/index.js",
+  "types": "es/index.d.ts",
   "type": "module",
   "devDependencies": {
     "@iconify-json/ant-design": "^1.1.5",
@@ -67,14 +67,15 @@
   },
   "files": [
     "dist",
-    "src"
+    "es",
+    "css"
   ],
   "scripts": {
     "docs:dev": "vitepress dev docs",
     "docs:build": "node scripts/annotationNonProductionCode && vitepress build docs && node scripts/cancelAnnotationNonProductionCode",
     "docs:preview": "vitepress preview docs",
-    "build": "rm -rf dist && NODE_ENV=production && npx rollup -c && npm run build:unocss",
-    "build:unocss": "npx unocss './src/**' -o dist/index.css -m",
+    "build": "rm -rf dist && rm -rf es && rm -rf css && NODE_ENV=production && npx rollup -c && npm run build:unocss",
+    "build:unocss": "npx unocss './src/**' -o css/index.css -m",
     "test": "vitest"
   }
 }