smartsell-ui-kit 0.0.1

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts","../src/components/Button.tsx","../src/theme.ts","../src/components/Card.tsx","../src/components/ComposableModal.tsx","../src/components/Modal.tsx","../src/components/Field.tsx","../src/components/Input.tsx","../src/components/Select.tsx","../src/components/Textarea.tsx"],"sourcesContent":["export { Button, type ButtonProps } from './components/Button';\nexport { Card, type CardProps } from './components/Card';\nexport {\n  ComposableModal,\n  createModalSlotIds,\n  type ComposableModalProps,\n  type ModalSlotContext,\n  type ModalSlotIds,\n} from './components/ComposableModal';\nexport { Field, type FieldProps } from './components/Field';\nexport { Input, type InputProps } from './components/Input';\nexport { Modal, type ModalProps } from './components/Modal';\nexport { Select, type SelectProps } from './components/Select';\nexport { Textarea, type TextareaProps } from './components/Textarea';\nexport { useUiKitTheme, type UiKitThemeTokens } from './theme';","import type { ButtonHTMLAttributes, CSSProperties, ReactNode } from 'react';\n\nimport { withAlpha, type SmartSellSDK } from 'smartsell-sales-sdk';\n\nimport { useUiKitTheme } from '../theme';\n\ntype ButtonVariant = 'solid' | 'outline' | 'ghost';\ntype ButtonTone = 'primary' | 'secondary' | 'neutral' | 'danger';\ntype ButtonSize = 'sm' | 'md' | 'lg';\n\nexport interface ButtonProps\n  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'dangerouslySetInnerHTML'> {\n  sdk: SmartSellSDK;\n  variant?: ButtonVariant;\n  tone?: ButtonTone;\n  size?: ButtonSize;\n  fullWidth?: boolean;\n  leadingIcon?: ReactNode;\n  trailingIcon?: ReactNode;\n}\n\nconst getSizeStyles = (size: ButtonSize): CSSProperties => {\n  if (size === 'sm') {\n    return { minHeight: 38, padding: '0 14px', fontSize: 13 };\n  }\n\n  if (size === 'lg') {\n    return { minHeight: 50, padding: '0 20px', fontSize: 15 };\n  }\n\n  return { minHeight: 44, padding: '0 18px', fontSize: 14 };\n};\n\nexport function Button({\n  sdk,\n  variant = 'solid',\n  tone = 'primary',\n  size = 'md',\n  fullWidth = false,\n  leadingIcon,\n  trailingIcon,\n  children,\n  disabled,\n  style,\n  type = 'button',\n  ...rest\n}: ButtonProps) {\n  const { theme } = useUiKitTheme(sdk);\n\n  const palette = {\n    primary: {\n      background: theme.colors.primary,\n      foreground: theme.colors.onPrimary,\n      border: withAlpha(theme.colors.primary, 0.3),\n    },\n    secondary: {\n      background: theme.colors.secondary,\n      foreground: theme.colors.onSecondary,\n      border: withAlpha(theme.colors.secondary, 0.3),\n    },\n    neutral: {\n      background: theme.colors.surface,\n      foreground: theme.colors.onSurface,\n      border: withAlpha(theme.colors.onSurface, 0.16),\n    },\n    danger: {\n      background: theme.colors.negative,\n      foreground: '#ffffff',\n      border: withAlpha(theme.colors.negative, 0.32),\n    },\n  }[tone];\n\n  const variantStyles: Record<ButtonVariant, CSSProperties> = {\n    solid: {\n      backgroundColor: palette.background,\n      borderColor: palette.border,\n      color: palette.foreground,\n    },\n    outline: {\n      backgroundColor: 'transparent',\n      borderColor: palette.border,\n      color: tone === 'neutral' ? palette.foreground : palette.background,\n    },\n    ghost: {\n      backgroundColor: 'transparent',\n      borderColor: 'transparent',\n      color: tone === 'neutral' ? palette.foreground : palette.background,\n    },\n  };\n\n  return (\n    <button\n      {...rest}\n      type={type}\n      disabled={disabled}\n      style={{\n        display: 'inline-flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        gap: 10,\n        width: fullWidth ? '100%' : undefined,\n        borderRadius: 16,\n        borderStyle: 'solid',\n        borderWidth: 1,\n        cursor: disabled ? 'not-allowed' : 'pointer',\n        fontWeight: 700,\n        letterSpacing: '0.01em',\n        lineHeight: 1,\n        opacity: disabled ? 0.58 : 1,\n        transition: 'transform 160ms ease, opacity 160ms ease, background-color 160ms ease',\n        boxShadow: variant === 'solid' ? `0 14px 28px ${withAlpha(palette.background, 0.18)}` : 'none',\n        ...getSizeStyles(size),\n        ...variantStyles[variant],\n        ...style,\n      }}\n    >\n      {leadingIcon}\n      {children}\n      {trailingIcon}\n    </button>\n  );\n}","import { useMemo } from 'react';\n\nimport {\n  useSalesTheme,\n  withAlpha,\n  type SalesTheme,\n  type SmartSellSDK,\n} from 'smartsell-sales-sdk';\n\nexport interface UiKitThemeTokens {\n  theme: SalesTheme;\n  borderSoft: string;\n  borderStrong: string;\n  surfaceMuted: string;\n  surfaceRaised: string;\n  overlay: string;\n  focusRing: string;\n  mutedText: string;\n}\n\nexport function useUiKitTheme(sdk: SmartSellSDK): UiKitThemeTokens {\n  const { theme } = useSalesTheme(sdk);\n\n  return useMemo(() => {\n    return {\n      theme,\n      borderSoft: withAlpha(theme.colors.onSurface, 0.1),\n      borderStrong: withAlpha(theme.colors.onSurface, 0.16),\n      surfaceMuted: withAlpha(theme.colors.onSurface, 0.04),\n      surfaceRaised: withAlpha(theme.colors.surface, 0.94),\n      overlay: withAlpha('#030712', 0.62),\n      focusRing: withAlpha(theme.colors.primary, 0.22),\n      mutedText: withAlpha(theme.colors.onSurface, 0.72),\n    };\n  }, [theme]);\n}","import type { CSSProperties, HTMLAttributes, ReactNode } from 'react';\n\nimport { withAlpha, type SmartSellSDK } from 'smartsell-sales-sdk';\n\nimport { useUiKitTheme } from '../theme';\n\ntype CardTone = 'default' | 'primary' | 'secondary' | 'warning';\n\nexport interface CardProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'dangerouslySetInnerHTML' | 'title'> {\n  sdk: SmartSellSDK;\n  children: ReactNode;\n  eyebrow?: ReactNode;\n  title?: ReactNode;\n  action?: ReactNode;\n  tone?: CardTone;\n  padded?: boolean;\n}\n\nconst getToneStyles = (tone: CardTone, sdk: SmartSellSDK) => {\n  const { theme } = useUiKitTheme(sdk);\n\n  const accent = {\n    default: theme.colors.primary,\n    primary: theme.colors.primary,\n    secondary: theme.colors.secondary,\n    warning: theme.colors.warning,\n  }[tone];\n\n  return {\n    accent,\n    background: `linear-gradient(160deg, ${withAlpha(theme.colors.surface, 0.98)}, ${withAlpha(accent, 0.08)})`,\n    border: withAlpha(accent, 0.22),\n  };\n};\n\nexport function Card({\n  sdk,\n  children,\n  eyebrow,\n  title,\n  action,\n  tone = 'default',\n  padded = true,\n  style,\n  ...rest\n}: CardProps) {\n  const { theme, mutedText } = useUiKitTheme(sdk);\n  const toneStyles = getToneStyles(tone, sdk);\n\n  return (\n    <div\n      {...rest}\n      style={{\n        borderRadius: 28,\n        border: `1px solid ${toneStyles.border}`,\n        background: toneStyles.background,\n        color: theme.colors.onSurface,\n        boxShadow: `0 24px 48px ${withAlpha(theme.colors.onSurface, 0.06)}`,\n        padding: padded ? 24 : undefined,\n        ...style,\n      }}\n    >\n      {(eyebrow || title || action) && (\n        <div\n          style={{\n            display: 'flex',\n            justifyContent: 'space-between',\n            alignItems: 'flex-start',\n            gap: 16,\n            marginBottom: 18,\n          }}\n        >\n          <div style={{ display: 'flex', flexDirection: 'column', gap: 6 }}>\n            {eyebrow ? (\n              <span\n                style={{\n                  color: toneStyles.accent,\n                  fontSize: 12,\n                  fontWeight: 800,\n                  letterSpacing: '0.16em',\n                  textTransform: 'uppercase',\n                }}\n              >\n                {eyebrow}\n              </span>\n            ) : null}\n            {title ? (\n              <div\n                style={{\n                  color: theme.colors.onSurface,\n                  fontSize: 24,\n                  fontWeight: 700,\n                  lineHeight: 1.2,\n                }}\n              >\n                {title}\n              </div>\n            ) : null}\n          </div>\n          {action ? <div style={{ color: mutedText }}>{action}</div> : null}\n        </div>\n      )}\n      {children}\n    </div>\n  );\n}","import { useMemo } from 'react';\nimport type { ReactNode } from 'react';\n\nimport { SlotRenderer, type SmartSellSDK } from 'smartsell-sales-sdk';\n\nimport { Button } from './Button';\nimport { Modal } from './Modal';\n\nexport interface ModalSlotIds {\n  header: string;\n  body: string;\n  footer: string;\n}\n\nexport interface ModalSlotContext<TPayload = unknown> {\n  title: string;\n  description?: string;\n  payload?: TPayload;\n  close: () => void;\n  confirm?: () => void;\n  confirmLabel: string;\n  cancelLabel: string;\n  isOpen: boolean;\n  isBusy: boolean;\n}\n\nexport interface ComposableModalProps<TPayload = unknown> {\n  sdk: SmartSellSDK;\n  isOpen: boolean;\n  onClose: () => void;\n  title: string;\n  description?: string;\n  slotBaseId: string;\n  payload?: TPayload;\n  onConfirm?: () => void;\n  confirmLabel?: string;\n  cancelLabel?: string;\n  isBusy?: boolean;\n  closeOnBackdrop?: boolean;\n  closeOnEscape?: boolean;\n  hideDefaultFooter?: boolean;\n  maxWidth?: number | string;\n  headerFallback?: ReactNode;\n  footerFallback?: ReactNode;\n  children?: ReactNode;\n}\n\nexport const createModalSlotIds = (slotBaseId: string): ModalSlotIds => ({\n  header: `${slotBaseId}:modal-header`,\n  body: `${slotBaseId}:modal-body`,\n  footer: `${slotBaseId}:modal-footer`,\n});\n\nexport function ComposableModal<TPayload = unknown>({\n  sdk,\n  isOpen,\n  onClose,\n  title,\n  description,\n  slotBaseId,\n  payload,\n  onConfirm,\n  confirmLabel = 'Confirm',\n  cancelLabel = 'Cancel',\n  isBusy = false,\n  closeOnBackdrop = true,\n  closeOnEscape = true,\n  hideDefaultFooter = false,\n  maxWidth,\n  headerFallback,\n  footerFallback,\n  children,\n}: ComposableModalProps<TPayload>) {\n  const slotIds = createModalSlotIds(slotBaseId);\n\n  const context = useMemo<ModalSlotContext<TPayload>>(\n    () => ({\n      title,\n      description,\n      payload,\n      close: onClose,\n      confirm: onConfirm,\n      confirmLabel,\n      cancelLabel,\n      isOpen,\n      isBusy,\n    }),\n    [cancelLabel, confirmLabel, description, isBusy, isOpen, onClose, onConfirm, payload, title],\n  );\n\n  const defaultFooter = hideDefaultFooter ? undefined : (\n    footerFallback ?? (\n      <>\n        <Button sdk={sdk} variant=\"outline\" tone=\"neutral\" onClick={onClose} disabled={isBusy}>\n          {cancelLabel}\n        </Button>\n        {onConfirm ? (\n          <Button sdk={sdk} onClick={onConfirm} disabled={isBusy}>\n            {confirmLabel}\n          </Button>\n        ) : null}\n      </>\n    )\n  );\n\n  const headerContent = (\n    <SlotRenderer id={slotIds.header} sdk={sdk} context={context}>\n      {headerFallback}\n    </SlotRenderer>\n  );\n\n  const bodyContent = (\n    <SlotRenderer id={slotIds.body} sdk={sdk} context={context}>\n      {children}\n    </SlotRenderer>\n  );\n\n  const footerContent = (\n    <SlotRenderer id={slotIds.footer} sdk={sdk} context={context}>\n      {defaultFooter}\n    </SlotRenderer>\n  );\n\n  return (\n    <Modal\n      sdk={sdk}\n      isOpen={isOpen}\n      onClose={onClose}\n      title={title}\n      description={description}\n      headerContent={headerContent}\n      footer={footerContent}\n      maxWidth={maxWidth}\n      closeOnBackdrop={closeOnBackdrop}\n      closeOnEscape={closeOnEscape}\n    >\n      {bodyContent}\n    </Modal>\n  );\n}","import { useEffect, useMemo } from 'react';\nimport type { CSSProperties, ReactNode } from 'react';\n\nimport { withAlpha, type SmartSellSDK } from 'smartsell-sales-sdk';\n\nimport { useUiKitTheme } from '../theme';\n\nexport interface ModalProps {\n  sdk: SmartSellSDK;\n  isOpen: boolean;\n  onClose: () => void;\n  children: ReactNode;\n  footer?: ReactNode;\n  title?: ReactNode;\n  description?: ReactNode;\n  headerContent?: ReactNode;\n  maxWidth?: number | string;\n  closeOnBackdrop?: boolean;\n  closeOnEscape?: boolean;\n  hideCloseButton?: boolean;\n  contentStyle?: CSSProperties;\n}\n\nconst normalizeWidth = (maxWidth?: number | string): string | number => {\n  if (typeof maxWidth === 'number') {\n    return `${maxWidth}px`;\n  }\n\n  return maxWidth ?? '720px';\n};\n\nexport function Modal({\n  sdk,\n  isOpen,\n  onClose,\n  children,\n  footer,\n  title,\n  description,\n  headerContent,\n  maxWidth,\n  closeOnBackdrop = true,\n  closeOnEscape = true,\n  hideCloseButton = false,\n  contentStyle,\n}: ModalProps) {\n  const { theme, borderSoft, overlay, surfaceRaised, mutedText } = useUiKitTheme(sdk);\n  const titleId = useMemo(\n    () => `smartsell-modal-${String(title ?? 'dialog').toLowerCase().replace(/[^a-z0-9]+/g, '-')}`,\n    [title],\n  );\n\n  useEffect(() => {\n    if (!isOpen || typeof window === 'undefined' || typeof document === 'undefined') {\n      return;\n    }\n\n    const previousOverflow = document.body.style.overflow;\n    document.body.style.overflow = 'hidden';\n\n    const handleKeyDown = (event: KeyboardEvent) => {\n      if (closeOnEscape && event.key === 'Escape') {\n        onClose();\n      }\n    };\n\n    window.addEventListener('keydown', handleKeyDown);\n\n    return () => {\n      document.body.style.overflow = previousOverflow;\n      window.removeEventListener('keydown', handleKeyDown);\n    };\n  }, [closeOnEscape, isOpen, onClose]);\n\n  if (!isOpen) {\n    return null;\n  }\n\n  const header = headerContent ?? (\n    <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>\n      {title ? (\n        <h2\n          id={titleId}\n          style={{\n            margin: 0,\n            color: theme.colors.onSurface,\n            fontSize: 30,\n            fontWeight: 800,\n            lineHeight: 1.1,\n          }}\n        >\n          {title}\n        </h2>\n      ) : null}\n      {description ? (\n        <p\n          style={{\n            margin: 0,\n            color: mutedText,\n            fontSize: 15,\n            lineHeight: 1.6,\n          }}\n        >\n          {description}\n        </p>\n      ) : null}\n    </div>\n  );\n\n  return (\n    <div\n      aria-labelledby={title ? titleId : undefined}\n      aria-modal=\"true\"\n      role=\"dialog\"\n      onMouseDown={(event) => {\n        if (closeOnBackdrop && event.target === event.currentTarget) {\n          onClose();\n        }\n      }}\n      style={{\n        position: 'fixed',\n        inset: 0,\n        zIndex: 70,\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        padding: 16,\n        backgroundColor: overlay,\n        backdropFilter: 'blur(8px)',\n      }}\n    >\n      <div\n        style={{\n          width: 'min(100%, 100%)',\n          maxWidth: normalizeWidth(maxWidth),\n          borderRadius: 30,\n          border: `1px solid ${borderSoft}`,\n          background: `linear-gradient(180deg, ${surfaceRaised}, ${theme.colors.surface})`,\n          boxShadow: `0 34px 80px ${withAlpha('#020617', 0.28)}`,\n          color: theme.colors.onSurface,\n          overflow: 'hidden',\n          ...contentStyle,\n        }}\n      >\n        <div\n          style={{\n            display: 'flex',\n            alignItems: 'flex-start',\n            justifyContent: 'space-between',\n            gap: 16,\n            padding: '24px 24px 0',\n          }}\n        >\n          <div style={{ flex: 1 }}>{header}</div>\n          {!hideCloseButton ? (\n            <button\n              aria-label=\"Close modal\"\n              type=\"button\"\n              onClick={onClose}\n              style={{\n                height: 42,\n                width: 42,\n                borderRadius: 999,\n                border: `1px solid ${borderSoft}`,\n                backgroundColor: 'transparent',\n                color: theme.colors.onSurface,\n                cursor: 'pointer',\n                fontSize: 20,\n                fontWeight: 700,\n              }}\n            >\n              ×\n            </button>\n          ) : null}\n        </div>\n\n        <div style={{ padding: 24 }}>{children}</div>\n\n        {footer ? (\n          <div\n            style={{\n              display: 'flex',\n              justifyContent: 'flex-end',\n              gap: 12,\n              padding: '0 24px 24px',\n              borderTop: `1px solid ${withAlpha(theme.colors.onSurface, 0.06)}`,\n            }}\n          >\n            {footer}\n          </div>\n        ) : null}\n      </div>\n    </div>\n  );\n}","import type { CSSProperties, ReactNode } from 'react';\n\nimport type { SmartSellSDK } from 'smartsell-sales-sdk';\n\nimport { useUiKitTheme } from '../theme';\n\nexport interface FieldProps {\n  sdk: SmartSellSDK;\n  label?: ReactNode;\n  hint?: ReactNode;\n  error?: ReactNode;\n  htmlFor?: string;\n  required?: boolean;\n  children: ReactNode;\n  style?: CSSProperties;\n}\n\nexport function Field({\n  sdk,\n  label,\n  hint,\n  error,\n  htmlFor,\n  required = false,\n  children,\n  style,\n}: FieldProps) {\n  const { theme, mutedText } = useUiKitTheme(sdk);\n\n  return (\n    <label\n      htmlFor={htmlFor}\n      style={{\n        display: 'flex',\n        flexDirection: 'column',\n        gap: 8,\n        width: '100%',\n        ...style,\n      }}\n    >\n      {(label || hint) && (\n        <div style={{ display: 'flex', flexDirection: 'column', gap: 4 }}>\n          {label ? (\n            <span\n              style={{\n                color: theme.colors.onSurface,\n                fontSize: 14,\n                fontWeight: 700,\n                letterSpacing: '0.01em',\n              }}\n            >\n              {label}\n              {required ? (\n                <span style={{ color: theme.colors.negative, marginLeft: 4 }}>*</span>\n              ) : null}\n            </span>\n          ) : null}\n          {hint ? (\n            <span\n              style={{\n                color: mutedText,\n                fontSize: 13,\n                lineHeight: 1.45,\n              }}\n            >\n              {hint}\n            </span>\n          ) : null}\n        </div>\n      )}\n      {children}\n      {error ? (\n        <span\n          style={{\n            color: theme.colors.negative,\n            fontSize: 13,\n            fontWeight: 600,\n            lineHeight: 1.45,\n          }}\n        >\n          {error}\n        </span>\n      ) : null}\n    </label>\n  );\n}","import type { CSSProperties, InputHTMLAttributes } from 'react';\n\nimport { withAlpha, type SmartSellSDK } from 'smartsell-sales-sdk';\n\nimport { useUiKitTheme } from '../theme';\nimport { Field } from './Field';\n\ntype ControlSize = 'sm' | 'md' | 'lg';\n\nexport interface InputProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, 'dangerouslySetInnerHTML' | 'size'> {\n  sdk: SmartSellSDK;\n  label?: string;\n  hint?: string;\n  error?: string;\n  controlSize?: ControlSize;\n}\n\nconst getPadding = (size: ControlSize): string => {\n  if (size === 'sm') return '10px 12px';\n  if (size === 'lg') return '16px 18px';\n  return '13px 16px';\n};\n\nexport function Input({\n  sdk,\n  label,\n  hint,\n  error,\n  controlSize = 'md',\n  id,\n  disabled,\n  style,\n  ...rest\n}: InputProps) {\n  const { theme, borderSoft, focusRing, surfaceMuted } = useUiKitTheme(sdk);\n\n  const inputStyle: CSSProperties = {\n    width: '100%',\n    borderRadius: 16,\n    border: `1px solid ${error ? theme.colors.negative : borderSoft}`,\n    padding: getPadding(controlSize),\n    outline: 'none',\n    color: theme.colors.onSurface,\n    backgroundColor: disabled ? surfaceMuted : theme.colors.surface,\n    boxShadow: error ? `0 0 0 3px ${withAlpha(theme.colors.negative, 0.12)}` : `0 0 0 0 ${focusRing}`,\n    transition: 'border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease',\n    ...style,\n  };\n\n  const input = <input {...rest} id={id} disabled={disabled} style={inputStyle} />;\n\n  if (!label && !hint && !error) {\n    return input;\n  }\n\n  return (\n    <Field sdk={sdk} label={label} hint={hint} error={error} htmlFor={id}>\n      {input}\n    </Field>\n  );\n}","import type { CSSProperties, SelectHTMLAttributes } from 'react';\n\nimport { withAlpha, type SmartSellSDK } from 'smartsell-sales-sdk';\n\nimport { useUiKitTheme } from '../theme';\nimport { Field } from './Field';\n\ntype ControlSize = 'sm' | 'md' | 'lg';\n\nexport interface SelectProps\n  extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'dangerouslySetInnerHTML' | 'size'> {\n  sdk: SmartSellSDK;\n  label?: string;\n  hint?: string;\n  error?: string;\n  controlSize?: ControlSize;\n}\n\nconst getPadding = (size: ControlSize): string => {\n  if (size === 'sm') return '10px 12px';\n  if (size === 'lg') return '16px 18px';\n  return '13px 16px';\n};\n\nexport function Select({\n  sdk,\n  label,\n  hint,\n  error,\n  controlSize = 'md',\n  id,\n  disabled,\n  style,\n  children,\n  ...rest\n}: SelectProps) {\n  const { theme, borderSoft, focusRing, surfaceMuted } = useUiKitTheme(sdk);\n\n  const selectStyle: CSSProperties = {\n    width: '100%',\n    borderRadius: 16,\n    border: `1px solid ${error ? theme.colors.negative : borderSoft}`,\n    padding: getPadding(controlSize),\n    outline: 'none',\n    color: theme.colors.onSurface,\n    backgroundColor: disabled ? surfaceMuted : theme.colors.surface,\n    boxShadow: error ? `0 0 0 3px ${withAlpha(theme.colors.negative, 0.12)}` : `0 0 0 0 ${focusRing}`,\n    transition: 'border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease',\n    ...style,\n  };\n\n  const select = (\n    <select {...rest} id={id} disabled={disabled} style={selectStyle}>\n      {children}\n    </select>\n  );\n\n  if (!label && !hint && !error) {\n    return select;\n  }\n\n  return (\n    <Field sdk={sdk} label={label} hint={hint} error={error} htmlFor={id}>\n      {select}\n    </Field>\n  );\n}","import type { CSSProperties, TextareaHTMLAttributes } from 'react';\n\nimport { withAlpha, type SmartSellSDK } from 'smartsell-sales-sdk';\n\nimport { useUiKitTheme } from '../theme';\nimport { Field } from './Field';\n\ntype ControlSize = 'sm' | 'md' | 'lg';\n\nexport interface TextareaProps\n  extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'dangerouslySetInnerHTML'> {\n  sdk: SmartSellSDK;\n  label?: string;\n  hint?: string;\n  error?: string;\n  controlSize?: ControlSize;\n}\n\nconst getPadding = (size: ControlSize): string => {\n  if (size === 'sm') return '10px 12px';\n  if (size === 'lg') return '16px 18px';\n  return '13px 16px';\n};\n\nexport function Textarea({\n  sdk,\n  label,\n  hint,\n  error,\n  controlSize = 'md',\n  id,\n  disabled,\n  style,\n  rows = 5,\n  ...rest\n}: TextareaProps) {\n  const { theme, borderSoft, focusRing, surfaceMuted } = useUiKitTheme(sdk);\n\n  const textareaStyle: CSSProperties = {\n    width: '100%',\n    borderRadius: 16,\n    border: `1px solid ${error ? theme.colors.negative : borderSoft}`,\n    padding: getPadding(controlSize),\n    outline: 'none',\n    color: theme.colors.onSurface,\n    backgroundColor: disabled ? surfaceMuted : theme.colors.surface,\n    boxShadow: error ? `0 0 0 3px ${withAlpha(theme.colors.negative, 0.12)}` : `0 0 0 0 ${focusRing}`,\n    transition: 'border-color 160ms ease, box-shadow 160ms ease, background-color 160ms ease',\n    resize: 'vertical',\n    ...style,\n  };\n\n  const textarea = (\n    <textarea {...rest} id={id} disabled={disabled} rows={rows} style={textareaStyle} />\n  );\n\n  if (!label && !hint && !error) {\n    return textarea;\n  }\n\n  return (\n    <Field sdk={sdk} label={label} hint={hint} error={error} htmlFor={id}>\n      {textarea}\n    </Field>\n  );\n}"],"mappings":"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","names":["import_smartsell_sales_sdk","import_smartsell_sales_sdk","import_jsx_runtime","import_react","import_smartsell_sales_sdk","import_react","import_smartsell_sales_sdk","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","import_smartsell_sales_sdk","import_jsx_runtime","import_smartsell_sales_sdk","import_jsx_runtime","getPadding","import_smartsell_sales_sdk","import_jsx_runtime","getPadding"]}

package/dist/index.d.cts

@@ -0,0 +1,141 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ButtonHTMLAttributes, ReactNode, HTMLAttributes, CSSProperties, InputHTMLAttributes, SelectHTMLAttributes, TextareaHTMLAttributes } from 'react';
+import { SmartSellSDK, SalesTheme } from 'smartsell-sales-sdk';
+
+type ButtonVariant = 'solid' | 'outline' | 'ghost';
+type ButtonTone = 'primary' | 'secondary' | 'neutral' | 'danger';
+type ButtonSize = 'sm' | 'md' | 'lg';
+interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'dangerouslySetInnerHTML'> {
+    sdk: SmartSellSDK;
+    variant?: ButtonVariant;
+    tone?: ButtonTone;
+    size?: ButtonSize;
+    fullWidth?: boolean;
+    leadingIcon?: ReactNode;
+    trailingIcon?: ReactNode;
+}
+declare function Button({ sdk, variant, tone, size, fullWidth, leadingIcon, trailingIcon, children, disabled, style, type, ...rest }: ButtonProps): react_jsx_runtime.JSX.Element;
+
+type CardTone = 'default' | 'primary' | 'secondary' | 'warning';
+interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'dangerouslySetInnerHTML' | 'title'> {
+    sdk: SmartSellSDK;
+    children: ReactNode;
+    eyebrow?: ReactNode;
+    title?: ReactNode;
+    action?: ReactNode;
+    tone?: CardTone;
+    padded?: boolean;
+}
+declare function Card({ sdk, children, eyebrow, title, action, tone, padded, style, ...rest }: CardProps): react_jsx_runtime.JSX.Element;
+
+interface ModalSlotIds {
+    header: string;
+    body: string;
+    footer: string;
+}
+interface ModalSlotContext<TPayload = unknown> {
+    title: string;
+    description?: string;
+    payload?: TPayload;
+    close: () => void;
+    confirm?: () => void;
+    confirmLabel: string;
+    cancelLabel: string;
+    isOpen: boolean;
+    isBusy: boolean;
+}
+interface ComposableModalProps<TPayload = unknown> {
+    sdk: SmartSellSDK;
+    isOpen: boolean;
+    onClose: () => void;
+    title: string;
+    description?: string;
+    slotBaseId: string;
+    payload?: TPayload;
+    onConfirm?: () => void;
+    confirmLabel?: string;
+    cancelLabel?: string;
+    isBusy?: boolean;
+    closeOnBackdrop?: boolean;
+    closeOnEscape?: boolean;
+    hideDefaultFooter?: boolean;
+    maxWidth?: number | string;
+    headerFallback?: ReactNode;
+    footerFallback?: ReactNode;
+    children?: ReactNode;
+}
+declare const createModalSlotIds: (slotBaseId: string) => ModalSlotIds;
+declare function ComposableModal<TPayload = unknown>({ sdk, isOpen, onClose, title, description, slotBaseId, payload, onConfirm, confirmLabel, cancelLabel, isBusy, closeOnBackdrop, closeOnEscape, hideDefaultFooter, maxWidth, headerFallback, footerFallback, children, }: ComposableModalProps<TPayload>): react_jsx_runtime.JSX.Element;
+
+interface FieldProps {
+    sdk: SmartSellSDK;
+    label?: ReactNode;
+    hint?: ReactNode;
+    error?: ReactNode;
+    htmlFor?: string;
+    required?: boolean;
+    children: ReactNode;
+    style?: CSSProperties;
+}
+declare function Field({ sdk, label, hint, error, htmlFor, required, children, style, }: FieldProps): react_jsx_runtime.JSX.Element;
+
+type ControlSize$2 = 'sm' | 'md' | 'lg';
+interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'dangerouslySetInnerHTML' | 'size'> {
+    sdk: SmartSellSDK;
+    label?: string;
+    hint?: string;
+    error?: string;
+    controlSize?: ControlSize$2;
+}
+declare function Input({ sdk, label, hint, error, controlSize, id, disabled, style, ...rest }: InputProps): react_jsx_runtime.JSX.Element;
+
+interface ModalProps {
+    sdk: SmartSellSDK;
+    isOpen: boolean;
+    onClose: () => void;
+    children: ReactNode;
+    footer?: ReactNode;
+    title?: ReactNode;
+    description?: ReactNode;
+    headerContent?: ReactNode;
+    maxWidth?: number | string;
+    closeOnBackdrop?: boolean;
+    closeOnEscape?: boolean;
+    hideCloseButton?: boolean;
+    contentStyle?: CSSProperties;
+}
+declare function Modal({ sdk, isOpen, onClose, children, footer, title, description, headerContent, maxWidth, closeOnBackdrop, closeOnEscape, hideCloseButton, contentStyle, }: ModalProps): react_jsx_runtime.JSX.Element | null;
+
+type ControlSize$1 = 'sm' | 'md' | 'lg';
+interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'dangerouslySetInnerHTML' | 'size'> {
+    sdk: SmartSellSDK;
+    label?: string;
+    hint?: string;
+    error?: string;
+    controlSize?: ControlSize$1;
+}
+declare function Select({ sdk, label, hint, error, controlSize, id, disabled, style, children, ...rest }: SelectProps): react_jsx_runtime.JSX.Element;
+
+type ControlSize = 'sm' | 'md' | 'lg';
+interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'dangerouslySetInnerHTML'> {
+    sdk: SmartSellSDK;
+    label?: string;
+    hint?: string;
+    error?: string;
+    controlSize?: ControlSize;
+}
+declare function Textarea({ sdk, label, hint, error, controlSize, id, disabled, style, rows, ...rest }: TextareaProps): react_jsx_runtime.JSX.Element;
+
+interface UiKitThemeTokens {
+    theme: SalesTheme;
+    borderSoft: string;
+    borderStrong: string;
+    surfaceMuted: string;
+    surfaceRaised: string;
+    overlay: string;
+    focusRing: string;
+    mutedText: string;
+}
+declare function useUiKitTheme(sdk: SmartSellSDK): UiKitThemeTokens;
+
+export { Button, type ButtonProps, Card, type CardProps, ComposableModal, type ComposableModalProps, Field, type FieldProps, Input, type InputProps, Modal, type ModalProps, type ModalSlotContext, type ModalSlotIds, Select, type SelectProps, Textarea, type TextareaProps, type UiKitThemeTokens, createModalSlotIds, useUiKitTheme };

package/dist/index.d.ts

@@ -0,0 +1,141 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ButtonHTMLAttributes, ReactNode, HTMLAttributes, CSSProperties, InputHTMLAttributes, SelectHTMLAttributes, TextareaHTMLAttributes } from 'react';
+import { SmartSellSDK, SalesTheme } from 'smartsell-sales-sdk';
+
+type ButtonVariant = 'solid' | 'outline' | 'ghost';
+type ButtonTone = 'primary' | 'secondary' | 'neutral' | 'danger';
+type ButtonSize = 'sm' | 'md' | 'lg';
+interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'dangerouslySetInnerHTML'> {
+    sdk: SmartSellSDK;
+    variant?: ButtonVariant;
+    tone?: ButtonTone;
+    size?: ButtonSize;
+    fullWidth?: boolean;
+    leadingIcon?: ReactNode;
+    trailingIcon?: ReactNode;
+}
+declare function Button({ sdk, variant, tone, size, fullWidth, leadingIcon, trailingIcon, children, disabled, style, type, ...rest }: ButtonProps): react_jsx_runtime.JSX.Element;
+
+type CardTone = 'default' | 'primary' | 'secondary' | 'warning';
+interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'dangerouslySetInnerHTML' | 'title'> {
+    sdk: SmartSellSDK;
+    children: ReactNode;
+    eyebrow?: ReactNode;
+    title?: ReactNode;
+    action?: ReactNode;
+    tone?: CardTone;
+    padded?: boolean;
+}
+declare function Card({ sdk, children, eyebrow, title, action, tone, padded, style, ...rest }: CardProps): react_jsx_runtime.JSX.Element;
+
+interface ModalSlotIds {
+    header: string;
+    body: string;
+    footer: string;
+}
+interface ModalSlotContext<TPayload = unknown> {
+    title: string;
+    description?: string;
+    payload?: TPayload;
+    close: () => void;
+    confirm?: () => void;
+    confirmLabel: string;
+    cancelLabel: string;
+    isOpen: boolean;
+    isBusy: boolean;
+}
+interface ComposableModalProps<TPayload = unknown> {
+    sdk: SmartSellSDK;
+    isOpen: boolean;
+    onClose: () => void;
+    title: string;
+    description?: string;
+    slotBaseId: string;
+    payload?: TPayload;
+    onConfirm?: () => void;
+    confirmLabel?: string;
+    cancelLabel?: string;
+    isBusy?: boolean;
+    closeOnBackdrop?: boolean;
+    closeOnEscape?: boolean;
+    hideDefaultFooter?: boolean;
+    maxWidth?: number | string;
+    headerFallback?: ReactNode;
+    footerFallback?: ReactNode;
+    children?: ReactNode;
+}
+declare const createModalSlotIds: (slotBaseId: string) => ModalSlotIds;
+declare function ComposableModal<TPayload = unknown>({ sdk, isOpen, onClose, title, description, slotBaseId, payload, onConfirm, confirmLabel, cancelLabel, isBusy, closeOnBackdrop, closeOnEscape, hideDefaultFooter, maxWidth, headerFallback, footerFallback, children, }: ComposableModalProps<TPayload>): react_jsx_runtime.JSX.Element;
+
+interface FieldProps {
+    sdk: SmartSellSDK;
+    label?: ReactNode;
+    hint?: ReactNode;
+    error?: ReactNode;
+    htmlFor?: string;
+    required?: boolean;
+    children: ReactNode;
+    style?: CSSProperties;
+}
+declare function Field({ sdk, label, hint, error, htmlFor, required, children, style, }: FieldProps): react_jsx_runtime.JSX.Element;
+
+type ControlSize$2 = 'sm' | 'md' | 'lg';
+interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'dangerouslySetInnerHTML' | 'size'> {
+    sdk: SmartSellSDK;
+    label?: string;
+    hint?: string;
+    error?: string;
+    controlSize?: ControlSize$2;
+}
+declare function Input({ sdk, label, hint, error, controlSize, id, disabled, style, ...rest }: InputProps): react_jsx_runtime.JSX.Element;
+
+interface ModalProps {
+    sdk: SmartSellSDK;
+    isOpen: boolean;
+    onClose: () => void;
+    children: ReactNode;
+    footer?: ReactNode;
+    title?: ReactNode;
+    description?: ReactNode;
+    headerContent?: ReactNode;
+    maxWidth?: number | string;
+    closeOnBackdrop?: boolean;
+    closeOnEscape?: boolean;
+    hideCloseButton?: boolean;
+    contentStyle?: CSSProperties;
+}
+declare function Modal({ sdk, isOpen, onClose, children, footer, title, description, headerContent, maxWidth, closeOnBackdrop, closeOnEscape, hideCloseButton, contentStyle, }: ModalProps): react_jsx_runtime.JSX.Element | null;
+
+type ControlSize$1 = 'sm' | 'md' | 'lg';
+interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'dangerouslySetInnerHTML' | 'size'> {
+    sdk: SmartSellSDK;
+    label?: string;
+    hint?: string;
+    error?: string;
+    controlSize?: ControlSize$1;
+}
+declare function Select({ sdk, label, hint, error, controlSize, id, disabled, style, children, ...rest }: SelectProps): react_jsx_runtime.JSX.Element;
+
+type ControlSize = 'sm' | 'md' | 'lg';
+interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'dangerouslySetInnerHTML'> {
+    sdk: SmartSellSDK;
+    label?: string;
+    hint?: string;
+    error?: string;
+    controlSize?: ControlSize;
+}
+declare function Textarea({ sdk, label, hint, error, controlSize, id, disabled, style, rows, ...rest }: TextareaProps): react_jsx_runtime.JSX.Element;
+
+interface UiKitThemeTokens {
+    theme: SalesTheme;
+    borderSoft: string;
+    borderStrong: string;
+    surfaceMuted: string;
+    surfaceRaised: string;
+    overlay: string;
+    focusRing: string;
+    mutedText: string;
+}
+declare function useUiKitTheme(sdk: SmartSellSDK): UiKitThemeTokens;
+
+export { Button, type ButtonProps, Card, type CardProps, ComposableModal, type ComposableModalProps, Field, type FieldProps, Input, type InputProps, Modal, type ModalProps, type ModalSlotContext, type ModalSlotIds, Select, type SelectProps, Textarea, type TextareaProps, type UiKitThemeTokens, createModalSlotIds, useUiKitTheme };