antd-solid 0.0.11 → 0.0.13

package/es/Tooltip.js

@@ -1,302 +0,0 @@
-import { delegateEvents, createComponent, memo, Portal, use, insert, effect, className, style, template } from 'solid-js/web';
-import { compact } from 'lodash-es';
-import { Show, mergeProps, children, createEffect, onCleanup, createSignal, createMemo } from 'solid-js';
-import cs from 'classnames';
-import createControllableValue from './hooks/createControllableValue.js';
-import useClickAway from './hooks/useClickAway.js';
-import { toArray } from './utils/array.js';
-
-const _tmpl$ = /*#__PURE__*/template(`<div>`);
-const Content = props => {
-  return createComponent(Show, {
-    get when() {
-      return typeof props.content === 'function';
-    },
-    get fallback() {
-      return props.content;
-    },
-    get children() {
-      return memo(() => typeof props.content === 'function')() && props.content(props.close);
-    }
-  });
-};
-const Tooltip = _props => {
-  const props = mergeProps({
-    trigger: 'hover',
-    placement: 'top',
-    mode: 'dark',
-    arrow: true
-  }, _props);
-  const resolvedChildren = children(() => _props.children);
-  let content;
-  const [open, setOpen] = createControllableValue(_props, {
-    defaultValue: false,
-    valuePropName: 'open',
-    trigger: 'onOpenChange'
-  });
-  const reverseOpen = () => setOpen(v => !v);
-  createEffect(() => {
-    const _children = resolvedChildren();
-    toArray(props.trigger).forEach(trigger => {
-      switch (trigger) {
-        case 'hover':
-          _children.addEventListener('mouseenter', reverseOpen);
-          _children.addEventListener('mouseleave', reverseOpen);
-          onCleanup(() => {
-            _children.removeEventListener('mouseenter', reverseOpen);
-            _children.removeEventListener('mouseleave', reverseOpen);
-          });
-          break;
-        case 'click':
-          _children.addEventListener('click', reverseOpen);
-          onCleanup(() => {
-            _children.removeEventListener('click', reverseOpen);
-          });
-          useClickAway(() => setOpen(false), () => compact([content, _children]));
-          break;
-        case 'focus':
-          _children.addEventListener('focus', reverseOpen);
-          _children.addEventListener('blur', reverseOpen);
-          onCleanup(() => {
-            _children.removeEventListener('focus', reverseOpen);
-            _children.removeEventListener('blur', reverseOpen);
-          });
-          break;
-      }
-    });
-  });
-  const [childrenRect, setChildrenRect] = createSignal(new DOMRect());
-  createEffect(() => {
-    if (open()) {
-      const _children = resolvedChildren();
-      setChildrenRect(_children.getBoundingClientRect());
-    }
-  });
-  const arrowOffset = createMemo(() => props.arrow ? 8 : 0);
-  const contentPositionStyle = createMemo(() => {
-    switch (props.placement) {
-      case 'top':
-        return {
-          top: `${childrenRect().top - arrowOffset()}px`,
-          left: `${childrenRect().left + childrenRect().width / 2}px`,
-          transform: 'translate(-50%, -100%)'
-        };
-      case 'topLeft':
-        return {
-          top: `${childrenRect().top - arrowOffset()}px`,
-          left: `${childrenRect().left}px`,
-          transform: 'translate(0, -100%)'
-        };
-      case 'topRight':
-        return {
-          top: `${childrenRect().top - arrowOffset()}px`,
-          left: `${childrenRect().right}px`,
-          transform: 'translate(-100%, -100%)'
-        };
-      case 'bottom':
-        return {
-          top: `${childrenRect().bottom + arrowOffset()}px`,
-          left: `${childrenRect().left + childrenRect().width / 2}px`,
-          transform: 'translate(-50%, 0)'
-        };
-      case 'bottomLeft':
-        return {
-          top: `${childrenRect().bottom + arrowOffset()}px`,
-          left: `${childrenRect().left}px`
-        };
-      case 'bottomRight':
-        return {
-          top: `${childrenRect().bottom + arrowOffset()}px`,
-          left: `${childrenRect().right}px`,
-          transform: 'translate(-100%, 0)'
-        };
-      case 'left':
-        return {
-          top: `${childrenRect().top + childrenRect().height / 2}px`,
-          left: `${childrenRect().left - arrowOffset()}px`,
-          transform: 'translate(-100%, -50%)'
-        };
-      case 'leftTop':
-        return {
-          top: `${childrenRect().top}px`,
-          left: `${childrenRect().left - arrowOffset()}px`,
-          transform: 'translate(-100%)'
-        };
-      case 'leftBottom':
-        return {
-          top: `${childrenRect().bottom}px`,
-          left: `${childrenRect().left - arrowOffset()}px`,
-          transform: 'translate(-100%, -100%)'
-        };
-      case 'right':
-        return {
-          top: `${childrenRect().top + childrenRect().height / 2}px`,
-          left: `${childrenRect().right + arrowOffset()}px`,
-          transform: 'translate(0, -50%)'
-        };
-      case 'rightTop':
-        return {
-          top: `${childrenRect().top}px`,
-          left: `${childrenRect().right + arrowOffset()}px`
-        };
-      case 'rightBottom':
-        return {
-          top: `${childrenRect().bottom}px`,
-          left: `${childrenRect().right + arrowOffset()}px`,
-          transform: 'translate(0, -100%)'
-        };
-    }
-  });
-  const arrowStyle = createMemo(() => {
-    switch (props.placement) {
-      case 'top':
-        return {
-          'border-top-color': 'var(--color)',
-          top: '100%',
-          filter: 'drop-shadow(3px 2px 2px rgba(0, 0, 0, 0.08))',
-          left: '50%',
-          transform: 'translateX(-50%)'
-        };
-      case 'topLeft':
-        return {
-          'border-top-color': 'var(--color)',
-          top: '100%',
-          filter: 'drop-shadow(3px 2px 2px rgba(0, 0, 0, 0.08))',
-          left: '8px'
-        };
-      case 'topRight':
-        return {
-          'border-top-color': 'var(--color)',
-          top: '100%',
-          filter: 'drop-shadow(3px 2px 2px rgba(0, 0, 0, 0.08))',
-          right: '8px'
-        };
-      case 'bottom':
-        return {
-          'border-bottom-color': 'var(--color)',
-          bottom: '100%',
-          filter: 'drop-shadow(3px 2px 2px rgba(0, 0, 0, 0.08))',
-          left: '50%',
-          transform: 'translateX(-50%)'
-        };
-      case 'bottomLeft':
-        return {
-          'border-bottom-color': 'var(--color)',
-          bottom: '100%',
-          filter: 'drop-shadow(3px 2px 2px rgba(0, 0, 0, 0.08))',
-          left: '8px'
-        };
-      case 'bottomRight':
-        return {
-          'border-bottom-color': 'var(--color)',
-          bottom: '100%',
-          filter: 'drop-shadow(3px 2px 2px rgba(0, 0, 0, 0.08))',
-          right: '8px'
-        };
-      case 'left':
-        return {
-          'border-left-color': 'var(--color)',
-          top: '50%',
-          right: 0,
-          transform: 'translate(100%, -50%)'
-        };
-      case 'leftTop':
-        return {
-          'border-left-color': 'var(--color)',
-          top: '8px',
-          right: 0,
-          transform: 'translate(100%, 0)'
-        };
-      case 'leftBottom':
-        return {
-          'border-left-color': 'var(--color)',
-          bottom: '8px',
-          right: 0,
-          transform: 'translate(100%, 0)'
-        };
-      case 'right':
-        return {
-          'border-right-color': 'var(--color)',
-          top: '50%',
-          left: 0,
-          transform: 'translate(-100%, -50%)'
-        };
-      case 'rightTop':
-        return {
-          'border-right-color': 'var(--color)',
-          top: '8px',
-          left: 0,
-          transform: 'translate(-100%, 0)'
-        };
-      case 'rightBottom':
-        return {
-          'border-right-color': 'var(--color)',
-          bottom: '8px',
-          left: 0,
-          transform: 'translate(-100%, 0)'
-        };
-    }
-  });
-  return [memo(resolvedChildren), createComponent(Show, {
-    get when() {
-      return open();
-    },
-    get children() {
-      return createComponent(Portal, {
-        get children() {
-          const _el$ = _tmpl$();
-          _el$.$$click = e => {
-            e.stopPropagation();
-          };
-          const _ref$ = content;
-          typeof _ref$ === "function" ? use(_ref$, _el$) : content = _el$;
-          insert(_el$, createComponent(Content, {
-            get content() {
-              return props.content;
-            },
-            close: () => setOpen(false)
-          }), null);
-          insert(_el$, createComponent(Show, {
-            get when() {
-              return props.arrow;
-            },
-            get children() {
-              const _el$2 = _tmpl$();
-              effect(_p$ => {
-                const _v$ = cs('ant-w-8px ant-h-8px ant-absolute ant-border-solid ant-border-4px ant-border-transparent'),
-                  _v$2 = {
-                    '--color': props.mode === 'dark' ? 'rgba(0,0,0,0.85)' : 'white',
-                    ...arrowStyle()
-                  };
-                _v$ !== _p$._v$ && className(_el$2, _p$._v$ = _v$);
-                _p$._v$2 = style(_el$2, _v$2, _p$._v$2);
-                return _p$;
-              }, {
-                _v$: undefined,
-                _v$2: undefined
-              });
-              return _el$2;
-            }
-          }), null);
-          effect(_p$ => {
-            const _v$3 = cs('ant-z-1000 ant-fixed ant-absolute ant-px-8px ant-py-6px ant-rounded-8px ant-box-content ant-[box-shadow:0_6px_16px_0_rgba(0,0,0,0.08),0_3px_6px_-4px_rgba(0,0,0,0.12),0_9px_28px_8px_rgba(0,0,0,0.05)]', props.mode === 'dark' ? 'ant-bg-[rgba(0,0,0,0.85)] ant-text-white' : 'ant-bg-white'),
-              _v$4 = {
-                ...contentPositionStyle(),
-                ...props.contentStyle
-              };
-            _v$3 !== _p$._v$3 && className(_el$, _p$._v$3 = _v$3);
-            _p$._v$4 = style(_el$, _v$4, _p$._v$4);
-            return _p$;
-          }, {
-            _v$3: undefined,
-            _v$4: undefined
-          });
-          return _el$;
-        }
-      });
-    }
-  })];
-};
-delegateEvents(["click"]);
-
-export { Content, Tooltip as default };

package/es/Tree.d.ts

@@ -1,28 +0,0 @@
-import { type JSXElement } from 'solid-js';
-export interface TreeProps<T extends {} = {}> {
-    class?: string;
-    defaultSelectedNodes?: T[];
-    treeData?: T[];
-    /**
-     * 是否节点占据一行
-     */
-    blockNode?: boolean;
-    defaultExpandAll?: boolean;
-    /**
-     * 设置节点可拖拽
-     */
-    draggable?: boolean;
-    titleRender: (node: T, info: {
-        indexes: number[];
-    }) => JSXElement;
-    children: (node: T) => T[] | undefined;
-    onSelect?: (node: T) => void;
-    onDrop?: (info: {
-        dragNode: T;
-        targetNode: T;
-        dragIndexes: number[];
-        targetIndexes: number[];
-    }) => void;
-}
-declare function Tree<T extends {} = {}>(props: TreeProps<T>): import("solid-js").JSX.Element;
-export default Tree;

package/es/Tree.js

@@ -1,198 +0,0 @@
-import { delegateEvents, createComponent, setAttribute, insert, effect, className, memo, template } from 'solid-js/web';
-import { isEmpty } from 'lodash-es';
-import { createContext, createSignal, createSelector, untrack, useContext, Index, Show } from 'solid-js';
-import cs from 'classnames';
-
-const _tmpl$ = /*#__PURE__*/template(`<span class="i-ant-design:minus-square-outlined">`),
-  _tmpl$2 = /*#__PURE__*/template(`<div><div class="flex-shrink-0" role="indent"></div><div class="ant-flex-shrink-0 ant-w-24px ant-h-24px ant-flex ant-items-center ant-justify-center"><span class="i-ant-design:holder-outlined"></span></div><div></div><div>`),
-  _tmpl$3 = /*#__PURE__*/template(`<span class="ant-inline-block ant-w-24px">`),
-  _tmpl$4 = /*#__PURE__*/template(`<span class="i-ant-design:plus-square-outlined">`);
-const TreeContext = createContext({});
-/**
- * 单层级 tree
- */
-function SingleLevelTree(props) {
-  const [expanded, setExpanded] = createSignal(props.defaultExpandAll);
-  const {
-    selectedNodes,
-    setSelectedNodes,
-    draggableNode,
-    setDraggableNode,
-    draggableIndexes,
-    setDraggableIndexes,
-    isDraggable,
-    targetNode,
-    setTargetNode,
-    targetIndexes,
-    setTargetIndexes,
-    isTarget,
-    draggable,
-    onDrop
-  } = useContext(TreeContext);
-  return createComponent(Index, {
-    get each() {
-      return props.treeData;
-    },
-    children: (item, i) => {
-      const indexes = [...(props.parentIndexes ?? []), i];
-      return [(() => {
-        const _el$ = _tmpl$2(),
-          _el$2 = _el$.firstChild,
-          _el$3 = _el$2.nextSibling,
-          _el$4 = _el$3.nextSibling,
-          _el$6 = _el$4.nextSibling;
-        _el$.addEventListener("dragend", () => {
-          onDrop?.({
-            dragNode: draggableNode(),
-            dragIndexes: draggableIndexes(),
-            targetNode: targetNode(),
-            targetIndexes: targetIndexes()
-          });
-          setDraggableNode(null);
-          setDraggableIndexes(null);
-          setTargetNode(null);
-          setTargetIndexes(null);
-        });
-        _el$.addEventListener("dragleave", e => {
-          if (item() === targetNode() && e.relatedTarget) {
-            setTargetNode(null);
-            setTargetIndexes(null);
-          }
-        });
-        _el$.addEventListener("dragenter", () => {
-          if (item() !== draggableNode()) {
-            setTargetNode(item());
-            setTargetIndexes(indexes);
-          }
-        });
-        _el$.addEventListener("dragstart", () => {
-          setDraggableNode(item());
-          setDraggableIndexes(indexes);
-        });
-        setAttribute(_el$, "draggable", draggable);
-        insert(_el$2, () => Array(props.indent).fill(0).map(() => _tmpl$3()));
-        insert(_el$4, createComponent(Show, {
-          get when() {
-            return expanded();
-          },
-          get fallback() {
-            return (() => {
-              const _el$8 = _tmpl$4();
-              _el$8.$$click = setExpanded;
-              _el$8.$$clickData = true;
-              return _el$8;
-            })();
-          },
-          get children() {
-            const _el$5 = _tmpl$();
-            _el$5.$$click = setExpanded;
-            _el$5.$$clickData = false;
-            return _el$5;
-          }
-        }));
-        _el$6.$$click = () => {
-          setSelectedNodes([item()]);
-          props.onSelect?.(item());
-        };
-        insert(_el$6, () => props.titleRender(item(), {
-          indexes
-        }));
-        effect(_p$ => {
-          const _v$ = cs('ant-flex ant-items-center ant-h-28px ant-pb-4px', isDraggable(item()) && 'ant-[border:1px_solid_var(--primary-color)] ant-bg-white', draggableNode() && 'child[]:ant-pointer-events-none'),
-            _v$2 = cs('ant-flex-shrink-0 ant-w-24px ant-h-24px ant-flex ant-items-center ant-justify-center ant-cursor-pointer', isEmpty(props.children(item())) && 'opacity-0'),
-            _v$3 = cs('ant-h-full ant-leading-24px hover:ant-bg-[var(--hover-bg-color)] ant-rounded-1 ant-px-1 ant-cursor-pointer ant-relative', props.blockNode && 'w-full', selectedNodes()?.includes(item()) && '!ant-bg-[var(--active-bg-color)]', isTarget(item()) && "before:ant-content-[''] before:ant-inline-block before:ant-w-8px before:ant-h-8px before:ant-absolute before:ant-bottom-0 before:ant-left-0 before:-ant-translate-x-full before:ant-translate-y-1/2 before:ant-rounded-1/2 before:ant-[border:2px_solid_var(--primary-color)] after:ant-content-[''] after:ant-inline-block after:ant-h-2px after:ant-absolute after:ant-left-0 after:ant-right-0 after:ant-bottom--1px after:ant-bg-[var(--primary-color)]");
-          _v$ !== _p$._v$ && className(_el$, _p$._v$ = _v$);
-          _v$2 !== _p$._v$2 && className(_el$4, _p$._v$2 = _v$2);
-          _v$3 !== _p$._v$3 && className(_el$6, _p$._v$3 = _v$3);
-          return _p$;
-        }, {
-          _v$: undefined,
-          _v$2: undefined,
-          _v$3: undefined
-        });
-        return _el$;
-      })(), createComponent(Show, {
-        get when() {
-          return memo(() => !!expanded())() && !isEmpty(props.children(item()));
-        },
-        get children() {
-          return createComponent(SingleLevelTree, {
-            get treeData() {
-              return props.children(item());
-            },
-            get indent() {
-              return props.indent + 1;
-            },
-            parentIndexes: indexes,
-            get blockNode() {
-              return props.blockNode;
-            },
-            get defaultExpandAll() {
-              return props.defaultExpandAll;
-            },
-            get titleRender() {
-              return props.titleRender;
-            },
-            get children() {
-              return props.children;
-            },
-            onSelect: node => untrack(() => props.onSelect?.(node))
-          });
-        }
-      })];
-    }
-  });
-}
-function Tree(props) {
-  const [selectedNodes, setSelectedNodes] = createSignal(props.defaultSelectedNodes ?? []);
-  const [draggableNode, setDraggableNode] = createSignal(null);
-  const isDraggable = createSelector(draggableNode);
-  const [draggableIndexes, setDraggableIndexes] = createSignal(null);
-  const [targetNode, setTargetNode] = createSignal(null);
-  const isTarget = createSelector(targetNode);
-  const [targetIndexes, setTargetIndexes] = createSignal(null);
-  return createComponent(TreeContext.Provider, {
-    get value() {
-      return {
-        selectedNodes,
-        setSelectedNodes: setSelectedNodes,
-        draggableNode,
-        setDraggableNode: setDraggableNode,
-        draggableIndexes,
-        setDraggableIndexes,
-        isDraggable,
-        targetNode,
-        setTargetNode: setTargetNode,
-        targetIndexes,
-        setTargetIndexes,
-        isTarget,
-        draggable: props.draggable,
-        onDrop: props.onDrop
-      };
-    },
-    get children() {
-      return createComponent(SingleLevelTree, {
-        get treeData() {
-          return props.treeData;
-        },
-        indent: 0,
-        get blockNode() {
-          return props.blockNode;
-        },
-        get defaultExpandAll() {
-          return props.defaultExpandAll;
-        },
-        get titleRender() {
-          return props.titleRender;
-        },
-        get children() {
-          return props.children;
-        },
-        onSelect: node => untrack(() => props.onSelect?.(node))
-      });
-    }
-  });
-}
-delegateEvents(["click"]);
-
-export { Tree as default };

package/es/Upload.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-export type { UploadFile } from 'antd/es/upload';
-declare const Upload: import("solid-js").Component<Omit<Omit<import("antd").UploadProps<any> & {
-    children?: import("react").ReactNode;
-} & import("react").RefAttributes<any>, "className"> & {
-    class?: string | undefined;
-}, "children"> & {
-    children?: import("solid-js").JSX.Element;
-}>;
-export type UploadProps = Parameters<typeof Upload>[0];
-export default Upload;

package/es/Upload.js

@@ -1,6 +0,0 @@
-import { replaceChildren, replaceClassName, reactToSolidComponent } from './utils/component.js';
-import { Upload as Upload$1 } from 'antd';
-
-const Upload = replaceChildren(replaceClassName(reactToSolidComponent(Upload$1)));
-
-export { Upload as default };

package/es/hooks/createUpdateEffect.d.ts

@@ -1,5 +0,0 @@
-import type { Accessor, AccessorArray, NoInfer, OnEffectFunction } from 'solid-js';
-/**
- * 等同于 createEffect，但是会忽略首次执行，只在依赖更新时执行。
- */
-export default function createUpdateEffect<S, Next extends Prev, Prev = Next>(deps: AccessorArray<S> | Accessor<S>, fn: OnEffectFunction<S, undefined | NoInfer<Prev>, Next>): void;

package/es/hooks/createUpdateEffect.js

@@ -1,12 +0,0 @@
-import { createEffect, on } from 'solid-js';
-
-/**
- * 等同于 createEffect，但是会忽略首次执行，只在依赖更新时执行。
- */
-function createUpdateEffect(deps, fn) {
-  createEffect(on(deps, fn, {
-    defer: true
-  }));
-}
-
-export { createUpdateEffect as default };

package/es/utils/EventEmitter.d.ts

@@ -1,7 +0,0 @@
-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

@@ -1,13 +0,0 @@
-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

@@ -1,8 +0,0 @@
-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

@@ -1,30 +0,0 @@
-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

@@ -1,8 +0,0 @@
-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

@@ -1,23 +0,0 @@
-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 };