@sproutsocial/seeds-react-table 1.0.0 → 1.0.1

package/.turbo/turbo-build.log

@@ -1,5 +1,77 @@
 yarn run v1.22.22
 $ tsup --dts
+▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:14:6:
+      14 │       "types": "./dist/index.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:12:6:
+      12 │       "import": "./dist/esm/index.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:13:6:
+      13 │       "require": "./dist/index.js",
+         ╵       ~~~~~~~~~
+
+▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:19:6:
+      19 │       "types": "./dist/tableCell.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:17:6:
+      17 │       "import": "./dist/esm/tableCell.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:18:6:
+      18 │       "require": "./dist/tableCell.js",
+         ╵       ~~~~~~~~~
+
+▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:24:6:
+      24 │       "types": "./dist/tableHeaderCell.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:22:6:
+      22 │       "import": "./dist/esm/tableHeaderCell.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:23:6:
+      23 │       "require": "./dist/tableHeaderCell.js",
+         ╵       ~~~~~~~~~
+
+▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:29:6:
+      29 │       "types": "./dist/tableRowAccordion.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:27:6:
+      27 │       "import": "./dist/esm/tableRowAccordion.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:28:6:
+      28 │       "require": "./dist/tableRowAccordion.js",
+         ╵       ~~~~~~~~~
+
 CLI Building entry: {"index":"src/index.ts","tableCell":"src/TableCell/index.ts","tableHeaderCell":"src/TableHeaderCell/index.ts","tableRowAccordion":"src/TableRowAccordion/index.ts"}
 CLI Using tsconfig: tsconfig.json
 CLI tsup v8.0.2
@@ -8,30 +80,182 @@ CLI Target: es2022
 CLI Cleaning output folder
 CJS Build start
 ESM Build start
-CJS dist/index.js                 10.34 KB
+[warn] ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:14:6:
+      14 │       "types": "./dist/index.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:12:6:
+      12 │       "import": "./dist/esm/index.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:13:6:
+      13 │       "require": "./dist/index.js",
+         ╵       ~~~~~~~~~
+
+
+[warn] ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:19:6:
+      19 │       "types": "./dist/tableCell.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:17:6:
+      17 │       "import": "./dist/esm/tableCell.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:18:6:
+      18 │       "require": "./dist/tableCell.js",
+         ╵       ~~~~~~~~~
+
+
+[warn] ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:24:6:
+      24 │       "types": "./dist/tableHeaderCell.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:22:6:
+      22 │       "import": "./dist/esm/tableHeaderCell.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:23:6:
+      23 │       "require": "./dist/tableHeaderCell.js",
+         ╵       ~~~~~~~~~
+
+
+[warn] ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:29:6:
+      29 │       "types": "./dist/tableRowAccordion.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:27:6:
+      27 │       "import": "./dist/esm/tableRowAccordion.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:28:6:
+      28 │       "require": "./dist/tableRowAccordion.js",
+         ╵       ~~~~~~~~~
+
+
+[warn] ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:14:6:
+      14 │       "types": "./dist/index.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:12:6:
+      12 │       "import": "./dist/esm/index.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:13:6:
+      13 │       "require": "./dist/index.js",
+         ╵       ~~~~~~~~~
+
+
+[warn] ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:19:6:
+      19 │       "types": "./dist/tableCell.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:17:6:
+      17 │       "import": "./dist/esm/tableCell.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:18:6:
+      18 │       "require": "./dist/tableCell.js",
+         ╵       ~~~~~~~~~
+
+
+[warn] ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:24:6:
+      24 │       "types": "./dist/tableHeaderCell.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:22:6:
+      22 │       "import": "./dist/esm/tableHeaderCell.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:23:6:
+      23 │       "require": "./dist/tableHeaderCell.js",
+         ╵       ~~~~~~~~~
+
+
+[warn] ▲ [WARNING] The condition "types" here will never be used as it comes after both "import" and "require" [package.json]
+
+    package.json:29:6:
+      29 │       "types": "./dist/tableRowAccordion.d.ts"
+         ╵       ~~~~~~~
+
+  The "import" condition comes earlier and will be used for all "import" statements:
+
+    package.json:27:6:
+      27 │       "import": "./dist/esm/tableRowAccordion.js",
+         ╵       ~~~~~~~~
+
+  The "require" condition comes earlier and will be used for all "require" calls:
+
+    package.json:28:6:
+      28 │       "require": "./dist/tableRowAccordion.js",
+         ╵       ~~~~~~~~~
+
+
+CJS dist/index.js                 10.33 KB
 CJS dist/tableCell.js             3.10 KB
-CJS dist/tableHeaderCell.js       5.97 KB
+CJS dist/tableHeaderCell.js       5.96 KB
 CJS dist/tableRowAccordion.js     6.36 KB
 CJS dist/index.js.map             18.90 KB
 CJS dist/tableCell.js.map         3.88 KB
 CJS dist/tableHeaderCell.js.map   8.11 KB
 CJS dist/tableRowAccordion.js.map 9.26 KB
-CJS ⚡️ Build success in 216ms
+CJS ⚡️ Build success in 330ms
 ESM dist/esm/index.js                 2.92 KB
 ESM dist/esm/tableCell.js             196.00 B
 ESM dist/esm/tableHeaderCell.js       270.00 B
-ESM dist/esm/chunk-67DCEN4G.js        3.90 KB
+ESM dist/esm/chunk-SMHAMHIP.js        3.89 KB
 ESM dist/esm/tableRowAccordion.js     2.93 KB
 ESM dist/esm/chunk-XJMS6762.js        1.34 KB
 ESM dist/esm/index.js.map             6.74 KB
 ESM dist/esm/tableCell.js.map         71.00 B
 ESM dist/esm/tableHeaderCell.js.map   71.00 B
-ESM dist/esm/chunk-67DCEN4G.js.map    8.00 KB
+ESM dist/esm/chunk-SMHAMHIP.js.map    8.00 KB
 ESM dist/esm/tableRowAccordion.js.map 5.25 KB
 ESM dist/esm/chunk-XJMS6762.js.map    3.79 KB
-ESM ⚡️ Build success in 221ms
+ESM ⚡️ Build success in 337ms
 DTS Build start
-DTS ⚡️ Build success in 86476ms
+DTS ⚡️ Build success in 88864ms
 DTS dist/index.d.ts                          1.27 KB
 DTS dist/tableCell.d.ts                      270.00 B
 DTS dist/tableHeaderCell.d.ts                396.00 B
@@ -50,4 +274,4 @@ DTS dist/TableHeaderCell-DsJpGb2j.d.mts      589.00 B
 DTS dist/TableTypes-jS0O3bwQ.d.mts           1.55 KB
 DTS dist/TableHeaderCellTypes-CsJQBwu2.d.mts 1.06 KB
 DTS dist/TableCellTypes-Cp-8r7l1.d.mts       1013.00 B
-Done in 92.63s.
+Done in 96.37s.

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @sproutsocial/seeds-react-table
 
+## 1.0.1
+
+### Patch Changes
+
+- 9fd8bac: Update dependencies to use semantic package version instead of wildcards
+- Updated dependencies [9fd8bac]
+  - @sproutsocial/seeds-react-system-props@3.0.2
+  - @sproutsocial/seeds-react-theme@2.2.1
+  - @sproutsocial/seeds-react-icon@1.1.2
+
 ## 1.0.0
 
 ### Major Changes

package/dist/esm/{chunk-67DCEN4G.js → chunk-SMHAMHIP.js}

@@ -70,8 +70,7 @@ var TableHeaderCell = class extends React.Component {
       onClick(e);
       return;
     }
-    if (!isSortable || !onSort)
-      return;
+    if (!isSortable || !onSort) return;
     onSort(id);
   };
   render() {
@@ -137,4 +136,4 @@ export {
   TableHeaderCell_default,
   TableHeaderCell_default2
 };
-//# sourceMappingURL=chunk-67DCEN4G.js.map
+//# sourceMappingURL=chunk-SMHAMHIP.js.map

package/dist/esm/{chunk-67DCEN4G.js.map → chunk-SMHAMHIP.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../src/TableHeaderCell/TableHeaderCell.tsx","../../src/TableHeaderCell/styles.ts","../../src/TableHeaderCell/constants.ts","../../src/TableHeaderCell/TableHeaderCellTypes.ts","../../src/TableHeaderCell/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport Icon, { type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport Container, { SortIcon, UnstyledButton } from \"./styles\";\nimport { SORT_DIRECTIONS } from \"./constants\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nexport class TableHeaderCell extends React.Component<TypeTableHeaderCellProps> {\n  static displayName: string;\n\n  getSortIcon = (\n    isSorted: boolean,\n    ariaSortDirection: \"ascending\" | \"descending\" | undefined\n  ) => {\n    const { sortDirection } = this.props;\n    let iconName: TypeIconName = \"caret-up-down-outline\";\n\n    if (isSorted && sortDirection === SORT_DIRECTIONS.ASC) {\n      iconName = \"caret-up-solid\";\n    } else if (isSorted && sortDirection === SORT_DIRECTIONS.DESC) {\n      iconName = \"caret-down-solid\";\n    }\n\n    return (\n      <SortIcon>\n        <Icon size=\"mini\" name={iconName} aria-label={ariaSortDirection} />\n      </SortIcon>\n    );\n  };\n\n  // @ts-note: If this is set to an HTMLButtonElement event, then the `Container` freaks out\n  handleClick = (\n    e: React.MouseEvent<HTMLTableCellElement | HTMLButtonElement>\n  ) => {\n    const { onClick, onSort, isSortable, id } = this.props;\n\n    if (onClick || isSortable) {\n      e.preventDefault();\n    }\n\n    if (onClick) {\n      // @ts-note: Right now the `onClick` is incorrectly set to consume an HTMLButtonElement event\n      onClick(e as unknown as React.MouseEvent<HTMLButtonElement>);\n      return;\n    }\n\n    if (!isSortable || !onSort) return;\n    onSort(id);\n  };\n\n  override render() {\n    const {\n      id,\n      content,\n      colSpan,\n      width,\n      align,\n      isSortable,\n      sortId,\n      sortDirection,\n      children,\n      /* eslint-disable @typescript-eslint/no-unused-vars */\n      shouldTruncate,\n      onSort,\n      onClick,\n      /* eslint-enable @typescript-eslint/no-unused-vars */\n      color,\n      ...rest\n    } = this.props;\n\n    const isSorted = sortId === id;\n    const ariaSort = isSorted\n      ? sortDirection === SORT_DIRECTIONS.ASC\n        ? \"ascending\"\n        : \"descending\"\n      : undefined;\n\n    const buttonProps = isSortable\n      ? {\n          role: \"button\",\n          onClick: this.handleClick,\n        }\n      : {};\n\n    const scope = colSpan ? \"colgroup\" : \"col\";\n\n    return (\n      <Container\n        {...rest}\n        key={id}\n        alignment={align || \"left\"}\n        sortable={isSortable}\n        colSpan={colSpan}\n        scope={scope}\n        width={width}\n        onClick={this.handleClick}\n        data-tableheadercell-sortable={isSortable}\n        data-qa-table-header-cell=\"\"\n        data-qa-table-header-cell-sortdirection={sortDirection}\n        // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        color={color}\n        aria-sort={ariaSort}\n      >\n        {isSortable ? (\n          <UnstyledButton {...buttonProps}>\n            <div aria-live=\"polite\" role=\"status\">\n              {children || content}\n              {!children && this.getSortIcon(id === sortId, ariaSort)}\n            </div>\n          </UnstyledButton>\n        ) : (\n          children || content\n        )}\n      </Container>\n    );\n  }\n}\n\nexport default TableHeaderCell;\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nconst Container = styled.th<{\n  sortable?: boolean;\n  alignment: TypeTableHeaderCellProps[\"align\"];\n  width: TypeTableHeaderCellProps[\"width\"];\n}>`\n  ${(props) => props.theme.typography[100]}\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  padding: ${(props) => props.theme.space[300]};\n  text-align: ${(props) => props.alignment};\n\n  ${(props) =>\n    props.sortable &&\n    css`\n      position: relative;\n      cursor: pointer;\n    `}\n\n  ${COMMON}\n`;\n\nexport const SortIcon = styled.span`\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  font-size: 0;\n  padding: 0 ${(props) => props.theme.space[200]};\n`;\n\nexport const UnstyledButton = styled.button`\n  background: none;\n  border: none;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  padding: 0;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  cursor: pointer;\n`;\n\nexport default Container;\n","export const SORT_DIRECTIONS = {\n  ASC: \"ASC\",\n  DESC: \"DESC\",\n} as const;\n","import * as React from \"react\";\nimport type { TypeTableCellProps } from \"../TableCell/TableCellTypes\";\nimport { SORT_DIRECTIONS } from \"./constants\";\n\nexport type TypeEnumSortDirections = keyof typeof SORT_DIRECTIONS;\n\nexport interface TypeTableHeaderCellProps\n  extends Omit<TypeTableCellProps, \"onClick\"> {\n  /** Legacy Deteremines if a table column is sortable (optional) */\n  isSortable?: boolean;\n\n  /** Truncates text into a singular line with ellipsis (optional) */\n  shouldTruncate?: boolean;\n\n  /** Legacy: Callback for Sorting Table Columns (optional) */\n  onSort?: (id: string) => void;\n\n  /** Legacy: Controls which column is being sorted (optional) */\n  sortId?: string;\n\n  /** Legacy: Controls the current sort direction (optional) */\n  sortDirection?: TypeEnumSortDirections;\n\n  /** Callback for Click Events. If Included will override onSort prop */\n  onClick?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;\n}\n","import TableHeaderCell from \"./TableHeaderCell\";\n\nexport default TableHeaderCell;\nexport { TableHeaderCell };\nexport * from \"./TableHeaderCellTypes\";\nexport * from \"./constants\";\n"],"mappings":";AAAA,YAAY,WAAW;AACvB,OAAO,UAAiC;;;ACDxC,OAAO,UAAU,WAAW;AAC5B,SAAS,cAAc;AAGvB,IAAM,YAAY,OAAO;AAAA,IAKrB,CAAC,UAAU,MAAM,MAAM,WAAW,GAAG,CAAC;AAAA,iBACzB,CAAC,UAAU,MAAM,MAAM,YAAY,QAAQ;AAAA,aAC/C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,gBAC9B,CAAC,UAAU,MAAM,SAAS;AAAA;AAAA,IAEtC,CAAC,UACD,MAAM,YACN;AAAA;AAAA;AAAA,KAGC;AAAA;AAAA,IAED,MAAM;AAAA;AAGH,IAAM,WAAW,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKhB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAGzC,IAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAarC,IAAO,iBAAQ;;;AC7CR,IAAM,kBAAkB;AAAA,EAC7B,KAAK;AAAA,EACL,MAAM;AACR;;;AFqBQ,cAkFI,YAlFJ;AA8DF;AAhFC,IAAM,kBAAN,cAAoC,gBAAoC;AAAA,EAC7E,OAAO;AAAA,EAEP,cAAc,CACZ,UACA,sBACG;AACH,UAAM,EAAE,cAAc,IAAI,KAAK;AAC/B,QAAI,WAAyB;AAE7B,QAAI,YAAY,kBAAkB,gBAAgB,KAAK;AACrD,iBAAW;AAAA,IACb,WAAW,YAAY,kBAAkB,gBAAgB,MAAM;AAC7D,iBAAW;AAAA,IACb;AAEA,WACE,oBAAC,YACC,8BAAC,QAAK,MAAK,QAAO,MAAM,UAAU,cAAY,mBAAmB,GACnE;AAAA,EAEJ;AAAA;AAAA,EAGA,cAAc,CACZ,MACG;AACH,UAAM,EAAE,SAAS,QAAQ,YAAY,GAAG,IAAI,KAAK;AAEjD,QAAI,WAAW,YAAY;AACzB,QAAE,eAAe;AAAA,IACnB;AAEA,QAAI,SAAS;AAEX,cAAQ,CAAmD;AAC3D;AAAA,IACF;AAEA,QAAI,CAAC,cAAc,CAAC;AAAQ;AAC5B,WAAO,EAAE;AAAA,EACX;AAAA,EAES,SAAS;AAChB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,KAAK;AAET,UAAM,WAAW,WAAW;AAC5B,UAAM,WAAW,WACb,kBAAkB,gBAAgB,MAChC,cACA,eACF;AAEJ,UAAM,cAAc,aAChB;AAAA,MACE,MAAM;AAAA,MACN,SAAS,KAAK;AAAA,IAChB,IACA,CAAC;AAEL,UAAM,QAAQ,UAAU,aAAa;AAErC,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,WAAW,SAAS;AAAA,QACpB,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAS,KAAK;AAAA,QACd,iCAA+B;AAAA,QAC/B,6BAA0B;AAAA,QAC1B,2CAAyC;AAAA,QAIzC;AAAA,QACA,aAAW;AAAA;AAAA,MAEV,aACC,oBAAC,kBAAgB,GAAG,aAClB,+BAAC,SAAI,aAAU,UAAS,MAAK,UAC1B;AAAA,oBAAY;AAAA,QACZ,CAAC,YAAY,KAAK,YAAY,OAAO,QAAQ,QAAQ;AAAA,SACxD,GACF,IAEA,YAAY;AAAA,IAEhB;AAAA,EAEJ;AACF;AAEA,IAAO,0BAAQ;;;AGvHf,OAAuB;;;ACEvB,IAAOA,2BAAQ;","names":["TableHeaderCell_default"]}
+{"version":3,"sources":["../../src/TableHeaderCell/TableHeaderCell.tsx","../../src/TableHeaderCell/styles.ts","../../src/TableHeaderCell/constants.ts","../../src/TableHeaderCell/TableHeaderCellTypes.ts","../../src/TableHeaderCell/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport Icon, { type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport Container, { SortIcon, UnstyledButton } from \"./styles\";\nimport { SORT_DIRECTIONS } from \"./constants\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nexport class TableHeaderCell extends React.Component<TypeTableHeaderCellProps> {\n  static displayName: string;\n\n  getSortIcon = (\n    isSorted: boolean,\n    ariaSortDirection: \"ascending\" | \"descending\" | undefined\n  ) => {\n    const { sortDirection } = this.props;\n    let iconName: TypeIconName = \"caret-up-down-outline\";\n\n    if (isSorted && sortDirection === SORT_DIRECTIONS.ASC) {\n      iconName = \"caret-up-solid\";\n    } else if (isSorted && sortDirection === SORT_DIRECTIONS.DESC) {\n      iconName = \"caret-down-solid\";\n    }\n\n    return (\n      <SortIcon>\n        <Icon size=\"mini\" name={iconName} aria-label={ariaSortDirection} />\n      </SortIcon>\n    );\n  };\n\n  // @ts-note: If this is set to an HTMLButtonElement event, then the `Container` freaks out\n  handleClick = (\n    e: React.MouseEvent<HTMLTableCellElement | HTMLButtonElement>\n  ) => {\n    const { onClick, onSort, isSortable, id } = this.props;\n\n    if (onClick || isSortable) {\n      e.preventDefault();\n    }\n\n    if (onClick) {\n      // @ts-note: Right now the `onClick` is incorrectly set to consume an HTMLButtonElement event\n      onClick(e as unknown as React.MouseEvent<HTMLButtonElement>);\n      return;\n    }\n\n    if (!isSortable || !onSort) return;\n    onSort(id);\n  };\n\n  override render() {\n    const {\n      id,\n      content,\n      colSpan,\n      width,\n      align,\n      isSortable,\n      sortId,\n      sortDirection,\n      children,\n      /* eslint-disable @typescript-eslint/no-unused-vars */\n      shouldTruncate,\n      onSort,\n      onClick,\n      /* eslint-enable @typescript-eslint/no-unused-vars */\n      color,\n      ...rest\n    } = this.props;\n\n    const isSorted = sortId === id;\n    const ariaSort = isSorted\n      ? sortDirection === SORT_DIRECTIONS.ASC\n        ? \"ascending\"\n        : \"descending\"\n      : undefined;\n\n    const buttonProps = isSortable\n      ? {\n          role: \"button\",\n          onClick: this.handleClick,\n        }\n      : {};\n\n    const scope = colSpan ? \"colgroup\" : \"col\";\n\n    return (\n      <Container\n        {...rest}\n        key={id}\n        alignment={align || \"left\"}\n        sortable={isSortable}\n        colSpan={colSpan}\n        scope={scope}\n        width={width}\n        onClick={this.handleClick}\n        data-tableheadercell-sortable={isSortable}\n        data-qa-table-header-cell=\"\"\n        data-qa-table-header-cell-sortdirection={sortDirection}\n        // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        color={color}\n        aria-sort={ariaSort}\n      >\n        {isSortable ? (\n          <UnstyledButton {...buttonProps}>\n            <div aria-live=\"polite\" role=\"status\">\n              {children || content}\n              {!children && this.getSortIcon(id === sortId, ariaSort)}\n            </div>\n          </UnstyledButton>\n        ) : (\n          children || content\n        )}\n      </Container>\n    );\n  }\n}\n\nexport default TableHeaderCell;\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nconst Container = styled.th<{\n  sortable?: boolean;\n  alignment: TypeTableHeaderCellProps[\"align\"];\n  width: TypeTableHeaderCellProps[\"width\"];\n}>`\n  ${(props) => props.theme.typography[100]}\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  padding: ${(props) => props.theme.space[300]};\n  text-align: ${(props) => props.alignment};\n\n  ${(props) =>\n    props.sortable &&\n    css`\n      position: relative;\n      cursor: pointer;\n    `}\n\n  ${COMMON}\n`;\n\nexport const SortIcon = styled.span`\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  font-size: 0;\n  padding: 0 ${(props) => props.theme.space[200]};\n`;\n\nexport const UnstyledButton = styled.button`\n  background: none;\n  border: none;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  padding: 0;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  cursor: pointer;\n`;\n\nexport default Container;\n","export const SORT_DIRECTIONS = {\n  ASC: \"ASC\",\n  DESC: \"DESC\",\n} as const;\n","import * as React from \"react\";\nimport type { TypeTableCellProps } from \"../TableCell/TableCellTypes\";\nimport { SORT_DIRECTIONS } from \"./constants\";\n\nexport type TypeEnumSortDirections = keyof typeof SORT_DIRECTIONS;\n\nexport interface TypeTableHeaderCellProps\n  extends Omit<TypeTableCellProps, \"onClick\"> {\n  /** Legacy Deteremines if a table column is sortable (optional) */\n  isSortable?: boolean;\n\n  /** Truncates text into a singular line with ellipsis (optional) */\n  shouldTruncate?: boolean;\n\n  /** Legacy: Callback for Sorting Table Columns (optional) */\n  onSort?: (id: string) => void;\n\n  /** Legacy: Controls which column is being sorted (optional) */\n  sortId?: string;\n\n  /** Legacy: Controls the current sort direction (optional) */\n  sortDirection?: TypeEnumSortDirections;\n\n  /** Callback for Click Events. If Included will override onSort prop */\n  onClick?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;\n}\n","import TableHeaderCell from \"./TableHeaderCell\";\n\nexport default TableHeaderCell;\nexport { TableHeaderCell };\nexport * from \"./TableHeaderCellTypes\";\nexport * from \"./constants\";\n"],"mappings":";AAAA,YAAY,WAAW;AACvB,OAAO,UAAiC;;;ACDxC,OAAO,UAAU,WAAW;AAC5B,SAAS,cAAc;AAGvB,IAAM,YAAY,OAAO;AAAA,IAKrB,CAAC,UAAU,MAAM,MAAM,WAAW,GAAG,CAAC;AAAA,iBACzB,CAAC,UAAU,MAAM,MAAM,YAAY,QAAQ;AAAA,aAC/C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,gBAC9B,CAAC,UAAU,MAAM,SAAS;AAAA;AAAA,IAEtC,CAAC,UACD,MAAM,YACN;AAAA;AAAA;AAAA,KAGC;AAAA;AAAA,IAED,MAAM;AAAA;AAGH,IAAM,WAAW,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKhB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAGzC,IAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAarC,IAAO,iBAAQ;;;AC7CR,IAAM,kBAAkB;AAAA,EAC7B,KAAK;AAAA,EACL,MAAM;AACR;;;AFqBQ,cAkFI,YAlFJ;AA8DF;AAhFC,IAAM,kBAAN,cAAoC,gBAAoC;AAAA,EAC7E,OAAO;AAAA,EAEP,cAAc,CACZ,UACA,sBACG;AACH,UAAM,EAAE,cAAc,IAAI,KAAK;AAC/B,QAAI,WAAyB;AAE7B,QAAI,YAAY,kBAAkB,gBAAgB,KAAK;AACrD,iBAAW;AAAA,IACb,WAAW,YAAY,kBAAkB,gBAAgB,MAAM;AAC7D,iBAAW;AAAA,IACb;AAEA,WACE,oBAAC,YACC,8BAAC,QAAK,MAAK,QAAO,MAAM,UAAU,cAAY,mBAAmB,GACnE;AAAA,EAEJ;AAAA;AAAA,EAGA,cAAc,CACZ,MACG;AACH,UAAM,EAAE,SAAS,QAAQ,YAAY,GAAG,IAAI,KAAK;AAEjD,QAAI,WAAW,YAAY;AACzB,QAAE,eAAe;AAAA,IACnB;AAEA,QAAI,SAAS;AAEX,cAAQ,CAAmD;AAC3D;AAAA,IACF;AAEA,QAAI,CAAC,cAAc,CAAC,OAAQ;AAC5B,WAAO,EAAE;AAAA,EACX;AAAA,EAES,SAAS;AAChB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,KAAK;AAET,UAAM,WAAW,WAAW;AAC5B,UAAM,WAAW,WACb,kBAAkB,gBAAgB,MAChC,cACA,eACF;AAEJ,UAAM,cAAc,aAChB;AAAA,MACE,MAAM;AAAA,MACN,SAAS,KAAK;AAAA,IAChB,IACA,CAAC;AAEL,UAAM,QAAQ,UAAU,aAAa;AAErC,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,WAAW,SAAS;AAAA,QACpB,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAS,KAAK;AAAA,QACd,iCAA+B;AAAA,QAC/B,6BAA0B;AAAA,QAC1B,2CAAyC;AAAA,QAIzC;AAAA,QACA,aAAW;AAAA;AAAA,MAEV,aACC,oBAAC,kBAAgB,GAAG,aAClB,+BAAC,SAAI,aAAU,UAAS,MAAK,UAC1B;AAAA,oBAAY;AAAA,QACZ,CAAC,YAAY,KAAK,YAAY,OAAO,QAAQ,QAAQ;AAAA,SACxD,GACF,IAEA,YAAY;AAAA,IAEhB;AAAA,EAEJ;AACF;AAEA,IAAO,0BAAQ;;;AGvHf,OAAuB;;;ACEvB,IAAOA,2BAAQ;","names":["TableHeaderCell_default"]}

package/dist/esm/index.js

@@ -1,6 +1,6 @@
 import {
   TableHeaderCell_default2 as TableHeaderCell_default
-} from "./chunk-67DCEN4G.js";
+} from "./chunk-SMHAMHIP.js";
 import {
   TableCell_default2 as TableCell_default
 } from "./chunk-XJMS6762.js";

package/dist/esm/tableHeaderCell.js

@@ -2,7 +2,7 @@ import {
   SORT_DIRECTIONS,
   TableHeaderCell_default,
   TableHeaderCell_default2
-} from "./chunk-67DCEN4G.js";
+} from "./chunk-SMHAMHIP.js";
 export {
   SORT_DIRECTIONS,
   TableHeaderCell_default as TableHeaderCell,

package/dist/index.js

@@ -167,8 +167,7 @@ var TableHeaderCell = class extends React3.Component {
       onClick(e);
       return;
     }
-    if (!isSortable || !onSort)
-      return;
+    if (!isSortable || !onSort) return;
     onSort(id);
   };
   render() {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/Table.tsx","../src/TableCell/TableCell.tsx","../src/TableCell/styles.ts","../src/TableCell/TableCellTypes.ts","../src/TableCell/index.ts","../src/TableHeaderCell/TableHeaderCell.tsx","../src/TableHeaderCell/styles.ts","../src/TableHeaderCell/constants.ts","../src/TableHeaderCell/TableHeaderCellTypes.ts","../src/TableHeaderCell/index.ts","../src/styles.ts","../src/TableTypes.ts"],"sourcesContent":["import Table from \"./Table\";\n\nexport default Table;\nexport { Table };\nexport * from \"./TableTypes\";\n","import * as React from \"react\";\nimport TableCell from \"./TableCell\";\nimport TableHeaderCell from \"./TableHeaderCell\";\nimport Container from \"./styles\";\nimport type {\n  TypePassthroughProps,\n  TypeTableProps,\n  TypeTableRow,\n} from \"./TableTypes\";\n\nconst renderTableRow = (row: TypeTableRow) => {\n  return (\n    <tbody key={row.id} data-qa-table-row=\"\">\n      <tr>\n        {row.cells.map((td) => {\n          return <TableCell {...td} key={td.id} />;\n        })}\n      </tr>\n    </tbody>\n  );\n};\n\n/**\n * The table component assist in rendering tablular data.\n */\nexport const Table = ({\n  head = [],\n  rows = [],\n  onSort,\n  sortId,\n  sortDirection,\n  rowRender,\n  children,\n  color,\n  ...rest\n}: TypeTableProps) => {\n  if (children) {\n    return (\n      <Container {...rest} data-qa-table=\"\">\n        {children}\n      </Container>\n    );\n  }\n\n  return (\n    <Container\n      {...rest}\n      data-qa-table=\"\"\n      // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      color={color}\n    >\n      <colgroup>\n        {head.map(({ id, colSpan = 1 }) => (\n          <col key={id} span={colSpan} />\n        ))}\n      </colgroup>\n      {head.length > 0 && (\n        <thead data-qa-table-header=\"\">\n          <tr>\n            {head.map(({ color, ...th }) => {\n              return (\n                <TableHeaderCell\n                  {...th}\n                  key={th.id}\n                  onSort={onSort}\n                  sortId={sortId}\n                  sortDirection={sortDirection}\n                  // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n                  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                  // @ts-ignore\n                  color={color}\n                />\n              );\n            })}\n          </tr>\n        </thead>\n      )}\n      {rows.map((row) => {\n        return rowRender ? rowRender(row) : renderTableRow(row);\n      })}\n    </Container>\n  );\n};\n\nexport const TableHead = ({ children, ...props }: TypePassthroughProps) => (\n  <thead {...props}>{children}</thead>\n);\n\nexport const TableBody = ({ children, ...props }: TypePassthroughProps) => (\n  <tbody {...props}>{children}</tbody>\n);\n\nexport const TableRow = ({ children, ...props }: TypePassthroughProps) => (\n  <tr {...props}>{children}</tr>\n);\n\nTableHead.displayName = \"Table.TableHead\";\nTableBody.displayName = \"Table.TableBody\";\nTableRow.displayName = \"Table.TableRow\";\nTableHeaderCell.displayName = \"Table.HeaderCell\";\nTableCell.displayName = \"Table.Cell\";\n\nTable.TableHead = TableHead;\nTable.TableBody = TableBody;\nTable.TableRow = TableRow;\nTable.HeaderCell = TableHeaderCell;\nTable.Cell = TableCell;\n\nexport default Table;\n","import * as React from \"react\";\nimport Container from \"./styles\";\nimport type { TypeTableCellProps } from \"./TableCellTypes\";\n\n/**\n * The table cell component is for rendering table cells and is meant to be used with the table component.\n */\nexport class TableCell extends React.Component<TypeTableCellProps> {\n  static displayName: string;\n  override render() {\n    const {\n      id,\n      content,\n      colSpan,\n      width,\n      align,\n      scope,\n      children,\n      color,\n      ...rest\n    } = this.props;\n    return (\n      <Container\n        {...rest}\n        // If the `scope` property is passed we must render the element as a <th>\n        as={scope ? \"th\" : \"td\"}\n        scope={scope ? scope : undefined}\n        alignment={align || \"left\"}\n        key={id}\n        colSpan={colSpan}\n        width={width}\n        data-qa-table-cell=\"\"\n        // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        color={color}\n      >\n        {children || content}\n      </Container>\n    );\n  }\n}\n\nexport default TableCell;\n","import styled from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeTableCellProps } from \"./TableCellTypes\";\n\nconst Container = styled.td<{\n  alignment: TypeTableCellProps[\"align\"];\n}>`\n  ${(props) => props.theme.typography[200]}\n  font-weight: ${(props) => props.theme.fontWeights.normal};\n  padding: ${(props) => props.theme.space[300]};\n  text-align: ${(props) => props.alignment};\n\n  ${COMMON}\n`;\n\nexport default Container;\n","import * as React from \"react\";\nimport type { TypeSystemCommonProps } from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypeTableCellProps\n  extends TypeSystemCommonProps,\n    Omit<\n      React.ComponentPropsWithoutRef<\"td\">,\n      keyof TypeSystemCommonProps | \"content\"\n    > {\n  /** Table Cell Id */\n  id: string;\n\n  /** Content is deprecated.  Please use children instead. Content to be render */\n  content?: React.ReactNode;\n\n  /** Controls the colSpan attribute (optional) */\n  colSpan?: number;\n\n  /** Controls the width attribute (optional) */\n  width?: number;\n\n  /** Controls the CSS text-align property (optional) */\n  align?: \"left\" | \"right\" | \"center\" | \"justify\";\n\n  /** Controls the scope attribute. If set, will change the element from a <td> to a <th>. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th#scope (optional)  */\n  scope?: \"row\" | \"col\" | \"rowGroup\" | \"colGroup\";\n\n  /** Children to be rendered */\n  children?: React.ReactNode;\n}\n","import TableCell from \"./TableCell\";\n\nexport default TableCell;\nexport { TableCell };\nexport * from \"./TableCellTypes\";\n","import * as React from \"react\";\nimport Icon, { type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport Container, { SortIcon, UnstyledButton } from \"./styles\";\nimport { SORT_DIRECTIONS } from \"./constants\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nexport class TableHeaderCell extends React.Component<TypeTableHeaderCellProps> {\n  static displayName: string;\n\n  getSortIcon = (\n    isSorted: boolean,\n    ariaSortDirection: \"ascending\" | \"descending\" | undefined\n  ) => {\n    const { sortDirection } = this.props;\n    let iconName: TypeIconName = \"caret-up-down-outline\";\n\n    if (isSorted && sortDirection === SORT_DIRECTIONS.ASC) {\n      iconName = \"caret-up-solid\";\n    } else if (isSorted && sortDirection === SORT_DIRECTIONS.DESC) {\n      iconName = \"caret-down-solid\";\n    }\n\n    return (\n      <SortIcon>\n        <Icon size=\"mini\" name={iconName} aria-label={ariaSortDirection} />\n      </SortIcon>\n    );\n  };\n\n  // @ts-note: If this is set to an HTMLButtonElement event, then the `Container` freaks out\n  handleClick = (\n    e: React.MouseEvent<HTMLTableCellElement | HTMLButtonElement>\n  ) => {\n    const { onClick, onSort, isSortable, id } = this.props;\n\n    if (onClick || isSortable) {\n      e.preventDefault();\n    }\n\n    if (onClick) {\n      // @ts-note: Right now the `onClick` is incorrectly set to consume an HTMLButtonElement event\n      onClick(e as unknown as React.MouseEvent<HTMLButtonElement>);\n      return;\n    }\n\n    if (!isSortable || !onSort) return;\n    onSort(id);\n  };\n\n  override render() {\n    const {\n      id,\n      content,\n      colSpan,\n      width,\n      align,\n      isSortable,\n      sortId,\n      sortDirection,\n      children,\n      /* eslint-disable @typescript-eslint/no-unused-vars */\n      shouldTruncate,\n      onSort,\n      onClick,\n      /* eslint-enable @typescript-eslint/no-unused-vars */\n      color,\n      ...rest\n    } = this.props;\n\n    const isSorted = sortId === id;\n    const ariaSort = isSorted\n      ? sortDirection === SORT_DIRECTIONS.ASC\n        ? \"ascending\"\n        : \"descending\"\n      : undefined;\n\n    const buttonProps = isSortable\n      ? {\n          role: \"button\",\n          onClick: this.handleClick,\n        }\n      : {};\n\n    const scope = colSpan ? \"colgroup\" : \"col\";\n\n    return (\n      <Container\n        {...rest}\n        key={id}\n        alignment={align || \"left\"}\n        sortable={isSortable}\n        colSpan={colSpan}\n        scope={scope}\n        width={width}\n        onClick={this.handleClick}\n        data-tableheadercell-sortable={isSortable}\n        data-qa-table-header-cell=\"\"\n        data-qa-table-header-cell-sortdirection={sortDirection}\n        // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        color={color}\n        aria-sort={ariaSort}\n      >\n        {isSortable ? (\n          <UnstyledButton {...buttonProps}>\n            <div aria-live=\"polite\" role=\"status\">\n              {children || content}\n              {!children && this.getSortIcon(id === sortId, ariaSort)}\n            </div>\n          </UnstyledButton>\n        ) : (\n          children || content\n        )}\n      </Container>\n    );\n  }\n}\n\nexport default TableHeaderCell;\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nconst Container = styled.th<{\n  sortable?: boolean;\n  alignment: TypeTableHeaderCellProps[\"align\"];\n  width: TypeTableHeaderCellProps[\"width\"];\n}>`\n  ${(props) => props.theme.typography[100]}\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  padding: ${(props) => props.theme.space[300]};\n  text-align: ${(props) => props.alignment};\n\n  ${(props) =>\n    props.sortable &&\n    css`\n      position: relative;\n      cursor: pointer;\n    `}\n\n  ${COMMON}\n`;\n\nexport const SortIcon = styled.span`\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  font-size: 0;\n  padding: 0 ${(props) => props.theme.space[200]};\n`;\n\nexport const UnstyledButton = styled.button`\n  background: none;\n  border: none;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  padding: 0;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  cursor: pointer;\n`;\n\nexport default Container;\n","export const SORT_DIRECTIONS = {\n  ASC: \"ASC\",\n  DESC: \"DESC\",\n} as const;\n","import * as React from \"react\";\nimport type { TypeTableCellProps } from \"../TableCell/TableCellTypes\";\nimport { SORT_DIRECTIONS } from \"./constants\";\n\nexport type TypeEnumSortDirections = keyof typeof SORT_DIRECTIONS;\n\nexport interface TypeTableHeaderCellProps\n  extends Omit<TypeTableCellProps, \"onClick\"> {\n  /** Legacy Deteremines if a table column is sortable (optional) */\n  isSortable?: boolean;\n\n  /** Truncates text into a singular line with ellipsis (optional) */\n  shouldTruncate?: boolean;\n\n  /** Legacy: Callback for Sorting Table Columns (optional) */\n  onSort?: (id: string) => void;\n\n  /** Legacy: Controls which column is being sorted (optional) */\n  sortId?: string;\n\n  /** Legacy: Controls the current sort direction (optional) */\n  sortDirection?: TypeEnumSortDirections;\n\n  /** Callback for Click Events. If Included will override onSort prop */\n  onClick?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;\n}\n","import TableHeaderCell from \"./TableHeaderCell\";\n\nexport default TableHeaderCell;\nexport { TableHeaderCell };\nexport * from \"./TableHeaderCellTypes\";\nexport * from \"./constants\";\n","import styled from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\n\nconst Container = styled.table`\n  width: 100%;\n  border-collapse: collapse;\n\n  thead {\n    vertical-align: bottom;\n  }\n\n  tr,\n  thead {\n    border-bottom: 1px solid\n      ${(props) => props.theme.colors.container.border.base};\n  }\n\n  ${COMMON}\n`;\n\nexport default Container;\n","import * as React from \"react\";\nimport type {\n  TypeEnumSortDirections,\n  TypeTableHeaderCellProps,\n} from \"./TableHeaderCell\";\nimport type { TypeTableCellProps } from \"./TableCell/TableCellTypes\";\nimport type { TypeSystemCommonProps } from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypePassthroughProps {\n  children: React.ReactNode;\n}\n\nexport interface TypeTableRow {\n  /** Table Row Id */\n  id: string;\n\n  /** Array for TableCells to render */\n  cells: TypeTableCellProps[];\n}\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface TypeTableHeadProp\n  extends Omit<\n    TypeTableHeaderCellProps,\n    \"onSort\" | \"sortId\" | \"sortDirection\"\n  > {}\n\nexport interface TypeTableProps\n  extends TypeSystemCommonProps,\n    Omit<React.ComponentPropsWithoutRef<\"table\">, keyof TypeSystemCommonProps> {\n  /** Array of TableHeaderCells to render */\n  head?: TypeTableHeadProp[];\n\n  /** Array of TableRows to render */\n  rows?: TypeTableRow[];\n\n  /** Callback for Sorting Table Columns (optional) */\n  onSort?: (id: string) => void;\n\n  /** Controls which column is being sorted (optional) */\n  sortId?: string;\n\n  /** Controls the current sort direction (optional) */\n  sortDirection?: TypeEnumSortDirections;\n\n  /** Custom row render for flexibilty */\n  rowRender?: (row: TypeTableRow) => React.ReactNode;\n\n  /**\n   * Including children will overwrite all head, rows, rowRender, and sorting props\n   * Should be used for manually rendering tables and ignoring data props\n   */\n  children?: React.ReactNode;\n}\n"],"mappings":"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","names":["React","styled","React","TableCell_default","React","import_styled_components","import_seeds_react_system_props","Container","styled","styles_default","import_react","Icon","styles_default","React","TableHeaderCell_default","import_styled_components","import_seeds_react_system_props","Container","styled","styles_default","import_jsx_runtime","import_react","TableCell_default","styles_default","color","TableHeaderCell_default","React"]}
+{"version":3,"sources":["../src/index.ts","../src/Table.tsx","../src/TableCell/TableCell.tsx","../src/TableCell/styles.ts","../src/TableCell/TableCellTypes.ts","../src/TableCell/index.ts","../src/TableHeaderCell/TableHeaderCell.tsx","../src/TableHeaderCell/styles.ts","../src/TableHeaderCell/constants.ts","../src/TableHeaderCell/TableHeaderCellTypes.ts","../src/TableHeaderCell/index.ts","../src/styles.ts","../src/TableTypes.ts"],"sourcesContent":["import Table from \"./Table\";\n\nexport default Table;\nexport { Table };\nexport * from \"./TableTypes\";\n","import * as React from \"react\";\nimport TableCell from \"./TableCell\";\nimport TableHeaderCell from \"./TableHeaderCell\";\nimport Container from \"./styles\";\nimport type {\n  TypePassthroughProps,\n  TypeTableProps,\n  TypeTableRow,\n} from \"./TableTypes\";\n\nconst renderTableRow = (row: TypeTableRow) => {\n  return (\n    <tbody key={row.id} data-qa-table-row=\"\">\n      <tr>\n        {row.cells.map((td) => {\n          return <TableCell {...td} key={td.id} />;\n        })}\n      </tr>\n    </tbody>\n  );\n};\n\n/**\n * The table component assist in rendering tablular data.\n */\nexport const Table = ({\n  head = [],\n  rows = [],\n  onSort,\n  sortId,\n  sortDirection,\n  rowRender,\n  children,\n  color,\n  ...rest\n}: TypeTableProps) => {\n  if (children) {\n    return (\n      <Container {...rest} data-qa-table=\"\">\n        {children}\n      </Container>\n    );\n  }\n\n  return (\n    <Container\n      {...rest}\n      data-qa-table=\"\"\n      // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      color={color}\n    >\n      <colgroup>\n        {head.map(({ id, colSpan = 1 }) => (\n          <col key={id} span={colSpan} />\n        ))}\n      </colgroup>\n      {head.length > 0 && (\n        <thead data-qa-table-header=\"\">\n          <tr>\n            {head.map(({ color, ...th }) => {\n              return (\n                <TableHeaderCell\n                  {...th}\n                  key={th.id}\n                  onSort={onSort}\n                  sortId={sortId}\n                  sortDirection={sortDirection}\n                  // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n                  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                  // @ts-ignore\n                  color={color}\n                />\n              );\n            })}\n          </tr>\n        </thead>\n      )}\n      {rows.map((row) => {\n        return rowRender ? rowRender(row) : renderTableRow(row);\n      })}\n    </Container>\n  );\n};\n\nexport const TableHead = ({ children, ...props }: TypePassthroughProps) => (\n  <thead {...props}>{children}</thead>\n);\n\nexport const TableBody = ({ children, ...props }: TypePassthroughProps) => (\n  <tbody {...props}>{children}</tbody>\n);\n\nexport const TableRow = ({ children, ...props }: TypePassthroughProps) => (\n  <tr {...props}>{children}</tr>\n);\n\nTableHead.displayName = \"Table.TableHead\";\nTableBody.displayName = \"Table.TableBody\";\nTableRow.displayName = \"Table.TableRow\";\nTableHeaderCell.displayName = \"Table.HeaderCell\";\nTableCell.displayName = \"Table.Cell\";\n\nTable.TableHead = TableHead;\nTable.TableBody = TableBody;\nTable.TableRow = TableRow;\nTable.HeaderCell = TableHeaderCell;\nTable.Cell = TableCell;\n\nexport default Table;\n","import * as React from \"react\";\nimport Container from \"./styles\";\nimport type { TypeTableCellProps } from \"./TableCellTypes\";\n\n/**\n * The table cell component is for rendering table cells and is meant to be used with the table component.\n */\nexport class TableCell extends React.Component<TypeTableCellProps> {\n  static displayName: string;\n  override render() {\n    const {\n      id,\n      content,\n      colSpan,\n      width,\n      align,\n      scope,\n      children,\n      color,\n      ...rest\n    } = this.props;\n    return (\n      <Container\n        {...rest}\n        // If the `scope` property is passed we must render the element as a <th>\n        as={scope ? \"th\" : \"td\"}\n        scope={scope ? scope : undefined}\n        alignment={align || \"left\"}\n        key={id}\n        colSpan={colSpan}\n        width={width}\n        data-qa-table-cell=\"\"\n        // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        color={color}\n      >\n        {children || content}\n      </Container>\n    );\n  }\n}\n\nexport default TableCell;\n","import styled from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeTableCellProps } from \"./TableCellTypes\";\n\nconst Container = styled.td<{\n  alignment: TypeTableCellProps[\"align\"];\n}>`\n  ${(props) => props.theme.typography[200]}\n  font-weight: ${(props) => props.theme.fontWeights.normal};\n  padding: ${(props) => props.theme.space[300]};\n  text-align: ${(props) => props.alignment};\n\n  ${COMMON}\n`;\n\nexport default Container;\n","import * as React from \"react\";\nimport type { TypeSystemCommonProps } from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypeTableCellProps\n  extends TypeSystemCommonProps,\n    Omit<\n      React.ComponentPropsWithoutRef<\"td\">,\n      keyof TypeSystemCommonProps | \"content\"\n    > {\n  /** Table Cell Id */\n  id: string;\n\n  /** Content is deprecated.  Please use children instead. Content to be render */\n  content?: React.ReactNode;\n\n  /** Controls the colSpan attribute (optional) */\n  colSpan?: number;\n\n  /** Controls the width attribute (optional) */\n  width?: number;\n\n  /** Controls the CSS text-align property (optional) */\n  align?: \"left\" | \"right\" | \"center\" | \"justify\";\n\n  /** Controls the scope attribute. If set, will change the element from a <td> to a <th>. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/th#scope (optional)  */\n  scope?: \"row\" | \"col\" | \"rowGroup\" | \"colGroup\";\n\n  /** Children to be rendered */\n  children?: React.ReactNode;\n}\n","import TableCell from \"./TableCell\";\n\nexport default TableCell;\nexport { TableCell };\nexport * from \"./TableCellTypes\";\n","import * as React from \"react\";\nimport Icon, { type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport Container, { SortIcon, UnstyledButton } from \"./styles\";\nimport { SORT_DIRECTIONS } from \"./constants\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nexport class TableHeaderCell extends React.Component<TypeTableHeaderCellProps> {\n  static displayName: string;\n\n  getSortIcon = (\n    isSorted: boolean,\n    ariaSortDirection: \"ascending\" | \"descending\" | undefined\n  ) => {\n    const { sortDirection } = this.props;\n    let iconName: TypeIconName = \"caret-up-down-outline\";\n\n    if (isSorted && sortDirection === SORT_DIRECTIONS.ASC) {\n      iconName = \"caret-up-solid\";\n    } else if (isSorted && sortDirection === SORT_DIRECTIONS.DESC) {\n      iconName = \"caret-down-solid\";\n    }\n\n    return (\n      <SortIcon>\n        <Icon size=\"mini\" name={iconName} aria-label={ariaSortDirection} />\n      </SortIcon>\n    );\n  };\n\n  // @ts-note: If this is set to an HTMLButtonElement event, then the `Container` freaks out\n  handleClick = (\n    e: React.MouseEvent<HTMLTableCellElement | HTMLButtonElement>\n  ) => {\n    const { onClick, onSort, isSortable, id } = this.props;\n\n    if (onClick || isSortable) {\n      e.preventDefault();\n    }\n\n    if (onClick) {\n      // @ts-note: Right now the `onClick` is incorrectly set to consume an HTMLButtonElement event\n      onClick(e as unknown as React.MouseEvent<HTMLButtonElement>);\n      return;\n    }\n\n    if (!isSortable || !onSort) return;\n    onSort(id);\n  };\n\n  override render() {\n    const {\n      id,\n      content,\n      colSpan,\n      width,\n      align,\n      isSortable,\n      sortId,\n      sortDirection,\n      children,\n      /* eslint-disable @typescript-eslint/no-unused-vars */\n      shouldTruncate,\n      onSort,\n      onClick,\n      /* eslint-enable @typescript-eslint/no-unused-vars */\n      color,\n      ...rest\n    } = this.props;\n\n    const isSorted = sortId === id;\n    const ariaSort = isSorted\n      ? sortDirection === SORT_DIRECTIONS.ASC\n        ? \"ascending\"\n        : \"descending\"\n      : undefined;\n\n    const buttonProps = isSortable\n      ? {\n          role: \"button\",\n          onClick: this.handleClick,\n        }\n      : {};\n\n    const scope = colSpan ? \"colgroup\" : \"col\";\n\n    return (\n      <Container\n        {...rest}\n        key={id}\n        alignment={align || \"left\"}\n        sortable={isSortable}\n        colSpan={colSpan}\n        scope={scope}\n        width={width}\n        onClick={this.handleClick}\n        data-tableheadercell-sortable={isSortable}\n        data-qa-table-header-cell=\"\"\n        data-qa-table-header-cell-sortdirection={sortDirection}\n        // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        color={color}\n        aria-sort={ariaSort}\n      >\n        {isSortable ? (\n          <UnstyledButton {...buttonProps}>\n            <div aria-live=\"polite\" role=\"status\">\n              {children || content}\n              {!children && this.getSortIcon(id === sortId, ariaSort)}\n            </div>\n          </UnstyledButton>\n        ) : (\n          children || content\n        )}\n      </Container>\n    );\n  }\n}\n\nexport default TableHeaderCell;\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nconst Container = styled.th<{\n  sortable?: boolean;\n  alignment: TypeTableHeaderCellProps[\"align\"];\n  width: TypeTableHeaderCellProps[\"width\"];\n}>`\n  ${(props) => props.theme.typography[100]}\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  padding: ${(props) => props.theme.space[300]};\n  text-align: ${(props) => props.alignment};\n\n  ${(props) =>\n    props.sortable &&\n    css`\n      position: relative;\n      cursor: pointer;\n    `}\n\n  ${COMMON}\n`;\n\nexport const SortIcon = styled.span`\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  font-size: 0;\n  padding: 0 ${(props) => props.theme.space[200]};\n`;\n\nexport const UnstyledButton = styled.button`\n  background: none;\n  border: none;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  padding: 0;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  cursor: pointer;\n`;\n\nexport default Container;\n","export const SORT_DIRECTIONS = {\n  ASC: \"ASC\",\n  DESC: \"DESC\",\n} as const;\n","import * as React from \"react\";\nimport type { TypeTableCellProps } from \"../TableCell/TableCellTypes\";\nimport { SORT_DIRECTIONS } from \"./constants\";\n\nexport type TypeEnumSortDirections = keyof typeof SORT_DIRECTIONS;\n\nexport interface TypeTableHeaderCellProps\n  extends Omit<TypeTableCellProps, \"onClick\"> {\n  /** Legacy Deteremines if a table column is sortable (optional) */\n  isSortable?: boolean;\n\n  /** Truncates text into a singular line with ellipsis (optional) */\n  shouldTruncate?: boolean;\n\n  /** Legacy: Callback for Sorting Table Columns (optional) */\n  onSort?: (id: string) => void;\n\n  /** Legacy: Controls which column is being sorted (optional) */\n  sortId?: string;\n\n  /** Legacy: Controls the current sort direction (optional) */\n  sortDirection?: TypeEnumSortDirections;\n\n  /** Callback for Click Events. If Included will override onSort prop */\n  onClick?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;\n}\n","import TableHeaderCell from \"./TableHeaderCell\";\n\nexport default TableHeaderCell;\nexport { TableHeaderCell };\nexport * from \"./TableHeaderCellTypes\";\nexport * from \"./constants\";\n","import styled from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\n\nconst Container = styled.table`\n  width: 100%;\n  border-collapse: collapse;\n\n  thead {\n    vertical-align: bottom;\n  }\n\n  tr,\n  thead {\n    border-bottom: 1px solid\n      ${(props) => props.theme.colors.container.border.base};\n  }\n\n  ${COMMON}\n`;\n\nexport default Container;\n","import * as React from \"react\";\nimport type {\n  TypeEnumSortDirections,\n  TypeTableHeaderCellProps,\n} from \"./TableHeaderCell\";\nimport type { TypeTableCellProps } from \"./TableCell/TableCellTypes\";\nimport type { TypeSystemCommonProps } from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypePassthroughProps {\n  children: React.ReactNode;\n}\n\nexport interface TypeTableRow {\n  /** Table Row Id */\n  id: string;\n\n  /** Array for TableCells to render */\n  cells: TypeTableCellProps[];\n}\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\nexport interface TypeTableHeadProp\n  extends Omit<\n    TypeTableHeaderCellProps,\n    \"onSort\" | \"sortId\" | \"sortDirection\"\n  > {}\n\nexport interface TypeTableProps\n  extends TypeSystemCommonProps,\n    Omit<React.ComponentPropsWithoutRef<\"table\">, keyof TypeSystemCommonProps> {\n  /** Array of TableHeaderCells to render */\n  head?: TypeTableHeadProp[];\n\n  /** Array of TableRows to render */\n  rows?: TypeTableRow[];\n\n  /** Callback for Sorting Table Columns (optional) */\n  onSort?: (id: string) => void;\n\n  /** Controls which column is being sorted (optional) */\n  sortId?: string;\n\n  /** Controls the current sort direction (optional) */\n  sortDirection?: TypeEnumSortDirections;\n\n  /** Custom row render for flexibilty */\n  rowRender?: (row: TypeTableRow) => React.ReactNode;\n\n  /**\n   * Including children will overwrite all head, rows, rowRender, and sorting props\n   * Should be used for manually rendering tables and ignoring data props\n   */\n  children?: React.ReactNode;\n}\n"],"mappings":"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","names":["React","styled","React","TableCell_default","React","import_styled_components","import_seeds_react_system_props","Container","styled","styles_default","import_react","Icon","styles_default","React","TableHeaderCell_default","import_styled_components","import_seeds_react_system_props","Container","styled","styles_default","import_jsx_runtime","import_react","TableCell_default","styles_default","color","TableHeaderCell_default","React"]}

package/dist/tableHeaderCell.js

@@ -108,8 +108,7 @@ var TableHeaderCell = class extends React.Component {
       onClick(e);
       return;
     }
-    if (!isSortable || !onSort)
-      return;
+    if (!isSortable || !onSort) return;
     onSort(id);
   };
   render() {

package/dist/tableHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/TableHeaderCell/index.ts","../src/TableHeaderCell/TableHeaderCell.tsx","../src/TableHeaderCell/styles.ts","../src/TableHeaderCell/constants.ts","../src/TableHeaderCell/TableHeaderCellTypes.ts"],"sourcesContent":["import TableHeaderCell from \"./TableHeaderCell\";\n\nexport default TableHeaderCell;\nexport { TableHeaderCell };\nexport * from \"./TableHeaderCellTypes\";\nexport * from \"./constants\";\n","import * as React from \"react\";\nimport Icon, { type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport Container, { SortIcon, UnstyledButton } from \"./styles\";\nimport { SORT_DIRECTIONS } from \"./constants\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nexport class TableHeaderCell extends React.Component<TypeTableHeaderCellProps> {\n  static displayName: string;\n\n  getSortIcon = (\n    isSorted: boolean,\n    ariaSortDirection: \"ascending\" | \"descending\" | undefined\n  ) => {\n    const { sortDirection } = this.props;\n    let iconName: TypeIconName = \"caret-up-down-outline\";\n\n    if (isSorted && sortDirection === SORT_DIRECTIONS.ASC) {\n      iconName = \"caret-up-solid\";\n    } else if (isSorted && sortDirection === SORT_DIRECTIONS.DESC) {\n      iconName = \"caret-down-solid\";\n    }\n\n    return (\n      <SortIcon>\n        <Icon size=\"mini\" name={iconName} aria-label={ariaSortDirection} />\n      </SortIcon>\n    );\n  };\n\n  // @ts-note: If this is set to an HTMLButtonElement event, then the `Container` freaks out\n  handleClick = (\n    e: React.MouseEvent<HTMLTableCellElement | HTMLButtonElement>\n  ) => {\n    const { onClick, onSort, isSortable, id } = this.props;\n\n    if (onClick || isSortable) {\n      e.preventDefault();\n    }\n\n    if (onClick) {\n      // @ts-note: Right now the `onClick` is incorrectly set to consume an HTMLButtonElement event\n      onClick(e as unknown as React.MouseEvent<HTMLButtonElement>);\n      return;\n    }\n\n    if (!isSortable || !onSort) return;\n    onSort(id);\n  };\n\n  override render() {\n    const {\n      id,\n      content,\n      colSpan,\n      width,\n      align,\n      isSortable,\n      sortId,\n      sortDirection,\n      children,\n      /* eslint-disable @typescript-eslint/no-unused-vars */\n      shouldTruncate,\n      onSort,\n      onClick,\n      /* eslint-enable @typescript-eslint/no-unused-vars */\n      color,\n      ...rest\n    } = this.props;\n\n    const isSorted = sortId === id;\n    const ariaSort = isSorted\n      ? sortDirection === SORT_DIRECTIONS.ASC\n        ? \"ascending\"\n        : \"descending\"\n      : undefined;\n\n    const buttonProps = isSortable\n      ? {\n          role: \"button\",\n          onClick: this.handleClick,\n        }\n      : {};\n\n    const scope = colSpan ? \"colgroup\" : \"col\";\n\n    return (\n      <Container\n        {...rest}\n        key={id}\n        alignment={align || \"left\"}\n        sortable={isSortable}\n        colSpan={colSpan}\n        scope={scope}\n        width={width}\n        onClick={this.handleClick}\n        data-tableheadercell-sortable={isSortable}\n        data-qa-table-header-cell=\"\"\n        data-qa-table-header-cell-sortdirection={sortDirection}\n        // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        color={color}\n        aria-sort={ariaSort}\n      >\n        {isSortable ? (\n          <UnstyledButton {...buttonProps}>\n            <div aria-live=\"polite\" role=\"status\">\n              {children || content}\n              {!children && this.getSortIcon(id === sortId, ariaSort)}\n            </div>\n          </UnstyledButton>\n        ) : (\n          children || content\n        )}\n      </Container>\n    );\n  }\n}\n\nexport default TableHeaderCell;\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nconst Container = styled.th<{\n  sortable?: boolean;\n  alignment: TypeTableHeaderCellProps[\"align\"];\n  width: TypeTableHeaderCellProps[\"width\"];\n}>`\n  ${(props) => props.theme.typography[100]}\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  padding: ${(props) => props.theme.space[300]};\n  text-align: ${(props) => props.alignment};\n\n  ${(props) =>\n    props.sortable &&\n    css`\n      position: relative;\n      cursor: pointer;\n    `}\n\n  ${COMMON}\n`;\n\nexport const SortIcon = styled.span`\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  font-size: 0;\n  padding: 0 ${(props) => props.theme.space[200]};\n`;\n\nexport const UnstyledButton = styled.button`\n  background: none;\n  border: none;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  padding: 0;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  cursor: pointer;\n`;\n\nexport default Container;\n","export const SORT_DIRECTIONS = {\n  ASC: \"ASC\",\n  DESC: \"DESC\",\n} as const;\n","import * as React from \"react\";\nimport type { TypeTableCellProps } from \"../TableCell/TableCellTypes\";\nimport { SORT_DIRECTIONS } from \"./constants\";\n\nexport type TypeEnumSortDirections = keyof typeof SORT_DIRECTIONS;\n\nexport interface TypeTableHeaderCellProps\n  extends Omit<TypeTableCellProps, \"onClick\"> {\n  /** Legacy Deteremines if a table column is sortable (optional) */\n  isSortable?: boolean;\n\n  /** Truncates text into a singular line with ellipsis (optional) */\n  shouldTruncate?: boolean;\n\n  /** Legacy: Callback for Sorting Table Columns (optional) */\n  onSort?: (id: string) => void;\n\n  /** Legacy: Controls which column is being sorted (optional) */\n  sortId?: string;\n\n  /** Legacy: Controls the current sort direction (optional) */\n  sortDirection?: TypeEnumSortDirections;\n\n  /** Callback for Click Events. If Included will override onSort prop */\n  onClick?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;\n}\n"],"mappings":"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","names":["TableHeaderCell_default","styled","Icon","React","TableHeaderCell_default"]}
+{"version":3,"sources":["../src/TableHeaderCell/index.ts","../src/TableHeaderCell/TableHeaderCell.tsx","../src/TableHeaderCell/styles.ts","../src/TableHeaderCell/constants.ts","../src/TableHeaderCell/TableHeaderCellTypes.ts"],"sourcesContent":["import TableHeaderCell from \"./TableHeaderCell\";\n\nexport default TableHeaderCell;\nexport { TableHeaderCell };\nexport * from \"./TableHeaderCellTypes\";\nexport * from \"./constants\";\n","import * as React from \"react\";\nimport Icon, { type TypeIconName } from \"@sproutsocial/seeds-react-icon\";\nimport Container, { SortIcon, UnstyledButton } from \"./styles\";\nimport { SORT_DIRECTIONS } from \"./constants\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nexport class TableHeaderCell extends React.Component<TypeTableHeaderCellProps> {\n  static displayName: string;\n\n  getSortIcon = (\n    isSorted: boolean,\n    ariaSortDirection: \"ascending\" | \"descending\" | undefined\n  ) => {\n    const { sortDirection } = this.props;\n    let iconName: TypeIconName = \"caret-up-down-outline\";\n\n    if (isSorted && sortDirection === SORT_DIRECTIONS.ASC) {\n      iconName = \"caret-up-solid\";\n    } else if (isSorted && sortDirection === SORT_DIRECTIONS.DESC) {\n      iconName = \"caret-down-solid\";\n    }\n\n    return (\n      <SortIcon>\n        <Icon size=\"mini\" name={iconName} aria-label={ariaSortDirection} />\n      </SortIcon>\n    );\n  };\n\n  // @ts-note: If this is set to an HTMLButtonElement event, then the `Container` freaks out\n  handleClick = (\n    e: React.MouseEvent<HTMLTableCellElement | HTMLButtonElement>\n  ) => {\n    const { onClick, onSort, isSortable, id } = this.props;\n\n    if (onClick || isSortable) {\n      e.preventDefault();\n    }\n\n    if (onClick) {\n      // @ts-note: Right now the `onClick` is incorrectly set to consume an HTMLButtonElement event\n      onClick(e as unknown as React.MouseEvent<HTMLButtonElement>);\n      return;\n    }\n\n    if (!isSortable || !onSort) return;\n    onSort(id);\n  };\n\n  override render() {\n    const {\n      id,\n      content,\n      colSpan,\n      width,\n      align,\n      isSortable,\n      sortId,\n      sortDirection,\n      children,\n      /* eslint-disable @typescript-eslint/no-unused-vars */\n      shouldTruncate,\n      onSort,\n      onClick,\n      /* eslint-enable @typescript-eslint/no-unused-vars */\n      color,\n      ...rest\n    } = this.props;\n\n    const isSorted = sortId === id;\n    const ariaSort = isSorted\n      ? sortDirection === SORT_DIRECTIONS.ASC\n        ? \"ascending\"\n        : \"descending\"\n      : undefined;\n\n    const buttonProps = isSortable\n      ? {\n          role: \"button\",\n          onClick: this.handleClick,\n        }\n      : {};\n\n    const scope = colSpan ? \"colgroup\" : \"col\";\n\n    return (\n      <Container\n        {...rest}\n        key={id}\n        alignment={align || \"left\"}\n        sortable={isSortable}\n        colSpan={colSpan}\n        scope={scope}\n        width={width}\n        onClick={this.handleClick}\n        data-tableheadercell-sortable={isSortable}\n        data-qa-table-header-cell=\"\"\n        data-qa-table-header-cell-sortdirection={sortDirection}\n        // TODO: fix this type since `color` should be valid here. TS can't resolve the correct type.\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        color={color}\n        aria-sort={ariaSort}\n      >\n        {isSortable ? (\n          <UnstyledButton {...buttonProps}>\n            <div aria-live=\"polite\" role=\"status\">\n              {children || content}\n              {!children && this.getSortIcon(id === sortId, ariaSort)}\n            </div>\n          </UnstyledButton>\n        ) : (\n          children || content\n        )}\n      </Container>\n    );\n  }\n}\n\nexport default TableHeaderCell;\n","import styled, { css } from \"styled-components\";\nimport { COMMON } from \"@sproutsocial/seeds-react-system-props\";\nimport type { TypeTableHeaderCellProps } from \"./TableHeaderCellTypes\";\n\nconst Container = styled.th<{\n  sortable?: boolean;\n  alignment: TypeTableHeaderCellProps[\"align\"];\n  width: TypeTableHeaderCellProps[\"width\"];\n}>`\n  ${(props) => props.theme.typography[100]}\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  padding: ${(props) => props.theme.space[300]};\n  text-align: ${(props) => props.alignment};\n\n  ${(props) =>\n    props.sortable &&\n    css`\n      position: relative;\n      cursor: pointer;\n    `}\n\n  ${COMMON}\n`;\n\nexport const SortIcon = styled.span`\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  font-size: 0;\n  padding: 0 ${(props) => props.theme.space[200]};\n`;\n\nexport const UnstyledButton = styled.button`\n  background: none;\n  border: none;\n  color: inherit;\n  font: inherit;\n  line-height: normal;\n  overflow: visible;\n  padding: 0;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  cursor: pointer;\n`;\n\nexport default Container;\n","export const SORT_DIRECTIONS = {\n  ASC: \"ASC\",\n  DESC: \"DESC\",\n} as const;\n","import * as React from \"react\";\nimport type { TypeTableCellProps } from \"../TableCell/TableCellTypes\";\nimport { SORT_DIRECTIONS } from \"./constants\";\n\nexport type TypeEnumSortDirections = keyof typeof SORT_DIRECTIONS;\n\nexport interface TypeTableHeaderCellProps\n  extends Omit<TypeTableCellProps, \"onClick\"> {\n  /** Legacy Deteremines if a table column is sortable (optional) */\n  isSortable?: boolean;\n\n  /** Truncates text into a singular line with ellipsis (optional) */\n  shouldTruncate?: boolean;\n\n  /** Legacy: Callback for Sorting Table Columns (optional) */\n  onSort?: (id: string) => void;\n\n  /** Legacy: Controls which column is being sorted (optional) */\n  sortId?: string;\n\n  /** Legacy: Controls the current sort direction (optional) */\n  sortDirection?: TypeEnumSortDirections;\n\n  /** Callback for Click Events. If Included will override onSort prop */\n  onClick?: (e: React.SyntheticEvent<HTMLButtonElement>) => void;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA,iBAAAA;AAAA;AAAA;;;ACAA,YAAuB;AACvB,8BAAwC;;;ACDxC,+BAA4B;AAC5B,sCAAuB;AAGvB,IAAM,YAAY,yBAAAC,QAAO;AAAA,IAKrB,CAAC,UAAU,MAAM,MAAM,WAAW,GAAG,CAAC;AAAA,iBACzB,CAAC,UAAU,MAAM,MAAM,YAAY,QAAQ;AAAA,aAC/C,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA,gBAC9B,CAAC,UAAU,MAAM,SAAS;AAAA;AAAA,IAEtC,CAAC,UACD,MAAM,YACN;AAAA;AAAA;AAAA,KAGC;AAAA;AAAA,IAED,sCAAM;AAAA;AAGH,IAAM,WAAW,yBAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKhB,CAAC,UAAU,MAAM,MAAM,MAAM,GAAG,CAAC;AAAA;AAGzC,IAAM,iBAAiB,yBAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAarC,IAAO,iBAAQ;;;AC7CR,IAAM,kBAAkB;AAAA,EAC7B,KAAK;AAAA,EACL,MAAM;AACR;;;AFqBQ;AA8DF;AAhFC,IAAM,kBAAN,cAAoC,gBAAoC;AAAA,EAC7E,OAAO;AAAA,EAEP,cAAc,CACZ,UACA,sBACG;AACH,UAAM,EAAE,cAAc,IAAI,KAAK;AAC/B,QAAI,WAAyB;AAE7B,QAAI,YAAY,kBAAkB,gBAAgB,KAAK;AACrD,iBAAW;AAAA,IACb,WAAW,YAAY,kBAAkB,gBAAgB,MAAM;AAC7D,iBAAW;AAAA,IACb;AAEA,WACE,4CAAC,YACC,sDAAC,wBAAAC,SAAA,EAAK,MAAK,QAAO,MAAM,UAAU,cAAY,mBAAmB,GACnE;AAAA,EAEJ;AAAA;AAAA,EAGA,cAAc,CACZ,MACG;AACH,UAAM,EAAE,SAAS,QAAQ,YAAY,GAAG,IAAI,KAAK;AAEjD,QAAI,WAAW,YAAY;AACzB,QAAE,eAAe;AAAA,IACnB;AAEA,QAAI,SAAS;AAEX,cAAQ,CAAmD;AAC3D;AAAA,IACF;AAEA,QAAI,CAAC,cAAc,CAAC,OAAQ;AAC5B,WAAO,EAAE;AAAA,EACX;AAAA,EAES,SAAS;AAChB,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA,GAAG;AAAA,IACL,IAAI,KAAK;AAET,UAAM,WAAW,WAAW;AAC5B,UAAM,WAAW,WACb,kBAAkB,gBAAgB,MAChC,cACA,eACF;AAEJ,UAAM,cAAc,aAChB;AAAA,MACE,MAAM;AAAA,MACN,SAAS,KAAK;AAAA,IAChB,IACA,CAAC;AAEL,UAAM,QAAQ,UAAU,aAAa;AAErC,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,WAAW,SAAS;AAAA,QACpB,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,SAAS,KAAK;AAAA,QACd,iCAA+B;AAAA,QAC/B,6BAA0B;AAAA,QAC1B,2CAAyC;AAAA,QAIzC;AAAA,QACA,aAAW;AAAA;AAAA,MAEV,aACC,4CAAC,kBAAgB,GAAG,aAClB,uDAAC,SAAI,aAAU,UAAS,MAAK,UAC1B;AAAA,oBAAY;AAAA,QACZ,CAAC,YAAY,KAAK,YAAY,OAAO,QAAQ,QAAQ;AAAA,SACxD,GACF,IAEA,YAAY;AAAA,IAEhB;AAAA,EAEJ;AACF;AAEA,IAAO,0BAAQ;;;AGvHf,IAAAC,SAAuB;;;AJEvB,IAAOC,2BAAQ;","names":["TableHeaderCell_default","styled","Icon","React","TableHeaderCell_default"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sproutsocial/seeds-react-table",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Seeds React Table",
   "author": "Sprout Social, Inc.",
   "license": "MIT",
@@ -40,9 +40,9 @@
     "test:watch": "jest --watch --coverage=false"
   },
   "dependencies": {
-    "@sproutsocial/seeds-react-theme": "*",
-    "@sproutsocial/seeds-react-system-props": "*",
-    "@sproutsocial/seeds-react-icon": "*"
+    "@sproutsocial/seeds-react-theme": "^2.2.0",
+    "@sproutsocial/seeds-react-system-props": "^3.0.1",
+    "@sproutsocial/seeds-react-icon": "^1.1.1"
   },
   "devDependencies": {
     "@types/react": "^18.0.0",