@dxos/react-ui-card 0.8.2-main.fbd8ed0 → 0.8.2-staging.4d6ad0f

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 (10) hide show
  1. package/dist/lib/browser/index.mjs +112 -71
  2. package/dist/lib/browser/index.mjs.map +1 -1
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/lib/node/index.cjs +112 -71
  5. package/dist/lib/node/index.cjs.map +1 -1
  6. package/dist/lib/node/meta.json +1 -1
  7. package/dist/lib/node-esm/index.mjs +112 -71
  8. package/dist/lib/node-esm/index.mjs.map +1 -1
  9. package/dist/lib/node-esm/meta.json +1 -1
  10. package/package.json +9 -8
package/dist/lib/browser/index.mjs CHANGED
@@ -1,4 +1,5 @@
1
1
  // packages/ui/react-ui-card/src/components/Card.tsx
2
+ import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
2
3
  import { Circle, DotsSixVertical, DotsThreeVertical } from "@phosphor-icons/react";
3
4
  import React, { forwardRef } from "react";
4
5
  import { useDensityContext, DropdownMenu } from "@dxos/react-ui";
@@ -43,91 +44,131 @@ var cardTheme = {
43
44
 
44
45
  // packages/ui/react-ui-card/src/components/Card.tsx
45
46
  var CardRoot = /* @__PURE__ */ forwardRef(({ grow, square, noPadding, classNames, children, ...props }, forwardedRef) => {
46
- return /* @__PURE__ */ React.createElement("div", {
47
- ...props,
48
- ref: forwardedRef,
49
- className: cardRoot({
50
- grow,
51
- square,
52
- noPadding
53
- }, classNames)
54
- }, children);
47
+ var _effect = _useSignals();
48
+ try {
49
+ return /* @__PURE__ */ React.createElement("div", {
50
+ ...props,
51
+ ref: forwardedRef,
52
+ className: cardRoot({
53
+ grow,
54
+ square,
55
+ noPadding
56
+ }, classNames)
57
+ }, children);
58
+ } finally {
59
+ _effect.f();
60
+ }
55
61
  });
56
62
  var CardHeader = ({ floating, classNames, children, ...props }) => {
57
- return /* @__PURE__ */ React.createElement("div", {
58
- ...props,
59
- className: cardHeader({
60
- floating
61
- }, classNames)
62
- }, children);
63
+ var _effect = _useSignals();
64
+ try {
65
+ return /* @__PURE__ */ React.createElement("div", {
66
+ ...props,
67
+ className: cardHeader({
68
+ floating
69
+ }, classNames)
70
+ }, children);
71
+ } finally {
72
+ _effect.f();
73
+ }
63
74
  };
64
75
  var CardTitle = ({ center, title, classNames, ...props }) => {
65
- return /* @__PURE__ */ React.createElement("div", {
66
- ...props,
67
- className: cardTitle({
68
- center
69
- }, classNames)
70
- }, title);
76
+ var _effect = _useSignals();
77
+ try {
78
+ return /* @__PURE__ */ React.createElement("div", {
79
+ ...props,
80
+ className: cardTitle({
81
+ center
82
+ }, classNames)
83
+ }, title);
84
+ } finally {
85
+ _effect.f();
86
+ }
71
87
  };
72
88
  var CardDragHandle = ({ position, classNames, ...props }) => {
73
- const density = useDensityContext();
74
- return /* @__PURE__ */ React.createElement("div", {
75
- ...props,
76
- className: cardDragHandle({
77
- density,
78
- position
79
- }, classNames)
80
- }, /* @__PURE__ */ React.createElement(DotsSixVertical, {
81
- className: cardDragHandleIcon({})
82
- }));
89
+ var _effect = _useSignals();
90
+ try {
91
+ const density = useDensityContext();
92
+ return /* @__PURE__ */ React.createElement("div", {
93
+ ...props,
94
+ className: cardDragHandle({
95
+ density,
96
+ position
97
+ }, classNames)
98
+ }, /* @__PURE__ */ React.createElement(DotsSixVertical, {
99
+ className: cardDragHandleIcon({})
100
+ }));
101
+ } finally {
102
+ _effect.f();
103
+ }
83
104
  };
84
105
  var CardEndcap = ({ Icon = Circle, position, classNames, ...props }) => {
85
- const density = useDensityContext();
86
- return /* @__PURE__ */ React.createElement("div", {
87
- ...props,
88
- className: cardMenu({
89
- density,
90
- position
91
- }, classNames)
92
- }, /* @__PURE__ */ React.createElement(Icon, {
93
- className: cardMenuIcon({})
94
- }));
106
+ var _effect = _useSignals();
107
+ try {
108
+ const density = useDensityContext();
109
+ return /* @__PURE__ */ React.createElement("div", {
110
+ ...props,
111
+ className: cardMenu({
112
+ density,
113
+ position
114
+ }, classNames)
115
+ }, /* @__PURE__ */ React.createElement(Icon, {
116
+ className: cardMenuIcon({})
117
+ }));
118
+ } finally {
119
+ _effect.f();
120
+ }
95
121
  };
96
122
  var CardMenu = /* @__PURE__ */ forwardRef(({ children, position, classNames, ...props }, forwardRef2) => {
97
- const density = useDensityContext();
98
- return /* @__PURE__ */ React.createElement("div", {
99
- ...props,
100
- className: cardMenu({
101
- density,
102
- position
103
- }, classNames),
104
- ref: forwardRef2
105
- }, /* @__PURE__ */ React.createElement(DropdownMenu.Root, null, /* @__PURE__ */ React.createElement(DropdownMenu.Trigger, {
106
- asChild: true
107
- }, /* @__PURE__ */ React.createElement(DotsThreeVertical, {
108
- className: cardMenuIcon({})
109
- })), /* @__PURE__ */ React.createElement(DropdownMenu.Content, null, /* @__PURE__ */ React.createElement(DropdownMenu.Viewport, null, children))));
123
+ var _effect = _useSignals();
124
+ try {
125
+ const density = useDensityContext();
126
+ return /* @__PURE__ */ React.createElement("div", {
127
+ ...props,
128
+ className: cardMenu({
129
+ density,
130
+ position
131
+ }, classNames),
132
+ ref: forwardRef2
133
+ }, /* @__PURE__ */ React.createElement(DropdownMenu.Root, null, /* @__PURE__ */ React.createElement(DropdownMenu.Trigger, {
134
+ asChild: true
135
+ }, /* @__PURE__ */ React.createElement(DotsThreeVertical, {
136
+ className: cardMenuIcon({})
137
+ })), /* @__PURE__ */ React.createElement(DropdownMenu.Content, null, /* @__PURE__ */ React.createElement(DropdownMenu.Viewport, null, children))));
138
+ } finally {
139
+ _effect.f();
140
+ }
110
141
  });
111
142
  var CardBody = ({ gutter, classNames, children, ...props }) => {
112
- const density = useDensityContext();
113
- return /* @__PURE__ */ React.createElement("div", {
114
- ...props,
115
- className: cardBody({
116
- density,
117
- gutter
118
- }, classNames)
119
- }, children);
143
+ var _effect = _useSignals();
144
+ try {
145
+ const density = useDensityContext();
146
+ return /* @__PURE__ */ React.createElement("div", {
147
+ ...props,
148
+ className: cardBody({
149
+ density,
150
+ gutter
151
+ }, classNames)
152
+ }, children);
153
+ } finally {
154
+ _effect.f();
155
+ }
120
156
  };
121
157
  var CardMedia = ({ src, contain, classNames, ...props }) => {
122
- return /* @__PURE__ */ React.createElement("div", {
123
- className: "flex grow overflow-hidden"
124
- }, /* @__PURE__ */ React.createElement("img", {
125
- ...props,
126
- className: cardMedia({
127
- contain
128
- }, classNames),
129
- src
130
- }));
158
+ var _effect = _useSignals();
159
+ try {
160
+ return /* @__PURE__ */ React.createElement("div", {
161
+ className: "flex grow overflow-hidden"
162
+ }, /* @__PURE__ */ React.createElement("img", {
163
+ ...props,
164
+ className: cardMedia({
165
+ contain
166
+ }, classNames),
167
+ src
168
+ }));
169
+ } finally {
170
+ _effect.f();
171
+ }
131
172
  };
132
173
  var Card = {
133
174
  Root: CardRoot,
package/dist/lib/browser/index.mjs.map CHANGED
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/Card.tsx", "../../../src/theme.ts"],
4
4
  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { Circle, DotsSixVertical, DotsThreeVertical, type Icon } from '@phosphor-icons/react';\nimport { type Primitive } from '@radix-ui/react-primitive';\nimport React, {\n type ComponentPropsWithoutRef,\n type ComponentPropsWithRef,\n type FC,\n type PropsWithChildren,\n forwardRef,\n} from 'react';\n\nimport { useDensityContext, DropdownMenu, type ThemedClassName } from '@dxos/react-ui';\n\nimport {\n cardBody,\n cardDragHandle,\n cardDragHandleIcon,\n cardHeader,\n cardMedia,\n cardMenu,\n cardMenuIcon,\n cardRoot,\n cardTitle,\n} from '../theme';\n\ntype CardRootProps = ThemedClassName<ComponentPropsWithRef<typeof Primitive.div>> & {\n grow?: boolean;\n square?: boolean;\n noPadding?: boolean;\n};\n\n// TODO(burdon): Forward refs for all components?\nconst CardRoot = forwardRef<HTMLDivElement, CardRootProps>(\n ({ grow, square, noPadding, classNames, children, ...props }, forwardedRef) => {\n return (\n <div {...props} ref={forwardedRef} className={cardRoot({ grow, square, noPadding }, classNames)}>\n {children}\n </div>\n );\n },\n);\n\ntype CardHeaderProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { floating?: boolean };\n\nexport const CardHeader: FC<CardHeaderProps> = ({ floating, classNames, children, ...props }) => {\n return (\n <div {...props} className={cardHeader({ floating }, classNames)}>\n {children}\n </div>\n );\n};\n\ntype CardTitleProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {\n center?: boolean;\n title?: string;\n};\n\nexport const CardTitle: FC<CardTitleProps> = ({ center, title, classNames, ...props }) => {\n return (\n <div {...props} className={cardTitle({ center }, classNames)}>\n {title}\n </div>\n );\n};\n\n// TODO(burdon): Reuse ListItemEndcap?\ntype CardDragHandleProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { position?: 'left' | 'right' };\n\nconst CardDragHandle: FC<CardDragHandleProps> = ({ position, classNames, ...props }) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardDragHandle({ density, position }, classNames)}>\n <DotsSixVertical className={cardDragHandleIcon({})} />\n </div>\n );\n};\n\ntype CardEndcapProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { Icon?: Icon; position?: 'left' | 'right' };\n\nconst CardEndcap: FC<CardEndcapProps> = ({ Icon = Circle, position, classNames, ...props }) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardMenu({ density, position }, classNames)}>\n <Icon className={cardMenuIcon({})} />\n </div>\n );\n};\n\ntype CardMenuProps = PropsWithChildren<\n ThemedClassName<ComponentPropsWithoutRef<'div'>> & { position?: 'left' | 'right' }\n>;\n\n// TODO(burdon): Reconcile with Endcap (remove dropdown from here). See ListItem.Endcap (style icon/size?)\nconst CardMenu = forwardRef<HTMLDivElement, CardMenuProps>(\n ({ children, position, classNames, ...props }, forwardRef) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardMenu({ density, position }, classNames)} ref={forwardRef}>\n <DropdownMenu.Root>\n <DropdownMenu.Trigger asChild>\n <DotsThreeVertical className={cardMenuIcon({})} />\n </DropdownMenu.Trigger>\n {/* TODO(burdon): Position to the left of the menu button. */}\n <DropdownMenu.Content>\n <DropdownMenu.Viewport>{children}</DropdownMenu.Viewport>\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n </div>\n );\n },\n);\n\ntype CardBodyProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { gutter?: boolean };\n\nexport const CardBody: FC<CardBodyProps> = ({ gutter, classNames, children, ...props }) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardBody({ density, gutter }, classNames)}>\n {children}\n </div>\n );\n};\n\ntype CardMediaProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { src?: string; contain?: boolean };\n\n// TODO(burdon): Option to set to 50% of height of card.\nexport const CardMedia: FC<CardMediaProps> = ({ src, contain, classNames, ...props }) => {\n return (\n <div className='flex grow overflow-hidden'>\n <img {...props} className={cardMedia({ contain }, classNames)} src={src} />\n </div>\n );\n};\n\nexport const Card = {\n Root: CardRoot,\n Header: CardHeader,\n DragHandle: CardDragHandle,\n Endcap: CardEndcap,\n Menu: CardMenu,\n Title: CardTitle,\n Body: CardBody,\n Media: CardMedia,\n};\n\nexport type { CardRootProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type ComponentFunction, type Density, type Theme } from '@dxos/react-ui';\nimport { getSize, attentionSurface, mx } from '@dxos/react-ui-theme';\n\nconst defaults = {\n width: 'min-w-[256px]',\n};\n\nexport type CardStyleProps = Partial<{\n density: Density;\n grow?: boolean;\n square?: boolean;\n rounded?: boolean;\n noPadding?: boolean;\n}>;\n\nexport const cardRoot: ComponentFunction<CardStyleProps> = ({ grow, square, rounded = true }, ...etc) =>\n mx(\n 'flex flex-col group/card overflow-hidden',\n grow && 'h-full',\n defaults.width,\n attentionSurface,\n 'shadow', // TODO(burdon): Elevation?\n rounded && 'rounded',\n square && 'aspect-square',\n ...etc,\n );\n\nexport const cardHeader: ComponentFunction<CardStyleProps & { floating?: boolean }> = ({ floating }, ...etc) =>\n mx(floating ? 'relative' : 'flex w-full shrink-0 justify-between overflow-hidden items-center py-1', ...etc);\n\nexport const cardTitle: ComponentFunction<CardStyleProps & { center?: boolean }> = ({ center }, ...etc) =>\n mx('grow overflow-hidden truncate first:pl-4 last:pr-4', center && 'text-center', ...etc);\n\nexport const cardDragHandle: ComponentFunction<CardStyleProps & { position?: 'left' | 'right' }> = (\n { density, position },\n ...etc\n) =>\n mx(\n 'flex shrink-0 items-center justify-center select-none',\n density === 'fine' ? getSize(8) : getSize(10),\n position === 'left' && 'absolute top-1 left-1',\n position === 'right' && 'absolute top-1 right-1',\n position && 'text-black group-hover/card:bg-white group-hover/card:bg-opacity-80',\n ...etc,\n );\n\nexport const cardDragHandleIcon: ComponentFunction<CardStyleProps> = (_, ...etc) =>\n mx(getSize(5), 'cursor-pointer', ...etc);\n\n// TODO(burdon): Helper for DropdownMenu? Density, etc?\nexport const cardMenu: ComponentFunction<CardStyleProps & { position?: 'left' | 'right' }> = (\n { density, position },\n ...etc\n) =>\n mx(\n 'flex shrink-0 items-center justify-center',\n density === 'fine' ? getSize(8) : getSize(10),\n position === 'left' && 'absolute top-1 left-1',\n position === 'right' && 'absolute top-1 right-1',\n position && 'text-black group-hover/card:bg-white group-hover/card:bg-opacity-80',\n ...etc,\n );\n\nexport const cardMenuIcon: ComponentFunction<CardStyleProps> = (_, ...etc) => mx(getSize(5), 'cursor-pointer');\n\nexport const cardBody: ComponentFunction<CardStyleProps & { gutter?: boolean }> = (\n { density, gutter, noPadding },\n ...etc\n) =>\n mx(\n 'grow overflow-auto',\n !noPadding && 'px-2',\n // TODO(burdon): Create density-specific constants.\n gutter && (density === 'fine' ? 'pl-0 ml-[32px]' : 'pl-0 ml-[40px]'),\n ...etc,\n );\n\nexport const cardMedia: ComponentFunction<CardStyleProps & { contain?: boolean }> = ({ contain }, ...etc) =>\n mx(\n 'grow max-h-[300px]',\n // Hide broken image links (e.g., if offline).\n \"before:content-[' '] before:block before:w-full before:h-full before:border-0\",\n contain ? 'object-contain' : 'object-cover',\n ...etc,\n );\n\nexport const cardTheme: Theme<CardStyleProps> = {\n root: cardRoot,\n header: cardHeader,\n title: cardTitle,\n dragHandle: cardDragHandle,\n dragHandleIcon: cardDragHandleIcon,\n menu: cardMenu,\n menuIcon: cardMenuIcon,\n body: cardBody,\n media: cardMedia,\n};\n"],
5
- "mappings": "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",
5
+ "mappings": ";;AAIA,SAASA,QAAQC,iBAAiBC,yBAAoC;AAEtE,OAAOC,SAKLC,kBACK;AAEP,SAASC,mBAAmBC,oBAA0C;;;ACTtE,SAASC,SAASC,kBAAkBC,UAAU;AAE9C,IAAMC,WAAW;EACfC,OAAO;AACT;AAUO,IAAMC,WAA8C,CAAC,EAAEC,MAAMC,QAAQC,UAAU,KAAI,MAAOC,QAC/FC,GACE,4CACAJ,QAAQ,UACRH,SAASC,OACTO,kBACA,UACAH,WAAW,WACXD,UAAU,iBAAA,GACPE,GAAAA;AAGA,IAAMG,aAAyE,CAAC,EAAEC,SAAQ,MAAOJ,QACtGC,GAAGG,WAAW,aAAa,0EAAA,GAA6EJ,GAAAA;AAEnG,IAAMK,YAAsE,CAAC,EAAEC,OAAM,MAAON,QACjGC,GAAG,sDAAsDK,UAAU,eAAA,GAAkBN,GAAAA;AAEhF,IAAMO,iBAAsF,CACjG,EAAEC,SAASC,SAAQ,MAChBT,QAEHC,GACE,yDACAO,YAAY,SAASE,QAAQ,CAAA,IAAKA,QAAQ,EAAA,GAC1CD,aAAa,UAAU,yBACvBA,aAAa,WAAW,0BACxBA,YAAY,uEAAA,GACTT,GAAAA;AAGA,IAAMW,qBAAwD,CAACC,MAAMZ,QAC1EC,GAAGS,QAAQ,CAAA,GAAI,kBAAA,GAAqBV,GAAAA;AAG/B,IAAMa,WAAgF,CAC3F,EAAEL,SAASC,SAAQ,MAChBT,QAEHC,GACE,6CACAO,YAAY,SAASE,QAAQ,CAAA,IAAKA,QAAQ,EAAA,GAC1CD,aAAa,UAAU,yBACvBA,aAAa,WAAW,0BACxBA,YAAY,uEAAA,GACTT,GAAAA;AAGA,IAAMc,eAAkD,CAACF,MAAMZ,QAAQC,GAAGS,QAAQ,CAAA,GAAI,gBAAA;AAEtF,IAAMK,WAAqE,CAChF,EAAEP,SAASQ,QAAQC,UAAS,MACzBjB,QAEHC;EACE;EACA,CAACgB,aAAa;;EAEdD,WAAWR,YAAY,SAAS,mBAAmB;EAAe,GAC/DR;AAAAA;AAGA,IAAMkB,YAAuE,CAAC,EAAEC,QAAO,MAAOnB,QACnGC;EACE;;EAEA;EACAkB,UAAU,mBAAmB;EAAA,GAC1BnB;AAAAA;AAGA,IAAMoB,YAAmC;EAC9CC,MAAMzB;EACN0B,QAAQnB;EACRoB,OAAOlB;EACPmB,YAAYjB;EACZkB,gBAAgBd;EAChBe,MAAMb;EACNc,UAAUb;EACVc,MAAMb;EACNc,OAAOX;AACT;;;ADjEA,IAAMY,WAAWC,2BACf,CAAC,EAAEC,MAAMC,QAAQC,WAAWC,YAAYC,UAAU,GAAGC,MAAAA,GAASC,iBAAAA;;;AAC5D,WACE,sBAAA,cAACC,OAAAA;MAAK,GAAGF;MAAOG,KAAKF;MAAcG,WAAWC,SAAS;QAAEV;QAAMC;QAAQC;MAAU,GAAGC,UAAAA;OACjFC,QAAAA;;;;AAGP,CAAA;AAKK,IAAMO,aAAkC,CAAC,EAAEC,UAAUT,YAAYC,UAAU,GAAGC,MAAAA,MAAO;;;AAC1F,WACE,sBAAA,cAACE,OAAAA;MAAK,GAAGF;MAAOI,WAAWI,WAAW;QAAED;MAAS,GAAGT,UAAAA;OACjDC,QAAAA;;;;AAGP;AAOO,IAAMU,YAAgC,CAAC,EAAEC,QAAQC,OAAOb,YAAY,GAAGE,MAAAA,MAAO;;;AACnF,WACE,sBAAA,cAACE,OAAAA;MAAK,GAAGF;MAAOI,WAAWQ,UAAU;QAAEF;MAAO,GAAGZ,UAAAA;OAC9Ca,KAAAA;;;;AAGP;AAKA,IAAME,iBAA0C,CAAC,EAAEC,UAAUhB,YAAY,GAAGE,MAAAA,MAAO;;;AACjF,UAAMe,UAAUC,kBAAAA;AAChB,WACE,sBAAA,cAACd,OAAAA;MAAK,GAAGF;MAAOI,WAAWa,eAAe;QAAEF;QAASD;MAAS,GAAGhB,UAAAA;OAC/D,sBAAA,cAACoB,iBAAAA;MAAgBd,WAAWe,mBAAmB,CAAC,CAAA;;;;;AAGtD;AAIA,IAAMC,aAAkC,CAAC,EAAEC,OAAOC,QAAQR,UAAUhB,YAAY,GAAGE,MAAAA,MAAO;;;AACxF,UAAMe,UAAUC,kBAAAA;AAChB,WACE,sBAAA,cAACd,OAAAA;MAAK,GAAGF;MAAOI,WAAWmB,SAAS;QAAER;QAASD;MAAS,GAAGhB,UAAAA;OACzD,sBAAA,cAACuB,MAAAA;MAAKjB,WAAWoB,aAAa,CAAC,CAAA;;;;;AAGrC;AAOA,IAAMC,WAAW/B,2BACf,CAAC,EAAEK,UAAUe,UAAUhB,YAAY,GAAGE,MAAAA,GAASN,gBAAAA;;;AAC7C,UAAMqB,UAAUC,kBAAAA;AAChB,WACE,sBAAA,cAACd,OAAAA;MAAK,GAAGF;MAAOI,WAAWmB,SAAS;QAAER;QAASD;MAAS,GAAGhB,UAAAA;MAAaK,KAAKT;OAC3E,sBAAA,cAACgC,aAAaC,MAAI,MAChB,sBAAA,cAACD,aAAaE,SAAO;MAACC,SAAAA;OACpB,sBAAA,cAACC,mBAAAA;MAAkB1B,WAAWoB,aAAa,CAAC,CAAA;SAG9C,sBAAA,cAACE,aAAaK,SAAO,MACnB,sBAAA,cAACL,aAAaM,UAAQ,MAAEjC,QAAAA,CAAAA,CAAAA,CAAAA;;;;AAKlC,CAAA;AAKK,IAAMkC,WAA8B,CAAC,EAAEC,QAAQpC,YAAYC,UAAU,GAAGC,MAAAA,MAAO;;;AACpF,UAAMe,UAAUC,kBAAAA;AAChB,WACE,sBAAA,cAACd,OAAAA;MAAK,GAAGF;MAAOI,WAAW+B,SAAS;QAAEpB;QAASmB;MAAO,GAAGpC,UAAAA;OACtDC,QAAAA;;;;AAGP;AAKO,IAAMqC,YAAgC,CAAC,EAAEC,KAAKC,SAASxC,YAAY,GAAGE,MAAAA,MAAO;;;AAClF,WACE,sBAAA,cAACE,OAAAA;MAAIE,WAAU;OACb,sBAAA,cAACmC,OAAAA;MAAK,GAAGvC;MAAOI,WAAWoC,UAAU;QAAEF;MAAQ,GAAGxC,UAAAA;MAAauC;;;;;AAGrE;AAEO,IAAMI,OAAO;EAClBd,MAAMlC;EACNiD,QAAQpC;EACRqC,YAAY9B;EACZ+B,QAAQxB;EACRyB,MAAMpB;EACNqB,OAAOrC;EACPsC,MAAMd;EACNe,OAAOZ;AACT;",
6
6
  "names": ["Circle", "DotsSixVertical", "DotsThreeVertical", "React", "forwardRef", "useDensityContext", "DropdownMenu", "getSize", "attentionSurface", "mx", "defaults", "width", "cardRoot", "grow", "square", "rounded", "etc", "mx", "attentionSurface", "cardHeader", "floating", "cardTitle", "center", "cardDragHandle", "density", "position", "getSize", "cardDragHandleIcon", "_", "cardMenu", "cardMenuIcon", "cardBody", "gutter", "noPadding", "cardMedia", "contain", "cardTheme", "root", "header", "title", "dragHandle", "dragHandleIcon", "menu", "menuIcon", "body", "media", "CardRoot", "forwardRef", "grow", "square", "noPadding", "classNames", "children", "props", "forwardedRef", "div", "ref", "className", "cardRoot", "CardHeader", "floating", "cardHeader", "CardTitle", "center", "title", "cardTitle", "CardDragHandle", "position", "density", "useDensityContext", "cardDragHandle", "DotsSixVertical", "cardDragHandleIcon", "CardEndcap", "Icon", "Circle", "cardMenu", "cardMenuIcon", "CardMenu", "DropdownMenu", "Root", "Trigger", "asChild", "DotsThreeVertical", "Content", "Viewport", "CardBody", "gutter", "cardBody", "CardMedia", "src", "contain", "img", "cardMedia", "Card", "Header", "DragHandle", "Endcap", "Menu", "Title", "Body", "Media"]
7
7
  }
package/dist/lib/browser/meta.json CHANGED
@@ -1 +1 @@
1
- {"inputs":{"packages/ui/react-ui-card/src/theme.ts":{"bytes":9652,"imports":[{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-card/src/components/Card.tsx":{"bytes":14189,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"../theme"}],"format":"esm"},"packages/ui/react-ui-card/src/components/index.ts":{"bytes":500,"imports":[{"path":"packages/ui/react-ui-card/src/components/Card.tsx","kind":"import-statement","original":"./Card"}],"format":"esm"},"packages/ui/react-ui-card/src/index.ts":{"bytes":584,"imports":[{"path":"packages/ui/react-ui-card/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"./theme"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-card/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":12773},"packages/ui/react-ui-card/dist/lib/browser/index.mjs":{"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["Card","CardBody","CardHeader","CardMedia","CardTitle","cardBody","cardDragHandle","cardDragHandleIcon","cardHeader","cardMedia","cardMenu","cardMenuIcon","cardRoot","cardTheme","cardTitle"],"entryPoint":"packages/ui/react-ui-card/src/index.ts","inputs":{"packages/ui/react-ui-card/src/components/Card.tsx":{"bytesInOutput":3096},"packages/ui/react-ui-card/src/theme.ts":{"bytesInOutput":2207},"packages/ui/react-ui-card/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-card/src/index.ts":{"bytesInOutput":0}},"bytes":5704}}}
1
+ {"inputs":{"packages/ui/react-ui-card/src/theme.ts":{"bytes":9584,"imports":[{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-card/src/components/Card.tsx":{"bytes":15142,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"../theme"}],"format":"esm"},"packages/ui/react-ui-card/src/components/index.ts":{"bytes":468,"imports":[{"path":"packages/ui/react-ui-card/src/components/Card.tsx","kind":"import-statement","original":"./Card"}],"format":"esm"},"packages/ui/react-ui-card/src/index.ts":{"bytes":552,"imports":[{"path":"packages/ui/react-ui-card/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"./theme"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-card/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":12814},"packages/ui/react-ui-card/dist/lib/browser/index.mjs":{"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["Card","CardBody","CardHeader","CardMedia","CardTitle","cardBody","cardDragHandle","cardDragHandleIcon","cardHeader","cardMedia","cardMenu","cardMenuIcon","cardRoot","cardTheme","cardTitle"],"entryPoint":"packages/ui/react-ui-card/src/index.ts","inputs":{"packages/ui/react-ui-card/src/components/Card.tsx":{"bytesInOutput":3911},"packages/ui/react-ui-card/src/theme.ts":{"bytesInOutput":2207},"packages/ui/react-ui-card/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-card/src/index.ts":{"bytesInOutput":0}},"bytes":6519}}}
package/dist/lib/node/index.cjs CHANGED
@@ -45,6 +45,7 @@ __export(node_exports, {
45
45
  cardTitle: () => cardTitle
46
46
  });
47
47
  module.exports = __toCommonJS(node_exports);
48
+ var import_tracking = require("@preact-signals/safe-react/tracking");
48
49
  var import_react = require("@phosphor-icons/react");
49
50
  var import_react2 = __toESM(require("react"));
50
51
  var import_react_ui = require("@dxos/react-ui");
@@ -85,91 +86,131 @@ var cardTheme = {
85
86
  media: cardMedia
86
87
  };
87
88
  var CardRoot = /* @__PURE__ */ (0, import_react2.forwardRef)(({ grow, square, noPadding, classNames, children, ...props }, forwardedRef) => {
88
- return /* @__PURE__ */ import_react2.default.createElement("div", {
89
- ...props,
90
- ref: forwardedRef,
91
- className: cardRoot({
92
- grow,
93
- square,
94
- noPadding
95
- }, classNames)
96
- }, children);
89
+ var _effect = (0, import_tracking.useSignals)();
90
+ try {
91
+ return /* @__PURE__ */ import_react2.default.createElement("div", {
92
+ ...props,
93
+ ref: forwardedRef,
94
+ className: cardRoot({
95
+ grow,
96
+ square,
97
+ noPadding
98
+ }, classNames)
99
+ }, children);
100
+ } finally {
101
+ _effect.f();
102
+ }
97
103
  });
98
104
  var CardHeader = ({ floating, classNames, children, ...props }) => {
99
- return /* @__PURE__ */ import_react2.default.createElement("div", {
100
- ...props,
101
- className: cardHeader({
102
- floating
103
- }, classNames)
104
- }, children);
105
+ var _effect = (0, import_tracking.useSignals)();
106
+ try {
107
+ return /* @__PURE__ */ import_react2.default.createElement("div", {
108
+ ...props,
109
+ className: cardHeader({
110
+ floating
111
+ }, classNames)
112
+ }, children);
113
+ } finally {
114
+ _effect.f();
115
+ }
105
116
  };
106
117
  var CardTitle = ({ center, title, classNames, ...props }) => {
107
- return /* @__PURE__ */ import_react2.default.createElement("div", {
108
- ...props,
109
- className: cardTitle({
110
- center
111
- }, classNames)
112
- }, title);
118
+ var _effect = (0, import_tracking.useSignals)();
119
+ try {
120
+ return /* @__PURE__ */ import_react2.default.createElement("div", {
121
+ ...props,
122
+ className: cardTitle({
123
+ center
124
+ }, classNames)
125
+ }, title);
126
+ } finally {
127
+ _effect.f();
128
+ }
113
129
  };
114
130
  var CardDragHandle = ({ position, classNames, ...props }) => {
115
- const density = (0, import_react_ui.useDensityContext)();
116
- return /* @__PURE__ */ import_react2.default.createElement("div", {
117
- ...props,
118
- className: cardDragHandle({
119
- density,
120
- position
121
- }, classNames)
122
- }, /* @__PURE__ */ import_react2.default.createElement(import_react.DotsSixVertical, {
123
- className: cardDragHandleIcon({})
124
- }));
131
+ var _effect = (0, import_tracking.useSignals)();
132
+ try {
133
+ const density = (0, import_react_ui.useDensityContext)();
134
+ return /* @__PURE__ */ import_react2.default.createElement("div", {
135
+ ...props,
136
+ className: cardDragHandle({
137
+ density,
138
+ position
139
+ }, classNames)
140
+ }, /* @__PURE__ */ import_react2.default.createElement(import_react.DotsSixVertical, {
141
+ className: cardDragHandleIcon({})
142
+ }));
143
+ } finally {
144
+ _effect.f();
145
+ }
125
146
  };
126
147
  var CardEndcap = ({ Icon = import_react.Circle, position, classNames, ...props }) => {
127
- const density = (0, import_react_ui.useDensityContext)();
128
- return /* @__PURE__ */ import_react2.default.createElement("div", {
129
- ...props,
130
- className: cardMenu({
131
- density,
132
- position
133
- }, classNames)
134
- }, /* @__PURE__ */ import_react2.default.createElement(Icon, {
135
- className: cardMenuIcon({})
136
- }));
148
+ var _effect = (0, import_tracking.useSignals)();
149
+ try {
150
+ const density = (0, import_react_ui.useDensityContext)();
151
+ return /* @__PURE__ */ import_react2.default.createElement("div", {
152
+ ...props,
153
+ className: cardMenu({
154
+ density,
155
+ position
156
+ }, classNames)
157
+ }, /* @__PURE__ */ import_react2.default.createElement(Icon, {
158
+ className: cardMenuIcon({})
159
+ }));
160
+ } finally {
161
+ _effect.f();
162
+ }
137
163
  };
138
164
  var CardMenu = /* @__PURE__ */ (0, import_react2.forwardRef)(({ children, position, classNames, ...props }, forwardRef2) => {
139
- const density = (0, import_react_ui.useDensityContext)();
140
- return /* @__PURE__ */ import_react2.default.createElement("div", {
141
- ...props,
142
- className: cardMenu({
143
- density,
144
- position
145
- }, classNames),
146
- ref: forwardRef2
147
- }, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.DropdownMenu.Root, null, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.DropdownMenu.Trigger, {
148
- asChild: true
149
- }, /* @__PURE__ */ import_react2.default.createElement(import_react.DotsThreeVertical, {
150
- className: cardMenuIcon({})
151
- })), /* @__PURE__ */ import_react2.default.createElement(import_react_ui.DropdownMenu.Content, null, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.DropdownMenu.Viewport, null, children))));
165
+ var _effect = (0, import_tracking.useSignals)();
166
+ try {
167
+ const density = (0, import_react_ui.useDensityContext)();
168
+ return /* @__PURE__ */ import_react2.default.createElement("div", {
169
+ ...props,
170
+ className: cardMenu({
171
+ density,
172
+ position
173
+ }, classNames),
174
+ ref: forwardRef2
175
+ }, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.DropdownMenu.Root, null, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.DropdownMenu.Trigger, {
176
+ asChild: true
177
+ }, /* @__PURE__ */ import_react2.default.createElement(import_react.DotsThreeVertical, {
178
+ className: cardMenuIcon({})
179
+ })), /* @__PURE__ */ import_react2.default.createElement(import_react_ui.DropdownMenu.Content, null, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.DropdownMenu.Viewport, null, children))));
180
+ } finally {
181
+ _effect.f();
182
+ }
152
183
  });
153
184
  var CardBody = ({ gutter, classNames, children, ...props }) => {
154
- const density = (0, import_react_ui.useDensityContext)();
155
- return /* @__PURE__ */ import_react2.default.createElement("div", {
156
- ...props,
157
- className: cardBody({
158
- density,
159
- gutter
160
- }, classNames)
161
- }, children);
185
+ var _effect = (0, import_tracking.useSignals)();
186
+ try {
187
+ const density = (0, import_react_ui.useDensityContext)();
188
+ return /* @__PURE__ */ import_react2.default.createElement("div", {
189
+ ...props,
190
+ className: cardBody({
191
+ density,
192
+ gutter
193
+ }, classNames)
194
+ }, children);
195
+ } finally {
196
+ _effect.f();
197
+ }
162
198
  };
163
199
  var CardMedia = ({ src, contain, classNames, ...props }) => {
164
- return /* @__PURE__ */ import_react2.default.createElement("div", {
165
- className: "flex grow overflow-hidden"
166
- }, /* @__PURE__ */ import_react2.default.createElement("img", {
167
- ...props,
168
- className: cardMedia({
169
- contain
170
- }, classNames),
171
- src
172
- }));
200
+ var _effect = (0, import_tracking.useSignals)();
201
+ try {
202
+ return /* @__PURE__ */ import_react2.default.createElement("div", {
203
+ className: "flex grow overflow-hidden"
204
+ }, /* @__PURE__ */ import_react2.default.createElement("img", {
205
+ ...props,
206
+ className: cardMedia({
207
+ contain
208
+ }, classNames),
209
+ src
210
+ }));
211
+ } finally {
212
+ _effect.f();
213
+ }
173
214
  };
174
215
  var Card = {
175
216
  Root: CardRoot,
package/dist/lib/node/index.cjs.map CHANGED
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/Card.tsx", "../../../src/theme.ts"],
4
4
  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { Circle, DotsSixVertical, DotsThreeVertical, type Icon } from '@phosphor-icons/react';\nimport { type Primitive } from '@radix-ui/react-primitive';\nimport React, {\n type ComponentPropsWithoutRef,\n type ComponentPropsWithRef,\n type FC,\n type PropsWithChildren,\n forwardRef,\n} from 'react';\n\nimport { useDensityContext, DropdownMenu, type ThemedClassName } from '@dxos/react-ui';\n\nimport {\n cardBody,\n cardDragHandle,\n cardDragHandleIcon,\n cardHeader,\n cardMedia,\n cardMenu,\n cardMenuIcon,\n cardRoot,\n cardTitle,\n} from '../theme';\n\ntype CardRootProps = ThemedClassName<ComponentPropsWithRef<typeof Primitive.div>> & {\n grow?: boolean;\n square?: boolean;\n noPadding?: boolean;\n};\n\n// TODO(burdon): Forward refs for all components?\nconst CardRoot = forwardRef<HTMLDivElement, CardRootProps>(\n ({ grow, square, noPadding, classNames, children, ...props }, forwardedRef) => {\n return (\n <div {...props} ref={forwardedRef} className={cardRoot({ grow, square, noPadding }, classNames)}>\n {children}\n </div>\n );\n },\n);\n\ntype CardHeaderProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { floating?: boolean };\n\nexport const CardHeader: FC<CardHeaderProps> = ({ floating, classNames, children, ...props }) => {\n return (\n <div {...props} className={cardHeader({ floating }, classNames)}>\n {children}\n </div>\n );\n};\n\ntype CardTitleProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {\n center?: boolean;\n title?: string;\n};\n\nexport const CardTitle: FC<CardTitleProps> = ({ center, title, classNames, ...props }) => {\n return (\n <div {...props} className={cardTitle({ center }, classNames)}>\n {title}\n </div>\n );\n};\n\n// TODO(burdon): Reuse ListItemEndcap?\ntype CardDragHandleProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { position?: 'left' | 'right' };\n\nconst CardDragHandle: FC<CardDragHandleProps> = ({ position, classNames, ...props }) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardDragHandle({ density, position }, classNames)}>\n <DotsSixVertical className={cardDragHandleIcon({})} />\n </div>\n );\n};\n\ntype CardEndcapProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { Icon?: Icon; position?: 'left' | 'right' };\n\nconst CardEndcap: FC<CardEndcapProps> = ({ Icon = Circle, position, classNames, ...props }) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardMenu({ density, position }, classNames)}>\n <Icon className={cardMenuIcon({})} />\n </div>\n );\n};\n\ntype CardMenuProps = PropsWithChildren<\n ThemedClassName<ComponentPropsWithoutRef<'div'>> & { position?: 'left' | 'right' }\n>;\n\n// TODO(burdon): Reconcile with Endcap (remove dropdown from here). See ListItem.Endcap (style icon/size?)\nconst CardMenu = forwardRef<HTMLDivElement, CardMenuProps>(\n ({ children, position, classNames, ...props }, forwardRef) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardMenu({ density, position }, classNames)} ref={forwardRef}>\n <DropdownMenu.Root>\n <DropdownMenu.Trigger asChild>\n <DotsThreeVertical className={cardMenuIcon({})} />\n </DropdownMenu.Trigger>\n {/* TODO(burdon): Position to the left of the menu button. */}\n <DropdownMenu.Content>\n <DropdownMenu.Viewport>{children}</DropdownMenu.Viewport>\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n </div>\n );\n },\n);\n\ntype CardBodyProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { gutter?: boolean };\n\nexport const CardBody: FC<CardBodyProps> = ({ gutter, classNames, children, ...props }) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardBody({ density, gutter }, classNames)}>\n {children}\n </div>\n );\n};\n\ntype CardMediaProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { src?: string; contain?: boolean };\n\n// TODO(burdon): Option to set to 50% of height of card.\nexport const CardMedia: FC<CardMediaProps> = ({ src, contain, classNames, ...props }) => {\n return (\n <div className='flex grow overflow-hidden'>\n <img {...props} className={cardMedia({ contain }, classNames)} src={src} />\n </div>\n );\n};\n\nexport const Card = {\n Root: CardRoot,\n Header: CardHeader,\n DragHandle: CardDragHandle,\n Endcap: CardEndcap,\n Menu: CardMenu,\n Title: CardTitle,\n Body: CardBody,\n Media: CardMedia,\n};\n\nexport type { CardRootProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type ComponentFunction, type Density, type Theme } from '@dxos/react-ui';\nimport { getSize, attentionSurface, mx } from '@dxos/react-ui-theme';\n\nconst defaults = {\n width: 'min-w-[256px]',\n};\n\nexport type CardStyleProps = Partial<{\n density: Density;\n grow?: boolean;\n square?: boolean;\n rounded?: boolean;\n noPadding?: boolean;\n}>;\n\nexport const cardRoot: ComponentFunction<CardStyleProps> = ({ grow, square, rounded = true }, ...etc) =>\n mx(\n 'flex flex-col group/card overflow-hidden',\n grow && 'h-full',\n defaults.width,\n attentionSurface,\n 'shadow', // TODO(burdon): Elevation?\n rounded && 'rounded',\n square && 'aspect-square',\n ...etc,\n );\n\nexport const cardHeader: ComponentFunction<CardStyleProps & { floating?: boolean }> = ({ floating }, ...etc) =>\n mx(floating ? 'relative' : 'flex w-full shrink-0 justify-between overflow-hidden items-center py-1', ...etc);\n\nexport const cardTitle: ComponentFunction<CardStyleProps & { center?: boolean }> = ({ center }, ...etc) =>\n mx('grow overflow-hidden truncate first:pl-4 last:pr-4', center && 'text-center', ...etc);\n\nexport const cardDragHandle: ComponentFunction<CardStyleProps & { position?: 'left' | 'right' }> = (\n { density, position },\n ...etc\n) =>\n mx(\n 'flex shrink-0 items-center justify-center select-none',\n density === 'fine' ? getSize(8) : getSize(10),\n position === 'left' && 'absolute top-1 left-1',\n position === 'right' && 'absolute top-1 right-1',\n position && 'text-black group-hover/card:bg-white group-hover/card:bg-opacity-80',\n ...etc,\n );\n\nexport const cardDragHandleIcon: ComponentFunction<CardStyleProps> = (_, ...etc) =>\n mx(getSize(5), 'cursor-pointer', ...etc);\n\n// TODO(burdon): Helper for DropdownMenu? Density, etc?\nexport const cardMenu: ComponentFunction<CardStyleProps & { position?: 'left' | 'right' }> = (\n { density, position },\n ...etc\n) =>\n mx(\n 'flex shrink-0 items-center justify-center',\n density === 'fine' ? getSize(8) : getSize(10),\n position === 'left' && 'absolute top-1 left-1',\n position === 'right' && 'absolute top-1 right-1',\n position && 'text-black group-hover/card:bg-white group-hover/card:bg-opacity-80',\n ...etc,\n );\n\nexport const cardMenuIcon: ComponentFunction<CardStyleProps> = (_, ...etc) => mx(getSize(5), 'cursor-pointer');\n\nexport const cardBody: ComponentFunction<CardStyleProps & { gutter?: boolean }> = (\n { density, gutter, noPadding },\n ...etc\n) =>\n mx(\n 'grow overflow-auto',\n !noPadding && 'px-2',\n // TODO(burdon): Create density-specific constants.\n gutter && (density === 'fine' ? 'pl-0 ml-[32px]' : 'pl-0 ml-[40px]'),\n ...etc,\n );\n\nexport const cardMedia: ComponentFunction<CardStyleProps & { contain?: boolean }> = ({ contain }, ...etc) =>\n mx(\n 'grow max-h-[300px]',\n // Hide broken image links (e.g., if offline).\n \"before:content-[' '] before:block before:w-full before:h-full before:border-0\",\n contain ? 'object-contain' : 'object-cover',\n ...etc,\n );\n\nexport const cardTheme: Theme<CardStyleProps> = {\n root: cardRoot,\n header: cardHeader,\n title: cardTitle,\n dragHandle: cardDragHandle,\n dragHandleIcon: cardDragHandleIcon,\n menu: cardMenu,\n menuIcon: cardMenuIcon,\n body: cardBody,\n media: cardMedia,\n};\n"],
5
- "mappings": "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",
5
+ "mappings": "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",
6
6
  "names": ["import_react", "defaults", "width", "cardRoot", "grow", "square", "rounded", "etc", "mx", "attentionSurface", "cardHeader", "floating", "cardTitle", "center", "cardDragHandle", "density", "position", "getSize", "cardDragHandleIcon", "_", "cardMenu", "cardMenuIcon", "cardBody", "gutter", "noPadding", "cardMedia", "contain", "cardTheme", "root", "header", "title", "dragHandle", "dragHandleIcon", "menu", "menuIcon", "body", "media", "CardRoot", "forwardRef", "classNames", "children", "props", "forwardedRef", "React", "div", "ref", "className", "CardHeader", "CardTitle", "CardDragHandle", "useDensityContext", "DotsSixVertical", "CardEndcap", "Icon", "Circle", "CardMenu", "DropdownMenu", "Root", "Trigger", "asChild", "DotsThreeVertical", "Content", "Viewport", "CardBody", "CardMedia", "src", "img", "Card", "Header", "DragHandle", "Endcap", "Menu", "Title", "Body", "Media"]
7
7
  }
package/dist/lib/node/meta.json CHANGED
@@ -1 +1 @@
1
- {"inputs":{"packages/ui/react-ui-card/src/theme.ts":{"bytes":9652,"imports":[{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-card/src/components/Card.tsx":{"bytes":14189,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"../theme"}],"format":"esm"},"packages/ui/react-ui-card/src/components/index.ts":{"bytes":500,"imports":[{"path":"packages/ui/react-ui-card/src/components/Card.tsx","kind":"import-statement","original":"./Card"}],"format":"esm"},"packages/ui/react-ui-card/src/index.ts":{"bytes":584,"imports":[{"path":"packages/ui/react-ui-card/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"./theme"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-card/dist/lib/node/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":12773},"packages/ui/react-ui-card/dist/lib/node/index.cjs":{"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["Card","CardBody","CardHeader","CardMedia","CardTitle","cardBody","cardDragHandle","cardDragHandleIcon","cardHeader","cardMedia","cardMenu","cardMenuIcon","cardRoot","cardTheme","cardTitle"],"entryPoint":"packages/ui/react-ui-card/src/index.ts","inputs":{"packages/ui/react-ui-card/src/components/Card.tsx":{"bytesInOutput":3096},"packages/ui/react-ui-card/src/theme.ts":{"bytesInOutput":2207},"packages/ui/react-ui-card/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-card/src/index.ts":{"bytesInOutput":0}},"bytes":5704}}}
1
+ {"inputs":{"packages/ui/react-ui-card/src/theme.ts":{"bytes":9584,"imports":[{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-card/src/components/Card.tsx":{"bytes":15142,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"../theme"}],"format":"esm"},"packages/ui/react-ui-card/src/components/index.ts":{"bytes":468,"imports":[{"path":"packages/ui/react-ui-card/src/components/Card.tsx","kind":"import-statement","original":"./Card"}],"format":"esm"},"packages/ui/react-ui-card/src/index.ts":{"bytes":552,"imports":[{"path":"packages/ui/react-ui-card/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"./theme"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-card/dist/lib/node/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":12814},"packages/ui/react-ui-card/dist/lib/node/index.cjs":{"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["Card","CardBody","CardHeader","CardMedia","CardTitle","cardBody","cardDragHandle","cardDragHandleIcon","cardHeader","cardMedia","cardMenu","cardMenuIcon","cardRoot","cardTheme","cardTitle"],"entryPoint":"packages/ui/react-ui-card/src/index.ts","inputs":{"packages/ui/react-ui-card/src/components/Card.tsx":{"bytesInOutput":3911},"packages/ui/react-ui-card/src/theme.ts":{"bytesInOutput":2207},"packages/ui/react-ui-card/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-card/src/index.ts":{"bytesInOutput":0}},"bytes":6519}}}
package/dist/lib/node-esm/index.mjs CHANGED
@@ -1,6 +1,7 @@
1
1
  import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
2
2
 
3
3
  // packages/ui/react-ui-card/src/components/Card.tsx
4
+ import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
4
5
  import { Circle, DotsSixVertical, DotsThreeVertical } from "@phosphor-icons/react";
5
6
  import React, { forwardRef } from "react";
6
7
  import { useDensityContext, DropdownMenu } from "@dxos/react-ui";
@@ -45,91 +46,131 @@ var cardTheme = {
45
46
 
46
47
  // packages/ui/react-ui-card/src/components/Card.tsx
47
48
  var CardRoot = /* @__PURE__ */ forwardRef(({ grow, square, noPadding, classNames, children, ...props }, forwardedRef) => {
48
- return /* @__PURE__ */ React.createElement("div", {
49
- ...props,
50
- ref: forwardedRef,
51
- className: cardRoot({
52
- grow,
53
- square,
54
- noPadding
55
- }, classNames)
56
- }, children);
49
+ var _effect = _useSignals();
50
+ try {
51
+ return /* @__PURE__ */ React.createElement("div", {
52
+ ...props,
53
+ ref: forwardedRef,
54
+ className: cardRoot({
55
+ grow,
56
+ square,
57
+ noPadding
58
+ }, classNames)
59
+ }, children);
60
+ } finally {
61
+ _effect.f();
62
+ }
57
63
  });
58
64
  var CardHeader = ({ floating, classNames, children, ...props }) => {
59
- return /* @__PURE__ */ React.createElement("div", {
60
- ...props,
61
- className: cardHeader({
62
- floating
63
- }, classNames)
64
- }, children);
65
+ var _effect = _useSignals();
66
+ try {
67
+ return /* @__PURE__ */ React.createElement("div", {
68
+ ...props,
69
+ className: cardHeader({
70
+ floating
71
+ }, classNames)
72
+ }, children);
73
+ } finally {
74
+ _effect.f();
75
+ }
65
76
  };
66
77
  var CardTitle = ({ center, title, classNames, ...props }) => {
67
- return /* @__PURE__ */ React.createElement("div", {
68
- ...props,
69
- className: cardTitle({
70
- center
71
- }, classNames)
72
- }, title);
78
+ var _effect = _useSignals();
79
+ try {
80
+ return /* @__PURE__ */ React.createElement("div", {
81
+ ...props,
82
+ className: cardTitle({
83
+ center
84
+ }, classNames)
85
+ }, title);
86
+ } finally {
87
+ _effect.f();
88
+ }
73
89
  };
74
90
  var CardDragHandle = ({ position, classNames, ...props }) => {
75
- const density = useDensityContext();
76
- return /* @__PURE__ */ React.createElement("div", {
77
- ...props,
78
- className: cardDragHandle({
79
- density,
80
- position
81
- }, classNames)
82
- }, /* @__PURE__ */ React.createElement(DotsSixVertical, {
83
- className: cardDragHandleIcon({})
84
- }));
91
+ var _effect = _useSignals();
92
+ try {
93
+ const density = useDensityContext();
94
+ return /* @__PURE__ */ React.createElement("div", {
95
+ ...props,
96
+ className: cardDragHandle({
97
+ density,
98
+ position
99
+ }, classNames)
100
+ }, /* @__PURE__ */ React.createElement(DotsSixVertical, {
101
+ className: cardDragHandleIcon({})
102
+ }));
103
+ } finally {
104
+ _effect.f();
105
+ }
85
106
  };
86
107
  var CardEndcap = ({ Icon = Circle, position, classNames, ...props }) => {
87
- const density = useDensityContext();
88
- return /* @__PURE__ */ React.createElement("div", {
89
- ...props,
90
- className: cardMenu({
91
- density,
92
- position
93
- }, classNames)
94
- }, /* @__PURE__ */ React.createElement(Icon, {
95
- className: cardMenuIcon({})
96
- }));
108
+ var _effect = _useSignals();
109
+ try {
110
+ const density = useDensityContext();
111
+ return /* @__PURE__ */ React.createElement("div", {
112
+ ...props,
113
+ className: cardMenu({
114
+ density,
115
+ position
116
+ }, classNames)
117
+ }, /* @__PURE__ */ React.createElement(Icon, {
118
+ className: cardMenuIcon({})
119
+ }));
120
+ } finally {
121
+ _effect.f();
122
+ }
97
123
  };
98
124
  var CardMenu = /* @__PURE__ */ forwardRef(({ children, position, classNames, ...props }, forwardRef2) => {
99
- const density = useDensityContext();
100
- return /* @__PURE__ */ React.createElement("div", {
101
- ...props,
102
- className: cardMenu({
103
- density,
104
- position
105
- }, classNames),
106
- ref: forwardRef2
107
- }, /* @__PURE__ */ React.createElement(DropdownMenu.Root, null, /* @__PURE__ */ React.createElement(DropdownMenu.Trigger, {
108
- asChild: true
109
- }, /* @__PURE__ */ React.createElement(DotsThreeVertical, {
110
- className: cardMenuIcon({})
111
- })), /* @__PURE__ */ React.createElement(DropdownMenu.Content, null, /* @__PURE__ */ React.createElement(DropdownMenu.Viewport, null, children))));
125
+ var _effect = _useSignals();
126
+ try {
127
+ const density = useDensityContext();
128
+ return /* @__PURE__ */ React.createElement("div", {
129
+ ...props,
130
+ className: cardMenu({
131
+ density,
132
+ position
133
+ }, classNames),
134
+ ref: forwardRef2
135
+ }, /* @__PURE__ */ React.createElement(DropdownMenu.Root, null, /* @__PURE__ */ React.createElement(DropdownMenu.Trigger, {
136
+ asChild: true
137
+ }, /* @__PURE__ */ React.createElement(DotsThreeVertical, {
138
+ className: cardMenuIcon({})
139
+ })), /* @__PURE__ */ React.createElement(DropdownMenu.Content, null, /* @__PURE__ */ React.createElement(DropdownMenu.Viewport, null, children))));
140
+ } finally {
141
+ _effect.f();
142
+ }
112
143
  });
113
144
  var CardBody = ({ gutter, classNames, children, ...props }) => {
114
- const density = useDensityContext();
115
- return /* @__PURE__ */ React.createElement("div", {
116
- ...props,
117
- className: cardBody({
118
- density,
119
- gutter
120
- }, classNames)
121
- }, children);
145
+ var _effect = _useSignals();
146
+ try {
147
+ const density = useDensityContext();
148
+ return /* @__PURE__ */ React.createElement("div", {
149
+ ...props,
150
+ className: cardBody({
151
+ density,
152
+ gutter
153
+ }, classNames)
154
+ }, children);
155
+ } finally {
156
+ _effect.f();
157
+ }
122
158
  };
123
159
  var CardMedia = ({ src, contain, classNames, ...props }) => {
124
- return /* @__PURE__ */ React.createElement("div", {
125
- className: "flex grow overflow-hidden"
126
- }, /* @__PURE__ */ React.createElement("img", {
127
- ...props,
128
- className: cardMedia({
129
- contain
130
- }, classNames),
131
- src
132
- }));
160
+ var _effect = _useSignals();
161
+ try {
162
+ return /* @__PURE__ */ React.createElement("div", {
163
+ className: "flex grow overflow-hidden"
164
+ }, /* @__PURE__ */ React.createElement("img", {
165
+ ...props,
166
+ className: cardMedia({
167
+ contain
168
+ }, classNames),
169
+ src
170
+ }));
171
+ } finally {
172
+ _effect.f();
173
+ }
133
174
  };
134
175
  var Card = {
135
176
  Root: CardRoot,
package/dist/lib/node-esm/index.mjs.map CHANGED
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/Card.tsx", "../../../src/theme.ts"],
4
4
  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { Circle, DotsSixVertical, DotsThreeVertical, type Icon } from '@phosphor-icons/react';\nimport { type Primitive } from '@radix-ui/react-primitive';\nimport React, {\n type ComponentPropsWithoutRef,\n type ComponentPropsWithRef,\n type FC,\n type PropsWithChildren,\n forwardRef,\n} from 'react';\n\nimport { useDensityContext, DropdownMenu, type ThemedClassName } from '@dxos/react-ui';\n\nimport {\n cardBody,\n cardDragHandle,\n cardDragHandleIcon,\n cardHeader,\n cardMedia,\n cardMenu,\n cardMenuIcon,\n cardRoot,\n cardTitle,\n} from '../theme';\n\ntype CardRootProps = ThemedClassName<ComponentPropsWithRef<typeof Primitive.div>> & {\n grow?: boolean;\n square?: boolean;\n noPadding?: boolean;\n};\n\n// TODO(burdon): Forward refs for all components?\nconst CardRoot = forwardRef<HTMLDivElement, CardRootProps>(\n ({ grow, square, noPadding, classNames, children, ...props }, forwardedRef) => {\n return (\n <div {...props} ref={forwardedRef} className={cardRoot({ grow, square, noPadding }, classNames)}>\n {children}\n </div>\n );\n },\n);\n\ntype CardHeaderProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { floating?: boolean };\n\nexport const CardHeader: FC<CardHeaderProps> = ({ floating, classNames, children, ...props }) => {\n return (\n <div {...props} className={cardHeader({ floating }, classNames)}>\n {children}\n </div>\n );\n};\n\ntype CardTitleProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & {\n center?: boolean;\n title?: string;\n};\n\nexport const CardTitle: FC<CardTitleProps> = ({ center, title, classNames, ...props }) => {\n return (\n <div {...props} className={cardTitle({ center }, classNames)}>\n {title}\n </div>\n );\n};\n\n// TODO(burdon): Reuse ListItemEndcap?\ntype CardDragHandleProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { position?: 'left' | 'right' };\n\nconst CardDragHandle: FC<CardDragHandleProps> = ({ position, classNames, ...props }) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardDragHandle({ density, position }, classNames)}>\n <DotsSixVertical className={cardDragHandleIcon({})} />\n </div>\n );\n};\n\ntype CardEndcapProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { Icon?: Icon; position?: 'left' | 'right' };\n\nconst CardEndcap: FC<CardEndcapProps> = ({ Icon = Circle, position, classNames, ...props }) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardMenu({ density, position }, classNames)}>\n <Icon className={cardMenuIcon({})} />\n </div>\n );\n};\n\ntype CardMenuProps = PropsWithChildren<\n ThemedClassName<ComponentPropsWithoutRef<'div'>> & { position?: 'left' | 'right' }\n>;\n\n// TODO(burdon): Reconcile with Endcap (remove dropdown from here). See ListItem.Endcap (style icon/size?)\nconst CardMenu = forwardRef<HTMLDivElement, CardMenuProps>(\n ({ children, position, classNames, ...props }, forwardRef) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardMenu({ density, position }, classNames)} ref={forwardRef}>\n <DropdownMenu.Root>\n <DropdownMenu.Trigger asChild>\n <DotsThreeVertical className={cardMenuIcon({})} />\n </DropdownMenu.Trigger>\n {/* TODO(burdon): Position to the left of the menu button. */}\n <DropdownMenu.Content>\n <DropdownMenu.Viewport>{children}</DropdownMenu.Viewport>\n </DropdownMenu.Content>\n </DropdownMenu.Root>\n </div>\n );\n },\n);\n\ntype CardBodyProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { gutter?: boolean };\n\nexport const CardBody: FC<CardBodyProps> = ({ gutter, classNames, children, ...props }) => {\n const density = useDensityContext();\n return (\n <div {...props} className={cardBody({ density, gutter }, classNames)}>\n {children}\n </div>\n );\n};\n\ntype CardMediaProps = ThemedClassName<ComponentPropsWithoutRef<'div'>> & { src?: string; contain?: boolean };\n\n// TODO(burdon): Option to set to 50% of height of card.\nexport const CardMedia: FC<CardMediaProps> = ({ src, contain, classNames, ...props }) => {\n return (\n <div className='flex grow overflow-hidden'>\n <img {...props} className={cardMedia({ contain }, classNames)} src={src} />\n </div>\n );\n};\n\nexport const Card = {\n Root: CardRoot,\n Header: CardHeader,\n DragHandle: CardDragHandle,\n Endcap: CardEndcap,\n Menu: CardMenu,\n Title: CardTitle,\n Body: CardBody,\n Media: CardMedia,\n};\n\nexport type { CardRootProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type ComponentFunction, type Density, type Theme } from '@dxos/react-ui';\nimport { getSize, attentionSurface, mx } from '@dxos/react-ui-theme';\n\nconst defaults = {\n width: 'min-w-[256px]',\n};\n\nexport type CardStyleProps = Partial<{\n density: Density;\n grow?: boolean;\n square?: boolean;\n rounded?: boolean;\n noPadding?: boolean;\n}>;\n\nexport const cardRoot: ComponentFunction<CardStyleProps> = ({ grow, square, rounded = true }, ...etc) =>\n mx(\n 'flex flex-col group/card overflow-hidden',\n grow && 'h-full',\n defaults.width,\n attentionSurface,\n 'shadow', // TODO(burdon): Elevation?\n rounded && 'rounded',\n square && 'aspect-square',\n ...etc,\n );\n\nexport const cardHeader: ComponentFunction<CardStyleProps & { floating?: boolean }> = ({ floating }, ...etc) =>\n mx(floating ? 'relative' : 'flex w-full shrink-0 justify-between overflow-hidden items-center py-1', ...etc);\n\nexport const cardTitle: ComponentFunction<CardStyleProps & { center?: boolean }> = ({ center }, ...etc) =>\n mx('grow overflow-hidden truncate first:pl-4 last:pr-4', center && 'text-center', ...etc);\n\nexport const cardDragHandle: ComponentFunction<CardStyleProps & { position?: 'left' | 'right' }> = (\n { density, position },\n ...etc\n) =>\n mx(\n 'flex shrink-0 items-center justify-center select-none',\n density === 'fine' ? getSize(8) : getSize(10),\n position === 'left' && 'absolute top-1 left-1',\n position === 'right' && 'absolute top-1 right-1',\n position && 'text-black group-hover/card:bg-white group-hover/card:bg-opacity-80',\n ...etc,\n );\n\nexport const cardDragHandleIcon: ComponentFunction<CardStyleProps> = (_, ...etc) =>\n mx(getSize(5), 'cursor-pointer', ...etc);\n\n// TODO(burdon): Helper for DropdownMenu? Density, etc?\nexport const cardMenu: ComponentFunction<CardStyleProps & { position?: 'left' | 'right' }> = (\n { density, position },\n ...etc\n) =>\n mx(\n 'flex shrink-0 items-center justify-center',\n density === 'fine' ? getSize(8) : getSize(10),\n position === 'left' && 'absolute top-1 left-1',\n position === 'right' && 'absolute top-1 right-1',\n position && 'text-black group-hover/card:bg-white group-hover/card:bg-opacity-80',\n ...etc,\n );\n\nexport const cardMenuIcon: ComponentFunction<CardStyleProps> = (_, ...etc) => mx(getSize(5), 'cursor-pointer');\n\nexport const cardBody: ComponentFunction<CardStyleProps & { gutter?: boolean }> = (\n { density, gutter, noPadding },\n ...etc\n) =>\n mx(\n 'grow overflow-auto',\n !noPadding && 'px-2',\n // TODO(burdon): Create density-specific constants.\n gutter && (density === 'fine' ? 'pl-0 ml-[32px]' : 'pl-0 ml-[40px]'),\n ...etc,\n );\n\nexport const cardMedia: ComponentFunction<CardStyleProps & { contain?: boolean }> = ({ contain }, ...etc) =>\n mx(\n 'grow max-h-[300px]',\n // Hide broken image links (e.g., if offline).\n \"before:content-[' '] before:block before:w-full before:h-full before:border-0\",\n contain ? 'object-contain' : 'object-cover',\n ...etc,\n );\n\nexport const cardTheme: Theme<CardStyleProps> = {\n root: cardRoot,\n header: cardHeader,\n title: cardTitle,\n dragHandle: cardDragHandle,\n dragHandleIcon: cardDragHandleIcon,\n menu: cardMenu,\n menuIcon: cardMenuIcon,\n body: cardBody,\n media: cardMedia,\n};\n"],
5
- "mappings": "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",
5
+ "mappings": "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",
6
6
  "names": ["Circle", "DotsSixVertical", "DotsThreeVertical", "React", "forwardRef", "useDensityContext", "DropdownMenu", "getSize", "attentionSurface", "mx", "defaults", "width", "cardRoot", "grow", "square", "rounded", "etc", "mx", "attentionSurface", "cardHeader", "floating", "cardTitle", "center", "cardDragHandle", "density", "position", "getSize", "cardDragHandleIcon", "_", "cardMenu", "cardMenuIcon", "cardBody", "gutter", "noPadding", "cardMedia", "contain", "cardTheme", "root", "header", "title", "dragHandle", "dragHandleIcon", "menu", "menuIcon", "body", "media", "CardRoot", "forwardRef", "grow", "square", "noPadding", "classNames", "children", "props", "forwardedRef", "div", "ref", "className", "cardRoot", "CardHeader", "floating", "cardHeader", "CardTitle", "center", "title", "cardTitle", "CardDragHandle", "position", "density", "useDensityContext", "cardDragHandle", "DotsSixVertical", "cardDragHandleIcon", "CardEndcap", "Icon", "Circle", "cardMenu", "cardMenuIcon", "CardMenu", "DropdownMenu", "Root", "Trigger", "asChild", "DotsThreeVertical", "Content", "Viewport", "CardBody", "gutter", "cardBody", "CardMedia", "src", "contain", "img", "cardMedia", "Card", "Header", "DragHandle", "Endcap", "Menu", "Title", "Body", "Media"]
7
7
  }
package/dist/lib/node-esm/meta.json CHANGED
@@ -1 +1 @@
1
- {"inputs":{"packages/ui/react-ui-card/src/theme.ts":{"bytes":9652,"imports":[{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-card/src/components/Card.tsx":{"bytes":14189,"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"../theme"}],"format":"esm"},"packages/ui/react-ui-card/src/components/index.ts":{"bytes":500,"imports":[{"path":"packages/ui/react-ui-card/src/components/Card.tsx","kind":"import-statement","original":"./Card"}],"format":"esm"},"packages/ui/react-ui-card/src/index.ts":{"bytes":584,"imports":[{"path":"packages/ui/react-ui-card/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"./theme"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-card/dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":12775},"packages/ui/react-ui-card/dist/lib/node-esm/index.mjs":{"imports":[{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["Card","CardBody","CardHeader","CardMedia","CardTitle","cardBody","cardDragHandle","cardDragHandleIcon","cardHeader","cardMedia","cardMenu","cardMenuIcon","cardRoot","cardTheme","cardTitle"],"entryPoint":"packages/ui/react-ui-card/src/index.ts","inputs":{"packages/ui/react-ui-card/src/components/Card.tsx":{"bytesInOutput":3096},"packages/ui/react-ui-card/src/theme.ts":{"bytesInOutput":2207},"packages/ui/react-ui-card/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-card/src/index.ts":{"bytesInOutput":0}},"bytes":5797}}}
1
+ {"inputs":{"packages/ui/react-ui-card/src/theme.ts":{"bytes":9584,"imports":[{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"packages/ui/react-ui-card/src/components/Card.tsx":{"bytes":15142,"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"../theme"}],"format":"esm"},"packages/ui/react-ui-card/src/components/index.ts":{"bytes":468,"imports":[{"path":"packages/ui/react-ui-card/src/components/Card.tsx","kind":"import-statement","original":"./Card"}],"format":"esm"},"packages/ui/react-ui-card/src/index.ts":{"bytes":552,"imports":[{"path":"packages/ui/react-ui-card/src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"packages/ui/react-ui-card/src/theme.ts","kind":"import-statement","original":"./theme"}],"format":"esm"}},"outputs":{"packages/ui/react-ui-card/dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":12816},"packages/ui/react-ui-card/dist/lib/node-esm/index.mjs":{"imports":[{"path":"@preact-signals/safe-react/tracking","kind":"import-statement","external":true},{"path":"@phosphor-icons/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"exports":["Card","CardBody","CardHeader","CardMedia","CardTitle","cardBody","cardDragHandle","cardDragHandleIcon","cardHeader","cardMedia","cardMenu","cardMenuIcon","cardRoot","cardTheme","cardTitle"],"entryPoint":"packages/ui/react-ui-card/src/index.ts","inputs":{"packages/ui/react-ui-card/src/components/Card.tsx":{"bytesInOutput":3911},"packages/ui/react-ui-card/src/theme.ts":{"bytesInOutput":2207},"packages/ui/react-ui-card/src/components/index.ts":{"bytesInOutput":0},"packages/ui/react-ui-card/src/index.ts":{"bytesInOutput":0}},"bytes":6612}}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dxos/react-ui-card",
3
- "version": "0.8.2-main.fbd8ed0",
3
+ "version": "0.8.2-staging.4d6ad0f",
4
4
  "description": "An opinionated card component.",
5
5
  "homepage": "https://dxos.org",
6
6
  "bugs": "https://github.com/dxos/dxos/issues",
@@ -24,6 +24,7 @@
24
24
  "src"
25
25
  ],
26
26
  "dependencies": {
27
+ "@preact-signals/safe-react": "^0.9.0",
27
28
  "@radix-ui/react-primitive": "2.0.2"
28
29
  },
29
30
  "devDependencies": {
@@ -36,18 +37,18 @@
36
37
  "react": "~18.2.0",
37
38
  "react-dom": "~18.2.0",
38
39
  "vite": "5.4.7",
39
- "@dxos/react-ui": "0.8.2-main.fbd8ed0",
40
- "@dxos/random": "0.8.2-main.fbd8ed0",
41
- "@dxos/react-ui-theme": "0.8.2-main.fbd8ed0",
42
- "@dxos/storybook-utils": "0.8.2-main.fbd8ed0",
43
- "@dxos/util": "0.8.2-main.fbd8ed0"
40
+ "@dxos/react-ui": "0.8.2-staging.4d6ad0f",
41
+ "@dxos/random": "0.8.2-staging.4d6ad0f",
42
+ "@dxos/react-ui-theme": "0.8.2-staging.4d6ad0f",
43
+ "@dxos/util": "0.8.2-staging.4d6ad0f",
44
+ "@dxos/storybook-utils": "0.8.2-staging.4d6ad0f"
44
45
  },
45
46
  "peerDependencies": {
46
47
  "@phosphor-icons/react": "^2.1.5",
47
48
  "react": "~18.2.0",
48
49
  "react-dom": "~18.2.0",
49
- "@dxos/react-ui": "0.8.2-main.fbd8ed0",
50
- "@dxos/react-ui-theme": "0.8.2-main.fbd8ed0"
50
+ "@dxos/react-ui": "0.8.2-staging.4d6ad0f",
51
+ "@dxos/react-ui-theme": "0.8.2-staging.4d6ad0f"
51
52
  },
52
53
  "publishConfig": {
53
54
  "access": "public"