@dxos/react-ui-card 0.8.2-main.f081794 → 0.8.2-main.f11618f
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.
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/Card.tsx", "../../../src/theme.ts"],
|
|
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
|
|
5
|
-
"mappings": ";AAIA,SAASA,QAAQC,iBAAiBC,yBAAoC;AAEtE,OAAOC,
|
|
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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",
|
|
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
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/Card.tsx", "../../../src/theme.ts"],
|
|
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
|
|
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
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
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/Card.tsx", "../../../src/theme.ts"],
|
|
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
|
|
5
|
-
"mappings": ";;;AAIA,SAASA,QAAQC,iBAAiBC,yBAAoC;AAEtE,OAAOC,
|
|
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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",
|
|
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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dxos/react-ui-card",
|
|
3
|
-
"version": "0.8.2-main.
|
|
3
|
+
"version": "0.8.2-main.f11618f",
|
|
4
4
|
"description": "An opinionated card component.",
|
|
5
5
|
"homepage": "https://dxos.org",
|
|
6
6
|
"bugs": "https://github.com/dxos/dxos/issues",
|
|
@@ -36,18 +36,18 @@
|
|
|
36
36
|
"react": "~18.2.0",
|
|
37
37
|
"react-dom": "~18.2.0",
|
|
38
38
|
"vite": "5.4.7",
|
|
39
|
-
"@dxos/random": "0.8.2-main.
|
|
40
|
-
"@dxos/react-ui": "0.8.2-main.
|
|
41
|
-
"@dxos/react-ui
|
|
42
|
-
"@dxos/
|
|
43
|
-
"@dxos/
|
|
39
|
+
"@dxos/random": "0.8.2-main.f11618f",
|
|
40
|
+
"@dxos/react-ui-theme": "0.8.2-main.f11618f",
|
|
41
|
+
"@dxos/react-ui": "0.8.2-main.f11618f",
|
|
42
|
+
"@dxos/storybook-utils": "0.8.2-main.f11618f",
|
|
43
|
+
"@dxos/util": "0.8.2-main.f11618f"
|
|
44
44
|
},
|
|
45
45
|
"peerDependencies": {
|
|
46
46
|
"@phosphor-icons/react": "^2.1.5",
|
|
47
47
|
"react": "~18.2.0",
|
|
48
48
|
"react-dom": "~18.2.0",
|
|
49
|
-
"@dxos/react-ui": "0.8.2-main.
|
|
50
|
-
"@dxos/react-ui-theme": "0.8.2-main.
|
|
49
|
+
"@dxos/react-ui": "0.8.2-main.f11618f",
|
|
50
|
+
"@dxos/react-ui-theme": "0.8.2-main.f11618f"
|
|
51
51
|
},
|
|
52
52
|
"publishConfig": {
|
|
53
53
|
"access": "public"
|
package/src/components/Card.tsx
CHANGED