react-asc 21.1.1 → 21.2.0

package/components/Table/TableBody.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TableBody: (props: React.ComponentProps<"tbody">) => JSX.Element;

package/components/Table/TableCell.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface ITableCellProps extends React.ComponentProps<"th">, React.ComponentProps<"td"> {
+    component?: 'th';
+}
+export declare const TableCell: (props: ITableCellProps) => JSX.Element;

package/components/Table/TableContext.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface ITableContext {
+    variant: 'head' | 'body';
+}
+export declare const TableContext: import("react").Context<ITableContext>;
+export declare const useTableContext: () => ITableContext;

package/components/Table/TableHead.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TableHead: (props: React.ComponentProps<"thead">) => JSX.Element;

package/components/Table/TableRow.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TableRow: (props: React.ComponentProps<"tr">) => JSX.Element;

package/components/Table/index.d.ts

@@ -1 +1,5 @@
 export * from './Table';
+export * from './TableRow';
+export * from './TableHead';
+export * from './TableBody';
+export * from './TableCell';

package/index.es.js

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef, Fragment, Component, createRef, cloneElement } from 'react';
+import React, { useState, useEffect, useRef, Fragment, Component, createRef, cloneElement, createContext, useContext } from 'react';
 import { createPortal, render, unmountComponentAtNode } from 'react-dom';
 import { createPopper } from '@popperjs/core';
 
@@ -2304,6 +2304,35 @@ const Table = (props) => {
         React.createElement("table", { className: getCssClasses() }, children)));
 };
 
+const TableRow = (props) => {
+    const { children } = props, rest = __rest(props, ["children"]);
+    return (React.createElement("tr", Object.assign({}, rest), children));
+};
+
+const TableContext = createContext({
+    variant: 'head'
+});
+const useTableContext = () => useContext(TableContext);
+
+const TableHead = (props) => {
+    const { children } = props, rest = __rest(props, ["children"]);
+    return (React.createElement(TableContext.Provider, { value: { variant: 'head' } },
+        React.createElement("thead", Object.assign({}, rest), children)));
+};
+
+const TableBody = (props) => {
+    const { children } = props, rest = __rest(props, ["children"]);
+    return (React.createElement(TableContext.Provider, { value: { variant: 'body' } },
+        React.createElement("tbody", Object.assign({}, rest), children)));
+};
+
+const TableCell = (props) => {
+    const { variant } = useTableContext();
+    const { children, component } = props, rest = __rest(props, ["children", "component"]);
+    return (React.createElement(ConditionalWrapper, { condition: true, wrapper: children => ((variant === 'head' || component === 'th') ? (React.createElement("th", Object.assign({}, rest), children)) :
+            React.createElement("td", Object.assign({}, rest), children)) }, children));
+};
+
 var css_248z$5 = ".TabIndicator-module_tabIndicator__jSJhH {\n  bottom: 0;\n  height: 2px;\n  position: absolute;\n  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n  .TabIndicator-module_tabIndicator__jSJhH.TabIndicator-module_primary__Q5jEo {\n    background-color: var(--primary); }\n  .TabIndicator-module_tabIndicator__jSJhH.TabIndicator-module_accent__qbgIG {\n    background-color: var(--accent); }\n";
 var styles$5 = {"tabIndicator":"TabIndicator-module_tabIndicator__jSJhH","primary":"TabIndicator-module_primary__Q5jEo","accent":"TabIndicator-module_accent__qbgIG"};
 styleInject(css_248z$5);
@@ -2620,4 +2649,4 @@ const TreeItem = (props) => {
         children && _isExpanded ? React.createElement("ul", null, children) : null));
 };
 
-export { Alert, AppBar, AppBarTitle, AutoComplete, Backdrop, Badge, Breadcrumb, BreadcrumbItem, Button, ButtonGroup, COLOR, Card, CardBody, CardFooter, CardImage, CardSubtitle, CardText, CardTitle, CaretDownSolidIcon, CheckSolidIcon, CheckSquareRegularIcon, Checkbox, ChevronDownSolidIcon, ChevronLeftSolidIcon, ChevronRightSolidIcon, ChevronUpSolidIcon, Chip, CircleSolidIcon, Column, ConditionalWrapper, DATEMODE, DateSelect, DaySelect, Drawer, EmailValidator, ExpansionPanel, ExpansionPanelContent, ExpansionPanelHeader, FileInput, FloatingActionButton, Form, FormControl, FormError, FormGroup, FormHint, FormInput, FormLabel, GlobalModal, HomeSolidIcon, HourSelect, Icon, IconButton, IsEmptyValidator, IsEqualValidator, Link, List, ListItem, ListItemAction, ListItemAvatar, ListItemIcon, ListItemText, LoadingIndicator, LoadingIndicatorContainer, MODALBUTTONTYPE, MODALTYPE, Menu, MenuBody, MenuDivider, MenuItem, MenuToggle, MilliSecondSelect, MinuteSelect, Modal, ModalBody, ModalFooter, ModalHeader, MonthSelect, NumberSelect, POSITION, PlusSolidIcon, Row, SIZE, STATUS, SecondSelect, Select, Sidebar, Snackbar, SpeedDial, SpeedDialAction, SpeedDialIcon, SpinnerSolidIcon, SquareRegularIcon, Step, Stepper, StepperActions, TIMEMODE, Tab, TabPanel, Table, Tabs, Textarea, TimeSelect, TimesCircleSolidIcon, TimesSolidIcon, Tooltip, TreeItem, TreeView, Typography, VARIANT, YearSelect, loadingIndicatorService, modalService, snackbarService, useConstructor, useCssClasses, useDebounce, useHover, useWindowSize };
+export { Alert, AppBar, AppBarTitle, AutoComplete, Backdrop, Badge, Breadcrumb, BreadcrumbItem, Button, ButtonGroup, COLOR, Card, CardBody, CardFooter, CardImage, CardSubtitle, CardText, CardTitle, CaretDownSolidIcon, CheckSolidIcon, CheckSquareRegularIcon, Checkbox, ChevronDownSolidIcon, ChevronLeftSolidIcon, ChevronRightSolidIcon, ChevronUpSolidIcon, Chip, CircleSolidIcon, Column, ConditionalWrapper, DATEMODE, DateSelect, DaySelect, Drawer, EmailValidator, ExpansionPanel, ExpansionPanelContent, ExpansionPanelHeader, FileInput, FloatingActionButton, Form, FormControl, FormError, FormGroup, FormHint, FormInput, FormLabel, GlobalModal, HomeSolidIcon, HourSelect, Icon, IconButton, IsEmptyValidator, IsEqualValidator, Link, List, ListItem, ListItemAction, ListItemAvatar, ListItemIcon, ListItemText, LoadingIndicator, LoadingIndicatorContainer, MODALBUTTONTYPE, MODALTYPE, Menu, MenuBody, MenuDivider, MenuItem, MenuToggle, MilliSecondSelect, MinuteSelect, Modal, ModalBody, ModalFooter, ModalHeader, MonthSelect, NumberSelect, POSITION, PlusSolidIcon, Row, SIZE, STATUS, SecondSelect, Select, Sidebar, Snackbar, SpeedDial, SpeedDialAction, SpeedDialIcon, SpinnerSolidIcon, SquareRegularIcon, Step, Stepper, StepperActions, TIMEMODE, Tab, TabPanel, Table, TableBody, TableCell, TableHead, TableRow, Tabs, Textarea, TimeSelect, TimesCircleSolidIcon, TimesSolidIcon, Tooltip, TreeItem, TreeView, Typography, VARIANT, YearSelect, loadingIndicatorService, modalService, snackbarService, useConstructor, useCssClasses, useDebounce, useHover, useWindowSize };

package/index.js

@@ -2312,6 +2312,35 @@ const Table = (props) => {
         React__default["default"].createElement("table", { className: getCssClasses() }, children)));
 };
 
+const TableRow = (props) => {
+    const { children } = props, rest = __rest(props, ["children"]);
+    return (React__default["default"].createElement("tr", Object.assign({}, rest), children));
+};
+
+const TableContext = React.createContext({
+    variant: 'head'
+});
+const useTableContext = () => React.useContext(TableContext);
+
+const TableHead = (props) => {
+    const { children } = props, rest = __rest(props, ["children"]);
+    return (React__default["default"].createElement(TableContext.Provider, { value: { variant: 'head' } },
+        React__default["default"].createElement("thead", Object.assign({}, rest), children)));
+};
+
+const TableBody = (props) => {
+    const { children } = props, rest = __rest(props, ["children"]);
+    return (React__default["default"].createElement(TableContext.Provider, { value: { variant: 'body' } },
+        React__default["default"].createElement("tbody", Object.assign({}, rest), children)));
+};
+
+const TableCell = (props) => {
+    const { variant } = useTableContext();
+    const { children, component } = props, rest = __rest(props, ["children", "component"]);
+    return (React__default["default"].createElement(ConditionalWrapper, { condition: true, wrapper: children => ((variant === 'head' || component === 'th') ? (React__default["default"].createElement("th", Object.assign({}, rest), children)) :
+            React__default["default"].createElement("td", Object.assign({}, rest), children)) }, children));
+};
+
 var css_248z$5 = ".TabIndicator-module_tabIndicator__jSJhH {\n  bottom: 0;\n  height: 2px;\n  position: absolute;\n  transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; }\n  .TabIndicator-module_tabIndicator__jSJhH.TabIndicator-module_primary__Q5jEo {\n    background-color: var(--primary); }\n  .TabIndicator-module_tabIndicator__jSJhH.TabIndicator-module_accent__qbgIG {\n    background-color: var(--accent); }\n";
 var styles$5 = {"tabIndicator":"TabIndicator-module_tabIndicator__jSJhH","primary":"TabIndicator-module_primary__Q5jEo","accent":"TabIndicator-module_accent__qbgIG"};
 styleInject(css_248z$5);
@@ -2720,6 +2749,10 @@ exports.StepperActions = StepperActions;
 exports.Tab = Tab;
 exports.TabPanel = TabPanel;
 exports.Table = Table;
+exports.TableBody = TableBody;
+exports.TableCell = TableCell;
+exports.TableHead = TableHead;
+exports.TableRow = TableRow;
 exports.Tabs = Tabs;
 exports.Textarea = Textarea;
 exports.TimeSelect = TimeSelect;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "react-asc",
-	"version": "21.1.1",
+	"version": "21.2.0",
 	"description": "handcrafted react components",
 	"main": "index.js",
 	"module": "index.es.js",