@objectifthunes/whiteboard 0.2.7 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +24 -1226
- package/dist/index.d.ts +32 -32
- package/dist/index.js +667 -697
- package/dist/whiteboard.css +8 -24
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -28,14 +28,6 @@ declare interface AlertProps extends HTMLAttributes<HTMLParagraphElement> {
|
|
|
28
28
|
|
|
29
29
|
declare type AlertTone = 'error' | 'muted' | 'info' | 'success';
|
|
30
30
|
|
|
31
|
-
export declare function AssetCardSkeleton(): JSX_2.Element;
|
|
32
|
-
|
|
33
|
-
export declare function AssetTitle({ as, clamp, className, ...props }: AssetTitleProps): ReactElement<any, string | JSXElementConstructor<any>>;
|
|
34
|
-
|
|
35
|
-
declare interface AssetTitleProps extends TypographyProps {
|
|
36
|
-
clamp?: boolean;
|
|
37
|
-
}
|
|
38
|
-
|
|
39
31
|
export declare function AvatarBadge({ className, ...props }: HTMLAttributes<HTMLSpanElement>): JSX_2.Element;
|
|
40
32
|
|
|
41
33
|
export declare function AvatarSkeleton(props: HTMLAttributes<HTMLDivElement>): JSX_2.Element;
|
|
@@ -82,6 +74,24 @@ declare interface CanvasStageProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
82
74
|
hint?: string;
|
|
83
75
|
}
|
|
84
76
|
|
|
77
|
+
/** Generic composed card skeleton — thumb + title + line + optional chips + optional actions. */
|
|
78
|
+
export declare function CardSkeleton({ withThumb, chipCount, actionCount, className, ...props }: CardSkeletonProps): JSX_2.Element;
|
|
79
|
+
|
|
80
|
+
declare interface CardSkeletonProps extends HTMLAttributes<HTMLLIElement> {
|
|
81
|
+
/** Show a thumbnail placeholder at the top of the card. Defaults to true. */
|
|
82
|
+
withThumb?: boolean;
|
|
83
|
+
/** Number of chip placeholders shown above the title. */
|
|
84
|
+
chipCount?: number;
|
|
85
|
+
/** Number of action-button placeholders shown at the bottom of the card. */
|
|
86
|
+
actionCount?: number;
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
export declare function CardTitle({ as, clamp, className, ...props }: CardTitleProps): ReactElement<any, string | JSXElementConstructor<any>>;
|
|
90
|
+
|
|
91
|
+
declare interface CardTitleProps extends TypographyProps {
|
|
92
|
+
clamp?: boolean;
|
|
93
|
+
}
|
|
94
|
+
|
|
85
95
|
export declare function Chip({ className, ...props }: ChipProps): JSX_2.Element;
|
|
86
96
|
|
|
87
97
|
declare type ChipProps = HTMLAttributes<HTMLSpanElement>;
|
|
@@ -312,6 +322,7 @@ export declare class PanelErrorBoundary extends Component<Props_6, State> {
|
|
|
312
322
|
render(): string | number | boolean | JSX_2.Element | Iterable<ReactNode> | null | undefined;
|
|
313
323
|
}
|
|
314
324
|
|
|
325
|
+
/** Skeleton for a panel body containing inputs + an optional submit button. */
|
|
315
326
|
export declare function PanelFormSkeleton({ inputs, showButton, className, ...props }: PanelFormSkeletonProps): JSX_2.Element;
|
|
316
327
|
|
|
317
328
|
declare interface PanelFormSkeletonProps extends HTMLAttributes<HTMLDivElement> {
|
|
@@ -357,24 +368,23 @@ declare interface PickerCardProps extends HTMLAttributes<HTMLElement> {
|
|
|
357
368
|
}
|
|
358
369
|
|
|
359
370
|
/**
|
|
360
|
-
*
|
|
361
|
-
* Replaces `<List className="picker-grid picker-grid--elements">`, etc.
|
|
371
|
+
* Responsive grid for picker cards. Uses `repeat(auto-fill, minmax(minItemWidth, 1fr))`.
|
|
362
372
|
*/
|
|
363
|
-
export declare function PickerGrid({
|
|
373
|
+
export declare function PickerGrid({ minItemWidth, className, style, ...props }: PickerGridProps): JSX_2.Element;
|
|
364
374
|
|
|
365
375
|
declare interface PickerGridProps extends HTMLAttributes<HTMLUListElement> {
|
|
366
|
-
|
|
376
|
+
/** Minimum width (px) of each cell. The grid auto-fills as many columns as fit. */
|
|
377
|
+
minItemWidth?: number;
|
|
367
378
|
}
|
|
368
379
|
|
|
369
|
-
export declare function PickerGridSkeleton({ count,
|
|
380
|
+
export declare function PickerGridSkeleton({ count, minItemWidth }: PickerGridSkeletonProps): JSX_2.Element;
|
|
370
381
|
|
|
371
382
|
declare interface PickerGridSkeletonProps {
|
|
372
383
|
count?: number;
|
|
373
|
-
|
|
384
|
+
/** Minimum width (px) per cell — should match the real grid for layout stability. */
|
|
385
|
+
minItemWidth?: number;
|
|
374
386
|
}
|
|
375
387
|
|
|
376
|
-
declare type PickerGridVariant = 'elements' | 'characters' | 'library';
|
|
377
|
-
|
|
378
388
|
export declare function Pill({ tone, className, ...props }: PillProps): JSX_2.Element;
|
|
379
389
|
|
|
380
390
|
declare interface PillProps extends HTMLAttributes<HTMLSpanElement> {
|
|
@@ -469,9 +479,11 @@ declare type SkeletonRadius = 'sm' | 'md' | 'pill';
|
|
|
469
479
|
export declare function snapToWhiteboardGrid(value: number): number;
|
|
470
480
|
|
|
471
481
|
/**
|
|
472
|
-
*
|
|
473
|
-
*
|
|
474
|
-
*
|
|
482
|
+
* Two- or three-column grid for media + content (+ actions) rows.
|
|
483
|
+
*
|
|
484
|
+
* - `media-content` — fixed media column + flexible content column.
|
|
485
|
+
* - `single` — one column (use as the small-screen fallback).
|
|
486
|
+
* - `media-content-actions` — auto media + flexible content + auto actions.
|
|
475
487
|
*/
|
|
476
488
|
export declare function SplitLayout({ variant, className, ...props }: SplitLayoutProps): JSX_2.Element;
|
|
477
489
|
|
|
@@ -479,7 +491,7 @@ declare interface SplitLayoutProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
479
491
|
variant: SplitLayoutVariant;
|
|
480
492
|
}
|
|
481
493
|
|
|
482
|
-
declare type SplitLayoutVariant = '
|
|
494
|
+
declare type SplitLayoutVariant = 'media-content' | 'single' | 'media-content-actions';
|
|
483
495
|
|
|
484
496
|
export declare function Stack({ as, size, className, ...props }: StackProps): ReactElement<any, string | JSXElementConstructor<any>>;
|
|
485
497
|
|
|
@@ -494,10 +506,6 @@ declare interface State {
|
|
|
494
506
|
error: Error | null;
|
|
495
507
|
}
|
|
496
508
|
|
|
497
|
-
export declare function StoryCardSkeleton(): JSX_2.Element;
|
|
498
|
-
|
|
499
|
-
export declare function StoryTitle({ as, className, ...props }: TypographyProps): ReactElement<any, string | JSXElementConstructor<any>>;
|
|
500
|
-
|
|
501
509
|
/**
|
|
502
510
|
* A horizontal wrapping row for chips/tags/pills/small items.
|
|
503
511
|
* Replaces `<div className="element-tags-row">`, `<div className="chip-row">`,
|
|
@@ -549,14 +557,6 @@ export declare function usePanelRect(initial: {
|
|
|
549
557
|
y: number;
|
|
550
558
|
}): MutableRefObject<PanelRect>;
|
|
551
559
|
|
|
552
|
-
export declare function UserCardSkeleton(): JSX_2.Element;
|
|
553
|
-
|
|
554
|
-
export declare function UserListSkeleton({ count }: UserListSkeletonProps): JSX_2.Element;
|
|
555
|
-
|
|
556
|
-
declare interface UserListSkeletonProps {
|
|
557
|
-
count?: number;
|
|
558
|
-
}
|
|
559
|
-
|
|
560
560
|
export declare function useWhiteboardLayout<T extends WidthMap>({ widths, startX, y, gap, }: UseWhiteboardLayoutOptions<T>): {
|
|
561
561
|
layout: {
|
|
562
562
|
startX: number;
|