@guardian/stand 0.0.15 → 0.0.16

package/dist/components/menu/styles.js

@@ -0,0 +1,88 @@
+import { css } from '@emotion/react';
+import { componentMenu } from '../../styleD/build/typescript/component/menu.js';
+import { convertTypographyToEmotionStringStyle } from '../../styleD/utils/semantic/typography.js';
+
+const defaultMenuTheme = componentMenu.menu;
+const menuStyles = (theme) => css`
+	display: ${theme.shared.display};
+	flex-direction: ${theme.shared["flex-direction"]};
+	border: ${theme.shared.border};
+	background: ${theme.shared["background-color"]};
+`;
+const defaultMenuSectionTheme = componentMenu.menuSection;
+const menuSectionHeaderStyles = (theme, { size }) => css`
+	display: ${theme.header.shared.display};
+	align-items: ${theme.header.shared["align-items"]};
+	padding: ${theme.header.shared.padding.top}
+		${theme.header.shared.padding.right} ${theme.header.shared.padding.bottom}
+		${theme.header.shared.padding.left};
+	height: ${theme.header[size].height};
+	background: ${theme.header.shared["background-color"]};
+	color: ${theme.header.shared.color};
+	${convertTypographyToEmotionStringStyle(theme.header[size].typography)}
+`;
+const defaultMenuItemTheme = componentMenu.menuItem;
+const menuItemStyles = (theme, { description }, isFocusVisible = false) => css`
+	display: ${theme.shared.display};
+	grid-template-columns: ${theme.shared["grid-template-columns"]};
+	grid-template-areas: ${description ? theme.shared["grid-template-areas-with-description"] : theme.shared["grid-template-areas"]};
+	gap: ${theme.shared.gap};
+	align-items: ${theme.shared["align-items"]};
+	padding: ${theme.shared.padding.top} ${theme.shared.padding.right}
+		${theme.shared.padding.bottom} ${theme.shared.padding.left};
+	border-bottom: ${theme.shared["border-bottom"]};
+	&:last-child {
+		border-bottom: ${theme.shared[":last-child"]["border-bottom"]};
+	}
+	&[data-hovered],
+	&:hover {
+		background: ${theme.shared[":hover"]["background-color"]};
+	}
+	${isFocusVisible ? css`
+				outline: ${theme.shared[":focus-visible"]["outline"]};
+				outline-offset: ${theme.shared[":focus-visible"]["outline-offset"]};
+				background: ${theme.shared[":hover"]["background-color"]};
+			` : css`
+				outline: none;
+			`}
+`;
+const menuItemIconStyles = (theme, { size }) => css`
+	grid-area: ${theme.shared.icon["grid-area"]};
+	align-self: ${theme.shared.icon["align-self"]};
+	color: ${theme.shared.icon.color};
+	/* Ensure the line-height matches the font line-height of the label for alignment */
+	line-height: ${theme[size].icon["line-height"]};
+`;
+const menuItemLabelStyles = (theme) => css`
+	grid-area: ${theme.shared.label["grid-area"]};
+	color: ${theme.shared.label.color};
+	${convertTypographyToEmotionStringStyle(theme.shared.label.typography)}
+	)}
+`;
+const menuItemDescriptionStyles = (theme) => css`
+	grid-area: ${theme.shared.description["grid-area"]};
+	color: ${theme.shared.description.color};
+	${convertTypographyToEmotionStringStyle(theme.shared.description.typography)}
+`;
+const menuItemAsideStyles = (theme) => css`
+	grid-area: ${theme.shared.aside["grid-area"]};
+	justify-self: ${theme.shared.aside["justify-self"]};
+	align-self: ${theme.shared.aside["align-self"]};
+	color: ${theme.shared.aside.color};
+	${convertTypographyToEmotionStringStyle(theme.shared.aside.typography)}
+`;
+const defaultMenuSeparatorTheme = componentMenu.menuSeparator;
+const menuSeparatorStyles = (theme) => css`
+	background-color: ${theme.shared["background-color"]};
+	height: ${theme.shared.height};
+	width: ${theme.shared.width};
+`;
+const defaultMenuPopoverTheme = componentMenu.menuPopover;
+const menuPopoverStyles = (theme, { size }) => css`
+	overflow: ${theme.shared.overflow};
+	max-width: ${theme[size]["max-width"]};
+	width: ${theme[size].width};
+	box-shadow: ${theme.shared.shadow};
+`;
+
+export { defaultMenuItemTheme, defaultMenuPopoverTheme, defaultMenuSectionTheme, defaultMenuSeparatorTheme, defaultMenuTheme, menuItemAsideStyles, menuItemDescriptionStyles, menuItemIconStyles, menuItemLabelStyles, menuItemStyles, menuPopoverStyles, menuSectionHeaderStyles, menuSeparatorStyles, menuStyles };

package/dist/components/tag-picker/TagTable.cjs

@@ -1,8 +1,8 @@
 'use strict';
 
 var jsxRuntime = require('@emotion/react/jsx-runtime');
-var react$1 = require('@emotion/react');
-var react = require('react');
+var react = require('@emotion/react');
+var React = require('react');
 var reactAriaComponents = require('react-aria-components');
 var styles = require('./styles.cjs');
 
@@ -28,10 +28,10 @@ function TagTable({
   cssOverrides
 }) {
   const canDrag = !!onReorder;
-  const [localRows, setLocalRows] = react.useState(() => [...rows]);
-  const localRowsRef = react.useRef(localRows);
+  const [localRows, setLocalRows] = React.useState(() => [...rows]);
+  const localRowsRef = React.useRef(localRows);
   localRowsRef.current = localRows;
-  react.useEffect(() => {
+  React.useEffect(() => {
     setLocalRows([...rows]);
   }, [rows]);
   const filtered = localRows.filter(filterRows);
@@ -99,7 +99,7 @@ function TagTable({
                   reactAriaComponents.Cell,
                   {
                     css: [
-                      react$1.css`
+                      react.css`
 											width: 1%;
 										`
                     ],
@@ -111,7 +111,7 @@ function TagTable({
                   {
                     css: [
                       styles.tagTableCellStyles(theme),
-                      react$1.css`
+                      react.css`
 											position: relative;
 											width: 15%;
 										`
@@ -124,7 +124,7 @@ function TagTable({
                   {
                     css: [
                       styles.tagTableCellStyles(theme),
-                      react$1.css`
+                      react.css`
 										width: 50%;
 									`
                     ],
@@ -137,7 +137,7 @@ function TagTable({
                   {
                     css: [
                       styles.tagTableCellStyles(theme),
-                      react$1.css`
+                      react.css`
 											width: 20%;
 										`
                     ],
@@ -149,7 +149,7 @@ function TagTable({
                   {
                     css: [
                       styles.tagTableCellStyles(theme),
-                      react$1.css`
+                      react.css`
 											text-align: center;
 											width: 10%;
 										`
@@ -172,7 +172,7 @@ function TagTable({
                   {
                     css: [
                       styles.tagTableCellStyles(theme),
-                      react$1.css`
+                      react.css`
 											text-align: center;
 											width: 10%;
 										`

package/dist/index.cjs

@@ -9,6 +9,7 @@ var button = require('./styleD/build/typescript/component/button.cjs');
 var typography$1 = require('./styleD/build/typescript/component/typography.cjs');
 var icon = require('./styleD/build/typescript/component/icon.cjs');
 var favicon = require('./styleD/build/typescript/component/favicon.cjs');
+var menu = require('./styleD/build/typescript/component/menu.cjs');
 var TopBar = require('./styleD/build/typescript/component/TopBar.cjs');
 var colors = require('./styleD/build/typescript/base/colors.cjs');
 var typography = require('./styleD/build/typescript/base/typography.cjs');
@@ -18,6 +19,7 @@ var radius = require('./styleD/build/typescript/base/radius.cjs');
 var colors$1 = require('./styleD/build/typescript/semantic/colors.cjs');
 var typography$2 = require('./styleD/build/typescript/semantic/typography.cjs');
 var sizing$1 = require('./styleD/build/typescript/semantic/sizing.cjs');
+var shadow = require('./styleD/build/typescript/semantic/shadow.cjs');
 
 
 
@@ -30,6 +32,7 @@ exports.componentButton = button.componentButton;
 exports.componentTypography = typography$1.componentTypography;
 exports.componentIcon = icon.componentIcon;
 exports.componentFavicon = favicon.componentFavicon;
+exports.componentMenu = menu.componentMenu;
 exports.componentTopBar = TopBar.componentTopBar;
 exports.baseColors = colors.baseColors;
 exports.baseTypography = typography.baseTypography;
@@ -39,3 +42,4 @@ exports.baseRadius = radius.baseRadius;
 exports.semanticColors = colors$1.semanticColors;
 exports.semanticTypography = typography$2.semanticTypography;
 exports.semanticSizing = sizing$1.semanticSizing;
+exports.semanticShadow = shadow.semanticShadow;

package/dist/index.js

@@ -7,6 +7,7 @@ export { componentButton } from './styleD/build/typescript/component/button.js';
 export { componentTypography } from './styleD/build/typescript/component/typography.js';
 export { componentIcon } from './styleD/build/typescript/component/icon.js';
 export { componentFavicon } from './styleD/build/typescript/component/favicon.js';
+export { componentMenu } from './styleD/build/typescript/component/menu.js';
 export { componentTopBar } from './styleD/build/typescript/component/TopBar.js';
 export { baseColors } from './styleD/build/typescript/base/colors.js';
 export { baseTypography } from './styleD/build/typescript/base/typography.js';
@@ -16,3 +17,4 @@ export { baseRadius } from './styleD/build/typescript/base/radius.js';
 export { semanticColors } from './styleD/build/typescript/semantic/colors.js';
 export { semanticTypography } from './styleD/build/typescript/semantic/typography.js';
 export { semanticSizing } from './styleD/build/typescript/semantic/sizing.js';
+export { semanticShadow } from './styleD/build/typescript/semantic/shadow.js';

package/dist/menu.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+var Menu = require('./components/menu/Menu.cjs');
+var menu = require('./styleD/build/typescript/component/menu.cjs');
+
+
+
+exports.Menu = Menu.Menu;
+exports.MenuItem = Menu.MenuItem;
+exports.MenuSection = Menu.MenuSection;
+exports.MenuSeparator = Menu.MenuSeparator;
+exports.MenuToggle = Menu.MenuToggle;
+exports.componentMenu = menu.componentMenu;

package/dist/menu.js

@@ -0,0 +1,2 @@
+export { Menu, MenuItem, MenuSection, MenuSeparator, MenuToggle } from './components/menu/Menu.js';
+export { componentMenu } from './styleD/build/typescript/component/menu.js';

package/dist/styleD/build/css/component/menu.css

@@ -0,0 +1,82 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+	--component-menu-menu-shared-display: flex;
+	--component-menu-menu-shared-flex-direction: column;
+	--component-menu-menu-shared-background-color: #ffffff;
+	--component-menu-menu-shared-border: 0.0625rem solid #cccccc;
+	--component-menu-menu-section-header-shared-display: flex;
+	--component-menu-menu-section-header-shared-align-items: center;
+	--component-menu-menu-section-header-shared-padding-top: 0;
+	--component-menu-menu-section-header-shared-padding-right: 0.5rem;
+	--component-menu-menu-section-header-shared-padding-bottom: 0;
+	--component-menu-menu-section-header-shared-padding-left: 0.5rem;
+	--component-menu-menu-section-header-shared-background-color: #ededed;
+	--component-menu-menu-section-header-shared-color: #000000;
+	--component-menu-menu-section-header-sm-height: 1.5rem;
+	--component-menu-menu-section-header-sm-typography-font: normal 700 0.875rem/1
+		'Open Sans';
+	--component-menu-menu-section-header-sm-typography-letter-spacing: -0.0125rem;
+	--component-menu-menu-section-header-sm-typography-font-width: 95;
+	--component-menu-menu-section-header-md-height: 2rem;
+	--component-menu-menu-section-header-md-typography-font: normal 700 1rem/1
+		'Open Sans';
+	--component-menu-menu-section-header-md-typography-letter-spacing: -0.0125rem;
+	--component-menu-menu-section-header-md-typography-font-width: 95;
+	--component-menu-menu-item-shared-display: grid;
+	--component-menu-menu-item-shared-grid-template-areas: 'icon label aside';
+	--component-menu-menu-item-shared-grid-template-areas-with-description: 'icon label aside'
+		'. description .';
+	--component-menu-menu-item-shared-grid-template-columns: auto 6fr 1fr;
+	--component-menu-menu-item-shared-gap: 0.25rem;
+	--component-menu-menu-item-shared-align-items: center;
+	--component-menu-menu-item-shared-padding-top: 0.75rem;
+	--component-menu-menu-item-shared-padding-right: 1rem;
+	--component-menu-menu-item-shared-padding-bottom: 0.75rem;
+	--component-menu-menu-item-shared-padding-left: 1rem;
+	--component-menu-menu-item-shared-border-bottom: 0.0625rem solid #cccccc;
+	--component-menu-menu-item-shared-icon-grid-area: icon;
+	--component-menu-menu-item-shared-icon-align-self: start;
+	--component-menu-menu-item-shared-icon-color: #545454;
+	--component-menu-menu-item-shared-label-grid-area: label;
+	--component-menu-menu-item-shared-label-color: #000000;
+	--component-menu-menu-item-shared-label-typography-font: normal 460 1rem/1.3
+		'Open Sans';
+	--component-menu-menu-item-shared-label-typography-letter-spacing: 0rem;
+	--component-menu-menu-item-shared-label-typography-font-width: 95;
+	--component-menu-menu-item-shared-description-grid-area: description;
+	--component-menu-menu-item-shared-description-color: #545454;
+	--component-menu-menu-item-shared-description-typography-font: normal 460
+		0.875rem/1.3 'Open Sans';
+	--component-menu-menu-item-shared-description-typography-letter-spacing: 0rem;
+	--component-menu-menu-item-shared-description-typography-font-width: 95;
+	--component-menu-menu-item-shared-aside-grid-area: aside;
+	--component-menu-menu-item-shared-aside-justify-self: end;
+	--component-menu-menu-item-shared-aside-align-self: start;
+	--component-menu-menu-item-shared-aside-color: #000000;
+	--component-menu-menu-item-shared-aside-typography-font: normal 460 1rem/1.3
+		'Open Sans';
+	--component-menu-menu-item-shared-aside-typography-letter-spacing: 0rem;
+	--component-menu-menu-item-shared-aside-typography-font-width: 95;
+	--component-menu-menu-item-shared-last-child-border-bottom: none;
+	--component-menu-menu-item-shared-hover-background-color: #ededed;
+	--component-menu-menu-item-shared-focus-visible-outline: 0.125rem solid
+		#0072a9;
+	--component-menu-menu-item-shared-focus-visible-outline-offset: -0.125rem;
+	--component-menu-menu-item-sm-icon-size: 1.125rem;
+	--component-menu-menu-item-sm-icon-line-height: 1.3;
+	--component-menu-menu-item-md-icon-size: 1.25rem;
+	--component-menu-menu-item-md-icon-line-height: 1.3;
+	--component-menu-menu-separator-shared-background-color: #ededed;
+	--component-menu-menu-separator-shared-height: 0.5rem;
+	--component-menu-menu-separator-shared-width: 100%;
+	--component-menu-menu-popover-shared-overflow: auto;
+	--component-menu-menu-popover-shared-shadow: 0 0.125rem 0.375rem 0
+		rgb(0% 0% 0% / 0.3);
+	--component-menu-menu-popover-sm-max-width: 200px;
+	--component-menu-menu-popover-sm-width: 100%;
+	--component-menu-menu-popover-md-max-width: 320px;
+	--component-menu-menu-popover-md-width: 100%;
+}

package/dist/styleD/build/css/semantic/shadow.css

@@ -0,0 +1,7 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+:root {
+	--semantic-shadow-raised: 0 0.125rem 0.375rem 0 rgb(0% 0% 0% / 0.3);
+}

package/dist/styleD/build/typescript/component/menu.cjs

@@ -0,0 +1,140 @@
+'use strict';
+
+const componentMenu = {
+  menu: {
+    shared: {
+      display: "flex",
+      "flex-direction": "column",
+      "background-color": "#ffffff",
+      border: "0.0625rem solid #cccccc"
+    }
+  },
+  menuSection: {
+    header: {
+      shared: {
+        display: "flex",
+        "align-items": "center",
+        padding: {
+          top: "0",
+          right: "0.5rem",
+          bottom: "0",
+          left: "0.5rem"
+        },
+        "background-color": "#ededed",
+        color: "#000000"
+      },
+      sm: {
+        height: "1.5rem",
+        typography: {
+          font: "normal 700 0.875rem/1 Open Sans",
+          letterSpacing: "-0.0125rem",
+          fontWidth: 95
+        }
+      },
+      md: {
+        height: "2rem",
+        typography: {
+          font: "normal 700 1rem/1 Open Sans",
+          letterSpacing: "-0.0125rem",
+          fontWidth: 95
+        }
+      }
+    }
+  },
+  menuItem: {
+    shared: {
+      display: "grid",
+      "grid-template-areas": "'icon label aside'",
+      "grid-template-areas-with-description": "'icon label aside' '. description .'",
+      "grid-template-columns": "auto 6fr 1fr",
+      gap: "0.25rem",
+      "align-items": "center",
+      padding: {
+        top: "0.75rem",
+        right: "1rem",
+        bottom: "0.75rem",
+        left: "1rem"
+      },
+      "border-bottom": "0.0625rem solid #cccccc",
+      icon: {
+        "grid-area": "icon",
+        "align-self": "start",
+        color: "#545454"
+      },
+      label: {
+        "grid-area": "label",
+        color: "#000000",
+        typography: {
+          font: "normal 460 1rem/1.3 Open Sans",
+          letterSpacing: "0rem",
+          fontWidth: 95
+        }
+      },
+      description: {
+        "grid-area": "description",
+        color: "#545454",
+        typography: {
+          font: "normal 460 0.875rem/1.3 Open Sans",
+          letterSpacing: "0rem",
+          fontWidth: 95
+        }
+      },
+      aside: {
+        "grid-area": "aside",
+        "justify-self": "end",
+        "align-self": "start",
+        color: "#000000",
+        typography: {
+          font: "normal 460 1rem/1.3 Open Sans",
+          letterSpacing: "0rem",
+          fontWidth: 95
+        }
+      },
+      ":last-child": {
+        "border-bottom": "none"
+      },
+      ":hover": {
+        "background-color": "#ededed"
+      },
+      ":focus-visible": {
+        outline: "0.125rem solid #0072a9",
+        "outline-offset": "-0.125rem"
+      }
+    },
+    sm: {
+      icon: {
+        size: "1.125rem",
+        "line-height": 1.3
+      }
+    },
+    md: {
+      icon: {
+        size: "1.25rem",
+        "line-height": 1.3
+      }
+    }
+  },
+  menuSeparator: {
+    shared: {
+      "background-color": "#ededed",
+      height: "0.5rem",
+      width: "100%"
+    }
+  },
+  menuPopover: {
+    shared: {
+      overflow: "auto",
+      shadow: "0 0.125rem 0.375rem 0 rgb(0% 0% 0% / 0.3)"
+    },
+    sm: {
+      "max-width": "200px",
+      width: "100%"
+    },
+    md: {
+      "max-width": "320px",
+      width: "100%"
+    }
+  }
+};
+
+exports.componentMenu = componentMenu;

package/dist/styleD/build/typescript/component/menu.js

@@ -0,0 +1,138 @@
+const componentMenu = {
+  menu: {
+    shared: {
+      display: "flex",
+      "flex-direction": "column",
+      "background-color": "#ffffff",
+      border: "0.0625rem solid #cccccc"
+    }
+  },
+  menuSection: {
+    header: {
+      shared: {
+        display: "flex",
+        "align-items": "center",
+        padding: {
+          top: "0",
+          right: "0.5rem",
+          bottom: "0",
+          left: "0.5rem"
+        },
+        "background-color": "#ededed",
+        color: "#000000"
+      },
+      sm: {
+        height: "1.5rem",
+        typography: {
+          font: "normal 700 0.875rem/1 Open Sans",
+          letterSpacing: "-0.0125rem",
+          fontWidth: 95
+        }
+      },
+      md: {
+        height: "2rem",
+        typography: {
+          font: "normal 700 1rem/1 Open Sans",
+          letterSpacing: "-0.0125rem",
+          fontWidth: 95
+        }
+      }
+    }
+  },
+  menuItem: {
+    shared: {
+      display: "grid",
+      "grid-template-areas": "'icon label aside'",
+      "grid-template-areas-with-description": "'icon label aside' '. description .'",
+      "grid-template-columns": "auto 6fr 1fr",
+      gap: "0.25rem",
+      "align-items": "center",
+      padding: {
+        top: "0.75rem",
+        right: "1rem",
+        bottom: "0.75rem",
+        left: "1rem"
+      },
+      "border-bottom": "0.0625rem solid #cccccc",
+      icon: {
+        "grid-area": "icon",
+        "align-self": "start",
+        color: "#545454"
+      },
+      label: {
+        "grid-area": "label",
+        color: "#000000",
+        typography: {
+          font: "normal 460 1rem/1.3 Open Sans",
+          letterSpacing: "0rem",
+          fontWidth: 95
+        }
+      },
+      description: {
+        "grid-area": "description",
+        color: "#545454",
+        typography: {
+          font: "normal 460 0.875rem/1.3 Open Sans",
+          letterSpacing: "0rem",
+          fontWidth: 95
+        }
+      },
+      aside: {
+        "grid-area": "aside",
+        "justify-self": "end",
+        "align-self": "start",
+        color: "#000000",
+        typography: {
+          font: "normal 460 1rem/1.3 Open Sans",
+          letterSpacing: "0rem",
+          fontWidth: 95
+        }
+      },
+      ":last-child": {
+        "border-bottom": "none"
+      },
+      ":hover": {
+        "background-color": "#ededed"
+      },
+      ":focus-visible": {
+        outline: "0.125rem solid #0072a9",
+        "outline-offset": "-0.125rem"
+      }
+    },
+    sm: {
+      icon: {
+        size: "1.125rem",
+        "line-height": 1.3
+      }
+    },
+    md: {
+      icon: {
+        size: "1.25rem",
+        "line-height": 1.3
+      }
+    }
+  },
+  menuSeparator: {
+    shared: {
+      "background-color": "#ededed",
+      height: "0.5rem",
+      width: "100%"
+    }
+  },
+  menuPopover: {
+    shared: {
+      overflow: "auto",
+      shadow: "0 0.125rem 0.375rem 0 rgb(0% 0% 0% / 0.3)"
+    },
+    sm: {
+      "max-width": "200px",
+      width: "100%"
+    },
+    md: {
+      "max-width": "320px",
+      width: "100%"
+    }
+  }
+};
+
+export { componentMenu };

package/dist/styleD/build/typescript/semantic/shadow.cjs

@@ -0,0 +1,7 @@
+'use strict';
+
+const semanticShadow = {
+  raised: "0 0.125rem 0.375rem 0 rgb(0% 0% 0% / 0.3)"
+};
+
+exports.semanticShadow = semanticShadow;

package/dist/styleD/build/typescript/semantic/shadow.js

@@ -0,0 +1,5 @@
+const semanticShadow = {
+  raised: "0 0.125rem 0.375rem 0 rgb(0% 0% 0% / 0.3)"
+};
+
+export { semanticShadow };

package/dist/types/TopBar.d.ts

@@ -14,6 +14,6 @@
  */
 export { TopBarToolName } from './components/topbar/toolName/TopBarToolName';
 export type { TopBarToolNameProps } from './components/topbar/toolName/types';
-export type { TopBarToolNameTheme } from './components/topbar/toolName/styles';
+export type { PartialTopBarToolNameTheme as TopBarToolNameTheme } from './components/topbar/toolName/styles';
 export { componentTopBar } from './styleD/build/typescript/component/TopBar';
 export type { ComponentTopBar } from './styleD/build/typescript/component/TopBar';

package/dist/types/avatar.d.ts

@@ -14,6 +14,6 @@
  */
 export { Avatar } from './components/avatar/Avatar';
 export type { AvatarProps } from './components/avatar/types';
-export type { AvatarTheme } from './components/avatar/styles';
+export type { PartialAvatarTheme as AvatarTheme } from './components/avatar/styles';
 export { componentAvatar } from './styleD/build/typescript/component/avatar';
 export type { ComponentAvatar } from './styleD/build/typescript/component/avatar';

package/dist/types/button.d.ts

@@ -15,6 +15,6 @@
  */
 export { Button } from './components/button/Button';
 export type { ButtonProps } from './components/button/types';
-export type { ButtonTheme } from './components/button/styles';
+export type { PartialButtonTheme as ButtonTheme } from './components/button/styles';
 export { componentButton } from './styleD/build/typescript/component/button';
 export type { ComponentButton } from './styleD/build/typescript/component/button';

package/dist/types/byline.d.ts

@@ -20,6 +20,6 @@
  */
 export { Byline } from './components/byline/Byline';
 export type { BylineModel } from './components/byline/lib';
-export type { PartialBylineTheme } from './components/byline/theme';
+export type { PartialBylineTheme as BylineTheme } from './components/byline/theme';
 export { componentByline } from './styleD/build/typescript/component/byline';
 export type { ComponentByline } from './styleD/build/typescript/component/byline';

package/dist/types/components/avatar/styles.d.ts

@@ -1,8 +1,9 @@
 import type { SerializedStyles } from '@emotion/react';
 import type { ComponentAvatar } from '../../styleD/build/typescript/component/avatar';
-import type { Prettify } from '../../util/types';
+import type { DeepPartial, Prettify } from '../../util/types';
 import type { AvatarProps } from './types';
 export type AvatarTheme = Prettify<ComponentAvatar>;
+export type PartialAvatarTheme = DeepPartial<AvatarTheme>;
 export declare const defaultAvatarTheme: AvatarTheme;
 export declare const avatarImageStyles: SerializedStyles;
 export declare const avatarStyles: (theme: AvatarTheme, { size, color }: Required<Pick<AvatarProps, 'size' | 'color'>>) => SerializedStyles;

package/dist/types/components/button/styles.d.ts

@@ -1,7 +1,8 @@
 import type { SerializedStyles } from '@emotion/react';
 import type { ComponentButton } from '../../styleD/build/typescript/component/button';
-import type { Prettify } from '../../util/types';
+import type { DeepPartial, Prettify } from '../../util/types';
 import type { ButtonProps } from './types';
 export type ButtonTheme = Prettify<ComponentButton>;
+export type PartialButtonTheme = DeepPartial<ButtonTheme>;
 export declare const defaultButtonTheme: ButtonTheme;
 export declare const buttonStyles: (theme: ButtonTheme, { size, variant }: Required<Pick<ButtonProps, 'size' | 'variant'>>, hasIcon?: boolean, isIconButton?: boolean) => SerializedStyles;