@react-md/core 1.0.0-next.0

package/dist/table/TableFooter.js

@@ -0,0 +1,96 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cnb } from "cnbuilder";
+import { forwardRef, useCallback, useMemo, useState } from "react";
+import { useEnsuredRef } from "../useEnsuredRef.js";
+import { useIntersectionObserver } from "../useIntersectionObserver.js";
+import { bem } from "../utils/bem.js";
+import { TableConfigProvider, useTableConfig } from "./TableConfigurationProvider.js";
+import { useTableContainer } from "./TableContainerProvider.js";
+const styles = bem("rmd-tfoot");
+/**
+ * **Client Component**
+ * TODO: Create separate useStickyTableFooter + StickyTableFooter component
+ *
+ * Creates a `<tfoot>` element with some basic styles. This component will
+ * disable the hover effect and line wrapping by default, but the hover effect
+ * and line-wrapping can be re-enabled if desired through the `hoverable` and
+ * `disableNoWrap` props.
+ */ export const TableFooter = /*#__PURE__*/ forwardRef(function TableFooter(props, propRef) {
+    const { className, hoverable = false, lineWrap: propLineWrap, children, sticky = false, stickyOptions, isStickyActive, disableStickyStyles = false, ...remaining } = props;
+    // update the table configuration with the custom overrides for the `<tfoot>`
+    const { dense, hAlign, vAlign, lineWrap, disableHover, disableBorders } = useTableConfig({
+        lineWrap: propLineWrap,
+        disableHover: !hoverable
+    });
+    const configuration = useMemo(()=>({
+            dense,
+            header: false,
+            hAlign,
+            vAlign,
+            lineWrap,
+            disableBorders,
+            disableHover
+        }), [
+        dense,
+        hAlign,
+        vAlign,
+        lineWrap,
+        disableBorders,
+        disableHover
+    ]);
+    const [tfootRef, tfootRefCallback] = useEnsuredRef(propRef);
+    const { exists, containerRef } = useTableContainer();
+    const [stickyActive, setStickyActive] = useState(false);
+    const targetRef = useIntersectionObserver({
+        ref: exists ? undefined : tfootRefCallback,
+        root: containerRef,
+        disabled: !sticky || disableStickyStyles,
+        threshold: exists ? 0 : 1,
+        getRootMargin: useCallback(()=>{
+            const topOffset = exists && tfootRef.current ? tfootRef.current.offsetHeight - 1 : 1;
+            return `0px 0px -${topOffset}px 0px`;
+        }, [
+            exists,
+            tfootRef
+        ]),
+        onUpdate: useCallback(([entry])=>{
+            if (typeof isStickyActive === "function") {
+                return isStickyActive(entry);
+            }
+            const { intersectionRatio, boundingClientRect, isIntersecting } = entry;
+            if (exists) {
+                setStickyActive(!isIntersecting);
+                return;
+            }
+            setStickyActive(intersectionRatio < 1 && boundingClientRect.top >= 0);
+        }, [
+            exists,
+            isStickyActive
+        ]),
+        // allow the user defined sticky options to override the default behavior
+        ...stickyOptions
+    });
+    return /*#__PURE__*/ _jsxs(TableConfigProvider, {
+        value: configuration,
+        children: [
+            exists && sticky && !disableStickyStyles && // rendering a `<tbody>` since it is valid to have 0-many in a table
+            // https://html.spec.whatwg.org/multipage/tables.html#the-table-element
+            /*#__PURE__*/ _jsx("tbody", {
+                "aria-hidden": true,
+                ref: targetRef
+            }),
+            /*#__PURE__*/ _jsx("tfoot", {
+                ...remaining,
+                ref: exists ? tfootRefCallback : targetRef,
+                className: cnb(styles({
+                    sticky,
+                    "sticky-active": stickyActive
+                }), className),
+                children: children
+            })
+        ]
+    });
+});
+
+//# sourceMappingURL=TableFooter.js.map

package/dist/table/TableFooter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/table/TableFooter.tsx"],"sourcesContent":["\"use client\";\nimport { cnb } from \"cnbuilder\";\nimport {\n  forwardRef,\n  useCallback,\n  useMemo,\n  useState,\n  type HTMLAttributes,\n} from \"react\";\nimport { useEnsuredRef } from \"../useEnsuredRef.js\";\nimport { useIntersectionObserver } from \"../useIntersectionObserver.js\";\nimport { bem } from \"../utils/bem.js\";\nimport {\n  TableConfigProvider,\n  useTableConfig,\n  type TableCellConfig,\n  type TableConfigContext,\n} from \"./TableConfigurationProvider.js\";\nimport { useTableContainer } from \"./TableContainerProvider.js\";\nimport { type TableStickySectionProps } from \"./types.js\";\n\nconst styles = bem(\"rmd-tfoot\");\n\n/**\n * @remarks \\@since 6.0.0 Added support for \"sticky-active\" state.\n */\nexport interface TableFooterProps\n  extends HTMLAttributes<HTMLTableSectionElement>,\n    Pick<TableCellConfig, \"lineWrap\">,\n    TableStickySectionProps {\n  /**\n   * This is a rename of the `disableHover` of the `TableConfig` since table\n   * footers are not hoverable by default. This prop can be enabled to add the\n   * row hover color within table footers, but it is not really recommended.\n   *\n   * @defaultValue `false`\n   */\n  hoverable?: boolean;\n}\n\n/**\n * **Client Component**\n * TODO: Create separate useStickyTableFooter + StickyTableFooter component\n *\n * Creates a `<tfoot>` element with some basic styles. This component will\n * disable the hover effect and line wrapping by default, but the hover effect\n * and line-wrapping can be re-enabled if desired through the `hoverable` and\n * `disableNoWrap` props.\n */\nexport const TableFooter = forwardRef<\n  HTMLTableSectionElement,\n  TableFooterProps\n>(function TableFooter(props, propRef) {\n  const {\n    className,\n    hoverable = false,\n    lineWrap: propLineWrap,\n    children,\n    sticky = false,\n    stickyOptions,\n    isStickyActive,\n    disableStickyStyles = false,\n    ...remaining\n  } = props;\n\n  // update the table configuration with the custom overrides for the `<tfoot>`\n  const { dense, hAlign, vAlign, lineWrap, disableHover, disableBorders } =\n    useTableConfig({\n      lineWrap: propLineWrap,\n      disableHover: !hoverable,\n    });\n\n  const configuration = useMemo<TableConfigContext>(\n    () => ({\n      dense,\n      header: false,\n      hAlign,\n      vAlign,\n      lineWrap,\n      disableBorders,\n      disableHover,\n    }),\n    [dense, hAlign, vAlign, lineWrap, disableBorders, disableHover]\n  );\n\n  const [tfootRef, tfootRefCallback] = useEnsuredRef(propRef);\n  const { exists, containerRef } = useTableContainer();\n  const [stickyActive, setStickyActive] = useState(false);\n  const targetRef = useIntersectionObserver<\n    HTMLTableSectionElement | HTMLElement\n  >({\n    ref: exists ? undefined : tfootRefCallback,\n    root: containerRef,\n    disabled: !sticky || disableStickyStyles,\n    threshold: exists ? 0 : 1,\n    getRootMargin: useCallback(() => {\n      const topOffset =\n        exists && tfootRef.current ? tfootRef.current.offsetHeight - 1 : 1;\n\n      return `0px 0px -${topOffset}px 0px`;\n    }, [exists, tfootRef]),\n    onUpdate: useCallback(\n      ([entry]) => {\n        if (typeof isStickyActive === \"function\") {\n          return isStickyActive(entry);\n        }\n\n        const { intersectionRatio, boundingClientRect, isIntersecting } = entry;\n        if (exists) {\n          setStickyActive(!isIntersecting);\n          return;\n        }\n\n        setStickyActive(intersectionRatio < 1 && boundingClientRect.top >= 0);\n      },\n      [exists, isStickyActive]\n    ),\n    // allow the user defined sticky options to override the default behavior\n    ...stickyOptions,\n  });\n\n  return (\n    <TableConfigProvider value={configuration}>\n      {exists && sticky && !disableStickyStyles && (\n        // rendering a `<tbody>` since it is valid to have 0-many in a table\n        // https://html.spec.whatwg.org/multipage/tables.html#the-table-element\n        <tbody aria-hidden ref={targetRef} />\n      )}\n      <tfoot\n        {...remaining}\n        ref={exists ? tfootRefCallback : targetRef}\n        className={cnb(\n          styles({\n            sticky,\n            \"sticky-active\": stickyActive,\n          }),\n          className\n        )}\n      >\n        {children}\n      </tfoot>\n    </TableConfigProvider>\n  );\n});\n"],"names":["cnb","forwardRef","useCallback","useMemo","useState","useEnsuredRef","useIntersectionObserver","bem","TableConfigProvider","useTableConfig","useTableContainer","styles","TableFooter","props","propRef","className","hoverable","lineWrap","propLineWrap","children","sticky","stickyOptions","isStickyActive","disableStickyStyles","remaining","dense","hAlign","vAlign","disableHover","disableBorders","configuration","header","tfootRef","tfootRefCallback","exists","containerRef","stickyActive","setStickyActive","targetRef","ref","undefined","root","disabled","threshold","getRootMargin","topOffset","current","offsetHeight","onUpdate","entry","intersectionRatio","boundingClientRect","isIntersecting","top","value","tbody","aria-hidden","tfoot"],"mappings":"AAAA;;AACA,SAASA,GAAG,QAAQ,YAAY;AAChC,SACEC,UAAU,EACVC,WAAW,EACXC,OAAO,EACPC,QAAQ,QAEH,QAAQ;AACf,SAASC,aAAa,QAAQ,sBAAsB;AACpD,SAASC,uBAAuB,QAAQ,gCAAgC;AACxE,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SACEC,mBAAmB,EACnBC,cAAc,QAGT,kCAAkC;AACzC,SAASC,iBAAiB,QAAQ,8BAA8B;AAGhE,MAAMC,SAASJ,IAAI;AAmBnB;;;;;;;;CAQC,GACD,OAAO,MAAMK,4BAAcX,WAGzB,SAASW,YAAYC,KAAK,EAAEC,OAAO;IACnC,MAAM,EACJC,SAAS,EACTC,YAAY,KAAK,EACjBC,UAAUC,YAAY,EACtBC,QAAQ,EACRC,SAAS,KAAK,EACdC,aAAa,EACbC,cAAc,EACdC,sBAAsB,KAAK,EAC3B,GAAGC,WACJ,GAAGX;IAEJ,6EAA6E;IAC7E,MAAM,EAAEY,KAAK,EAAEC,MAAM,EAAEC,MAAM,EAAEV,QAAQ,EAAEW,YAAY,EAAEC,cAAc,EAAE,GACrEpB,eAAe;QACbQ,UAAUC;QACVU,cAAc,CAACZ;IACjB;IAEF,MAAMc,gBAAgB3B,QACpB,IAAO,CAAA;YACLsB;YACAM,QAAQ;YACRL;YACAC;YACAV;YACAY;YACAD;QACF,CAAA,GACA;QAACH;QAAOC;QAAQC;QAAQV;QAAUY;QAAgBD;KAAa;IAGjE,MAAM,CAACI,UAAUC,iBAAiB,GAAG5B,cAAcS;IACnD,MAAM,EAAEoB,MAAM,EAAEC,YAAY,EAAE,GAAGzB;IACjC,MAAM,CAAC0B,cAAcC,gBAAgB,GAAGjC,SAAS;IACjD,MAAMkC,YAAYhC,wBAEhB;QACAiC,KAAKL,SAASM,YAAYP;QAC1BQ,MAAMN;QACNO,UAAU,CAACtB,UAAUG;QACrBoB,WAAWT,SAAS,IAAI;QACxBU,eAAe1C,YAAY;YACzB,MAAM2C,YACJX,UAAUF,SAASc,OAAO,GAAGd,SAASc,OAAO,CAACC,YAAY,GAAG,IAAI;YAEnE,OAAO,CAAC,SAAS,EAAEF,UAAU,MAAM,CAAC;QACtC,GAAG;YAACX;YAAQF;SAAS;QACrBgB,UAAU9C,YACR,CAAC,CAAC+C,MAAM;YACN,IAAI,OAAO3B,mBAAmB,YAAY;gBACxC,OAAOA,eAAe2B;YACxB;YAEA,MAAM,EAAEC,iBAAiB,EAAEC,kBAAkB,EAAEC,cAAc,EAAE,GAAGH;YAClE,IAAIf,QAAQ;gBACVG,gBAAgB,CAACe;gBACjB;YACF;YAEAf,gBAAgBa,oBAAoB,KAAKC,mBAAmBE,GAAG,IAAI;QACrE,GACA;YAACnB;YAAQZ;SAAe;QAE1B,yEAAyE;QACzE,GAAGD,aAAa;IAClB;IAEA,qBACE,MAACb;QAAoB8C,OAAOxB;;YACzBI,UAAUd,UAAU,CAACG,uBACpB,oEAAoE;YACpE,uEAAuE;0BACvE,KAACgC;gBAAMC,aAAW;gBAACjB,KAAKD;;0BAE1B,KAACmB;gBACE,GAAGjC,SAAS;gBACbe,KAAKL,SAASD,mBAAmBK;gBACjCvB,WAAWf,IACTW,OAAO;oBACLS;oBACA,iBAAiBgB;gBACnB,IACArB;0BAGDI;;;;AAIT,GAAG"}

package/dist/table/TableHeader.d.ts

@@ -0,0 +1,41 @@
+import { type HTMLAttributes } from "react";
+import { type TableCellConfig } from "./TableConfigurationProvider.js";
+import { type TableStickySectionProps } from "./types.js";
+/** @remarks \@since 6.0.0 */
+export interface TableHeaderClassNameOptions {
+    className?: string;
+    dense?: boolean;
+    sticky?: boolean;
+    stickyActive?: boolean;
+}
+/** @remarks \@since 6.0.0 */
+export declare function tableHeader(options?: TableHeaderClassNameOptions): string;
+/**
+ * @remarks \@since 6.0.0 Added support for "sticky-active" state.
+ */
+export interface TableHeaderProps extends HTMLAttributes<HTMLTableSectionElement>, Pick<TableCellConfig, "lineWrap">, TableStickySectionProps {
+    /**
+     * This is a rename of the `disableHover` of the `TableConfig` since table
+     * headers are not hoverable by default. This prop can be enabled to add the
+     * row hover color within table headers, but it is not really recommended.
+     *
+     * @defaultValue `false`
+     */
+    hoverable?: boolean;
+}
+/**
+ * @remarks \@since 6.0.0
+ */
+export declare const isTableHeaderStickyActive: (entry: IntersectionObserverEntry) => boolean;
+/**
+ * **Client Component**
+ * TODO: Create separate useStickyTableHeader + StickyTableHeader component
+ *
+ * Creates a `<thead>` element with some basic styles. This component will also
+ * update the table configuration so that all the `TableCell` children will
+ * automatically become `<th>` elements instead of the normal `<td>` as well as
+ * disabling the hover effect and line wrapping. The hover effect and
+ * line-wrapping can be re-enabled if desired through the `hoverable` and
+ * `disableNoWrap` props.
+ */
+export declare const TableHeader: import("react").ForwardRefExoticComponent<TableHeaderProps & import("react").RefAttributes<HTMLTableSectionElement>>;

package/dist/table/TableHeader.js

@@ -0,0 +1,114 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cnb } from "cnbuilder";
+import { forwardRef, useCallback, useMemo, useState } from "react";
+import { useEnsuredRef } from "../useEnsuredRef.js";
+import { useIntersectionObserver } from "../useIntersectionObserver.js";
+import { bem } from "../utils/bem.js";
+import { TableConfigProvider, useTableConfig } from "./TableConfigurationProvider.js";
+import { useTableContainer } from "./TableContainerProvider.js";
+const styles = bem("rmd-thead");
+/** @remarks \@since 6.0.0 */ export function tableHeader(options = {}) {
+    const { dense, sticky, stickyActive, className } = options;
+    return cnb(styles({
+        dense,
+        sticky,
+        "sticky-active": stickyActive
+    }), className);
+}
+/**
+ * @remarks \@since 6.0.0
+ */ export const isTableHeaderStickyActive = (entry)=>{
+    return entry.intersectionRatio < 1 && entry.boundingClientRect.bottom <= window.innerHeight;
+};
+/**
+ * **Client Component**
+ * TODO: Create separate useStickyTableHeader + StickyTableHeader component
+ *
+ * Creates a `<thead>` element with some basic styles. This component will also
+ * update the table configuration so that all the `TableCell` children will
+ * automatically become `<th>` elements instead of the normal `<td>` as well as
+ * disabling the hover effect and line wrapping. The hover effect and
+ * line-wrapping can be re-enabled if desired through the `hoverable` and
+ * `disableNoWrap` props.
+ */ export const TableHeader = /*#__PURE__*/ forwardRef(function TableHeader(props, propRef) {
+    const { className, hoverable = false, lineWrap: propLineWrap, children, sticky = false, stickyOptions, isStickyActive = isTableHeaderStickyActive, disableStickyStyles = false, ...remaining } = props;
+    // update the table configuration with the custom overrides for the `<thead>`
+    const { dense, hAlign, vAlign, lineWrap, disableHover, disableBorders } = useTableConfig({
+        lineWrap: propLineWrap,
+        disableHover: !hoverable
+    });
+    const configuration = useMemo(()=>({
+            dense,
+            header: true,
+            hAlign,
+            vAlign,
+            lineWrap,
+            disableBorders,
+            disableHover
+        }), [
+        dense,
+        hAlign,
+        vAlign,
+        lineWrap,
+        disableBorders,
+        disableHover
+    ]);
+    const [theadRef, theadRefCallback] = useEnsuredRef(propRef);
+    const { exists, containerRef } = useTableContainer();
+    const [stickyActive, setStickyActive] = useState(false);
+    const targetRef = useIntersectionObserver({
+        ref: exists ? undefined : theadRefCallback,
+        root: containerRef,
+        disabled: !sticky || disableStickyStyles,
+        threshold: exists ? 0 : 1,
+        getRootMargin: useCallback(()=>{
+            const thead = theadRef.current;
+            if (!thead) {
+                return;
+            }
+            let topOffset;
+            if (exists) {
+                topOffset = thead.offsetHeight - 1;
+            } else {
+                const top = parseFloat(window.getComputedStyle(thead).top);
+                topOffset = Number.isNaN(top) ? 1 : top + 1;
+            }
+            return `-${topOffset}px 0px 0px`;
+        }, [
+            exists,
+            theadRef
+        ]),
+        onUpdate: useCallback(([entry])=>{
+            setStickyActive(isStickyActive(entry));
+        }, [
+            isStickyActive
+        ]),
+        // allow the user defined sticky options to override the default behavior
+        ...stickyOptions
+    });
+    return /*#__PURE__*/ _jsxs(TableConfigProvider, {
+        value: configuration,
+        children: [
+            /*#__PURE__*/ _jsx("thead", {
+                ...remaining,
+                ref: exists ? theadRefCallback : targetRef,
+                className: tableHeader({
+                    dense,
+                    sticky,
+                    stickyActive,
+                    className
+                }),
+                children: children
+            }),
+            exists && sticky && !disableStickyStyles && // rendering a `<tbody>` since it is valid to have 0-many in a table
+            // https://html.spec.whatwg.org/multipage/tables.html#the-table-element
+            /*#__PURE__*/ _jsx("tbody", {
+                "aria-hidden": true,
+                ref: targetRef
+            })
+        ]
+    });
+});
+
+//# sourceMappingURL=TableHeader.js.map

package/dist/table/TableHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/table/TableHeader.tsx"],"sourcesContent":["\"use client\";\nimport { cnb } from \"cnbuilder\";\nimport {\n  forwardRef,\n  useCallback,\n  useMemo,\n  useState,\n  type HTMLAttributes,\n} from \"react\";\nimport { useEnsuredRef } from \"../useEnsuredRef.js\";\nimport { useIntersectionObserver } from \"../useIntersectionObserver.js\";\nimport { bem } from \"../utils/bem.js\";\nimport {\n  TableConfigProvider,\n  useTableConfig,\n  type TableCellConfig,\n  type TableConfigContext,\n} from \"./TableConfigurationProvider.js\";\nimport { useTableContainer } from \"./TableContainerProvider.js\";\nimport { type TableStickySectionProps } from \"./types.js\";\n\nconst styles = bem(\"rmd-thead\");\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableHeaderClassNameOptions {\n  className?: string;\n  dense?: boolean;\n  sticky?: boolean;\n  stickyActive?: boolean;\n}\n\n/** @remarks \\@since 6.0.0 */\nexport function tableHeader(options: TableHeaderClassNameOptions = {}): string {\n  const { dense, sticky, stickyActive, className } = options;\n\n  return cnb(\n    styles({\n      dense,\n      sticky,\n      \"sticky-active\": stickyActive,\n    }),\n    className\n  );\n}\n\n/**\n * @remarks \\@since 6.0.0 Added support for \"sticky-active\" state.\n */\nexport interface TableHeaderProps\n  extends HTMLAttributes<HTMLTableSectionElement>,\n    Pick<TableCellConfig, \"lineWrap\">,\n    TableStickySectionProps {\n  /**\n   * This is a rename of the `disableHover` of the `TableConfig` since table\n   * headers are not hoverable by default. This prop can be enabled to add the\n   * row hover color within table headers, but it is not really recommended.\n   *\n   * @defaultValue `false`\n   */\n  hoverable?: boolean;\n}\n\n/**\n * @remarks \\@since 6.0.0\n */\nexport const isTableHeaderStickyActive = (\n  entry: IntersectionObserverEntry\n): boolean => {\n  return (\n    entry.intersectionRatio < 1 &&\n    entry.boundingClientRect.bottom <= window.innerHeight\n  );\n};\n\n/**\n * **Client Component**\n * TODO: Create separate useStickyTableHeader + StickyTableHeader component\n *\n * Creates a `<thead>` element with some basic styles. This component will also\n * update the table configuration so that all the `TableCell` children will\n * automatically become `<th>` elements instead of the normal `<td>` as well as\n * disabling the hover effect and line wrapping. The hover effect and\n * line-wrapping can be re-enabled if desired through the `hoverable` and\n * `disableNoWrap` props.\n */\nexport const TableHeader = forwardRef<\n  HTMLTableSectionElement,\n  TableHeaderProps\n>(function TableHeader(props, propRef) {\n  const {\n    className,\n    hoverable = false,\n    lineWrap: propLineWrap,\n    children,\n    sticky = false,\n    stickyOptions,\n    isStickyActive = isTableHeaderStickyActive,\n    disableStickyStyles = false,\n    ...remaining\n  } = props;\n\n  // update the table configuration with the custom overrides for the `<thead>`\n  const { dense, hAlign, vAlign, lineWrap, disableHover, disableBorders } =\n    useTableConfig({\n      lineWrap: propLineWrap,\n      disableHover: !hoverable,\n    });\n\n  const configuration = useMemo<TableConfigContext>(\n    () => ({\n      dense,\n      header: true,\n      hAlign,\n      vAlign,\n      lineWrap,\n      disableBorders,\n      disableHover,\n    }),\n    [dense, hAlign, vAlign, lineWrap, disableBorders, disableHover]\n  );\n\n  const [theadRef, theadRefCallback] = useEnsuredRef(propRef);\n  const { exists, containerRef } = useTableContainer();\n  const [stickyActive, setStickyActive] = useState(false);\n  const targetRef = useIntersectionObserver({\n    ref: exists ? undefined : theadRefCallback,\n    root: containerRef,\n    disabled: !sticky || disableStickyStyles,\n    threshold: exists ? 0 : 1,\n    getRootMargin: useCallback(() => {\n      const thead = theadRef.current;\n      if (!thead) {\n        return;\n      }\n\n      let topOffset: number;\n      if (exists) {\n        topOffset = thead.offsetHeight - 1;\n      } else {\n        const top = parseFloat(window.getComputedStyle(thead).top);\n        topOffset = Number.isNaN(top) ? 1 : top + 1;\n      }\n\n      return `-${topOffset}px 0px 0px`;\n    }, [exists, theadRef]),\n    onUpdate: useCallback(\n      ([entry]) => {\n        setStickyActive(isStickyActive(entry));\n      },\n      [isStickyActive]\n    ),\n    // allow the user defined sticky options to override the default behavior\n    ...stickyOptions,\n  });\n\n  return (\n    <TableConfigProvider value={configuration}>\n      <thead\n        {...remaining}\n        ref={exists ? theadRefCallback : targetRef}\n        className={tableHeader({\n          dense,\n          sticky,\n          stickyActive,\n          className,\n        })}\n      >\n        {children}\n      </thead>\n      {exists && sticky && !disableStickyStyles && (\n        // rendering a `<tbody>` since it is valid to have 0-many in a table\n        // https://html.spec.whatwg.org/multipage/tables.html#the-table-element\n        <tbody aria-hidden ref={targetRef} />\n      )}\n    </TableConfigProvider>\n  );\n});\n"],"names":["cnb","forwardRef","useCallback","useMemo","useState","useEnsuredRef","useIntersectionObserver","bem","TableConfigProvider","useTableConfig","useTableContainer","styles","tableHeader","options","dense","sticky","stickyActive","className","isTableHeaderStickyActive","entry","intersectionRatio","boundingClientRect","bottom","window","innerHeight","TableHeader","props","propRef","hoverable","lineWrap","propLineWrap","children","stickyOptions","isStickyActive","disableStickyStyles","remaining","hAlign","vAlign","disableHover","disableBorders","configuration","header","theadRef","theadRefCallback","exists","containerRef","setStickyActive","targetRef","ref","undefined","root","disabled","threshold","getRootMargin","thead","current","topOffset","offsetHeight","top","parseFloat","getComputedStyle","Number","isNaN","onUpdate","value","tbody","aria-hidden"],"mappings":"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"}

package/dist/table/TableRow.d.ts

@@ -0,0 +1,35 @@
+import { type HTMLAttributes } from "react";
+import { type TableRowConfiguration } from "./TableConfigurationProvider.js";
+/** @remarks \@since 6.0.0 */
+export interface TableRowClassNameOptions {
+    className?: string;
+    disableHover?: boolean;
+    disableBorders?: boolean;
+    selected?: boolean;
+    clickable?: boolean;
+}
+/** @remarks \@since 6.0.0 */
+export declare function tableRow(options?: TableRowClassNameOptions): string;
+export interface TableRowProps extends HTMLAttributes<HTMLTableRowElement>, TableRowConfiguration {
+    /**
+     * Boolean if the current row has been selected and should apply the selected
+     * background-color.
+     *
+     * @defaultValue `false`
+     */
+    selected?: boolean;
+    /**
+     * Boolean if the row should be clickable and update the cursor while hovered
+     * to be a pointer.
+     *
+     * @defaultValue `false`
+     */
+    clickable?: boolean;
+}
+/**
+ * **Client Component**
+ *
+ * Creates a `<tr>` element with some general styles that are inherited from the
+ * base table configuration.
+ */
+export declare const TableRow: import("react").ForwardRefExoticComponent<TableRowProps & import("react").RefAttributes<HTMLTableRowElement>>;

package/dist/table/TableRow.js

@@ -0,0 +1,42 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cnb } from "cnbuilder";
+import { forwardRef } from "react";
+import { bem } from "../utils/bem.js";
+import { useTableConfig } from "./TableConfigurationProvider.js";
+const styles = bem("rmd-tr");
+/** @remarks \@since 6.0.0 */ export function tableRow(options = {}) {
+    const { disableHover, disableBorders, selected, clickable, className } = options;
+    return cnb(styles({
+        bordered: !disableBorders,
+        hoverable: !disableHover,
+        clickable,
+        selected
+    }), className);
+}
+/**
+ * **Client Component**
+ *
+ * Creates a `<tr>` element with some general styles that are inherited from the
+ * base table configuration.
+ */ export const TableRow = /*#__PURE__*/ forwardRef(function TableRow(props, ref) {
+    const { className, disableHover: propDisableHover, disableBorders: propDisableBorders, children, selected = false, clickable = false, ...remaining } = props;
+    const { disableHover, disableBorders } = useTableConfig({
+        disableHover: propDisableHover,
+        disableBorders: propDisableBorders
+    });
+    return /*#__PURE__*/ _jsx("tr", {
+        ...remaining,
+        ref: ref,
+        className: tableRow({
+            selected,
+            clickable,
+            disableHover,
+            disableBorders,
+            className
+        }),
+        children: children
+    });
+});
+
+//# sourceMappingURL=TableRow.js.map

package/dist/table/TableRow.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/table/TableRow.tsx"],"sourcesContent":["\"use client\";\nimport { cnb } from \"cnbuilder\";\nimport { forwardRef, type HTMLAttributes } from \"react\";\nimport { bem } from \"../utils/bem.js\";\nimport {\n  useTableConfig,\n  type TableRowConfiguration,\n} from \"./TableConfigurationProvider.js\";\n\nconst styles = bem(\"rmd-tr\");\n\n/** @remarks \\@since 6.0.0 */\nexport interface TableRowClassNameOptions {\n  className?: string;\n  disableHover?: boolean;\n  disableBorders?: boolean;\n  selected?: boolean;\n  clickable?: boolean;\n}\n\n/** @remarks \\@since 6.0.0 */\nexport function tableRow(options: TableRowClassNameOptions = {}): string {\n  const { disableHover, disableBorders, selected, clickable, className } =\n    options;\n  return cnb(\n    styles({\n      bordered: !disableBorders,\n      hoverable: !disableHover,\n      clickable,\n      selected,\n    }),\n    className\n  );\n}\n\nexport interface TableRowProps\n  extends HTMLAttributes<HTMLTableRowElement>,\n    TableRowConfiguration {\n  /**\n   * Boolean if the current row has been selected and should apply the selected\n   * background-color.\n   *\n   * @defaultValue `false`\n   */\n  selected?: boolean;\n\n  /**\n   * Boolean if the row should be clickable and update the cursor while hovered\n   * to be a pointer.\n   *\n   * @defaultValue `false`\n   */\n  clickable?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * Creates a `<tr>` element with some general styles that are inherited from the\n * base table configuration.\n */\nexport const TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(\n  function TableRow(props, ref) {\n    const {\n      className,\n      disableHover: propDisableHover,\n      disableBorders: propDisableBorders,\n      children,\n      selected = false,\n      clickable = false,\n      ...remaining\n    } = props;\n\n    const { disableHover, disableBorders } = useTableConfig({\n      disableHover: propDisableHover,\n      disableBorders: propDisableBorders,\n    });\n\n    return (\n      <tr\n        {...remaining}\n        ref={ref}\n        className={tableRow({\n          selected,\n          clickable,\n          disableHover,\n          disableBorders,\n          className,\n        })}\n      >\n        {children}\n      </tr>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","bem","useTableConfig","styles","tableRow","options","disableHover","disableBorders","selected","clickable","className","bordered","hoverable","TableRow","props","ref","propDisableHover","propDisableBorders","children","remaining","tr"],"mappings":"AAAA;;AACA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAA6B,QAAQ;AACxD,SAASC,GAAG,QAAQ,kBAAkB;AACtC,SACEC,cAAc,QAET,kCAAkC;AAEzC,MAAMC,SAASF,IAAI;AAWnB,2BAA2B,GAC3B,OAAO,SAASG,SAASC,UAAoC,CAAC,CAAC;IAC7D,MAAM,EAAEC,YAAY,EAAEC,cAAc,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,SAAS,EAAE,GACpEL;IACF,OAAON,IACLI,OAAO;QACLQ,UAAU,CAACJ;QACXK,WAAW,CAACN;QACZG;QACAD;IACF,IACAE;AAEJ;AAsBA;;;;;CAKC,GACD,OAAO,MAAMG,yBAAWb,WACtB,SAASa,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJL,SAAS,EACTJ,cAAcU,gBAAgB,EAC9BT,gBAAgBU,kBAAkB,EAClCC,QAAQ,EACRV,WAAW,KAAK,EAChBC,YAAY,KAAK,EACjB,GAAGU,WACJ,GAAGL;IAEJ,MAAM,EAAER,YAAY,EAAEC,cAAc,EAAE,GAAGL,eAAe;QACtDI,cAAcU;QACdT,gBAAgBU;IAClB;IAEA,qBACE,KAACG;QACE,GAAGD,SAAS;QACbJ,KAAKA;QACLL,WAAWN,SAAS;YAClBI;YACAC;YACAH;YACAC;YACAG;QACF;kBAECQ;;AAGP,GACA"}