@mario_hahn/jumpy-ui 0.8.1 → 0.10.0

package/dist/theme.js

@@ -28,7 +28,7 @@ import {
   textStyleValue,
   themeToCSSVariables,
   useJumpyTheme
-} from "./chunk-B7QIDGY7.js";
+} from "./chunk-LORNGSIB.js";
 export {
   JumpyAnimation,
   JumpyAnimationDelay,

package/index.d.ts

@@ -1,4 +1,4 @@
-import type { AnchorHTMLAttributes, ButtonHTMLAttributes, HTMLAttributes, InputHTMLAttributes, ReactNode, Ref, TdHTMLAttributes, TextareaHTMLAttributes, ThHTMLAttributes } from 'react'
+import type { AnchorHTMLAttributes, CSSProperties, ElementType, ButtonHTMLAttributes, HTMLAttributes, InputHTMLAttributes, ReactNode, Ref, TdHTMLAttributes, TextareaHTMLAttributes, ThHTMLAttributes } from 'react'
 export type { JumpyTheme, JumpySizeToken } from './theme.js'
 type ElementTag = keyof HTMLElementTagNameMap
 type JumpResponsiveValue<T> = T | { small?: T; medium?: T; large?: T; xLarge?: T }
@@ -51,7 +51,7 @@ export {
 export declare function JumpBackground(props: { snow?: boolean }): ReactNode
 export declare function JumpBadge(props: HTMLAttributes<HTMLElement> & { as?: ElementTag; size?: 'xSmall' | 'small' | 'medium'; status?: 'regular' | 'positive' | 'warning' | 'alarm' | 'active'; hidden?: boolean; children?: ReactNode }): ReactNode
 export declare function BrandMark(props: { compact?: boolean; label?: string }): ReactNode
-export declare function JumpCard(props: HTMLAttributes<HTMLElement> & { as?: ElementTag; children: ReactNode; variant?: 'filled' | 'outlined'; interactive?: boolean; selected?: boolean; disabled?: boolean; dragged?: boolean; innerClasses?: JumpCardInnerClasses }): ReactNode
+export declare function JumpCard(props: HTMLAttributes<HTMLElement> & { ref?: Ref<HTMLElement>; as?: ElementTag; children: ReactNode; variant?: 'filled' | 'outlined'; interactive?: boolean; selected?: boolean; disabled?: boolean; dragged?: boolean; innerClasses?: JumpCardInnerClasses }): ReactNode
 export declare function JumpGrid(props: HTMLAttributes<HTMLElement> & { as?: ElementTag; columns?: JumpResponsiveValue<number | string>; spacing?: JumpResponsiveValue<JumpGridSpacing>; children?: ReactNode }): ReactNode
 export declare function JumpGridItem(props: HTMLAttributes<HTMLElement> & { as?: ElementTag; span?: JumpResponsiveValue<number>; horizontalPlacement?: 'start' | 'center' | 'end' | 'stretch'; verticalPlacement?: 'start' | 'center' | 'end' | 'stretch'; children?: ReactNode }): ReactNode
 export declare function JumpList(props: HTMLAttributes<HTMLElement> & { as?: ElementTag; children: ReactNode }): ReactNode
@@ -110,6 +110,14 @@ export declare function JumpTableRow(props: HTMLAttributes<HTMLTableRowElement>
 export declare function JumpTableCell(props: Omit<TdHTMLAttributes<HTMLTableCellElement>, 'align'> & { as?: ElementTag; ref?: Ref<HTMLTableCellElement>; selected?: boolean; disabled?: boolean; align?: JumpTableAlign; variant?: 'default' | 'control'; padding?: 'default' | 'none' | 'checkbox'; showHorizontalBorder?: boolean; pinned?: JumpTablePinned; pinnedEdge?: boolean; leading?: ReactNode; trailing?: ReactNode; description?: ReactNode; slots?: { leading?: ReactNode; trailing?: ReactNode; description?: ReactNode }; innerClasses?: JumpTableCellInnerClasses; children?: ReactNode }): ReactNode
 export declare function JumpTableHeaderCell(props: Omit<ThHTMLAttributes<HTMLTableCellElement>, 'align'> & { as?: ElementTag; ref?: Ref<HTMLTableCellElement>; selected?: boolean; disabled?: boolean; align?: JumpTableAlign; variant?: 'default' | 'control'; padding?: 'default' | 'none' | 'checkbox'; showHorizontalBorder?: boolean; pinned?: JumpTablePinned; pinnedEdge?: boolean; sortable?: boolean; sortOrder?: JumpTableSortOrder; onSortChange?: (sortOrder: JumpTableSortOrder) => void; ariaLabels?: { sort?: string | ((sortOrder: JumpTableSortOrder) => string) }; leading?: ReactNode; trailing?: ReactNode; slots?: { leading?: ReactNode; trailing?: ReactNode }; innerClasses?: JumpTableCellInnerClasses; children?: ReactNode }): ReactNode
 export declare function JumpSheet(props: HTMLAttributes<HTMLElement> & { visible?: boolean; onVisibleChange?: (visible: boolean) => void; position?: 'top' | 'right' | 'bottom' | 'left'; title?: string; subtitle?: string; footer?: ReactNode; children?: ReactNode }): ReactNode
+export type JumpTopBarLeading = 'menu' | 'back' | ReactNode
+export type JumpTopBarProps = Omit<HTMLAttributes<HTMLElement>, 'title'> & { leading?: JumpTopBarLeading; onMenu?: () => void; onBack?: () => void; menuOpen?: boolean; title?: ReactNode; subtitle?: ReactNode; trailing?: ReactNode; sticky?: boolean; ariaLabels?: { menu?: string; back?: string } }
+export declare function JumpTopBar(props: JumpTopBarProps): ReactNode
+export declare function JumpTabBar(props: HTMLAttributes<HTMLElement> & { children: ReactNode }): ReactNode
+export type JumpTabBarItemProps = { as?: ElementType; href?: string; icon?: ReactNode; badge?: ReactNode | number; selected?: boolean; children: ReactNode; className?: string; style?: CSSProperties } & Record<string, unknown>
+export declare function JumpTabBarItem(props: JumpTabBarItemProps): ReactNode
+export type JumpAppShellTopBar = Omit<JumpTopBarProps, 'onMenu' | 'menuOpen'> & { desktop?: boolean }
+export declare function JumpAppShell(props: HTMLAttributes<HTMLDivElement> & { brand?: ReactNode; navigation?: ReactNode; sidebarFooter?: ReactNode; topBar?: JumpAppShellTopBar | null; tabBar?: ReactNode; hideTabBar?: boolean; breakpoint?: number; sidebarWidth?: number | string; navigationOpen?: boolean; defaultNavigationOpen?: boolean; onNavigationOpenChange?: (open: boolean) => void; ariaLabels?: { navigation?: string; openNavigation?: string; closeNavigation?: string; back?: string }; children?: ReactNode }): ReactNode
 export declare function JumpSectionHeader(props: HTMLAttributes<HTMLElement> & { as?: ElementTag; variant?: 'regular' | 'prominent'; description?: ReactNode; children: ReactNode }): ReactNode
 export declare function JumpSectionFooter(props: HTMLAttributes<HTMLElement> & { as?: ElementTag; children: ReactNode }): ReactNode
 export declare function JumpTag(props: HTMLAttributes<HTMLSpanElement> & { size?: 'small' | 'medium'; status?: 'regular' | 'positive' | 'warning' | 'alarm'; disabled?: boolean; children: ReactNode }): ReactNode
@@ -119,7 +127,7 @@ export declare function JumpSwitch(props: Omit<InputHTMLAttributes<HTMLInputElem
 export declare function JumpRadioGroup(props: HTMLAttributes<HTMLDivElement> & { name?: string; value?: string; defaultValue?: string; onValueChange?: (value: string) => void; disabled?: boolean; readOnly?: boolean; direction?: 'horizontal' | 'vertical'; innerClasses?: JumpRadioInnerClasses; options: Array<{ value: string; label: ReactNode; disabled?: boolean }> }): ReactNode
 export type JumpDropdownItemValue = string | number
 export interface JumpDropdownItem<TValue extends JumpDropdownItemValue = JumpDropdownItemValue> { label: string; value: TValue; children?: Array<JumpDropdownItem<TValue>>; metadata?: Record<string, unknown>; disabled?: boolean }
-export declare function JumpDropdown<TValue extends JumpDropdownItemValue = JumpDropdownItemValue>(props: Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange'> & { label?: string; hint?: string; value?: Array<TValue>; defaultValue?: Array<TValue>; open?: boolean; onChange?: (value: Array<TValue>) => void; onOpenChange?: (open: boolean) => void; items?: Array<JumpDropdownItem<TValue>>; placeholder?: string; disabled?: boolean; multiple?: boolean; searchable?: boolean; renderTrigger?: (selectedValues: Array<TValue>, isOpen: boolean) => ReactNode; renderItem?: (option: JumpDropdownItem<TValue>, selected: boolean, listItemProps: Record<string, unknown>) => ReactNode; inputRef?: import('react').Ref<HTMLInputElement>; status?: 'regular' | 'alarm'; error?: boolean; hideClearIcon?: boolean; onClear?: () => void }): ReactNode
+export declare function JumpDropdown<TValue extends JumpDropdownItemValue = JumpDropdownItemValue>(props: Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange'> & { label?: string; hint?: string; value?: Array<TValue>; defaultValue?: Array<TValue>; open?: boolean; onChange?: (value: Array<TValue>) => void; onOpenChange?: (open: boolean) => void; items?: Array<JumpDropdownItem<TValue>>; placeholder?: string; popupMinWidth?: number; disabled?: boolean; multiple?: boolean; searchable?: boolean; renderTrigger?: (selectedValues: Array<TValue>, isOpen: boolean) => ReactNode; renderItem?: (option: JumpDropdownItem<TValue>, selected: boolean, listItemProps: Record<string, unknown>) => ReactNode; inputRef?: import('react').Ref<HTMLInputElement>; status?: 'regular' | 'alarm'; error?: boolean; hideClearIcon?: boolean; onClear?: () => void }): ReactNode
 export type JumpDateTimeValue = Date | number
 export declare function JumpDatePicker<TValue extends JumpDateTimeValue = Date>(props: Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange'> & { label?: string; hint?: string; value?: TValue | null; defaultValue?: TValue | null; onChange?: (value: TValue | null) => void; open?: boolean; onOpenChange?: (open: boolean) => void; format?: string | string[]; minDate?: TValue; maxDate?: TValue; disabledDates?: TValue[]; isDateDisabled?: (date: Date) => boolean; labels?: { cancelButton?: string; applyButton?: string }; disabled?: boolean; readOnly?: boolean; status?: 'regular' | 'alarm'; error?: boolean; hideClearIcon?: boolean; onClear?: () => void }): ReactNode
 export declare function JumpTimePicker<TValue extends JumpDateTimeValue = Date>(props: Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange'> & { label?: string; hint?: string; value?: TValue | null; defaultValue?: TValue | null; onChange?: (value: TValue | null) => void; open?: boolean; onOpenChange?: (open: boolean) => void; format?: string; twentyFourHours?: boolean; labels?: { cancelButton?: string; applyButton?: string }; disabled?: boolean; readOnly?: boolean; status?: 'regular' | 'alarm'; error?: boolean; hideClearIcon?: boolean; onClear?: () => void }): ReactNode
@@ -132,6 +140,23 @@ export declare function JumpButton(props: JumpPolymorphicButtonAttributes & { as
 export declare function JumpIconButton(props: JumpPolymorphicButtonAttributes & { as?: ElementTag; variant?: 'primary' | 'secondary' | 'tertiary' | 'borderless'; status?: 'regular' | 'alarm'; alternateHover?: boolean; elevated?: boolean }): ReactNode
 export declare function JumpLinkButton(props: AnchorHTMLAttributes<HTMLAnchorElement> & { href: string; variant?: 'primary' | 'secondary' | 'tertiary' | 'borderless'; status?: 'regular' | 'alarm'; leadingIcon?: ReactNode; trailingIcon?: ReactNode }): ReactNode
 export declare const JumpInput: import('react').ForwardRefExoticComponent<InputHTMLAttributes<HTMLInputElement> & { status?: JumpInputStatus } & import('react').RefAttributes<HTMLInputElement>>
+export type JumpTokenInputToken = { type: 'token'; id: string; value: string; label: string }
+export type JumpTokenInputValue = Array<{ type: 'text'; text: string } | JumpTokenInputToken>
+export interface JumpTokenInputHandle {
+  focus(): void
+  clear(): void
+  insertToken(token: Omit<JumpTokenInputToken, 'type' | 'id'> & { id?: string }): void
+  insertText(text: string): void
+  removeToken(id: string): void
+}
+export declare function JumpTokenInput(props: Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue' | 'children'> & {
+  ref?: Ref<JumpTokenInputHandle>; value?: JumpTokenInputValue; defaultValue?: JumpTokenInputValue;
+  onChange?: (value: JumpTokenInputValue) => void;
+  onTokenInsert?: (token: JumpTokenInputToken) => void; onTokenRemove?: (token: JumpTokenInputToken) => void;
+  multiline?: boolean; minRows?: number; maxRows?: number; hideClearIcon?: boolean; onClear?: () => void;
+  label?: string; hint?: string; placeholder?: string; status?: JumpInputStatus; error?: boolean;
+  disabled?: boolean; readOnly?: boolean;
+}): ReactNode
 export declare function JumpTextarea(props: TextareaHTMLAttributes<HTMLTextAreaElement> & { status?: JumpInputStatus }): ReactNode
 export declare function JumpBaseInput(props: { label?: string; hint?: string; children: ReactNode; className?: string; 'data-testid'?: string; labelTestId?: string; leading?: ReactNode; trailing?: ReactNode; status?: JumpInputStatus; error?: boolean; hideClearIcon?: boolean; showCharCount?: boolean; onClear?: () => void; slots?: JumpBaseInputSlots }): ReactNode
 export declare function JumpField(props: { label?: string; hint?: string; children: ReactNode; className?: string; 'data-testid'?: string; labelTestId?: string; leading?: ReactNode; trailing?: ReactNode; status?: JumpInputStatus; error?: boolean; hideClearIcon?: boolean; showCharCount?: boolean; onClear?: () => void; slots?: JumpBaseInputSlots }): ReactNode

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@mario_hahn/jumpy-ui",
-  "version": "0.8.1",
+  "version": "0.10.0",
   "license": "MIT",
   "type": "module",
   "scripts": {
     "prebuild": "node --input-type=module -e \"import { rmSync } from 'node:fs'; rmSync('dist', { recursive: true, force: true })\"",
-    "build": "esbuild index.js theme.js utils.js jumpy-theme-inventory.js --outdir=dist --format=esm --splitting --jsx=automatic --loader:.js=jsx --bundle --external:react --external:react/jsx-runtime --external:@floating-ui/react",
+    "build": "esbuild index.js theme.js utils.js jumpy-theme-inventory.js --outdir=dist --format=esm --splitting --jsx=automatic --loader:.js=jsx --bundle --external:react --external:react/jsx-runtime --external:react-dom --external:lexical --external:@lexical/* --external:@floating-ui/react",
     "prepack": "npm run build"
   },
   "files": [
@@ -45,7 +45,10 @@
     "url": "git+https://github.com/mariohahn/jumpy-ui.git"
   },
   "dependencies": {
-    "@floating-ui/react": "^0.27.20"
+    "@floating-ui/react": "^0.27.20",
+    "@lexical/clipboard": "^0.52.0",
+    "@lexical/react": "^0.52.0",
+    "lexical": "^0.52.0"
   },
   "devDependencies": {
     "esbuild": "^0.28.2"