@dxos/react-ui 0.3.9-main.915c0ba → 0.3.9-main.9c4408c

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.
Files changed (101) hide show
  1. package/dist/lib/browser/index.mjs +275 -390
  2. package/dist/lib/browser/index.mjs.map +4 -4
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/types/src/components/Avatars/Avatar.stories.d.ts +1 -0
  5. package/dist/types/src/components/Avatars/Avatar.stories.d.ts.map +1 -1
  6. package/dist/types/src/components/Avatars/AvatarGroup.stories.d.ts +1 -0
  7. package/dist/types/src/components/Avatars/AvatarGroup.stories.d.ts.map +1 -1
  8. package/dist/types/src/components/Breadcrumb/Breadcrumb.stories.d.ts +1 -0
  9. package/dist/types/src/components/Breadcrumb/Breadcrumb.stories.d.ts.map +1 -1
  10. package/dist/types/src/components/Buttons/Button.stories.d.ts +1 -0
  11. package/dist/types/src/components/Buttons/Button.stories.d.ts.map +1 -1
  12. package/dist/types/src/components/Buttons/Toggle.stories.d.ts +1 -0
  13. package/dist/types/src/components/Buttons/Toggle.stories.d.ts.map +1 -1
  14. package/dist/types/src/components/Buttons/ToggleGroup.stories.d.ts +1 -0
  15. package/dist/types/src/components/Buttons/ToggleGroup.stories.d.ts.map +1 -1
  16. package/dist/types/src/components/Dialogs/AlertDialog.stories.d.ts +1 -0
  17. package/dist/types/src/components/Dialogs/AlertDialog.stories.d.ts.map +1 -1
  18. package/dist/types/src/components/Dialogs/Dialog.stories.d.ts +1 -0
  19. package/dist/types/src/components/Dialogs/Dialog.stories.d.ts.map +1 -1
  20. package/dist/types/src/components/DropdownMenu/DropdownMenu.stories.d.ts +1 -0
  21. package/dist/types/src/components/DropdownMenu/DropdownMenu.stories.d.ts.map +1 -1
  22. package/dist/types/src/components/Input/Input.d.ts +2 -2
  23. package/dist/types/src/components/Input/Input.d.ts.map +1 -1
  24. package/dist/types/src/components/Input/Input.stories.d.ts +2 -1
  25. package/dist/types/src/components/Input/Input.stories.d.ts.map +1 -1
  26. package/dist/types/src/components/Link/Link.stories.d.ts.map +1 -1
  27. package/dist/types/src/components/Lists/List.stories.d.ts +1 -0
  28. package/dist/types/src/components/Lists/List.stories.d.ts.map +1 -1
  29. package/dist/types/src/components/Lists/Tree.stories.d.ts +1 -0
  30. package/dist/types/src/components/Lists/Tree.stories.d.ts.map +1 -1
  31. package/dist/types/src/components/Main/Main.d.ts +2 -2
  32. package/dist/types/src/components/Main/Main.stories.d.ts +1 -0
  33. package/dist/types/src/components/Main/Main.stories.d.ts.map +1 -1
  34. package/dist/types/src/components/Message/Message.stories.d.ts +1 -0
  35. package/dist/types/src/components/Message/Message.stories.d.ts.map +1 -1
  36. package/dist/types/src/components/Popover/Popover.stories.d.ts +6 -0
  37. package/dist/types/src/components/Popover/Popover.stories.d.ts.map +1 -1
  38. package/dist/types/src/components/ScrollArea/ScrollArea.stories.d.ts +6 -0
  39. package/dist/types/src/components/ScrollArea/ScrollArea.stories.d.ts.map +1 -1
  40. package/dist/types/src/components/Select/Select.stories.d.ts +6 -0
  41. package/dist/types/src/components/Select/Select.stories.d.ts.map +1 -1
  42. package/dist/types/src/components/Status/Status.stories.d.ts +6 -0
  43. package/dist/types/src/components/Status/Status.stories.d.ts.map +1 -1
  44. package/dist/types/src/components/Tag/Tag.stories.d.ts.map +1 -1
  45. package/dist/types/src/components/Toast/Toast.stories.d.ts +6 -0
  46. package/dist/types/src/components/Toast/Toast.stories.d.ts.map +1 -1
  47. package/dist/types/src/components/Toolbar/Toolbar.stories.d.ts +6 -0
  48. package/dist/types/src/components/Toolbar/Toolbar.stories.d.ts.map +1 -1
  49. package/dist/types/src/components/Tooltip/Tooltip.stories.d.ts +6 -0
  50. package/dist/types/src/components/Tooltip/Tooltip.stories.d.ts.map +1 -1
  51. package/dist/types/src/components/index.d.ts +0 -1
  52. package/dist/types/src/components/index.d.ts.map +1 -1
  53. package/dist/types/src/playground/Controls.stories.d.ts +6 -0
  54. package/dist/types/src/playground/Controls.stories.d.ts.map +1 -1
  55. package/dist/types/src/playground/Surfaces.stories.d.ts +6 -0
  56. package/dist/types/src/playground/Surfaces.stories.d.ts.map +1 -1
  57. package/dist/types/src/testing/decorators/index.d.ts +2 -0
  58. package/dist/types/src/testing/decorators/index.d.ts.map +1 -0
  59. package/dist/types/src/testing/decorators/with-theme.d.ts +3 -0
  60. package/dist/types/src/testing/decorators/with-theme.d.ts.map +1 -0
  61. package/dist/types/src/testing/index.d.ts +2 -0
  62. package/dist/types/src/testing/index.d.ts.map +1 -0
  63. package/package.json +8 -14
  64. package/src/components/Avatars/Avatar.stories.tsx +2 -0
  65. package/src/components/Avatars/AvatarGroup.stories.tsx +2 -0
  66. package/src/components/Breadcrumb/Breadcrumb.stories.tsx +2 -0
  67. package/src/components/Buttons/Button.stories.tsx +2 -0
  68. package/src/components/Buttons/Toggle.stories.tsx +2 -0
  69. package/src/components/Buttons/ToggleGroup.stories.tsx +2 -0
  70. package/src/components/Dialogs/AlertDialog.stories.tsx +2 -0
  71. package/src/components/Dialogs/Dialog.stories.tsx +2 -0
  72. package/src/components/DropdownMenu/DropdownMenu.stories.tsx +2 -0
  73. package/src/components/Input/Input.stories.tsx +21 -2
  74. package/src/components/Input/Input.tsx +3 -1
  75. package/src/components/Link/Link.stories.tsx +2 -0
  76. package/src/components/Lists/List.stories.tsx +2 -0
  77. package/src/components/Lists/Tree.stories.tsx +2 -0
  78. package/src/components/Main/Main.stories.tsx +5 -1
  79. package/src/components/Message/Message.stories.tsx +2 -0
  80. package/src/components/Popover/Popover.stories.tsx +3 -0
  81. package/src/components/ScrollArea/ScrollArea.stories.tsx +3 -0
  82. package/src/components/Select/Select.stories.tsx +3 -0
  83. package/src/components/Status/Status.stories.tsx +3 -0
  84. package/src/components/Tag/Tag.stories.tsx +3 -0
  85. package/src/components/Toast/Toast.stories.tsx +3 -0
  86. package/src/components/Toolbar/Toolbar.stories.tsx +3 -0
  87. package/src/components/Tooltip/Tooltip.stories.tsx +3 -0
  88. package/src/components/index.ts +0 -1
  89. package/src/playground/Controls.stories.tsx +3 -0
  90. package/src/playground/Surfaces.stories.tsx +4 -0
  91. package/src/{components/Card → testing/decorators}/index.ts +1 -1
  92. package/src/testing/decorators/with-theme.ts +22 -0
  93. package/src/testing/index.ts +5 -0
  94. package/dist/types/src/components/Card/Card.d.ts +0 -52
  95. package/dist/types/src/components/Card/Card.d.ts.map +0 -1
  96. package/dist/types/src/components/Card/Card.stories.d.ts +0 -56
  97. package/dist/types/src/components/Card/Card.stories.d.ts.map +0 -1
  98. package/dist/types/src/components/Card/index.d.ts +0 -2
  99. package/dist/types/src/components/Card/index.d.ts.map +0 -1
  100. package/src/components/Card/Card.stories.tsx +0 -220
  101. package/src/components/Card/Card.tsx +0 -147
@@ -7,6 +7,7 @@ import '@dxosTheme';
7
7
  import React from 'react';
8
8
 
9
9
  import { DropdownMenu } from './DropdownMenu';
10
+ import { withTheme } from '../../testing';
10
11
  import { Button } from '../Buttons';
11
12
 
12
13
  const StorybookDropdownMenu = () => {
@@ -92,6 +93,7 @@ const StorybookDropdownMenu = () => {
92
93
 
93
94
  export default {
94
95
  component: StorybookDropdownMenu,
96
+ decorators: [withTheme],
95
97
  };
96
98
 
97
99
  export const Default = {
@@ -6,9 +6,11 @@ import '@dxosTheme';
6
6
 
7
7
  import React from 'react';
8
8
 
9
+ import { baseSurface, chromeSurface, groupSurface, mx, surfaceElevation } from '@dxos/react-ui-theme';
9
10
  import { type MessageValence } from '@dxos/react-ui-types';
10
11
 
11
12
  import { Input } from './Input';
13
+ import { withTheme } from '../../testing';
12
14
 
13
15
  type StoryInputProps = Partial<{
14
16
  label: string;
@@ -22,7 +24,7 @@ type StoryInputProps = Partial<{
22
24
  validationValence: MessageValence;
23
25
  }>;
24
26
 
25
- const StoryInput = ({
27
+ const StoryInputContent = ({
26
28
  type = 'default',
27
29
  label,
28
30
  description,
@@ -32,7 +34,6 @@ const StoryInput = ({
32
34
  validationMessage,
33
35
  ...props
34
36
  }: StoryInputProps) => {
35
- // TODO(thure): Implement
36
37
  return (
37
38
  <Input.Root {...{ validationValence }}>
38
39
  <Input.Label srOnly={labelVisuallyHidden}>{label}</Input.Label>
@@ -53,6 +54,23 @@ const StoryInput = ({
53
54
  );
54
55
  };
55
56
 
57
+ const StoryInput = (props: StoryInputProps) => {
58
+ // TODO(thure): Implement
59
+ return (
60
+ <div className='space-b-4'>
61
+ <div className={mx(baseSurface, 'p-4')}>
62
+ <StoryInputContent {...props} />
63
+ </div>
64
+ <div className={mx(groupSurface, 'p-4 rounded-lg', surfaceElevation({ elevation: 'group' }))}>
65
+ <StoryInputContent {...props} />
66
+ </div>
67
+ <div className={mx(chromeSurface, 'p-4 rounded-lg', surfaceElevation({ elevation: 'chrome' }))}>
68
+ <StoryInputContent {...props} />
69
+ </div>
70
+ </div>
71
+ );
72
+ };
73
+
56
74
  export default {
57
75
  component: StoryInput,
58
76
  // TODO(thure): Refactor
@@ -69,6 +87,7 @@ export default {
69
87
  options: ['default', 'textarea', 'pin'],
70
88
  },
71
89
  },
90
+ decorators: [withTheme],
72
91
  };
73
92
 
74
93
  export const Default = {
@@ -175,11 +175,13 @@ type TextInputProps = InputSharedProps & ThemedClassName<TextInputPrimitiveProps
175
175
  const TextInput = forwardRef<HTMLInputElement, InputScopedProps<TextInputProps>>(
176
176
  ({ __inputScope, classNames, density: propsDensity, elevation: propsElevation, variant, ...props }, forwardedRef) => {
177
177
  const { hasIosKeyboard } = useThemeContext();
178
- const { tx } = useThemeContext();
178
+ const themeContextValue = useThemeContext();
179
179
  const density = useDensityContext(propsDensity);
180
180
  const elevation = useElevationContext(propsElevation);
181
181
  const { validationValence } = useInputContext(INPUT_NAME, __inputScope);
182
182
 
183
+ const { tx } = themeContextValue;
184
+
183
185
  return (
184
186
  <TextInputPrimitive
185
187
  {...props}
@@ -5,9 +5,11 @@
5
5
  import '@dxosTheme';
6
6
 
7
7
  import { Link } from './Link';
8
+ import { withTheme } from '../../testing';
8
9
 
9
10
  export default {
10
11
  component: Link,
12
+ decorators: [withTheme],
11
13
  } as any;
12
14
 
13
15
  export const Default = { args: { children: 'Hello', href: '#' } };
@@ -13,9 +13,11 @@ import React, { type FC, type ReactNode, useState } from 'react';
13
13
  import { getSize, mx, surfaceElevation } from '@dxos/react-ui-theme';
14
14
 
15
15
  import { List, ListItem, type ListProps, type ListScopedProps } from './List';
16
+ import { withTheme } from '../../testing';
16
17
 
17
18
  export default {
18
19
  component: List as FC<ListProps>,
20
+ decorators: [withTheme],
19
21
  };
20
22
 
21
23
  const UniformListItem = ({ id, text }: { id: string; text: string }) => {
@@ -7,6 +7,7 @@ import '@dxosTheme';
7
7
  import React from 'react';
8
8
 
9
9
  import { Tree, TreeItem } from './Tree';
10
+ import { withTheme } from '../../testing';
10
11
 
11
12
  type StorybookTreeProps = {
12
13
  data: any;
@@ -56,6 +57,7 @@ const StorybookTree = ({ data }: StorybookTreeProps) => {
56
57
 
57
58
  export default {
58
59
  component: StorybookTree,
60
+ decorators: [withTheme],
59
61
  };
60
62
 
61
63
  export const Default = {
@@ -7,6 +7,7 @@ import '@dxosTheme';
7
7
  import React from 'react';
8
8
 
9
9
  import { Main, useSidebars } from './Main';
10
+ import { withTheme } from '../../testing';
10
11
  import { Button } from '../Buttons';
11
12
 
12
13
  type StoryMainArgs = {};
@@ -44,7 +45,10 @@ const StoryMain = (_args: StoryMainArgs) => {
44
45
  );
45
46
  };
46
47
 
47
- export default { component: StoryMain };
48
+ export default {
49
+ component: StoryMain,
50
+ decorators: [withTheme],
51
+ };
48
52
 
49
53
  export const Default = {
50
54
  args: {},
@@ -10,6 +10,7 @@ import React from 'react';
10
10
  import { type MessageValence } from '@dxos/react-ui-types';
11
11
 
12
12
  import { Message } from './Message';
13
+ import { withTheme } from '../../testing';
13
14
 
14
15
  type StoryMessageProps = {
15
16
  valence: MessageValence;
@@ -28,6 +29,7 @@ const StoryMessage = ({ valence, title, body }: StoryMessageProps) => (
28
29
 
29
30
  export default {
30
31
  component: StoryMessage,
32
+ decorators: [withTheme],
31
33
  };
32
34
 
33
35
  export const Default = {
@@ -8,6 +8,7 @@ import { faker } from '@faker-js/faker';
8
8
  import React, { type PropsWithChildren, type ReactNode } from 'react';
9
9
 
10
10
  import { Popover } from './Popover';
11
+ import { withTheme } from '../../testing';
11
12
  import { Button } from '../Buttons';
12
13
 
13
14
  faker.seed(1234);
@@ -28,6 +29,8 @@ const StorybookPopover = ({ openTrigger, children }: PropsWithChildren<{ openTri
28
29
 
29
30
  export default {
30
31
  component: StorybookPopover,
32
+ decorators: [withTheme],
33
+ parameters: { chromatic: { disableSnapshot: false } },
31
34
  };
32
35
 
33
36
  export const Default = {
@@ -10,6 +10,7 @@ import React, { type PropsWithChildren } from 'react';
10
10
  import { groupSurface, surfaceElevation } from '@dxos/react-ui-theme';
11
11
 
12
12
  import { ScrollArea } from './ScrollArea';
13
+ import { withTheme } from '../../testing';
13
14
 
14
15
  faker.seed(1234);
15
16
 
@@ -34,6 +35,8 @@ const StorybookScrollArea = ({ children }: PropsWithChildren<{}>) => {
34
35
 
35
36
  export default {
36
37
  component: StorybookScrollArea,
38
+ decorators: [withTheme],
39
+ parameters: { chromatic: { disableSnapshot: false } },
37
40
  };
38
41
 
39
42
  export const Default = {
@@ -10,6 +10,7 @@ import React, { type FC, type PropsWithChildren, useState } from 'react';
10
10
  import { type Density } from '@dxos/react-ui-types';
11
11
 
12
12
  import { Select } from './Select';
13
+ import { withTheme } from '../../testing';
13
14
  import { DensityProvider } from '../DensityProvider';
14
15
 
15
16
  faker.seed(1234);
@@ -59,6 +60,8 @@ const StorybookSelect = ({ items = [] }: PropsWithChildren<{ items: ItemProps[]
59
60
 
60
61
  export default {
61
62
  component: createDensityTest(StorybookSelect),
63
+ decorators: [withTheme],
64
+ parameters: { chromatic: { disableSnapshot: false } },
62
65
  };
63
66
 
64
67
  export const Default = {
@@ -7,10 +7,13 @@ import '@dxosTheme';
7
7
  import React from 'react';
8
8
 
9
9
  import { Status } from './Status';
10
+ import { withTheme } from '../../testing';
10
11
 
11
12
  export default {
12
13
  component: Status,
13
14
  actions: { argTypesRegex: '^on.*' },
15
+ decorators: [withTheme],
16
+ parameters: { chromatic: { disableSnapshot: false } },
14
17
  };
15
18
 
16
19
  export const Normal = (props: any) => {
@@ -5,9 +5,12 @@
5
5
  import '@dxosTheme';
6
6
 
7
7
  import { Tag } from './Tag';
8
+ import { withTheme } from '../../testing';
8
9
 
9
10
  export default {
10
11
  component: Tag,
12
+ decorators: [withTheme],
13
+ parameters: { chromatic: { disableSnapshot: false } },
11
14
  argTypes: {
12
15
  palette: {
13
16
  control: 'select',
@@ -7,6 +7,7 @@ import '@dxosTheme';
7
7
  import React, { type ReactNode, useState } from 'react';
8
8
 
9
9
  import { Toast } from './Toast';
10
+ import { withTheme } from '../../testing';
10
11
  import { Button } from '../Buttons';
11
12
 
12
13
  type ActionTriggerProps = { altText: string; trigger: ReactNode };
@@ -45,6 +46,8 @@ const StorybookToast = (props: StorybookToastProps) => {
45
46
 
46
47
  export default {
47
48
  component: StorybookToast,
49
+ decorators: [withTheme],
50
+ parameters: { chromatic: { disableSnapshot: false } },
48
51
  };
49
52
 
50
53
  export const Default = {
@@ -8,6 +8,7 @@ import { ArrowClockwise, Bug, FileJs, FileTs, TextB, TextItalic, TextUnderline }
8
8
  import React from 'react';
9
9
 
10
10
  import { Toolbar } from './Toolbar';
11
+ import { withTheme } from '../../testing';
11
12
  import { Toggle } from '../Buttons';
12
13
  import { Select } from '../Select';
13
14
 
@@ -70,6 +71,8 @@ const StorybookToolbar = (props: StorybookToolbarProps) => {
70
71
 
71
72
  export default {
72
73
  component: StorybookToolbar,
74
+ decorators: [withTheme],
75
+ parameters: { chromatic: { disableSnapshot: false } },
73
76
  };
74
77
 
75
78
  export const Default = {
@@ -7,6 +7,7 @@ import '@dxosTheme';
7
7
  import React from 'react';
8
8
 
9
9
  import { Tooltip } from './Tooltip';
10
+ import { withTheme } from '../../testing';
10
11
  import { Button } from '../Buttons';
11
12
 
12
13
  type StoryTooltipProps = {
@@ -29,6 +30,8 @@ const StoryTooltip = ({ content }: StoryTooltipProps) => (
29
30
 
30
31
  export default {
31
32
  component: StoryTooltip,
33
+ decorators: [withTheme],
34
+ parameters: { chromatic: { disableSnapshot: false } },
32
35
  };
33
36
 
34
37
  export const Default = {
@@ -6,7 +6,6 @@ export * from './AnchoredOverflow';
6
6
  export * from './Avatars';
7
7
  export * from './Breadcrumb';
8
8
  export * from './Buttons';
9
- export * from './Card';
10
9
  export * from './Dialogs';
11
10
  export * from './DropdownMenu';
12
11
  export * from './Input';
@@ -9,6 +9,7 @@ import React, { useState } from 'react';
9
9
 
10
10
  import { createScenarios } from './helpers';
11
11
  import { Input, Select, Toggle, Toolbar } from '../components';
12
+ import { withTheme } from '../testing';
12
13
 
13
14
  const Story = () => {
14
15
  const [checked, setChecked] = useState<boolean>(false);
@@ -83,6 +84,8 @@ const Story = () => {
83
84
 
84
85
  export default {
85
86
  component: Story,
87
+ decorators: [withTheme],
88
+ parameters: { chromatic: { disableSnapshot: false } },
86
89
  };
87
90
 
88
91
  export const Default = {
@@ -17,6 +17,8 @@ import {
17
17
  inputSurface,
18
18
  } from '@dxos/react-ui-theme';
19
19
 
20
+ import { withTheme } from '../testing';
21
+
20
22
  const Surface = ({
21
23
  children,
22
24
  level,
@@ -57,6 +59,8 @@ const SurfacesStory = () => {
57
59
 
58
60
  export default {
59
61
  component: SurfacesStory,
62
+ decorators: [withTheme],
63
+ parameters: { chromatic: { disableSnapshot: false } },
60
64
  };
61
65
 
62
66
  export const Default = {
@@ -2,4 +2,4 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- export * from './Card';
5
+ export * from './with-theme';
@@ -0,0 +1,22 @@
1
+ //
2
+ // Copyright 2023 DXOS.org
3
+ //
4
+
5
+ import { type Decorator } from '@storybook/react';
6
+ import { useEffect, createElement } from 'react';
7
+
8
+ import { defaultTx } from '@dxos/react-ui-theme';
9
+
10
+ import { ThemeProvider } from '../../components';
11
+
12
+ export const withTheme: Decorator = (StoryFn, context) => {
13
+ const theme = context?.parameters?.theme || context?.globals?.theme;
14
+ useEffect(() => {
15
+ document.documentElement.classList[theme === 'dark' ? 'add' : 'remove']('dark');
16
+ }, [theme]);
17
+
18
+ return createElement(ThemeProvider, {
19
+ children: createElement(StoryFn),
20
+ tx: defaultTx,
21
+ });
22
+ };
@@ -0,0 +1,5 @@
1
+ //
2
+ // Copyright 2023 DXOS.org
3
+ //
4
+
5
+ export * from './decorators';
@@ -1,52 +0,0 @@
1
- import { type Icon } from '@phosphor-icons/react';
2
- import { type Primitive } from '@radix-ui/react-primitive';
3
- import React, { type ComponentPropsWithoutRef, type ComponentPropsWithRef, type FC } from 'react';
4
- import { type ThemedClassName } from '../../util';
5
- type CardRootProps = ThemedClassName<ComponentPropsWithRef<typeof Primitive.div>> & {
6
- grow?: boolean;
7
- square?: boolean;
8
- noPadding?: boolean;
9
- };
10
- type CardHeaderProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {
11
- floating?: boolean;
12
- };
13
- export declare const CardHeader: FC<CardHeaderProps>;
14
- type CardTitleProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {
15
- center?: boolean;
16
- title?: string;
17
- };
18
- export declare const CardTitle: FC<CardTitleProps>;
19
- type CardDragHandleProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {
20
- position?: 'left' | 'right';
21
- };
22
- type CardEndcapProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {
23
- Icon: Icon;
24
- position?: 'left' | 'right';
25
- };
26
- type CardBodyProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {
27
- gutter?: boolean;
28
- };
29
- export declare const CardBody: FC<CardBodyProps>;
30
- type CardMediaProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {
31
- src?: string;
32
- contain?: boolean;
33
- };
34
- export declare const CardMedia: FC<CardMediaProps>;
35
- export declare const Card: {
36
- Root: React.ForwardRefExoticComponent<Pick<CardRootProps, "children" | "slot" | "style" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "asChild" | "classNames" | "square" | "grow" | "noPadding"> & React.RefAttributes<HTMLDivElement>>;
37
- Header: React.FC<CardHeaderProps>;
38
- DragHandle: React.FC<CardDragHandleProps>;
39
- Endcap: React.FC<CardEndcapProps>;
40
- Menu: React.ForwardRefExoticComponent<Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "className"> & {
41
- classNames?: import("@dxos/react-ui-types").ClassNameValue;
42
- } & {
43
- position?: "right" | "left" | undefined;
44
- } & {
45
- children?: React.ReactNode;
46
- } & React.RefAttributes<HTMLDivElement>>;
47
- Title: React.FC<CardTitleProps>;
48
- Body: React.FC<CardBodyProps>;
49
- Media: React.FC<CardMediaProps>;
50
- };
51
- export type { CardRootProps };
52
- //# sourceMappingURL=Card.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../../../src/components/Card/Card.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAsC,KAAK,IAAI,EAAE,MAAM,uBAAuB,CAAC;AACtF,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,KAAK,EAAE,EACZ,KAAK,wBAAwB,EAC7B,KAAK,qBAAqB,EAC1B,KAAK,EAAE,EAGR,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,YAAY,CAAC;AAGlD,KAAK,aAAa,GAAG,eAAe,CAAC,qBAAqB,CAAC,OAAO,SAAS,CAAC,GAAG,CAAC,CAAC,GAAG;IAClF,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAcF,KAAK,eAAe,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAAG;IAAE,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAEjG,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,CAO1C,CAAC;AAEF,KAAK,cAAc,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAAG;IACvE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAOxC,CAAC;AAGF,KAAK,mBAAmB,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAAG;IAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;CAAE,CAAC;AAY9G,KAAK,eAAe,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAAG;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;CAAE,CAAC;AAqCtH,KAAK,aAAa,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAAG;IAAE,MAAM,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAE7F,eAAO,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAQtC,CAAC;AAEF,KAAK,cAAc,GAAG,eAAe,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAG7G,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAOxC,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;CAShB,CAAC;AAEF,YAAY,EAAE,aAAa,EAAE,CAAC"}
@@ -1,56 +0,0 @@
1
- import '@dxosTheme';
2
- import React from 'react';
3
- declare const _default: {
4
- component: {
5
- Root: React.ForwardRefExoticComponent<Pick<import("./Card").CardRootProps, "children" | "slot" | "style" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "asChild" | "classNames" | "square" | "grow" | "noPadding"> & React.RefAttributes<HTMLDivElement>>;
6
- Header: React.FC<Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "className"> & {
7
- classNames?: import("@dxos/react-ui-types").ClassNameValue;
8
- } & {
9
- floating?: boolean | undefined;
10
- }>;
11
- DragHandle: React.FC<Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "className"> & {
12
- classNames?: import("@dxos/react-ui-types").ClassNameValue;
13
- } & {
14
- position?: "right" | "left" | undefined;
15
- }>;
16
- Endcap: React.FC<Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "className"> & {
17
- classNames?: import("@dxos/react-ui-types").ClassNameValue;
18
- } & {
19
- Icon: import("@phosphor-icons/react").Icon;
20
- position?: "right" | "left" | undefined;
21
- }>;
22
- Menu: React.ForwardRefExoticComponent<Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "className"> & {
23
- classNames?: import("@dxos/react-ui-types").ClassNameValue;
24
- } & {
25
- position?: "right" | "left" | undefined;
26
- } & {
27
- children?: React.ReactNode;
28
- } & React.RefAttributes<HTMLDivElement>>;
29
- Title: React.FC<Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "className"> & {
30
- classNames?: import("@dxos/react-ui-types").ClassNameValue;
31
- } & {
32
- center?: boolean | undefined;
33
- title?: string | undefined;
34
- }>;
35
- Body: React.FC<Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "className"> & {
36
- classNames?: import("@dxos/react-ui-types").ClassNameValue;
37
- } & {
38
- gutter?: boolean | undefined;
39
- }>;
40
- Media: React.FC<Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>>, "className"> & {
41
- classNames?: import("@dxos/react-ui-types").ClassNameValue;
42
- } & {
43
- src?: string | undefined;
44
- contain?: boolean | undefined;
45
- }>;
46
- };
47
- decorators: ((Story: any) => JSX.Element)[];
48
- parameters: {
49
- layout: string;
50
- };
51
- };
52
- export default _default;
53
- export declare const Draggable: () => JSX.Element;
54
- export declare const ReadOnly: () => JSX.Element;
55
- export declare const Editable: () => JSX.Element;
56
- //# sourceMappingURL=Card.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Card.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Card/Card.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAMpB,OAAO,KAAoD,MAAM,OAAO,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yBA+L7D,GAAG;;;;;AAHf,wBAiBE;AAEF,eAAO,MAAM,SAAS,mBAA2B,CAAC;AAClD,eAAO,MAAM,QAAQ,mBAA8B,CAAC;AACpD,eAAO,MAAM,QAAQ,mBAA8B,CAAC"}
@@ -1,2 +0,0 @@
1
- export * from './Card';
2
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Card/index.ts"],"names":[],"mappings":"AAIA,cAAc,QAAQ,CAAC"}