@dxos/plugin-preview 0.8.4-main.f9ba587 → 0.8.4-main.fd6878d
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/dist/lib/browser/index.mjs +2 -2
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/browser/{preview-popover-2UCEZUQW.mjs → preview-popover-MAIBTJKJ.mjs} +1 -1
- package/dist/lib/browser/{preview-popover-2UCEZUQW.mjs.map → preview-popover-MAIBTJKJ.mjs.map} +2 -2
- package/dist/lib/browser/{react-surface-P5GWVHQD.mjs → react-surface-SC522FSX.mjs} +65 -34
- package/dist/lib/browser/react-surface-SC522FSX.mjs.map +7 -0
- package/dist/lib/node-esm/index.mjs +2 -2
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/lib/node-esm/{preview-popover-OSHWR2YE.mjs → preview-popover-LZGHYW23.mjs} +1 -1
- package/dist/lib/node-esm/{preview-popover-OSHWR2YE.mjs.map → preview-popover-LZGHYW23.mjs.map} +2 -2
- package/dist/lib/node-esm/{react-surface-KBHIRVNI.mjs → react-surface-PDXF35OF.mjs} +65 -34
- package/dist/lib/node-esm/react-surface-PDXF35OF.mjs.map +7 -0
- package/dist/types/src/capabilities/preview-popover.d.ts.map +1 -1
- package/dist/types/src/capabilities/react-surface.d.ts.map +1 -1
- package/dist/types/src/components/ContactCard.d.ts.map +1 -1
- package/dist/types/src/index.d.ts +1 -1
- package/dist/types/src/index.d.ts.map +1 -1
- package/dist/types/src/stories/Card.stories.d.ts +50 -0
- package/dist/types/src/stories/Card.stories.d.ts.map +1 -0
- package/dist/types/src/stories/testing.d.ts +18 -0
- package/dist/types/src/stories/testing.d.ts.map +1 -0
- package/dist/types/src/types.d.ts +2 -1
- package/dist/types/src/types.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +25 -22
- package/src/capabilities/preview-popover.ts +2 -2
- package/src/capabilities/react-surface.tsx +68 -35
- package/src/components/ContactCard.tsx +21 -19
- package/src/index.ts +1 -1
- package/src/stories/Card.stories.tsx +53 -0
- package/src/stories/testing.tsx +103 -0
- package/src/types.ts +2 -2
- package/dist/lib/browser/react-surface-P5GWVHQD.mjs.map +0 -7
- package/dist/lib/node-esm/react-surface-KBHIRVNI.mjs.map +0 -7
- package/dist/types/src/Preview.stories.d.ts +0 -127
- package/dist/types/src/Preview.stories.d.ts.map +0 -1
- package/src/Preview.stories.tsx +0 -147
|
@@ -1,127 +0,0 @@
|
|
|
1
|
-
import '@dxos-theme';
|
|
2
|
-
import { type Meta } from '@storybook/react-vite';
|
|
3
|
-
import React, { type FC } from 'react';
|
|
4
|
-
import { DataType } from '@dxos/schema';
|
|
5
|
-
import { type PreviewProps } from './types';
|
|
6
|
-
type StoryProps = {
|
|
7
|
-
Component: FC<PreviewProps<any>>;
|
|
8
|
-
icon: string;
|
|
9
|
-
subject: any;
|
|
10
|
-
};
|
|
11
|
-
declare const meta: Meta<StoryProps>;
|
|
12
|
-
export default meta;
|
|
13
|
-
export declare const ContactWithImage: {
|
|
14
|
-
args: {
|
|
15
|
-
Component: ({ children, subject: { fullName, image, organization, emails }, onOrgClick, role, }: PreviewProps<DataType.Person> & {
|
|
16
|
-
onOrgClick?: (org: DataType.Organization) => void;
|
|
17
|
-
}) => React.JSX.Element;
|
|
18
|
-
icon: string;
|
|
19
|
-
subject: import("@dxos/live-object").Live<import("@dxos/echo/Type").OfKind<import("@dxos/echo-schema").EntityKind.Object> & {
|
|
20
|
-
fields?: {
|
|
21
|
-
readonly label: string;
|
|
22
|
-
readonly category?: string | undefined;
|
|
23
|
-
readonly value: string;
|
|
24
|
-
}[] | undefined;
|
|
25
|
-
fullName?: string | undefined;
|
|
26
|
-
preferredName?: string | undefined;
|
|
27
|
-
nickname?: string | undefined;
|
|
28
|
-
image?: string | undefined;
|
|
29
|
-
organization?: import("@dxos/echo-schema").Ref<import("@dxos/echo/Type").OfKind<import("@dxos/echo-schema").EntityKind.Object> & {
|
|
30
|
-
description?: string | undefined;
|
|
31
|
-
id: string;
|
|
32
|
-
name?: string | undefined;
|
|
33
|
-
status?: "prospect" | "qualified" | "active" | "commit" | "reject" | undefined;
|
|
34
|
-
image?: string | undefined;
|
|
35
|
-
website?: string | undefined;
|
|
36
|
-
}> | undefined;
|
|
37
|
-
jobTitle?: string | undefined;
|
|
38
|
-
department?: string | undefined;
|
|
39
|
-
notes?: string | undefined;
|
|
40
|
-
emails?: {
|
|
41
|
-
readonly label?: string | undefined;
|
|
42
|
-
readonly value: string;
|
|
43
|
-
}[] | undefined;
|
|
44
|
-
identities?: {
|
|
45
|
-
readonly label?: string | undefined;
|
|
46
|
-
readonly value: string;
|
|
47
|
-
}[] | undefined;
|
|
48
|
-
phoneNumbers?: {
|
|
49
|
-
readonly label?: string | undefined;
|
|
50
|
-
readonly value: string;
|
|
51
|
-
}[] | undefined;
|
|
52
|
-
addresses?: {
|
|
53
|
-
readonly label?: string | undefined;
|
|
54
|
-
readonly value: {
|
|
55
|
-
readonly street?: string | undefined;
|
|
56
|
-
readonly extended?: string | undefined;
|
|
57
|
-
readonly locality?: string | undefined;
|
|
58
|
-
readonly region?: string | undefined;
|
|
59
|
-
readonly postalCode?: string | undefined;
|
|
60
|
-
readonly postOfficeBoxNumber?: string | undefined;
|
|
61
|
-
readonly country?: string | undefined;
|
|
62
|
-
};
|
|
63
|
-
}[] | undefined;
|
|
64
|
-
urls?: {
|
|
65
|
-
readonly label?: string | undefined;
|
|
66
|
-
readonly value: string;
|
|
67
|
-
}[] | undefined;
|
|
68
|
-
birthday?: string | undefined;
|
|
69
|
-
}>;
|
|
70
|
-
role: string;
|
|
71
|
-
};
|
|
72
|
-
};
|
|
73
|
-
export declare const ContactNoImage: {
|
|
74
|
-
args: {
|
|
75
|
-
Component: ({ children, subject: { fullName, image, organization, emails }, onOrgClick, role, }: PreviewProps<DataType.Person> & {
|
|
76
|
-
onOrgClick?: (org: DataType.Organization) => void;
|
|
77
|
-
}) => React.JSX.Element;
|
|
78
|
-
icon: string;
|
|
79
|
-
subject: any;
|
|
80
|
-
role: string;
|
|
81
|
-
};
|
|
82
|
-
};
|
|
83
|
-
export declare const OrganizationWithImage: {
|
|
84
|
-
args: {
|
|
85
|
-
Component: ({ children, subject: { name, image, description, website }, role, }: PreviewProps<DataType.Organization>) => React.JSX.Element;
|
|
86
|
-
icon: string;
|
|
87
|
-
subject: import("@dxos/live-object").Live<import("@dxos/echo/Type").OfKind<import("@dxos/echo-schema").EntityKind.Object> & {
|
|
88
|
-
image?: string | undefined;
|
|
89
|
-
id: string;
|
|
90
|
-
status?: "active" | "prospect" | "qualified" | "commit" | "reject" | undefined;
|
|
91
|
-
name?: string | undefined;
|
|
92
|
-
description?: string | undefined;
|
|
93
|
-
website?: string | undefined;
|
|
94
|
-
}>;
|
|
95
|
-
role: string;
|
|
96
|
-
};
|
|
97
|
-
};
|
|
98
|
-
export declare const OrganizationNoImage: {
|
|
99
|
-
args: {
|
|
100
|
-
Component: ({ children, subject: { name, image, description, website }, role, }: PreviewProps<DataType.Organization>) => React.JSX.Element;
|
|
101
|
-
icon: string;
|
|
102
|
-
subject: any;
|
|
103
|
-
role: string;
|
|
104
|
-
};
|
|
105
|
-
};
|
|
106
|
-
export declare const ProjectWithImage: {
|
|
107
|
-
args: {
|
|
108
|
-
Component: ({ subject: { name, image, description }, role }: PreviewProps<DataType.Project>) => React.JSX.Element;
|
|
109
|
-
icon: string;
|
|
110
|
-
subject: import("@dxos/live-object").Live<import("@dxos/echo/Type").OfKind<import("@dxos/echo-schema").EntityKind.Object> & {
|
|
111
|
-
image?: string | undefined;
|
|
112
|
-
id: string;
|
|
113
|
-
name: string;
|
|
114
|
-
description?: string | undefined;
|
|
115
|
-
}>;
|
|
116
|
-
role: string;
|
|
117
|
-
};
|
|
118
|
-
};
|
|
119
|
-
export declare const ProjectNoImage: {
|
|
120
|
-
args: {
|
|
121
|
-
Component: ({ subject: { name, image, description }, role }: PreviewProps<DataType.Project>) => React.JSX.Element;
|
|
122
|
-
icon: string;
|
|
123
|
-
subject: any;
|
|
124
|
-
role: string;
|
|
125
|
-
};
|
|
126
|
-
};
|
|
127
|
-
//# sourceMappingURL=Preview.stories.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Preview.stories.d.ts","sourceRoot":"","sources":["../../../src/Preview.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAKvC,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAKxC,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,SAAS,CAAC;AAI5C,KAAK,UAAU,GAAG;IAChB,SAAS,EAAE,EAAE,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC;IACjC,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,GAAG,CAAC;CACd,CAAC;AAEF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,UAAU,CAsB1B,CAAC;AAEF,eAAe,IAAI,CAAC;AA2CpB,eAAO,MAAM,gBAAgB;;;sBA7E7B,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoFA,CAAC;AAEF,eAAO,MAAM,cAAc;;;sBAtF3B,CAAC;;;;;;CA6FA,CAAC;AAEF,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;CAOjC,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;CAO/B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;CAO5B,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;;CAO1B,CAAC"}
|
package/src/Preview.stories.tsx
DELETED
|
@@ -1,147 +0,0 @@
|
|
|
1
|
-
//
|
|
2
|
-
// Copyright 2023 DXOS.org
|
|
3
|
-
//
|
|
4
|
-
|
|
5
|
-
import '@dxos-theme';
|
|
6
|
-
|
|
7
|
-
import { type Meta } from '@storybook/react-vite';
|
|
8
|
-
import React, { type FC } from 'react';
|
|
9
|
-
|
|
10
|
-
import { Obj, Ref } from '@dxos/echo';
|
|
11
|
-
import { faker } from '@dxos/random';
|
|
12
|
-
import { Icon, Popover } from '@dxos/react-ui';
|
|
13
|
-
import { DataType } from '@dxos/schema';
|
|
14
|
-
import { withTheme, withLayout } from '@dxos/storybook-utils';
|
|
15
|
-
|
|
16
|
-
import { ContactCard, OrganizationCard, ProjectCard } from './components';
|
|
17
|
-
import { translations } from './translations';
|
|
18
|
-
import { type PreviewProps } from './types';
|
|
19
|
-
|
|
20
|
-
faker.seed(1234);
|
|
21
|
-
|
|
22
|
-
type StoryProps = {
|
|
23
|
-
Component: FC<PreviewProps<any>>;
|
|
24
|
-
icon: string;
|
|
25
|
-
subject: any;
|
|
26
|
-
};
|
|
27
|
-
|
|
28
|
-
const meta: Meta<StoryProps> = {
|
|
29
|
-
title: 'plugins/plugin-preview/Preview',
|
|
30
|
-
render: ({ Component, icon, ...args }) => {
|
|
31
|
-
return (
|
|
32
|
-
<Popover.Root open>
|
|
33
|
-
<Popover.Content>
|
|
34
|
-
<Popover.Viewport>
|
|
35
|
-
<Component {...args} role='popover' />
|
|
36
|
-
</Popover.Viewport>
|
|
37
|
-
<Popover.Arrow />
|
|
38
|
-
</Popover.Content>
|
|
39
|
-
<Popover.Trigger>
|
|
40
|
-
<Icon icon={icon} size={5} />
|
|
41
|
-
</Popover.Trigger>
|
|
42
|
-
</Popover.Root>
|
|
43
|
-
);
|
|
44
|
-
},
|
|
45
|
-
decorators: [withTheme, withLayout()],
|
|
46
|
-
parameters: {
|
|
47
|
-
layout: 'centered',
|
|
48
|
-
translations,
|
|
49
|
-
},
|
|
50
|
-
};
|
|
51
|
-
|
|
52
|
-
export default meta;
|
|
53
|
-
|
|
54
|
-
const omitImage = ({ image, ...rest }: any) => rest;
|
|
55
|
-
|
|
56
|
-
const data = (() => {
|
|
57
|
-
const organization = Obj.make(DataType.Organization, {
|
|
58
|
-
name: faker.company.name(),
|
|
59
|
-
image:
|
|
60
|
-
'https://plus.unsplash.com/premium_photo-1672116452571-896980a801c8?q=80&w=2671&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',
|
|
61
|
-
website: faker.internet.url(),
|
|
62
|
-
description: faker.lorem.paragraph(),
|
|
63
|
-
});
|
|
64
|
-
|
|
65
|
-
const contact = Obj.make(DataType.Person, {
|
|
66
|
-
fullName: faker.person.fullName(),
|
|
67
|
-
image:
|
|
68
|
-
'https://plus.unsplash.com/premium_photo-1664536392779-049ba8fde933?q=80&w=2574&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',
|
|
69
|
-
organization: Ref.make(organization),
|
|
70
|
-
emails: [
|
|
71
|
-
{
|
|
72
|
-
label: 'Work',
|
|
73
|
-
value: faker.internet.email(),
|
|
74
|
-
},
|
|
75
|
-
{
|
|
76
|
-
label: 'Work',
|
|
77
|
-
value: faker.internet.email(),
|
|
78
|
-
},
|
|
79
|
-
{
|
|
80
|
-
label: 'Work',
|
|
81
|
-
value: faker.internet.email(),
|
|
82
|
-
},
|
|
83
|
-
],
|
|
84
|
-
});
|
|
85
|
-
|
|
86
|
-
const project = Obj.make(DataType.Project, {
|
|
87
|
-
name: faker.person.fullName(),
|
|
88
|
-
image: 'https://dxos.network/dxos-logotype-blue.png',
|
|
89
|
-
description: faker.lorem.paragraph(),
|
|
90
|
-
});
|
|
91
|
-
|
|
92
|
-
return { organization, contact, project };
|
|
93
|
-
})();
|
|
94
|
-
|
|
95
|
-
export const ContactWithImage = {
|
|
96
|
-
args: {
|
|
97
|
-
Component: ContactCard,
|
|
98
|
-
icon: 'ph--user--regular',
|
|
99
|
-
subject: data.contact,
|
|
100
|
-
role: 'popover',
|
|
101
|
-
},
|
|
102
|
-
};
|
|
103
|
-
|
|
104
|
-
export const ContactNoImage = {
|
|
105
|
-
args: {
|
|
106
|
-
Component: ContactCard,
|
|
107
|
-
icon: 'ph--user--regular',
|
|
108
|
-
subject: omitImage(data.contact),
|
|
109
|
-
role: 'popover',
|
|
110
|
-
},
|
|
111
|
-
};
|
|
112
|
-
|
|
113
|
-
export const OrganizationWithImage = {
|
|
114
|
-
args: {
|
|
115
|
-
Component: OrganizationCard,
|
|
116
|
-
icon: 'ph--building-office--regular',
|
|
117
|
-
subject: data.organization,
|
|
118
|
-
role: 'popover',
|
|
119
|
-
},
|
|
120
|
-
};
|
|
121
|
-
|
|
122
|
-
export const OrganizationNoImage = {
|
|
123
|
-
args: {
|
|
124
|
-
Component: OrganizationCard,
|
|
125
|
-
icon: 'ph--building-office--regular',
|
|
126
|
-
subject: omitImage(data.organization),
|
|
127
|
-
role: 'popover',
|
|
128
|
-
},
|
|
129
|
-
};
|
|
130
|
-
|
|
131
|
-
export const ProjectWithImage = {
|
|
132
|
-
args: {
|
|
133
|
-
Component: ProjectCard,
|
|
134
|
-
icon: 'ph--building--regular',
|
|
135
|
-
subject: data.project,
|
|
136
|
-
role: 'popover',
|
|
137
|
-
},
|
|
138
|
-
};
|
|
139
|
-
|
|
140
|
-
export const ProjectNoImage = {
|
|
141
|
-
args: {
|
|
142
|
-
Component: ProjectCard,
|
|
143
|
-
icon: 'ph--building--regular',
|
|
144
|
-
subject: omitImage(data.project),
|
|
145
|
-
role: 'popover',
|
|
146
|
-
},
|
|
147
|
-
};
|