antd-solid 0.0.6 → 0.0.8

package/src/Button.tsx

@@ -1,125 +0,0 @@
-import {
-  type Component,
-  mergeProps,
-  type ParentProps,
-  type JSX,
-  Show,
-  createSignal,
-  createMemo,
-} from 'solid-js'
-import cs from 'classnames'
-
-interface ButtonProps extends ParentProps, JSX.CustomAttributes<HTMLButtonElement> {
-  type?: 'default' | 'primary' | 'dashed' | 'text' | 'link'
-  onClick?: ((e: MouseEvent) => void) | ((e: MouseEvent) => Promise<unknown>)
-  /**
-   * 默认: middle
-   * plain: 没有多余的 padding 和高度等
-   */
-  size?: 'large' | 'middle' | 'small' | 'plain'
-  class?: string
-  style?: JSX.CSSProperties
-  loading?: boolean
-  /**
-   * 设置危险按钮
-   */
-  danger?: boolean
-}
-
-const sizeClassMap = {
-  large: 'ant-px-15px ant-py-6px ant-h-40px ant-rounded-8px',
-  middle: 'ant-px-15px ant-py-4px ant-h-32px ant-rounded-6px',
-  small: 'ant-px-7px ant-h-24px ant-rounded-4px',
-  plain: 'ant-p-0',
-} as const
-
-const typeClassMap = {
-  default: (danger: boolean) =>
-    cs(
-      'ant-bg-white',
-      danger
-        ? 'ant-[border:1px_solid_var(--ant-color-error)] ant-text-[var(--ant-color-error)] hover:ant-[border-color:var(--light-error-color)] hover:ant-text-[var(--light-error-color)] active:ant-[border-color:var(--dark-error-color)] active:ant-text-[var(--dark-error-color)]'
-        : 'ant-[border:1px_solid_var(--ant-color-border)] ant-text-[var(--dark-color)] hover:ant-[border-color:var(--light-primary-color)] hover:ant-text-[var(--light-primary-color)] active:ant-[border-color:var(--dark-primary-color)] active:ant-text-[var(--dark-primary-color)]',
-    ),
-  primary: (danger: boolean) =>
-    cs(
-      'ant-border-none ant-text-white',
-      danger
-        ? 'ant-bg-[var(--ant-color-error)] hover:ant-bg-[var(--light-error-color)] active:ant-bg-[var(--dark-error-color)]'
-        : 'ant-bg-[var(--primary-color)] hover:ant-bg-[var(--light-primary-color)] active:ant-bg-[var(--dark-primary-color)]',
-    ),
-  dashed: (danger: boolean) =>
-    cs(
-      ' ant-bg-white',
-      danger
-        ? 'ant-[border:1px_dashed_var(--ant-color-error)] ant-text-[var(--ant-color-error)] hover:ant-[border-color:var(--light-error-color)] hover:ant-text-[var(--light-error-color)] active:ant-[border-color:var(--dark-error-color)] active:ant-text-[var(--dark-error-color)]'
-        : 'ant-[border:1px_dashed_var(--ant-color-border)] ant-text-[var(--dark-color)] hover:ant-[border-color:var(--light-primary-color)] hover:ant-text-[var(--light-primary-color)] active:ant-[border-color:var(--dark-primary-color)] active:ant-text-[var(--dark-primary-color)]',
-    ),
-  text: (danger: boolean) =>
-    cs(
-      'ant-border-none ant-bg-transparent',
-      danger
-        ? 'ant-text-[var(--ant-color-error)] hover:ant-bg-[var(--error-bg-color)] active:ant-bg-[var(--error-bg-color)]'
-        : 'ant-text-[var(--dark-color)] hover:ant-bg-[rgba(0,0,0,0.06)] active:ant-bg-[rgba(0,0,0,.15)]',
-    ),
-  link: (danger: boolean) =>
-    cs(
-      'ant-border-none ant-bg-transparent',
-      danger
-        ? 'ant-text-[var(--ant-color-error)] hover:ant-text-[var(--light-error-color)] active:ant-text-[var(--dark-error-color)]'
-        : 'ant-text-[var(--primary-color)] hover:ant-text-[var(--light-primary-color)] active:ant-text-[var(--dark-primary-color)]',
-    ),
-} as const
-
-const Button: Component<ButtonProps> = props => {
-  const mergedProps = mergeProps({ type: 'default', size: 'middle' } as ButtonProps, props)
-  const [innerLoading, setLoading] = createSignal(false)
-  const loading = createMemo(() => props.loading ?? innerLoading())
-
-  return (
-    <button
-      ref={mergedProps.ref}
-      class={cs(
-        'ant-relative ant-cursor-pointer',
-        mergedProps.class,
-        sizeClassMap[mergedProps.size!],
-        typeClassMap[mergedProps.type!](props.danger ?? false),
-        loading() && 'ant-opacity-65',
-        'ant-[--color:--light-primary-color]'
-      )}
-      style={mergedProps.style}
-      onClick={e => {
-        const res = mergedProps.onClick?.(e)
-        if (res instanceof Promise) {
-          setLoading(true)
-          res.finally(() => setLoading(false))
-        }
-
-        if (
-          mergedProps.type === 'default' ||
-          mergedProps.type === 'primary' ||
-          mergedProps.type === 'dashed'
-        ) {
-          const div = document.createElement('div')
-          div.className = cs(
-            props.danger ? 'ant-[--color:var(--light-error-color)]' : 'ant-[--color:var(--light-primary-color)]',
-            'ant-absolute ant-inset-0 ant-rounded-inherit ant-[background:radial-gradient(var(--color),rgba(0,0,0,0))] ant-z--1 ant-keyframes-button-border[inset:0px][inset:-6px] ant-[animation:button-border_ease-out_0.3s]',
-          )
-          const onAnimationEnd = () => {
-            div.remove()
-            div.removeEventListener('animationend', onAnimationEnd)
-          }
-          div.addEventListener('animationend', onAnimationEnd)
-          e.currentTarget.insertBefore(div, e.currentTarget.childNodes[0])
-        }
-      }}
-    >
-      <Show when={loading()}>
-        <span class="i-ant-design:loading ant-[vertical-align:-0.125em] keyframes-spin ant-[animation:spin_1s_linear_infinite] ant-mr-8px" />
-      </Show>
-      <span>{mergedProps.children}</span>
-    </button>
-  )
-}
-
-export default Button

package/src/Collapse/index.tsx

@@ -1,86 +0,0 @@
-import { type JSX, type JSXElement, type Component, For, Show } from 'solid-js'
-import cs from 'classnames'
-import { Transition } from 'solid-transition-group'
-import { type Key } from '../types'
-import createControllableValue from '../hooks/createControllableValue'
-
-export interface CollapseItem {
-  key: Key
-  label: JSXElement
-  children: JSXElement
-}
-
-export interface CollapseProps {
-  class?: string
-  defaultActiveKey?: Key[]
-  activeKey?: Key[]
-  items: CollapseItem[]
-  style?: JSX.CSSProperties
-}
-
-const Collapse: Component<CollapseProps> = props => {
-  const [activeKey, setActiveKey] = createControllableValue<Key[]>(props, {
-    defaultValuePropName: 'defaultActiveKey',
-    valuePropName: 'activeKey',
-    defaultValue: [],
-  })
-
-  return (
-    <div
-      class={cs(
-        'ant-rounded-[var(--ant-border-radius-lg)] ant-[border:1px_solid_var(--ant-color-border)] ant-border-b-0',
-        props.class,
-      )}
-      style={props.style}
-    >
-      <For each={props.items}>
-        {item => (
-          <div class="ant-[border-bottom:1px_solid_var(--ant-color-border)] first:ant-rounded-t-[var(--ant-border-radius-lg)] last:ant-rounded-b-[var(--ant-border-radius-lg)] ant-cursor-pointer">
-            <div
-              class="ant-bg-[var(--ant-collapse-header-bg)] ant-text-[var(--ant-color-text-heading)] ant-p-[var(--ant-collapse-header-padding)]"
-              onClick={() => {
-                setActiveKey(keys => {
-                  if (keys.includes(item.key)) {
-                    return keys.filter(key => key !== item.key)
-                  }
-                  return [...keys, item.key]
-                })
-              }}
-            >
-              <span
-                class={cs(
-                  'i-ant-design:right-outlined',
-                  'ant-mr-[var(--ant-margin-sm)] ant-duration-.3s',
-                  activeKey().includes(item.key) && 'ant-rotate-[90deg]',
-                )}
-              />
-              {item.label}
-            </div>
-            <Transition
-              onEnter={(el, done) => {
-                el.animate([{ height: '0px' }, { height: `${el.scrollHeight}px` }], {
-                  duration: 300,
-                }).finished.finally(done)
-              }}
-              onExit={(el, done) => {
-                el.animate([{ height: `${el.scrollHeight}px` }, { height: '0px' }], {
-                  duration: 300,
-                }).finished.finally(done)
-              }}
-            >
-              <Show when={activeKey().includes(item.key)}>
-                <div class="ant-overflow-hidden">
-                  <div class="ant-p-[var(--ant-padding-sm)] ant-[border-top:1px_solid_var(--ant-color-border)]">
-                    {item.children}
-                  </div>
-                </div>
-              </Show>
-            </Transition>
-          </div>
-        )}
-      </For>
-    </div>
-  )
-}
-
-export default Collapse

package/src/ColorPicker.tsx

@@ -1,11 +0,0 @@
-import { ColorPicker } from 'antd'
-import { type Color } from 'antd/es/color-picker'
-import { reactToSolidComponent } from './utils/component'
-
-export interface ColorPickerProps {
-  defaultValue?: string | Color
-  value?: string | Color
-  onChange?: (value: Color, hex: string) => void
-}
-
-export default reactToSolidComponent(ColorPicker)

package/src/Compact.tsx

@@ -1,15 +0,0 @@
-import { type ParentProps } from 'solid-js'
-
-interface CompactProps extends ParentProps {}
-
-function Compact(props: CompactProps) {
-  return <div class="ant-compact ant-flex">{props.children}</div>
-}
-
-Compact.compactItemClass = 'p[.ant-compact]:ant-ml--1px'
-Compact.compactItemRounded0Class = 'p[.ant-compact>*]:ant-rounded-0'
-Compact.compactItemRoundedLeftClass = 'p[.ant-compact>:first-child]:ant-rounded-l-6px'
-Compact.compactItemRoundedRightClass = 'p[.ant-compact>:last-child]:ant-rounded-r-6px'
-Compact.compactItemZIndexClass = 'p[.ant-compact>*]:focus:ant-z-10 p[.ant-compact>*]:focus-within:ant-z-10'
-
-export default Compact

package/src/DatePicker.tsx

@@ -1,22 +0,0 @@
-import { DatePicker as DatePickerAntd } from 'antd'
-import { type DatePickerProps, type RangePickerProps } from 'antd/es/date-picker';
-import { reactToSolidComponent, replaceClassName } from './utils/component'
-
-const RangePicker = replaceClassName(reactToSolidComponent<RangePickerProps & {
-  dropdownClassName?: string | undefined;
-  popupClassName?: string | undefined;
-  rootClassName?: string | undefined;
-}>(DatePickerAntd.RangePicker))
-
-const _DatePicker = replaceClassName(reactToSolidComponent<DatePickerProps & {
-  status?: '' | 'error' | 'warning' | undefined;
-  hashId?: string | undefined;
-  popupClassName?: string | undefined;
-  rootClassName?: string | undefined;
-}>(DatePickerAntd))
-const DatePicker = _DatePicker as typeof _DatePicker & {
-  RangePicker: typeof RangePicker
-}
-DatePicker.RangePicker = RangePicker
-
-export default DatePicker

package/src/Empty/PRESENTED_IMAGE_SIMPLE.tsx

@@ -1,15 +0,0 @@
-import { type Component } from 'solid-js'
-import SimpleEmptySvg from './assets/SimpleEmptySvg'
-
-const PRESENTED_IMAGE_SIMPLE: Component = () => {
-  return (
-    <div class='ant-my-[var(--ant-margin-xl)] ant-mx-[var(--ant-margin-xs)]'>
-      <div class="ant-mb-[var(--ant-margin-xs)] ant-flex ant-justify-center">
-        <SimpleEmptySvg />
-      </div>
-      <div class="ant-text-[var(--ant-color-text-disabled)] ant-text-center">暂无数据</div>
-    </div>
-  )
-}
-
-export default PRESENTED_IMAGE_SIMPLE

package/src/Empty/assets/EmptySvg.tsx

@@ -1,43 +0,0 @@
-const EmptySvg = () => (
-  <svg width="184" height="100" viewBox="0 0 184 152" xmlns="http://www.w3.org/2000/svg">
-    <g fill="none" fill-rule="evenodd">
-      <g transform="translate(24 31.67)">
-        <ellipse
-          fill-opacity=".8"
-          fill="#F5F5F7"
-          cx="67.797"
-          cy="106.89"
-          rx="67.797"
-          ry="12.668"
-        />
-        <path
-          d="M122.034 69.674L98.109 40.229c-1.148-1.386-2.826-2.225-4.593-2.225h-51.44c-1.766 0-3.444.839-4.592 2.225L13.56 69.674v15.383h108.475V69.674z"
-          fill="#AEB8C2"
-        />
-        <path
-          d="M101.537 86.214L80.63 61.102c-1.001-1.207-2.507-1.867-4.048-1.867H31.724c-1.54 0-3.047.66-4.048 1.867L6.769 86.214v13.792h94.768V86.214z"
-          fill="url(#linearGradient-1)"
-          transform="translate(13.56)"
-        />
-        <path
-          d="M33.83 0h67.933a4 4 0 0 1 4 4v93.344a4 4 0 0 1-4 4H33.83a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4z"
-          fill="#F5F5F7"
-        />
-        <path
-          d="M42.678 9.953h50.237a2 2 0 0 1 2 2V36.91a2 2 0 0 1-2 2H42.678a2 2 0 0 1-2-2V11.953a2 2 0 0 1 2-2zM42.94 49.767h49.713a2.262 2.262 0 1 1 0 4.524H42.94a2.262 2.262 0 0 1 0-4.524zM42.94 61.53h49.713a2.262 2.262 0 1 1 0 4.525H42.94a2.262 2.262 0 0 1 0-4.525zM121.813 105.032c-.775 3.071-3.497 5.36-6.735 5.36H20.515c-3.238 0-5.96-2.29-6.734-5.36a7.309 7.309 0 0 1-.222-1.79V69.675h26.318c2.907 0 5.25 2.448 5.25 5.42v.04c0 2.971 2.37 5.37 5.277 5.37h34.785c2.907 0 5.277-2.421 5.277-5.393V75.1c0-2.972 2.343-5.426 5.25-5.426h26.318v33.569c0 .617-.077 1.216-.221 1.789z"
-          fill="#DCE0E6"
-        />
-      </g>
-      <path
-        d="M149.121 33.292l-6.83 2.65a1 1 0 0 1-1.317-1.23l1.937-6.207c-2.589-2.944-4.109-6.534-4.109-10.408C138.802 8.102 148.92 0 161.402 0 173.881 0 184 8.102 184 18.097c0 9.995-10.118 18.097-22.599 18.097-4.528 0-8.744-1.066-12.28-2.902z"
-        fill="#DCE0E6"
-      />
-      <g transform="translate(149.65 15.383)" fill="#FFF">
-        <ellipse cx="20.654" cy="3.167" rx="2.849" ry="2.815" />
-        <path d="M5.698 5.63H0L2.898.704zM9.259.704h4.985V5.63H9.259z" />
-      </g>
-    </g>
-  </svg>
-)
-
-export default EmptySvg

package/src/Empty/assets/SimpleEmptySvg.tsx

@@ -1,16 +0,0 @@
-const EmptySvg = () => (
-  <svg width="64" height="41" viewBox="0 0 64 41" xmlns="http://www.w3.org/2000/svg">
-    <g transform="translate(0 1)" fill="none" fill-rule="evenodd">
-      <ellipse fill="#f5f5f5" cx="32" cy="33" rx="32" ry="7" />
-      <g fill-rule="nonzero" stroke="#d9d9d9">
-        <path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z" />
-        <path
-          d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
-          fill="#fafafa"
-        />
-      </g>
-    </g>
-  </svg>
-)
-
-export default EmptySvg

package/src/Empty/index.tsx

@@ -1,20 +0,0 @@
-import { type Component } from 'solid-js'
-import PRESENTED_IMAGE_SIMPLE from './PRESENTED_IMAGE_SIMPLE'
-import EmptySvg from './assets/EmptySvg'
-
-const Empty: Component & {
-  PRESENTED_IMAGE_SIMPLE: Component
-} = () => {
-  return (
-    <div>
-      <div class='ant-mb-[var(--ant-margin-xs)] ant-flex ant-justify-center'>
-        <EmptySvg />
-      </div>
-      <div class='ant-text-[var(--ant-color-text)] ant-text-center'>暂无数据</div>
-    </div>
-  )
-}
-
-Empty.PRESENTED_IMAGE_SIMPLE = PRESENTED_IMAGE_SIMPLE
-
-export default Empty

package/src/Image.tsx

@@ -1,29 +0,0 @@
-import { Image as ImageAntd } from 'antd'
-import { configProvider, reactToSolidComponent, replaceClassName } from './utils/component'
-import { solidToReact } from './utils/solid'
-import { type JSXElement, createMemo } from 'solid-js'
-import { mapValues } from 'lodash-es'
-
-const _Image = replaceClassName(
-  reactToSolidComponent(configProvider(ImageAntd), () => (<div class="ant-inline-flex" />) as any),
-)
-
-type ImageProps = Omit<Parameters<typeof _Image>[0], 'placeholder'> & {
-  placeholder?: JSXElement
-}
-
-function Image(_props: ImageProps) {
-  const props = createMemo(() =>
-    mapValues(_props, (value, key) => {
-      switch (key) {
-        case 'placeholder':
-          return solidToReact(value)
-        default:
-          return value
-      }
-    }),
-  )
-  return <_Image {...(props() as any)} />
-}
-
-export default Image

package/src/Input.tsx

@@ -1,202 +0,0 @@
-import { isNil, omit } from 'lodash-es'
-import { Show, createMemo, splitProps } from 'solid-js'
-import type { JSX, JSXElement, Component } from 'solid-js'
-import cs from 'classnames'
-import createControllableValue from './hooks/createControllableValue'
-import { Dynamic } from 'solid-js/web'
-import Compact from './Compact'
-
-type CommonInputProps<T extends HTMLInputElement | HTMLTextAreaElement = HTMLInputElement> =
-  JSX.CustomAttributes<T> & {
-    textarea?: boolean
-    defaultValue?: string | undefined
-    value?: string | undefined
-    addonBefore?: JSXElement
-    addonAfter?: JSXElement
-    prefix?: JSXElement
-    suffix?: JSXElement
-    placeholder?: string
-    /**
-     * 仅供 InputNumber 使用
-     */
-    actions?: JSXElement
-    /**
-     * 设置校验状态
-     */
-    status?: 'error' | 'warning'
-    onChange?: JSX.InputEventHandler<T, InputEvent>
-    onPressEnter?: JSX.EventHandler<T, KeyboardEvent>
-    onKeyDown?: JSX.EventHandler<T, KeyboardEvent>
-  }
-
-const statusClassDict = {
-  default: (disabled: boolean) =>
-    cs(
-      'ant-[border:1px_solid_var(--ant-color-border)]',
-      !disabled &&
-        'hover:ant-border-[var(--primary-color)] focus-within:ant-border-[var(--primary-color)] focus-within:ant-[box-shadow:0_0_0_2px_rgba(5,145,255,0.1)]',
-    ),
-  error: (disabled: boolean) =>
-    cs(
-      'ant-[border:1px_solid_var(--ant-color-error)]',
-      !disabled &&
-        'hover:ant-border-[var(--light-error-color)] focus-within:ant-[box-shadow:0_0_0_2px_rgba(255,38,5,.06)]',
-    ),
-  warning: (disabled: boolean) =>
-    cs(
-      'ant-[border:1px_solid_var(--warning-color)]',
-      !disabled &&
-        'hover:ant-border-[var(--color-warning-border-hover)] focus-within:ant-[box-shadow:0_0_0_2px_rgba(255,215,5,.1)]',
-    ),
-}
-
-export function CommonInput<T extends HTMLInputElement | HTMLTextAreaElement = HTMLInputElement>(
-  props: CommonInputProps<T> &
-  Omit<JSX.InputHTMLAttributes<T>, 'onChange' | 'onInput' | 'onKeyDown'>,
-) {
-  const [{ style, onChange, onPressEnter, onKeyDown }, inputProps] = splitProps(props, [
-    'defaultValue',
-    'value',
-    'class',
-    'addonBefore',
-    'addonAfter',
-    'suffix',
-    'onChange',
-    'onPressEnter',
-    'onKeyDown',
-    'actions',
-    'style',
-  ])
-
-  const [_, controllableProps] = splitProps(props, ['onChange'])
-  const [value, setValue] = createControllableValue(controllableProps)
-
-  const inputWrapClass = createMemo(() =>
-    cs(
-      'ant-px-11px ant-py-4px ant-rounded-6px',
-      !props.textarea && 'ant-h-32px',
-      props.addonBefore ? 'ant-rounded-l-0' : Compact.compactItemRoundedLeftClass,
-      props.addonAfter ? 'ant-rounded-r-0' : Compact.compactItemRoundedRightClass,
-      statusClassDict[props.status ?? 'default'](!!inputProps.disabled),
-      Compact.compactItemRounded0Class,
-      Compact.compactItemZIndexClass,
-    ),
-  )
-  const hasPrefixOrSuffix = createMemo(
-    () => !isNil(props.prefix) || !isNil(props.suffix) || !isNil(props.actions),
-  )
-  const inputJSX = (
-    <Dynamic<Component<JSX.InputHTMLAttributes<HTMLInputElement>>>
-      component={
-        (props.textarea ? 'textarea' : 'input') as unknown as Component<
-        JSX.InputHTMLAttributes<HTMLInputElement>
-        >
-      }
-      {...(inputProps as JSX.InputHTMLAttributes<HTMLInputElement>)}
-      class={cs(
-        'ant-w-full ant-[outline:none] ant-text-14px',
-        !hasPrefixOrSuffix() && inputWrapClass(),
-        inputProps.disabled &&
-          'ant-bg-[var(--ant-color-bg-container-disabled)] ant-cursor-not-allowed',
-      )}
-      value={value() ?? ''}
-      onInput={e => {
-        setValue(e.target.value)
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-        onChange?.(e as any)
-
-        if (Object.keys(props).includes('value')) {
-          e.target.value = value()
-        }
-      }}
-      onKeyDown={e => {
-        if (e.key === 'Enter') {
-          // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-          onPressEnter?.(e as any)
-        }
-
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-        onKeyDown?.(e as any)
-      }}
-    />
-  )
-
-  return (
-    <div class={cs('ant-flex ant-w-full', Compact.compactItemClass)} style={style}>
-      <Show when={props.addonBefore}>
-        <div
-          class={cs(
-            'ant-shrink-0 ant-flex ant-justify-center ant-items-center ant-px-11px ant-bg-[rgba(0,0,0,.02)] ant-[border:1px_solid_var(--ant-color-border)] ant-border-r-0 ant-rounded-l-6px ant-text-14px',
-            Compact.compactItemRounded0Class,
-            Compact.compactItemRoundedLeftClass,
-          )}
-        >
-          {props.addonBefore}
-        </div>
-      </Show>
-
-      <Show when={hasPrefixOrSuffix()} fallback={inputJSX}>
-        <div
-          class={cs(
-            'ant-flex ant-items-center ant-w-full ant-relative ant-[--input-after-display:none] hover:ant-[--input-after-display:block] p:hover-child[input]:ant-border-[var(--primary-color)]',
-            inputWrapClass(),
-          )}
-        >
-          <Show when={props.prefix}>
-            <div class="ant-mr-4px">{props.prefix}</div>
-          </Show>
-
-          {inputJSX}
-
-          <Show when={props.suffix}>
-            <div class="ant-ml-4px">{props.suffix}</div>
-          </Show>
-
-          <Show when={props.actions}>
-            <div class="ant-[display:var(--input-after-display)] ant-absolute ant-top-0 ant-bottom-0 ant-right-0 ant-h-[calc(100%-2px)] ant-translate-y-1px -ant-translate-x-1px">
-              {props.actions}
-            </div>
-          </Show>
-        </div>
-      </Show>
-
-      <Show when={props.addonAfter}>
-        <div
-          class={cs(
-            'ant-shrink-0 ant-flex ant-justify-center ant-items-center ant-px-11px ant-bg-[rgba(0,0,0,.02)] ant-[border:1px_solid_var(--ant-color-border)] ant-border-l-0 ant-rounded-r-6px ant-text-14px',
-            Compact.compactItemRounded0Class,
-            Compact.compactItemRoundedRightClass,
-          )}
-        >
-          {props.addonAfter}
-        </div>
-      </Show>
-    </div>
-  )
-}
-
-export type InputProps = Omit<CommonInputProps, 'actions' | 'textarea'> &
-Omit<JSX.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'onInput' | 'onKeyDown'>
-
-export type TextAreaProps = Omit<
-CommonInputProps<HTMLTextAreaElement>,
-'prefix' | 'suffix' | 'textarea'
-> &
-Omit<
-JSX.TextareaHTMLAttributes<HTMLTextAreaElement>,
-'actions' | 'onChange' | 'onInput' | 'onKeyDown'
->
-
-const Input: Component<InputProps> & {
-  TextArea: Component<TextAreaProps>
-} = props => {
-  return <CommonInput {...omit(props, ['actions'])} />
-}
-
-Input.TextArea = props => {
-  return (
-    <CommonInput<HTMLTextAreaElement> textarea {...omit(props, ['prefix', 'suffix', 'actions'])} />
-  )
-}
-
-export default Input

package/src/InputNumber.test.tsx

@@ -1,46 +0,0 @@
-import { describe, expect, it, vi } from 'vitest'
-import { fireEvent, render } from '@solidjs/testing-library'
-import InputNumber from './InputNumber'
-import '@testing-library/jest-dom'
-
-describe('InputNumber component', () => {
-  it('onChange', () => {
-    const onChange = vi.fn()
-    const { getByPlaceholderText } = render(() => (
-      <InputNumber placeholder="input-number" onChange={onChange} />
-    ))
-
-    const input: HTMLInputElement = getByPlaceholderText('input-number')
-    input.value = '123'
-    fireEvent.input(input)
-    expect(onChange).toHaveBeenLastCalledWith(123)
-
-    input.value = '1234'
-    fireEvent.input(input)
-    expect(onChange).toBeCalledTimes(2)
-    expect(onChange).toHaveBeenLastCalledWith(1234)
-
-    input.value = '1234'
-    fireEvent.input(input)
-    expect(onChange).toBeCalledTimes(2)
-
-    input.value = '1234.'
-    fireEvent.input(input)
-    expect(onChange).toBeCalledTimes(2)
-
-    input.value = '1234.0'
-    fireEvent.input(input)
-    expect(onChange).toBeCalledTimes(2)
-
-    input.value = '1234.01'
-    fireEvent.input(input)
-    expect(onChange).toBeCalledTimes(3)
-
-    input.value = '123x'
-    fireEvent.input(input)
-    expect(onChange).toBeCalledTimes(3)
-
-    fireEvent.blur(input)
-    expect(onChange).toBeCalledTimes(3)
-  })
-})