@nulogy/components 16.1.0 → 17.0.0

package/dist/esm/StyledProps/index.js

@@ -0,0 +1,134 @@
+import { useTheme } from "styled-components";
+import { flexGrow, backgroundImage, backgroundPosition, backgroundRepeat, backgroundSize, left, bottom, right, top, zIndex, overflow, opacity, borderRadius, borderColor, borderLeft, borderBottom, borderRight, borderTop, gridArea, gridTemplateAreas, gridTemplateRows, gridTemplateColumns, gridAutoRows, gridAutoColumns, gridAutoFlow, gridRow, gridColumn, gridRowGap, gridColumnGap, gridGap, order, alignSelf, justifySelf, flex, flexDirection, flexBasis, flexWrap, justifyContent, justifyItems, alignContent, alignItems, verticalAlign, size, minHeight, maxHeight, height, minWidth, maxWidth, display, letterSpacing, fontStyle, fontWeight, lineHeight, textAlign, fontFamily, fontSize, width } from "../node_modules/.pnpm/styled-system@5.1.5/node_modules/styled-system/dist/index.esm.js";
+import { useComponentVariant } from "../NDSProvider/ComponentVariantContext.js";
+import { compose, system } from "../node_modules/.pnpm/@styled-system_core@5.1.2/node_modules/@styled-system/core/dist/index.esm.js";
+import typography from "../node_modules/.pnpm/@styled-system_typography@5.1.2/node_modules/@styled-system/typography/dist/index.esm.js";
+import layout from "../node_modules/.pnpm/@styled-system_layout@5.1.2/node_modules/@styled-system/layout/dist/index.esm.js";
+import { background } from "../node_modules/.pnpm/@styled-system_background@5.1.2/node_modules/@styled-system/background/dist/index.esm.js";
+import { buttonStyle, colorStyle, textStyle, variant as variant$1 } from "../node_modules/.pnpm/@styled-system_variant@5.1.5/node_modules/@styled-system/variant/dist/index.esm.js";
+import position from "../node_modules/.pnpm/@styled-system_position@5.1.2/node_modules/@styled-system/position/dist/index.esm.js";
+import shadow from "../node_modules/.pnpm/@styled-system_shadow@5.1.2/node_modules/@styled-system/shadow/dist/index.esm.js";
+import { border } from "../node_modules/.pnpm/@styled-system_border@5.1.5/node_modules/@styled-system/border/dist/index.esm.js";
+import grid from "../node_modules/.pnpm/@styled-system_grid@5.1.2/node_modules/@styled-system/grid/dist/index.esm.js";
+import flexbox from "../node_modules/.pnpm/@styled-system_flexbox@5.1.2/node_modules/@styled-system/flexbox/dist/index.esm.js";
+import { color } from "../node_modules/.pnpm/@styled-system_color@5.1.2/node_modules/@styled-system/color/dist/index.esm.js";
+import { padding, margin, space } from "../node_modules/.pnpm/@styled-system_space@5.1.2/node_modules/@styled-system/space/dist/index.esm.js";
+const gap = system({
+  gap: {
+    property: "gap",
+    scale: "space"
+  },
+  rowGap: {
+    property: "rowGap",
+    scale: "space"
+  },
+  columnGap: {
+    property: "columnGap",
+    scale: "space"
+  }
+});
+function getStyledPropNames(...styleFns) {
+  return styleFns.reduce(
+    (acc, fn) => fn.propNames ? acc.concat(fn.propNames) : acc,
+    []
+  );
+}
+const excludeStyledProps = (...styleFns) => (prop) => !getStyledPropNames(...styleFns).includes(String(prop));
+const variant = (variants) => () => {
+  const componentVariant = useComponentVariant();
+  const theme = useTheme();
+  return variant$1(variants)({ theme, variant: componentVariant });
+};
+const addStyledProps = compose(
+  // After
+  space,
+  margin,
+  padding,
+  width,
+  fontSize,
+  color,
+  fontFamily,
+  textAlign,
+  lineHeight,
+  fontWeight,
+  fontStyle,
+  letterSpacing,
+  display,
+  maxWidth,
+  minWidth,
+  height,
+  maxHeight,
+  minHeight,
+  size,
+  verticalAlign,
+  alignItems,
+  alignContent,
+  justifyItems,
+  justifyContent,
+  flexWrap,
+  flexBasis,
+  flexDirection,
+  flex,
+  flexbox,
+  justifySelf,
+  alignSelf,
+  order,
+  grid,
+  gridGap,
+  gridColumnGap,
+  gridRowGap,
+  gridColumn,
+  gridRow,
+  gridAutoFlow,
+  gridAutoColumns,
+  gridAutoRows,
+  gridTemplateColumns,
+  gridTemplateRows,
+  gridTemplateAreas,
+  gridArea,
+  border,
+  borderTop,
+  borderRight,
+  borderBottom,
+  borderLeft,
+  border,
+  borderColor,
+  borderRadius,
+  shadow,
+  opacity,
+  overflow,
+  position,
+  zIndex,
+  top,
+  right,
+  bottom,
+  left,
+  textStyle,
+  colorStyle,
+  buttonStyle,
+  background,
+  backgroundSize,
+  backgroundRepeat,
+  backgroundPosition,
+  backgroundImage,
+  layout,
+  flexGrow,
+  typography,
+  gap,
+  system({
+    visibility: true,
+    transition: true,
+    transform: true,
+    whiteSpace: true,
+    textOverflow: true,
+    cursor: true
+  })
+);
+export {
+  addStyledProps,
+  excludeStyledProps,
+  gap,
+  getStyledPropNames,
+  variant
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/StyledProps/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/StyledProps/index.ts"],"sourcesContent":["import { useTheme } from \"styled-components\";\nimport {\n  space,\n  margin,\n  padding,\n  width,\n  fontSize,\n  color,\n  fontFamily,\n  textAlign,\n  lineHeight,\n  fontWeight,\n  fontStyle,\n  letterSpacing,\n  display,\n  maxWidth,\n  minWidth,\n  height,\n  maxHeight,\n  minHeight,\n  size,\n  verticalAlign,\n  alignItems,\n  alignContent,\n  justifyItems,\n  justifyContent,\n  flexWrap,\n  flexBasis,\n  flexDirection,\n  flex,\n  justifySelf,\n  alignSelf,\n  order,\n  gridGap,\n  gridColumnGap,\n  gridRowGap,\n  gridColumn,\n  gridRow,\n  gridAutoFlow,\n  gridAutoColumns,\n  gridAutoRows,\n  gridTemplateColumns,\n  gridTemplateRows,\n  gridTemplateAreas,\n  gridArea,\n  border,\n  borderTop,\n  borderRight,\n  borderBottom,\n  borderLeft,\n  borders,\n  borderColor,\n  borderRadius,\n  boxShadow,\n  opacity,\n  overflow,\n  background,\n  position,\n  zIndex,\n  top,\n  right,\n  bottom,\n  left,\n  textStyle,\n  colorStyle,\n  buttonStyle,\n  compose,\n  layout,\n  flexGrow,\n  system,\n  flexbox,\n  grid,\n  typography,\n  backgroundSize,\n  backgroundRepeat,\n  backgroundPosition,\n  backgroundImage,\n  styleFn,\n  variant as styledSystemVariant,\n} from \"styled-system\";\n\nimport type {\n  SpaceProps,\n  PaddingProps,\n  MarginProps,\n  WidthProps,\n  FontSizeProps,\n  FontFamilyProps,\n  TextAlignProps,\n  LineHeightProps,\n  FontWeightProps,\n  FontStyleProps,\n  LetterSpacingProps,\n  DisplayProps,\n  MaxWidthProps,\n  MinWidthProps,\n  HeightProps,\n  MaxHeightProps,\n  MinHeightProps,\n  SizeProps,\n  VerticalAlignProps,\n  AlignItemsProps,\n  AlignContentProps,\n  JustifyItemsProps,\n  JustifyContentProps,\n  FlexWrapProps,\n  FlexBasisProps,\n  FlexDirectionProps,\n  FlexProps,\n  JustifySelfProps,\n  AlignSelfProps,\n  OrderProps,\n  GridGapProps,\n  GridColumnGapProps,\n  GridRowGapProps,\n  GridColumnProps,\n  GridRowProps,\n  GridAutoFlowProps,\n  GridAutoColumnsProps,\n  GridAutoRowsProps,\n  GridTemplateColumnsProps,\n  GridTemplateRowsProps,\n  GridTemplateAreasProps,\n  GridAreaProps,\n  BorderProps,\n  BorderTopProps,\n  BorderRightProps,\n  BorderBottomProps,\n  BorderLeftProps,\n  BordersProps,\n  BorderColorProps,\n  BorderRadiusProps,\n  BoxShadowProps,\n  OpacityProps,\n  OverflowProps,\n  BackgroundProps,\n  BackgroundImageProps,\n  BackgroundPositionProps,\n  BackgroundRepeatProps,\n  BackgroundSizeProps,\n  PositionProps,\n  ZIndexProps,\n  TopProps,\n  RightProps,\n  BottomProps,\n  LeftProps,\n  TextStyleProps,\n  ColorStyleProps,\n  ButtonStyleProps,\n  FlexboxProps,\n  GridProps,\n  BackgroundColorProps,\n  FlexGrowProps,\n  TypographyProps,\n  LayoutProps,\n} from \"styled-system\";\nimport { CSSProperties } from \"react\";\nimport { useComponentVariant } from \"../NDSProvider/ComponentVariantContext\";\n\nexport interface GapProps {\n  gap?: CSSProperties[\"gap\"];\n  rowGap?: CSSProperties[\"rowGap\"];\n  columnGap?: CSSProperties[\"columnGap\"];\n}\n\nexport const gap = system({\n  gap: {\n    property: \"gap\",\n    scale: \"space\",\n  },\n  rowGap: {\n    property: \"rowGap\",\n    scale: \"space\",\n  },\n  columnGap: {\n    property: \"columnGap\",\n    scale: \"space\",\n  },\n});\n\nexport function getStyledPropNames(...styleFns: styleFn[]): string[] {\n  return styleFns.reduce(\n    (acc: string[], fn: styleFn) => (fn.propNames ? acc.concat(fn.propNames) : acc),\n    [] as string[]\n  );\n}\nexport const excludeStyledProps =\n  (...styleFns: styleFn[]) =>\n  (prop: string | number): boolean =>\n    !getStyledPropNames(...styleFns).includes(String(prop));\n\nexport const variant: typeof styledSystemVariant = (variants) => () => {\n  const componentVariant = useComponentVariant();\n  const theme = useTheme();\n\n  return styledSystemVariant(variants)({ theme, variant: componentVariant });\n};\n\nexport const addStyledProps = compose(\n  // After\n  space,\n  margin,\n  padding,\n  width,\n  fontSize,\n  color,\n  fontFamily,\n  textAlign,\n  lineHeight,\n  fontWeight,\n  fontStyle,\n  letterSpacing,\n  display,\n  maxWidth,\n  minWidth,\n  height,\n  maxHeight,\n  minHeight,\n  size,\n  verticalAlign,\n  alignItems,\n  alignContent,\n  justifyItems,\n  justifyContent,\n  flexWrap,\n  flexBasis,\n  flexDirection,\n  flex,\n  flexbox,\n  justifySelf,\n  alignSelf,\n  order,\n  grid,\n  gridGap,\n  gridColumnGap,\n  gridRowGap,\n  gridColumn,\n  gridRow,\n  gridAutoFlow,\n  gridAutoColumns,\n  gridAutoRows,\n  gridTemplateColumns,\n  gridTemplateRows,\n  gridTemplateAreas,\n  gridArea,\n  border,\n  borderTop,\n  borderRight,\n  borderBottom,\n  borderLeft,\n  borders,\n  borderColor,\n  borderRadius,\n  boxShadow,\n  opacity,\n  overflow,\n  position,\n  zIndex,\n  top,\n  right,\n  bottom,\n  left,\n  textStyle,\n  colorStyle,\n  buttonStyle,\n  background,\n  backgroundSize,\n  backgroundRepeat,\n  backgroundPosition,\n  backgroundImage,\n  layout,\n  flexGrow,\n  typography,\n  gap,\n  system({\n    visibility: true,\n    transition: true,\n    transform: true,\n    whiteSpace: true,\n    textOverflow: true,\n    cursor: true,\n  })\n);\n\ninterface TransitionProps {\n  transition?: CSSProperties[\"transition\"];\n  transitionDelay?: CSSProperties[\"transitionDelay\"];\n  transitionProperty?: CSSProperties[\"transition\"];\n  transitionDuration?: CSSProperties[\"transitionDuration\"];\n  transitionTimingFunction?: CSSProperties[\"transitionTimingFunction\"];\n}\n\ninterface TransformProps {\n  transform?: CSSProperties[\"transform\"];\n  transformOrigin?: CSSProperties[\"transformOrigin\"];\n  transformStyle?: CSSProperties[\"transformStyle\"];\n  transformBox?: CSSProperties[\"transformBox\"];\n}\n\nexport type TextOverflowProps = {\n  whiteSpace?: CSSProperties[\"whiteSpace\"];\n  textOverflow?: CSSProperties[\"textOverflow\"];\n};\n\nexport type VisibilityProps = {\n  visibility?: CSSProperties[\"visibility\"];\n};\n\nexport type CursorProps = {\n  cursor?: CSSProperties[\"cursor\"];\n};\n\nexport interface StyledProps\n  extends\n    SpaceProps,\n    BackgroundColorProps,\n    LayoutProps,\n    FlexGrowProps,\n    TypographyProps,\n    MarginProps,\n    PaddingProps,\n    WidthProps,\n    FontSizeProps,\n    FontFamilyProps,\n    TextAlignProps,\n    LineHeightProps,\n    FontWeightProps,\n    FontStyleProps,\n    LetterSpacingProps,\n    DisplayProps,\n    MaxWidthProps,\n    MinWidthProps,\n    HeightProps,\n    MaxHeightProps,\n    MinHeightProps,\n    SizeProps,\n    VerticalAlignProps,\n    AlignItemsProps,\n    AlignContentProps,\n    JustifyItemsProps,\n    JustifyContentProps,\n    FlexWrapProps,\n    FlexBasisProps,\n    FlexDirectionProps,\n    FlexProps,\n    FlexboxProps,\n    JustifySelfProps,\n    AlignSelfProps,\n    OrderProps,\n    GridProps,\n    GridGapProps,\n    GridColumnGapProps,\n    GridRowGapProps,\n    GridColumnProps,\n    GridRowProps,\n    GridAutoFlowProps,\n    GridAutoColumnsProps,\n    GridAutoRowsProps,\n    GridTemplateColumnsProps,\n    GridTemplateRowsProps,\n    GridTemplateAreasProps,\n    GridAreaProps,\n    BorderProps,\n    BorderTopProps,\n    BorderRightProps,\n    BorderBottomProps,\n    BorderLeftProps,\n    BordersProps,\n    BorderRadiusProps,\n    BoxShadowProps,\n    OpacityProps,\n    OverflowProps,\n    BorderColorProps,\n    BackgroundProps,\n    PositionProps,\n    ZIndexProps,\n    TopProps,\n    RightProps,\n    BottomProps,\n    LeftProps,\n    TextStyleProps,\n    ColorStyleProps,\n    ButtonStyleProps,\n    TransitionProps,\n    TransformProps,\n    BackgroundImageProps,\n    BackgroundPositionProps,\n    BackgroundRepeatProps,\n    BackgroundSizeProps,\n    TextOverflowProps,\n    VisibilityProps,\n    CursorProps,\n    GapProps {}\n"],"names":["styledSystemVariant","borders","boxShadow"],"mappings":";;;;;;;;;;;;;;;AAqKO,MAAM,MAAM,OAAO;AAAA,EACxB,KAAK;AAAA,IACH,UAAU;AAAA,IACV,OAAO;AAAA,EAAA;AAAA,EAET,QAAQ;AAAA,IACN,UAAU;AAAA,IACV,OAAO;AAAA,EAAA;AAAA,EAET,WAAW;AAAA,IACT,UAAU;AAAA,IACV,OAAO;AAAA,EAAA;AAEX,CAAC;AAEM,SAAS,sBAAsB,UAA+B;AACnE,SAAO,SAAS;AAAA,IACd,CAAC,KAAe,OAAiB,GAAG,YAAY,IAAI,OAAO,GAAG,SAAS,IAAI;AAAA,IAC3E,CAAA;AAAA,EAAC;AAEL;AACO,MAAM,qBACX,IAAI,aACJ,CAAC,SACC,CAAC,mBAAmB,GAAG,QAAQ,EAAE,SAAS,OAAO,IAAI,CAAC;AAEnD,MAAM,UAAsC,CAAC,aAAa,MAAM;AACrE,QAAM,mBAAmB,oBAAA;AACzB,QAAM,QAAQ,SAAA;AAEd,SAAOA,UAAoB,QAAQ,EAAE,EAAE,OAAO,SAAS,kBAAkB;AAC3E;AAEO,MAAM,iBAAiB;AAAA;AAAA,EAE5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACAC;AAAAA,EACA;AAAA,EACA;AAAA,EACAC;AAAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,QAAQ;AAAA,EAAA,CACT;AACH;"}

package/dist/esm/Summary/Summary.js

@@ -0,0 +1,33 @@
+import { jsx } from "react/jsx-runtime";
+import { useTheme, styled } from "styled-components";
+import numberFromDimension from "../utils/numberFromDimension/index.js";
+import { SummaryContextProvider } from "./SummaryContext.js";
+import Box from "../Box/Box.js";
+const SummaryWrapper = styled(Box)(({ theme, breakpoint }) => ({
+  display: "flex",
+  background: theme.colors.white,
+  gap: theme.space.x2,
+  paddingTop: theme.space.x1,
+  paddingBottom: theme.space.x1,
+  paddingLeft: theme.space.x2,
+  paddingRight: theme.space.x2,
+  borderRadius: theme.radii.medium,
+  width: "fit-content",
+  [`@media (max-width: ${breakpoint}px)`]: {
+    background: "none",
+    flexFlow: "wrap",
+    padding: 0,
+    paddingTop: theme.space.x2,
+    rowGap: 0
+  }
+}));
+function Summary({ breakpoint, children, ...rest }) {
+  const theme = useTheme();
+  breakpoint || (breakpoint = theme.breakpoints.medium);
+  const breakpointPx = numberFromDimension(breakpoint);
+  return /* @__PURE__ */ jsx(SummaryContextProvider, { breakpoint: breakpointPx, children: /* @__PURE__ */ jsx(SummaryWrapper, { breakpoint: breakpointPx, ...rest, children }) });
+}
+export {
+  Summary as default
+};
+//# sourceMappingURL=Summary.js.map

package/dist/esm/Summary/Summary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Summary.js","sources":["../../../src/Summary/Summary.tsx"],"sourcesContent":["import React from \"react\";\nimport { styled, useTheme } from \"styled-components\";\nimport numberFromDimension from \"../utils/numberFromDimension\";\nimport { Box } from \"../Box\";\nimport { BoxProps } from \"../Box/Box\";\nimport { SummaryContextProvider } from \"./SummaryContext\";\n\ntype SummaryProps = Omit<BoxProps, \"as\"> & {\n  breakpoint?: number | string;\n};\n\nconst SummaryWrapper = styled(Box)<{ breakpoint: number }>(({ theme, breakpoint }) => ({\n  display: \"flex\",\n  background: theme.colors.white,\n  gap: theme.space.x2,\n  paddingTop: theme.space.x1,\n  paddingBottom: theme.space.x1,\n  paddingLeft: theme.space.x2,\n  paddingRight: theme.space.x2,\n  borderRadius: theme.radii.medium,\n  width: \"fit-content\",\n\n  [`@media (max-width: ${breakpoint}px)`]: {\n    background: \"none\",\n    flexFlow: \"wrap\",\n    padding: 0,\n    paddingTop: theme.space.x2,\n    rowGap: 0,\n  },\n}));\n\nfunction Summary({ breakpoint, children, ...rest }: SummaryProps) {\n  const theme = useTheme();\n  breakpoint ||= theme.breakpoints.medium;\n\n  const breakpointPx = numberFromDimension(breakpoint);\n\n  return (\n    <SummaryContextProvider breakpoint={breakpointPx}>\n      <SummaryWrapper breakpoint={breakpointPx} {...rest}>\n        {children}\n      </SummaryWrapper>\n    </SummaryContextProvider>\n  );\n}\n\nexport default Summary;\n"],"names":[],"mappings":";;;;;AAWA,MAAM,iBAAiB,OAAO,GAAG,EAA0B,CAAC,EAAE,OAAO,kBAAkB;AAAA,EACrF,SAAS;AAAA,EACT,YAAY,MAAM,OAAO;AAAA,EACzB,KAAK,MAAM,MAAM;AAAA,EACjB,YAAY,MAAM,MAAM;AAAA,EACxB,eAAe,MAAM,MAAM;AAAA,EAC3B,aAAa,MAAM,MAAM;AAAA,EACzB,cAAc,MAAM,MAAM;AAAA,EAC1B,cAAc,MAAM,MAAM;AAAA,EAC1B,OAAO;AAAA,EAEP,CAAC,sBAAsB,UAAU,KAAK,GAAG;AAAA,IACvC,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,YAAY,MAAM,MAAM;AAAA,IACxB,QAAQ;AAAA,EAAA;AAEZ,EAAE;AAEF,SAAS,QAAQ,EAAE,YAAY,UAAU,GAAG,QAAsB;AAChE,QAAM,QAAQ,SAAA;AACd,8BAAe,MAAM,YAAY;AAEjC,QAAM,eAAe,oBAAoB,UAAU;AAEnD,SACE,oBAAC,wBAAA,EAAuB,YAAY,cAClC,UAAA,oBAAC,gBAAA,EAAe,YAAY,cAAe,GAAG,MAC3C,SAAA,CACH,EAAA,CACF;AAEJ;"}

package/dist/esm/Summary/SummaryContext.js

@@ -0,0 +1,26 @@
+import { jsx } from "react/jsx-runtime";
+import { useContext, createContext } from "react";
+const SummaryContext = createContext(void 0);
+function useSummaryContext() {
+  const context = useContext(SummaryContext);
+  if (!context) {
+    throw new Error(`Summary compound components cannot be rendered outside the Summary component`);
+  }
+  return context;
+}
+function SummaryContextProvider({ breakpoint, children }) {
+  return /* @__PURE__ */ jsx(
+    SummaryContext.Provider,
+    {
+      value: {
+        breakpoint
+      },
+      children
+    }
+  );
+}
+export {
+  SummaryContextProvider,
+  useSummaryContext
+};
+//# sourceMappingURL=SummaryContext.js.map

package/dist/esm/Summary/SummaryContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SummaryContext.js","sources":["../../../src/Summary/SummaryContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\n\ntype SummaryContextValue = {\n  breakpoint: number;\n};\n\nconst SummaryContext = createContext<SummaryContextValue>(undefined);\n\nexport function useSummaryContext() {\n  const context = useContext(SummaryContext);\n  if (!context) {\n    throw new Error(`Summary compound components cannot be rendered outside the Summary component`);\n  }\n  return context;\n}\n\nexport function SummaryContextProvider({ breakpoint, children }: SummaryContextValue & { children?: React.ReactNode }) {\n  return (\n    <SummaryContext.Provider\n      value={{\n        breakpoint,\n      }}\n    >\n      {children}\n    </SummaryContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;AAMA,MAAM,iBAAiB,cAAmC,MAAS;AAE5D,SAAS,oBAAoB;AAClC,QAAM,UAAU,WAAW,cAAc;AACzC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,8EAA8E;AAAA,EAChG;AACA,SAAO;AACT;AAEO,SAAS,uBAAuB,EAAE,YAAY,YAAkE;AACrH,SACE;AAAA,IAAC,eAAe;AAAA,IAAf;AAAA,MACC,OAAO;AAAA,QACL;AAAA,MAAA;AAAA,MAGD;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/esm/Summary/SummaryDivider.js

@@ -0,0 +1,24 @@
+import { jsx } from "react/jsx-runtime";
+import { styled } from "styled-components";
+import numberFromDimension from "../utils/numberFromDimension/index.js";
+import { useSummaryContext } from "./SummaryContext.js";
+import Box from "../Box/Box.js";
+const Divider = styled(Box)(({ theme, breakpoint }) => ({
+  display: "block",
+  alignSelf: "stretch",
+  width: 1,
+  marginRight: theme.space.x1,
+  marginLeft: theme.space.x1,
+  background: theme.colors.grey,
+  [`@media (max-width: ${breakpoint}px)`]: {
+    display: "none"
+  }
+}));
+const SummaryDivider = (props) => {
+  const { breakpoint } = useSummaryContext();
+  return /* @__PURE__ */ jsx(Divider, { breakpoint: numberFromDimension(breakpoint), ...props });
+};
+export {
+  SummaryDivider as default
+};
+//# sourceMappingURL=SummaryDivider.js.map

package/dist/esm/Summary/SummaryDivider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SummaryDivider.js","sources":["../../../src/Summary/SummaryDivider.tsx"],"sourcesContent":["import React from \"react\";\nimport { styled } from \"styled-components\";\nimport { Box } from \"../Box\";\nimport numberFromDimension from \"../utils/numberFromDimension\";\nimport { useSummaryContext } from \"./SummaryContext\";\n\nconst Divider = styled(Box)<{ breakpoint: number }>(({ theme, breakpoint }) => ({\n  display: \"block\",\n  alignSelf: \"stretch\",\n  width: 1,\n  marginRight: theme.space.x1,\n  marginLeft: theme.space.x1,\n  background: theme.colors.grey,\n\n  [`@media (max-width: ${breakpoint}px)`]: {\n    display: \"none\",\n  },\n}));\n\nconst SummaryDivider = (props) => {\n  const { breakpoint } = useSummaryContext();\n\n  return <Divider breakpoint={numberFromDimension(breakpoint)} {...props} />;\n};\n\nexport default SummaryDivider;\n"],"names":[],"mappings":";;;;;AAMA,MAAM,UAAU,OAAO,GAAG,EAA0B,CAAC,EAAE,OAAO,kBAAkB;AAAA,EAC9E,SAAS;AAAA,EACT,WAAW;AAAA,EACX,OAAO;AAAA,EACP,aAAa,MAAM,MAAM;AAAA,EACzB,YAAY,MAAM,MAAM;AAAA,EACxB,YAAY,MAAM,OAAO;AAAA,EAEzB,CAAC,sBAAsB,UAAU,KAAK,GAAG;AAAA,IACvC,SAAS;AAAA,EAAA;AAEb,EAAE;AAEF,MAAM,iBAAiB,CAAC,UAAU;AAChC,QAAM,EAAE,WAAA,IAAe,kBAAA;AAEvB,6BAAQ,SAAA,EAAQ,YAAY,oBAAoB,UAAU,GAAI,GAAG,OAAO;AAC1E;"}

package/dist/esm/Summary/SummaryItem.js

@@ -0,0 +1,26 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { styled } from "styled-components";
+import useMediaQuery from "../hooks/useMediaQuery/useMediaQuery.js";
+import { useSummaryContext } from "./SummaryContext.js";
+import Text from "../Type/Text.js";
+import Flex from "../Flex/Flex.js";
+const SummaryItemWrapper = styled(Flex)(({ theme, breakpoint }) => ({
+  gap: theme.space.half,
+  flexDirection: "column",
+  [`@media (max-width: ${breakpoint}px)`]: {
+    flexDirection: "row"
+  }
+}));
+function SummaryItem({ value, status, ...rest }) {
+  const { breakpoint } = useSummaryContext();
+  const matches = useMediaQuery(`(max-width: ${breakpoint}px)`);
+  delete rest["children"];
+  return /* @__PURE__ */ jsxs(SummaryItemWrapper, { breakpoint, ...rest, children: [
+    /* @__PURE__ */ jsx(Text, { fontWeight: "medium", fontSize: !matches ? "heading4" : void 0, children: value }),
+    status
+  ] });
+}
+export {
+  SummaryItem as default
+};
+//# sourceMappingURL=SummaryItem.js.map

package/dist/esm/Summary/SummaryItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SummaryItem.js","sources":["../../../src/Summary/SummaryItem.tsx"],"sourcesContent":["import React from \"react\";\nimport { styled } from \"styled-components\";\nimport { Flex } from \"../Flex\";\nimport { Text } from \"../Type\";\nimport useMediaQuery from \"../hooks/useMediaQuery\";\nimport { FlexProps } from \"../Flex/Flex\";\nimport { useSummaryContext } from \"./SummaryContext\";\n\ntype SummaryItemProps = Omit<FlexProps, \"as\"> & {\n  value: number | string;\n  status: React.ReactNode;\n};\n\nconst SummaryItemWrapper = styled(Flex)<{ breakpoint: number }>(({ theme, breakpoint }) => ({\n  gap: theme.space.half,\n  flexDirection: \"column\",\n\n  [`@media (max-width: ${breakpoint}px)`]: {\n    flexDirection: \"row\",\n  },\n}));\n\nfunction SummaryItem({ value, status, ...rest }: SummaryItemProps) {\n  const { breakpoint } = useSummaryContext();\n  const matches = useMediaQuery(`(max-width: ${breakpoint}px)`);\n\n  delete rest[\"children\"];\n\n  return (\n    <SummaryItemWrapper breakpoint={breakpoint} {...rest}>\n      <Text fontWeight=\"medium\" fontSize={!matches ? \"heading4\" : undefined}>\n        {value}\n      </Text>\n      {status}\n    </SummaryItemWrapper>\n  );\n}\n\nexport default SummaryItem;\n"],"names":[],"mappings":";;;;;;AAaA,MAAM,qBAAqB,OAAO,IAAI,EAA0B,CAAC,EAAE,OAAO,kBAAkB;AAAA,EAC1F,KAAK,MAAM,MAAM;AAAA,EACjB,eAAe;AAAA,EAEf,CAAC,sBAAsB,UAAU,KAAK,GAAG;AAAA,IACvC,eAAe;AAAA,EAAA;AAEnB,EAAE;AAEF,SAAS,YAAY,EAAE,OAAO,QAAQ,GAAG,QAA0B;AACjE,QAAM,EAAE,WAAA,IAAe,kBAAA;AACvB,QAAM,UAAU,cAAc,eAAe,UAAU,KAAK;AAE5D,SAAO,KAAK,UAAU;AAEtB,SACE,qBAAC,oBAAA,EAAmB,YAAyB,GAAG,MAC9C,UAAA;AAAA,IAAA,oBAAC,MAAA,EAAK,YAAW,UAAS,UAAU,CAAC,UAAU,aAAa,QACzD,UAAA,MAAA,CACH;AAAA,IACC;AAAA,EAAA,GACH;AAEJ;"}

package/dist/esm/Switcher/Switch.js

@@ -0,0 +1,47 @@
+import { jsx } from "react/jsx-runtime";
+import React__default from "react";
+import { styled } from "styled-components";
+import "../node_modules/.pnpm/styled-system@5.1.5/node_modules/styled-system/dist/index.esm.js";
+import numberFromDimension from "../utils/numberFromDimension/index.js";
+import { variant } from "../node_modules/.pnpm/@styled-system_variant@5.1.5/node_modules/@styled-system/variant/dist/index.esm.js";
+const Switch = React__default.forwardRef(({ children, ...rest }, ref) => {
+  return /* @__PURE__ */ jsx(SwitchButton, { ...rest, ref, children });
+});
+const SwitchButton = styled.button(
+  ({ selected, theme }) => ({
+    margin: 1,
+    background: selected ? theme.colors.white : "none",
+    color: selected ? theme.colors.darkBlue : theme.colors.darkGrey,
+    cursor: "pointer",
+    border: "none",
+    borderRadius: theme.radii.rounded,
+    fontSize: theme.fontSizes.base,
+    fontWeight: theme.fontWeights.medium,
+    lineHeight: theme.lineHeights.base,
+    textDecoration: "none",
+    whiteSpace: "nowrap",
+    padding: `${numberFromDimension(theme.space.half) - 1}px ${theme.space.x2}`,
+    ...selected && { boxShadow: theme.shadows.small },
+    "&:focus": {
+      outline: "none",
+      boxShadow: theme.shadows.focus
+    },
+    ...!selected && {
+      "&:hover": {
+        backgroundColor: theme.colors.lightGrey
+      }
+    }
+  }),
+  variant({
+    variants: {
+      touch: {
+        fontSize: "md",
+        lineHeight: "base"
+      }
+    }
+  })
+);
+export {
+  Switch as default
+};
+//# sourceMappingURL=Switch.js.map

package/dist/esm/Switcher/Switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.js","sources":["../../../src/Switcher/Switch.tsx"],"sourcesContent":["import React from \"react\";\nimport { styled } from \"styled-components\";\nimport { variant } from \"styled-system\";\nimport numberFromDimension from \"../utils/numberFromDimension\";\nimport { ComponentVariant } from \"../NDSProvider/ComponentVariantContext\";\n\nexport type SwitchProps = Omit<React.ComponentPropsWithRef<\"button\">, \"value\"> & {\n  value?: string;\n  selected?: boolean;\n  variant?: ComponentVariant;\n};\n\nconst Switch = React.forwardRef<HTMLButtonElement, SwitchProps>(({ children, ...rest }, ref) => {\n  return (\n    <SwitchButton {...rest} ref={ref}>\n      {children}\n    </SwitchButton>\n  );\n});\n\nconst SwitchButton = styled.button<SwitchProps>(\n  ({ selected, theme }) => ({\n    margin: 1,\n    background: selected ? theme.colors.white : \"none\",\n    color: selected ? theme.colors.darkBlue : theme.colors.darkGrey,\n    cursor: \"pointer\",\n    border: \"none\",\n    borderRadius: theme.radii.rounded,\n    fontSize: theme.fontSizes.base,\n    fontWeight: theme.fontWeights.medium,\n    lineHeight: theme.lineHeights.base,\n    textDecoration: \"none\",\n    whiteSpace: \"nowrap\",\n    padding: `${numberFromDimension(theme.space.half) - 1}px ${theme.space.x2}`,\n\n    ...(selected && { boxShadow: theme.shadows.small }),\n\n    \"&:focus\": {\n      outline: \"none\",\n      boxShadow: theme.shadows.focus,\n    },\n\n    ...(!selected && {\n      \"&:hover\": {\n        backgroundColor: theme.colors.lightGrey,\n      },\n    }),\n  }),\n  variant({\n    variants: {\n      touch: {\n        fontSize: \"md\",\n        lineHeight: \"base\",\n      },\n    },\n  })\n);\n\nexport default Switch;\n"],"names":["React"],"mappings":";;;;;;AAYA,MAAM,SAASA,eAAM,WAA2C,CAAC,EAAE,UAAU,GAAG,KAAA,GAAQ,QAAQ;AAC9F,SACE,oBAAC,cAAA,EAAc,GAAG,MAAM,KACrB,UACH;AAEJ,CAAC;AAED,MAAM,eAAe,OAAO;AAAA,EAC1B,CAAC,EAAE,UAAU,aAAa;AAAA,IACxB,QAAQ;AAAA,IACR,YAAY,WAAW,MAAM,OAAO,QAAQ;AAAA,IAC5C,OAAO,WAAW,MAAM,OAAO,WAAW,MAAM,OAAO;AAAA,IACvD,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,cAAc,MAAM,MAAM;AAAA,IAC1B,UAAU,MAAM,UAAU;AAAA,IAC1B,YAAY,MAAM,YAAY;AAAA,IAC9B,YAAY,MAAM,YAAY;AAAA,IAC9B,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,SAAS,GAAG,oBAAoB,MAAM,MAAM,IAAI,IAAI,CAAC,MAAM,MAAM,MAAM,EAAE;AAAA,IAEzE,GAAI,YAAY,EAAE,WAAW,MAAM,QAAQ,MAAA;AAAA,IAE3C,WAAW;AAAA,MACT,SAAS;AAAA,MACT,WAAW,MAAM,QAAQ;AAAA,IAAA;AAAA,IAG3B,GAAI,CAAC,YAAY;AAAA,MACf,WAAW;AAAA,QACT,iBAAiB,MAAM,OAAO;AAAA,MAAA;AAAA,IAChC;AAAA,EACF;AAAA,EAEF,QAAQ;AAAA,IACN,UAAU;AAAA,MACR,OAAO;AAAA,QACL,UAAU;AAAA,QACV,YAAY;AAAA,MAAA;AAAA,IACd;AAAA,EACF,CACD;AACH;"}

package/dist/esm/Switcher/Switcher.js

@@ -0,0 +1,44 @@
+import { jsx } from "react/jsx-runtime";
+import React__default from "react";
+import FocusManager from "../utils/ts/FocusManager.js";
+import { useComponentVariant } from "../NDSProvider/ComponentVariantContext.js";
+import Box from "../Box/Box.js";
+function Switcher({ variant, selected, onChange, ...rest }) {
+  const componentVariant = useComponentVariant(variant);
+  const optionRefs = [];
+  const isSelected = (value, index) => {
+    if (!selected) return index === 0;
+    return value === selected;
+  };
+  const getSelectedIndex = () => {
+    return React__default.Children.toArray(rest.children).findIndex(
+      (child) => child?.props?.value === selected
+    );
+  };
+  const options = (focusedIndex, setFocusedIndex, handleArrowNavigation) => {
+    return React__default.Children.map(rest.children, (child, index) => {
+      return React__default.cloneElement(child, {
+        variant: componentVariant,
+        tabIndex: index === focusedIndex ? 0 : -1,
+        selected: isSelected(child.props.value, index),
+        "aria-selected": isSelected(child.props.value, index),
+        onKeyDown: handleArrowNavigation,
+        ref: (ref) => {
+          optionRefs[index] = ref;
+        },
+        onFocus: (e) => {
+          e.stopPropagation();
+        },
+        onClick: (e) => {
+          setFocusedIndex(index);
+          if (onChange) onChange(e.currentTarget.value);
+        }
+      });
+    });
+  };
+  return /* @__PURE__ */ jsx(Box, { display: "inline-flex", bg: "whiteGrey", borderRadius: "9999px", ...rest, children: /* @__PURE__ */ jsx(FocusManager, { refs: optionRefs, defaultFocusedIndex: getSelectedIndex(), children: ({ focusedIndex, setFocusedIndex, handleArrowNavigation }) => options(focusedIndex, setFocusedIndex, handleArrowNavigation) }) });
+}
+export {
+  Switcher as default
+};
+//# sourceMappingURL=Switcher.js.map

package/dist/esm/Switcher/Switcher.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switcher.js","sources":["../../../src/Switcher/Switcher.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { Box } from \"../Box\";\nimport FocusManager from \"../utils/ts/FocusManager\";\nimport type { ComponentVariant } from \"../NDSProvider/ComponentVariantContext\";\nimport { useComponentVariant } from \"../NDSProvider/ComponentVariantContext\";\nimport type { SwitchProps } from \"./Switch\";\n\ntype SwitcherProps = {\n  variant?: ComponentVariant;\n  children?: ReactElement<SwitchProps>[];\n  selected?: string;\n  onChange?: (value: string) => void;\n};\n\nfunction Switcher({ variant, selected, onChange, ...rest }: SwitcherProps) {\n  const componentVariant = useComponentVariant(variant);\n\n  const optionRefs = [];\n\n  const isSelected = (value: string, index: number) => {\n    if (!selected) return index === 0;\n\n    return value === selected;\n  };\n\n  const getSelectedIndex = () => {\n    return React.Children.toArray(rest.children).findIndex(\n      (child) => (child as ReactElement)?.props?.value === selected\n    );\n  };\n\n  const options = (focusedIndex, setFocusedIndex, handleArrowNavigation) => {\n    return React.Children.map(rest.children, (child: ReactElement<SwitchProps>, index) => {\n      return React.cloneElement(child, {\n        variant: componentVariant,\n        tabIndex: index === focusedIndex ? 0 : -1,\n        selected: isSelected(child.props.value, index),\n        \"aria-selected\": isSelected(child.props.value, index),\n        onKeyDown: handleArrowNavigation,\n        ref: (ref) => {\n          optionRefs[index] = ref;\n        },\n        onFocus: (e) => {\n          e.stopPropagation();\n        },\n        onClick: (e) => {\n          setFocusedIndex(index);\n          if (onChange) onChange(e.currentTarget.value);\n        },\n      });\n    });\n  };\n\n  return (\n    <Box display=\"inline-flex\" bg=\"whiteGrey\" borderRadius=\"9999px\" {...rest}>\n      <FocusManager refs={optionRefs} defaultFocusedIndex={getSelectedIndex()}>\n        {({ focusedIndex, setFocusedIndex, handleArrowNavigation }) =>\n          options(focusedIndex, setFocusedIndex, handleArrowNavigation)\n        }\n      </FocusManager>\n    </Box>\n  );\n}\n\nexport default Switcher;\n"],"names":["React"],"mappings":";;;;;AAcA,SAAS,SAAS,EAAE,SAAS,UAAU,UAAU,GAAG,QAAuB;AACzE,QAAM,mBAAmB,oBAAoB,OAAO;AAEpD,QAAM,aAAa,CAAA;AAEnB,QAAM,aAAa,CAAC,OAAe,UAAkB;AACnD,QAAI,CAAC,SAAU,QAAO,UAAU;AAEhC,WAAO,UAAU;AAAA,EACnB;AAEA,QAAM,mBAAmB,MAAM;AAC7B,WAAOA,eAAM,SAAS,QAAQ,KAAK,QAAQ,EAAE;AAAA,MAC3C,CAAC,UAAW,OAAwB,OAAO,UAAU;AAAA,IAAA;AAAA,EAEzD;AAEA,QAAM,UAAU,CAAC,cAAc,iBAAiB,0BAA0B;AACxE,WAAOA,eAAM,SAAS,IAAI,KAAK,UAAU,CAAC,OAAkC,UAAU;AACpF,aAAOA,eAAM,aAAa,OAAO;AAAA,QAC/B,SAAS;AAAA,QACT,UAAU,UAAU,eAAe,IAAI;AAAA,QACvC,UAAU,WAAW,MAAM,MAAM,OAAO,KAAK;AAAA,QAC7C,iBAAiB,WAAW,MAAM,MAAM,OAAO,KAAK;AAAA,QACpD,WAAW;AAAA,QACX,KAAK,CAAC,QAAQ;AACZ,qBAAW,KAAK,IAAI;AAAA,QACtB;AAAA,QACA,SAAS,CAAC,MAAM;AACd,YAAE,gBAAA;AAAA,QACJ;AAAA,QACA,SAAS,CAAC,MAAM;AACd,0BAAgB,KAAK;AACrB,cAAI,SAAU,UAAS,EAAE,cAAc,KAAK;AAAA,QAC9C;AAAA,MAAA,CACD;AAAA,IACH,CAAC;AAAA,EACH;AAEA,SACE,oBAAC,KAAA,EAAI,SAAQ,eAAc,IAAG,aAAY,cAAa,UAAU,GAAG,MAClE,UAAA,oBAAC,cAAA,EAAa,MAAM,YAAY,qBAAqB,iBAAA,GAClD,UAAA,CAAC,EAAE,cAAc,iBAAiB,sBAAA,MACjC,QAAQ,cAAc,iBAAiB,qBAAqB,EAAA,CAEhE,EAAA,CACF;AAEJ;"}

package/dist/esm/Table/BaseTable.js

@@ -0,0 +1,56 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { styled } from "styled-components";
+import "../node_modules/.pnpm/styled-system@5.1.5/node_modules/styled-system/dist/index.esm.js";
+import TableHead from "./TableHead.js";
+import TableBody from "./TableBody.js";
+import TableFoot from "./TableFoot.js";
+import { space } from "../node_modules/.pnpm/@styled-system_space@5.1.2/node_modules/@styled-system/space/dist/index.esm.js";
+const StyledTable = styled.table(space, {
+  borderCollapse: "collapse",
+  width: "100%",
+  background: "white",
+  position: "relative"
+});
+function BaseTable({
+  noRowsContent = "No records have been created for this table.",
+  keyField = "id",
+  loading = false,
+  footerRows = [],
+  rowHovers = true,
+  compact = false,
+  stickyHeader = false,
+  onRowMouseEnter = () => {
+  },
+  onRowMouseLeave = () => {
+  },
+  columns,
+  rows,
+  id,
+  className,
+  rowBorder = false,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(StyledTable, { id, className, ...props, children: [
+    /* @__PURE__ */ jsx(TableHead, { columns, compact, sticky: stickyHeader }),
+    /* @__PURE__ */ jsx(
+      TableBody,
+      {
+        columns,
+        rows,
+        keyField,
+        noRowsContent,
+        loading,
+        rowHovers,
+        compact,
+        onRowMouseLeave,
+        onRowMouseEnter,
+        rowBorder
+      }
+    ),
+    footerRows && /* @__PURE__ */ jsx(TableFoot, { columns, rows: footerRows, keyField, loading, compact })
+  ] });
+}
+export {
+  BaseTable as default
+};
+//# sourceMappingURL=BaseTable.js.map

package/dist/esm/Table/BaseTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseTable.js","sources":["../../../src/Table/BaseTable.tsx"],"sourcesContent":["import React, { type ReactNode } from \"react\";\nimport { styled } from \"styled-components\";\nimport { space } from \"styled-system\";\nimport TableHead from \"./TableHead\";\nimport TableBody from \"./TableBody\";\nimport TableFoot from \"./TableFoot\";\nimport { RowType, Columns, RowBorder } from \"./Table.types\";\n\nexport type BaseTableProps<ColumnMetaData> = {\n  columns: Columns<ColumnMetaData>;\n  rows: RowType[];\n  noRowsContent?: ReactNode;\n  keyField?: string;\n  id?: string;\n  loading?: boolean;\n  footerRows?: any;\n  rowHovers?: boolean;\n  compact?: boolean;\n  className?: string;\n  stickyHeader?: boolean;\n  onRowMouseEnter?: (...args: any[]) => any;\n  onRowMouseLeave?: (...args: any[]) => any;\n  onMouseEnter?: any;\n  onMouseLeave?: any;\n  rowBorder?: RowBorder;\n};\n\nconst StyledTable = styled.table(space, {\n  borderCollapse: \"collapse\",\n  width: \"100%\",\n  background: \"white\",\n  position: \"relative\",\n});\n\nfunction BaseTable<ColumnMetaData>({\n  noRowsContent = \"No records have been created for this table.\",\n  keyField = \"id\",\n  loading = false,\n  footerRows = [],\n  rowHovers = true,\n  compact = false,\n  stickyHeader = false,\n  onRowMouseEnter = () => {},\n  onRowMouseLeave = () => {},\n  columns,\n  rows,\n  id,\n  className,\n  rowBorder = false,\n  ...props\n}: BaseTableProps<ColumnMetaData>) {\n  return (\n    <StyledTable id={id} className={className} {...props}>\n      <TableHead columns={columns} compact={compact} sticky={stickyHeader} />\n      <TableBody\n        columns={columns}\n        rows={rows}\n        keyField={keyField}\n        noRowsContent={noRowsContent}\n        loading={loading}\n        rowHovers={rowHovers}\n        compact={compact}\n        onRowMouseLeave={onRowMouseLeave}\n        onRowMouseEnter={onRowMouseEnter}\n        rowBorder={rowBorder}\n      />\n      {footerRows && (\n        <TableFoot columns={columns} rows={footerRows} keyField={keyField} loading={loading} compact={compact} />\n      )}\n    </StyledTable>\n  );\n}\n\nexport default BaseTable;\n"],"names":[],"mappings":";;;;;;;AA2BA,MAAM,cAAc,OAAO,MAAM,OAAO;AAAA,EACtC,gBAAgB;AAAA,EAChB,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,UAAU;AACZ,CAAC;AAED,SAAS,UAA0B;AAAA,EACjC,gBAAgB;AAAA,EAChB,WAAW;AAAA,EACX,UAAU;AAAA,EACV,aAAa,CAAA;AAAA,EACb,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,eAAe;AAAA,EACf,kBAAkB,MAAM;AAAA,EAAC;AAAA,EACzB,kBAAkB,MAAM;AAAA,EAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,GAAG;AACL,GAAmC;AACjC,SACE,qBAAC,aAAA,EAAY,IAAQ,WAAuB,GAAG,OAC7C,UAAA;AAAA,IAAA,oBAAC,WAAA,EAAU,SAAkB,SAAkB,QAAQ,cAAc;AAAA,IACrE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IAAA;AAAA,IAED,kCACE,WAAA,EAAU,SAAkB,MAAM,YAAY,UAAoB,SAAkB,QAAA,CAAkB;AAAA,EAAA,GAE3G;AAEJ;"}

package/dist/esm/Table/SortingColumnHeader.js

@@ -0,0 +1,32 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useTranslation } from "../node_modules/.pnpm/react-i18next@12.3.1_i18next@19.9.2_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/react-i18next/dist/es/useTranslation.js";
+import Flex from "../Flex/Flex.js";
+import Text from "../Type/Text.js";
+import ControlIcon from "../Button/ControlIcon.js";
+function SortingColumnHeader({
+  onChange,
+  label,
+  ariaLabel,
+  ascending = false,
+  active = false
+}) {
+  const { t } = useTranslation();
+  const defaultAriaLabel = ascending ? t("sort descending") : t("sort ascending");
+  return /* @__PURE__ */ jsxs(Flex, { alignItems: "center", children: [
+    /* @__PURE__ */ jsx(Text, { mr: "x1", children: label }),
+    /* @__PURE__ */ jsx(
+      ControlIcon,
+      {
+        size: "x3",
+        icon: ascending ? "sortDown" : "sortUp",
+        label: ariaLabel || defaultAriaLabel,
+        toggled: active,
+        onClick: onChange
+      }
+    )
+  ] });
+}
+export {
+  SortingColumnHeader as default
+};
+//# sourceMappingURL=SortingColumnHeader.js.map

package/dist/esm/Table/SortingColumnHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SortingColumnHeader.js","sources":["../../../src/Table/SortingColumnHeader.tsx"],"sourcesContent":["import React from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { Text } from \"../Type\";\nimport { Flex } from \"../Flex\";\nimport { ControlIcon } from \"../Button\";\n\ninterface SortingColumnHeaderProps {\n  onChange?: React.MouseEventHandler<HTMLButtonElement>;\n  ariaLabel?: string;\n  label?: string;\n  ascending?: boolean;\n  active?: boolean;\n}\n\nfunction SortingColumnHeader({\n  onChange,\n  label,\n  ariaLabel,\n  ascending = false,\n  active = false,\n}: SortingColumnHeaderProps) {\n  const { t } = useTranslation();\n  const defaultAriaLabel = ascending ? t(\"sort descending\") : t(\"sort ascending\");\n\n  return (\n    <Flex alignItems=\"center\">\n      <Text mr=\"x1\">{label}</Text>\n      <ControlIcon\n        size=\"x3\"\n        icon={ascending ? \"sortDown\" : \"sortUp\"}\n        label={ariaLabel || defaultAriaLabel}\n        toggled={active}\n        onClick={onChange}\n      />\n    </Flex>\n  );\n}\n\nexport default SortingColumnHeader;\n"],"names":[],"mappings":";;;;;AAcA,SAAS,oBAAoB;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,SAAS;AACX,GAA6B;AAC3B,QAAM,EAAE,EAAA,IAAM,eAAA;AACd,QAAM,mBAAmB,YAAY,EAAE,iBAAiB,IAAI,EAAE,gBAAgB;AAE9E,SACE,qBAAC,MAAA,EAAK,YAAW,UACf,UAAA;AAAA,IAAA,oBAAC,MAAA,EAAK,IAAG,MAAM,UAAA,OAAM;AAAA,IACrB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,MAAM,YAAY,aAAa;AAAA,QAC/B,OAAO,aAAa;AAAA,QACpB,SAAS;AAAA,QACT,SAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EACX,GACF;AAEJ;"}