react-asc 21.1.1 → 21.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Table/TableBody.d.ts +2 -0
- package/components/Table/TableCell.d.ts +5 -0
- package/components/Table/TableContext.d.ts +6 -0
- package/components/Table/TableHead.d.ts +2 -0
- package/components/Table/TableRow.d.ts +2 -0
- package/components/Table/index.d.ts +4 -0
- package/index.es.js +34 -5
- package/index.js +36 -3
- package/package.json +1 -1
- package/react-asc.scss +31 -0
package/index.es.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useState, useEffect, useRef, Fragment, Component, createRef, cloneElement } from 'react';
|
|
1
|
+
import React, { useState, useEffect, useRef, Fragment, Component, createRef, cloneElement, createContext, useContext } from 'react';
|
|
2
2
|
import { createPortal, render, unmountComponentAtNode } from 'react-dom';
|
|
3
3
|
import { createPopper } from '@popperjs/core';
|
|
4
4
|
|
|
@@ -501,8 +501,8 @@ const Badge = (props) => {
|
|
|
501
501
|
React.createElement("span", { className: getCssClassesBadge() }, content)));
|
|
502
502
|
};
|
|
503
503
|
|
|
504
|
-
var css_248z$O = ".Button-module_button__qeIer {\n text-transform: uppercase
|
|
505
|
-
var styles$O = {"button":"Button-module_button__qeIer","shadow":"Button-module_shadow__6N2nE","block":"Button-module_block__JIazf","
|
|
504
|
+
var css_248z$O = ".Button-module_button__qeIer {\n text-transform: uppercase;\n flex-shrink: 0;\n background-color: transparent;\n display: inline-block;\n font-weight: 400;\n line-height: 1.5;\n text-align: center;\n text-decoration: none;\n vertical-align: middle;\n user-select: none;\n border: 1px solid transparent;\n padding: 0.375rem 0.75rem;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out,\r box-shadow 0.15s ease-in-out;\n min-width: 64px;\n font-size: 0.875rem;\n border-radius: var(--borderRadius); }\n .Button-module_button__qeIer.Button-module_shadow__6N2nE {\n box-shadow: var(--shadow); }\n .Button-module_button__qeIer.Button-module_block__JIazf {\n width: 100%; }\n .Button-module_button__qeIer:hover:not(:disabled) {\n cursor: pointer; }\n .Button-module_button__qeIer:focus:not(:disabled) {\n border-color: #86b7fe;\n outline: 0;\n box-shadow: inset 0 1px 2px #00000013, 0 0 0 0.25rem #0d6efd40; }\n\n.Button-module_btnContained__16y5l.Button-module_primary__EUyOu {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Button-module_btnContained__16y5l.Button-module_primary__EUyOu:hover:not(:disabled) {\n background-color: var(--primary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_accent__opVgQ {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Button-module_btnContained__16y5l.Button-module_accent__opVgQ:hover:not(:disabled) {\n background-color: var(--accent-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_secondary__zKoGk {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Button-module_btnContained__16y5l.Button-module_secondary__zKoGk:hover:not(:disabled) {\n background-color: var(--secondary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_light__LXeZy {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Button-module_btnContained__16y5l.Button-module_light__LXeZy:hover:not(:disabled) {\n background-color: var(--light-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_dark__5oFOT {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .Button-module_btnContained__16y5l.Button-module_dark__5oFOT:hover:not(:disabled) {\n background-color: var(--dark-dark); }\n\n.Button-module_btnContained__16y5l:disabled {\n color: rgba(0, 0, 0, 0.26);\n box-shadow: none;\n background-color: rgba(0, 0, 0, 0.12); }\n .Button-module_btnContained__16y5l:disabled:hover {\n cursor: not-allowed; }\n\n.Button-module_btnText__N5Gys {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu {\n color: var(--primary); }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu:hover:not(:disabled) {\n text-decoration: none;\n background: var(--primary-highlight); }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk {\n color: var(--secondary); }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk:hover:not(:disabled) {\n text-decoration: none;\n background: var(--secondary-highlight); }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ {\n color: var(--accent); }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ:hover:not(:disabled) {\n text-decoration: none;\n background: var(--accent-highlight); }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy {\n color: var(--light-contrast-text); }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy:hover:not(:disabled) {\n text-decoration: none;\n background: var(--light-highlight); }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT {\n color: var(--dark); }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT:hover:not(:disabled) {\n text-decoration: none;\n background: var(--dark-highlight); }\n\n.Button-module_btnOutline__CCFPI {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu {\n color: var(--primary);\n border-color: var(--primary); }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu:hover:not(:disabled) {\n background: var(--primary-highlight); }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk {\n color: var(--secondary);\n border-color: var(--secondary); }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk:hover:not(:disabled) {\n background: var(--secondary-highlight); }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ {\n color: var(--accent);\n border-color: var(--accent); }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ:hover:not(:disabled) {\n background: var(--accent-highlight); }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy {\n color: var(--light-contrast-text);\n border-color: var(--light); }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy:hover:not(:disabled) {\n background: var(--light-highlight); }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT {\n color: var(--dark);\n border-color: var(--dark); }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT:hover:not(:disabled) {\n background: var(--dark-highlight); }\n .Button-module_btnOutline__CCFPI:disabled {\n color: rgba(0, 0, 0, 0.26);\n border: 1px solid rgba(0, 0, 0, 0.12); }\n\n.Button-module_startIcon__Eylwr {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px; }\n .Button-module_startIcon__Eylwr svg {\n width: 18px;\n height: 18px; }\n\n.Button-module_endIcon__pCffL {\n display: inherit;\n margin-left: 8px; }\n .Button-module_endIcon__pCffL svg {\n width: 18px;\n height: 18px; }\n";
|
|
505
|
+
var styles$O = {"button":"Button-module_button__qeIer","shadow":"Button-module_shadow__6N2nE","block":"Button-module_block__JIazf","btnContained":"Button-module_btnContained__16y5l","primary":"Button-module_primary__EUyOu","accent":"Button-module_accent__opVgQ","secondary":"Button-module_secondary__zKoGk","light":"Button-module_light__LXeZy","dark":"Button-module_dark__5oFOT","btnText":"Button-module_btnText__N5Gys","btnOutline":"Button-module_btnOutline__CCFPI","startIcon":"Button-module_startIcon__Eylwr","endIcon":"Button-module_endIcon__pCffL"};
|
|
506
506
|
styleInject(css_248z$O);
|
|
507
507
|
|
|
508
508
|
const Button = (props) => {
|
|
@@ -542,7 +542,7 @@ const Button = (props) => {
|
|
|
542
542
|
React.createElement(Icon, { className: styles$O.endIcon }, endIcon))));
|
|
543
543
|
};
|
|
544
544
|
|
|
545
|
-
var css_248z$N = ".ButtonGroup-module_buttonGroup__w6iB- button:not(:last-child) {\n
|
|
545
|
+
var css_248z$N = ".ButtonGroup-module_buttonGroup__w6iB- {\n display: inline-flex;\n border-radius: 4px;\n box-shadow: 0px 3px 1px -2px black, 0px 2px 2px 0px black, 0px 1px 5px 0px black; }\n .ButtonGroup-module_buttonGroup__w6iB- button:not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0; }\n .ButtonGroup-module_buttonGroup__w6iB- button:not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0; }\n .ButtonGroup-module_buttonGroup__w6iB- button:not(:last-of-type) {\n border-right: 1px solid #bdbdbd; }\n";
|
|
546
546
|
var styles$N = {"buttonGroup":"ButtonGroup-module_buttonGroup__w6iB-"};
|
|
547
547
|
styleInject(css_248z$N);
|
|
548
548
|
|
|
@@ -2304,6 +2304,35 @@ const Table = (props) => {
|
|
|
2304
2304
|
React.createElement("table", { className: getCssClasses() }, children)));
|
|
2305
2305
|
};
|
|
2306
2306
|
|
|
2307
|
+
const TableRow = (props) => {
|
|
2308
|
+
const { children } = props, rest = __rest(props, ["children"]);
|
|
2309
|
+
return (React.createElement("tr", Object.assign({}, rest), children));
|
|
2310
|
+
};
|
|
2311
|
+
|
|
2312
|
+
const TableContext = createContext({
|
|
2313
|
+
variant: 'head'
|
|
2314
|
+
});
|
|
2315
|
+
const useTableContext = () => useContext(TableContext);
|
|
2316
|
+
|
|
2317
|
+
const TableHead = (props) => {
|
|
2318
|
+
const { children } = props, rest = __rest(props, ["children"]);
|
|
2319
|
+
return (React.createElement(TableContext.Provider, { value: { variant: 'head' } },
|
|
2320
|
+
React.createElement("thead", Object.assign({}, rest), children)));
|
|
2321
|
+
};
|
|
2322
|
+
|
|
2323
|
+
const TableBody = (props) => {
|
|
2324
|
+
const { children } = props, rest = __rest(props, ["children"]);
|
|
2325
|
+
return (React.createElement(TableContext.Provider, { value: { variant: 'body' } },
|
|
2326
|
+
React.createElement("tbody", Object.assign({}, rest), children)));
|
|
2327
|
+
};
|
|
2328
|
+
|
|
2329
|
+
const TableCell = (props) => {
|
|
2330
|
+
const { variant } = useTableContext();
|
|
2331
|
+
const { children, component } = props, rest = __rest(props, ["children", "component"]);
|
|
2332
|
+
return (React.createElement(ConditionalWrapper, { condition: true, wrapper: children => ((variant === 'head' || component === 'th') ? (React.createElement("th", Object.assign({}, rest), children)) :
|
|
2333
|
+
React.createElement("td", Object.assign({}, rest), children)) }, children));
|
|
2334
|
+
};
|
|
2335
|
+
|
|
2307
2336
|
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";
|
|
2308
2337
|
var styles$5 = {"tabIndicator":"TabIndicator-module_tabIndicator__jSJhH","primary":"TabIndicator-module_primary__Q5jEo","accent":"TabIndicator-module_accent__qbgIG"};
|
|
2309
2338
|
styleInject(css_248z$5);
|
|
@@ -2620,4 +2649,4 @@ const TreeItem = (props) => {
|
|
|
2620
2649
|
children && _isExpanded ? React.createElement("ul", null, children) : null));
|
|
2621
2650
|
};
|
|
2622
2651
|
|
|
2623
|
-
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 };
|
|
2652
|
+
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
CHANGED
|
@@ -509,8 +509,8 @@ const Badge = (props) => {
|
|
|
509
509
|
React__default["default"].createElement("span", { className: getCssClassesBadge() }, content)));
|
|
510
510
|
};
|
|
511
511
|
|
|
512
|
-
var css_248z$O = ".Button-module_button__qeIer {\n text-transform: uppercase
|
|
513
|
-
var styles$O = {"button":"Button-module_button__qeIer","shadow":"Button-module_shadow__6N2nE","block":"Button-module_block__JIazf","
|
|
512
|
+
var css_248z$O = ".Button-module_button__qeIer {\n text-transform: uppercase;\n flex-shrink: 0;\n background-color: transparent;\n display: inline-block;\n font-weight: 400;\n line-height: 1.5;\n text-align: center;\n text-decoration: none;\n vertical-align: middle;\n user-select: none;\n border: 1px solid transparent;\n padding: 0.375rem 0.75rem;\n transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out,\r box-shadow 0.15s ease-in-out;\n min-width: 64px;\n font-size: 0.875rem;\n border-radius: var(--borderRadius); }\n .Button-module_button__qeIer.Button-module_shadow__6N2nE {\n box-shadow: var(--shadow); }\n .Button-module_button__qeIer.Button-module_block__JIazf {\n width: 100%; }\n .Button-module_button__qeIer:hover:not(:disabled) {\n cursor: pointer; }\n .Button-module_button__qeIer:focus:not(:disabled) {\n border-color: #86b7fe;\n outline: 0;\n box-shadow: inset 0 1px 2px #00000013, 0 0 0 0.25rem #0d6efd40; }\n\n.Button-module_btnContained__16y5l.Button-module_primary__EUyOu {\n color: var(--primary-contrast-text);\n background-color: var(--primary); }\n .Button-module_btnContained__16y5l.Button-module_primary__EUyOu:hover:not(:disabled) {\n background-color: var(--primary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_accent__opVgQ {\n color: var(--accent-contrast-text);\n background-color: var(--accent); }\n .Button-module_btnContained__16y5l.Button-module_accent__opVgQ:hover:not(:disabled) {\n background-color: var(--accent-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_secondary__zKoGk {\n color: var(--secondary-contrast-text);\n background-color: var(--secondary); }\n .Button-module_btnContained__16y5l.Button-module_secondary__zKoGk:hover:not(:disabled) {\n background-color: var(--secondary-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_light__LXeZy {\n color: var(--light-contrast-text);\n background-color: var(--light); }\n .Button-module_btnContained__16y5l.Button-module_light__LXeZy:hover:not(:disabled) {\n background-color: var(--light-dark); }\n\n.Button-module_btnContained__16y5l.Button-module_dark__5oFOT {\n color: var(--dark-contrast-text);\n background-color: var(--dark); }\n .Button-module_btnContained__16y5l.Button-module_dark__5oFOT:hover:not(:disabled) {\n background-color: var(--dark-dark); }\n\n.Button-module_btnContained__16y5l:disabled {\n color: rgba(0, 0, 0, 0.26);\n box-shadow: none;\n background-color: rgba(0, 0, 0, 0.12); }\n .Button-module_btnContained__16y5l:disabled:hover {\n cursor: not-allowed; }\n\n.Button-module_btnText__N5Gys {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu {\n color: var(--primary); }\n .Button-module_btnText__N5Gys.Button-module_primary__EUyOu:hover:not(:disabled) {\n text-decoration: none;\n background: var(--primary-highlight); }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk {\n color: var(--secondary); }\n .Button-module_btnText__N5Gys.Button-module_secondary__zKoGk:hover:not(:disabled) {\n text-decoration: none;\n background: var(--secondary-highlight); }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ {\n color: var(--accent); }\n .Button-module_btnText__N5Gys.Button-module_accent__opVgQ:hover:not(:disabled) {\n text-decoration: none;\n background: var(--accent-highlight); }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy {\n color: var(--light-contrast-text); }\n .Button-module_btnText__N5Gys.Button-module_light__LXeZy:hover:not(:disabled) {\n text-decoration: none;\n background: var(--light-highlight); }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT {\n color: var(--dark); }\n .Button-module_btnText__N5Gys.Button-module_dark__5oFOT:hover:not(:disabled) {\n text-decoration: none;\n background: var(--dark-highlight); }\n\n.Button-module_btnOutline__CCFPI {\n box-shadow: none;\n text-decoration: none; }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu {\n color: var(--primary);\n border-color: var(--primary); }\n .Button-module_btnOutline__CCFPI.Button-module_primary__EUyOu:hover:not(:disabled) {\n background: var(--primary-highlight); }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk {\n color: var(--secondary);\n border-color: var(--secondary); }\n .Button-module_btnOutline__CCFPI.Button-module_secondary__zKoGk:hover:not(:disabled) {\n background: var(--secondary-highlight); }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ {\n color: var(--accent);\n border-color: var(--accent); }\n .Button-module_btnOutline__CCFPI.Button-module_accent__opVgQ:hover:not(:disabled) {\n background: var(--accent-highlight); }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy {\n color: var(--light-contrast-text);\n border-color: var(--light); }\n .Button-module_btnOutline__CCFPI.Button-module_light__LXeZy:hover:not(:disabled) {\n background: var(--light-highlight); }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT {\n color: var(--dark);\n border-color: var(--dark); }\n .Button-module_btnOutline__CCFPI.Button-module_dark__5oFOT:hover:not(:disabled) {\n background: var(--dark-highlight); }\n .Button-module_btnOutline__CCFPI:disabled {\n color: rgba(0, 0, 0, 0.26);\n border: 1px solid rgba(0, 0, 0, 0.12); }\n\n.Button-module_startIcon__Eylwr {\n display: inherit;\n margin-left: -4px;\n margin-right: 8px; }\n .Button-module_startIcon__Eylwr svg {\n width: 18px;\n height: 18px; }\n\n.Button-module_endIcon__pCffL {\n display: inherit;\n margin-left: 8px; }\n .Button-module_endIcon__pCffL svg {\n width: 18px;\n height: 18px; }\n";
|
|
513
|
+
var styles$O = {"button":"Button-module_button__qeIer","shadow":"Button-module_shadow__6N2nE","block":"Button-module_block__JIazf","btnContained":"Button-module_btnContained__16y5l","primary":"Button-module_primary__EUyOu","accent":"Button-module_accent__opVgQ","secondary":"Button-module_secondary__zKoGk","light":"Button-module_light__LXeZy","dark":"Button-module_dark__5oFOT","btnText":"Button-module_btnText__N5Gys","btnOutline":"Button-module_btnOutline__CCFPI","startIcon":"Button-module_startIcon__Eylwr","endIcon":"Button-module_endIcon__pCffL"};
|
|
514
514
|
styleInject(css_248z$O);
|
|
515
515
|
|
|
516
516
|
const Button = (props) => {
|
|
@@ -550,7 +550,7 @@ const Button = (props) => {
|
|
|
550
550
|
React__default["default"].createElement(Icon, { className: styles$O.endIcon }, endIcon))));
|
|
551
551
|
};
|
|
552
552
|
|
|
553
|
-
var css_248z$N = ".ButtonGroup-module_buttonGroup__w6iB- button:not(:last-child) {\n
|
|
553
|
+
var css_248z$N = ".ButtonGroup-module_buttonGroup__w6iB- {\n display: inline-flex;\n border-radius: 4px;\n box-shadow: 0px 3px 1px -2px black, 0px 2px 2px 0px black, 0px 1px 5px 0px black; }\n .ButtonGroup-module_buttonGroup__w6iB- button:not(:last-child) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0; }\n .ButtonGroup-module_buttonGroup__w6iB- button:not(:first-child) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0; }\n .ButtonGroup-module_buttonGroup__w6iB- button:not(:last-of-type) {\n border-right: 1px solid #bdbdbd; }\n";
|
|
554
554
|
var styles$N = {"buttonGroup":"ButtonGroup-module_buttonGroup__w6iB-"};
|
|
555
555
|
styleInject(css_248z$N);
|
|
556
556
|
|
|
@@ -2312,6 +2312,35 @@ const Table = (props) => {
|
|
|
2312
2312
|
React__default["default"].createElement("table", { className: getCssClasses() }, children)));
|
|
2313
2313
|
};
|
|
2314
2314
|
|
|
2315
|
+
const TableRow = (props) => {
|
|
2316
|
+
const { children } = props, rest = __rest(props, ["children"]);
|
|
2317
|
+
return (React__default["default"].createElement("tr", Object.assign({}, rest), children));
|
|
2318
|
+
};
|
|
2319
|
+
|
|
2320
|
+
const TableContext = React.createContext({
|
|
2321
|
+
variant: 'head'
|
|
2322
|
+
});
|
|
2323
|
+
const useTableContext = () => React.useContext(TableContext);
|
|
2324
|
+
|
|
2325
|
+
const TableHead = (props) => {
|
|
2326
|
+
const { children } = props, rest = __rest(props, ["children"]);
|
|
2327
|
+
return (React__default["default"].createElement(TableContext.Provider, { value: { variant: 'head' } },
|
|
2328
|
+
React__default["default"].createElement("thead", Object.assign({}, rest), children)));
|
|
2329
|
+
};
|
|
2330
|
+
|
|
2331
|
+
const TableBody = (props) => {
|
|
2332
|
+
const { children } = props, rest = __rest(props, ["children"]);
|
|
2333
|
+
return (React__default["default"].createElement(TableContext.Provider, { value: { variant: 'body' } },
|
|
2334
|
+
React__default["default"].createElement("tbody", Object.assign({}, rest), children)));
|
|
2335
|
+
};
|
|
2336
|
+
|
|
2337
|
+
const TableCell = (props) => {
|
|
2338
|
+
const { variant } = useTableContext();
|
|
2339
|
+
const { children, component } = props, rest = __rest(props, ["children", "component"]);
|
|
2340
|
+
return (React__default["default"].createElement(ConditionalWrapper, { condition: true, wrapper: children => ((variant === 'head' || component === 'th') ? (React__default["default"].createElement("th", Object.assign({}, rest), children)) :
|
|
2341
|
+
React__default["default"].createElement("td", Object.assign({}, rest), children)) }, children));
|
|
2342
|
+
};
|
|
2343
|
+
|
|
2315
2344
|
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";
|
|
2316
2345
|
var styles$5 = {"tabIndicator":"TabIndicator-module_tabIndicator__jSJhH","primary":"TabIndicator-module_primary__Q5jEo","accent":"TabIndicator-module_accent__qbgIG"};
|
|
2317
2346
|
styleInject(css_248z$5);
|
|
@@ -2720,6 +2749,10 @@ exports.StepperActions = StepperActions;
|
|
|
2720
2749
|
exports.Tab = Tab;
|
|
2721
2750
|
exports.TabPanel = TabPanel;
|
|
2722
2751
|
exports.Table = Table;
|
|
2752
|
+
exports.TableBody = TableBody;
|
|
2753
|
+
exports.TableCell = TableCell;
|
|
2754
|
+
exports.TableHead = TableHead;
|
|
2755
|
+
exports.TableRow = TableRow;
|
|
2723
2756
|
exports.Tabs = Tabs;
|
|
2724
2757
|
exports.Textarea = Textarea;
|
|
2725
2758
|
exports.TimeSelect = TimeSelect;
|
package/package.json
CHANGED
package/react-asc.scss
CHANGED
|
@@ -64,6 +64,16 @@
|
|
|
64
64
|
--fontWeight: 400;
|
|
65
65
|
|
|
66
66
|
--fontLineHeight: 1.5;
|
|
67
|
+
|
|
68
|
+
--textBody1FontSize: 13px;
|
|
69
|
+
--textBody1LineHeight: 18px;
|
|
70
|
+
|
|
71
|
+
--textBody2FontSize: 13px;
|
|
72
|
+
--textBody2LineHeight: 18px;
|
|
73
|
+
|
|
74
|
+
--textOverlineFontSize: 13px;
|
|
75
|
+
--textOverlineLineHeight: 18px;
|
|
76
|
+
--textOverlineTransform: uppercase;
|
|
67
77
|
}
|
|
68
78
|
|
|
69
79
|
:root {
|
|
@@ -304,3 +314,24 @@ label.required {
|
|
|
304
314
|
vertical-align: text-top;
|
|
305
315
|
}
|
|
306
316
|
}
|
|
317
|
+
|
|
318
|
+
.overline {
|
|
319
|
+
font-size: var(--textOverlineFontSize) !important;
|
|
320
|
+
line-height: var(--textOverlineLineHeight) !important;
|
|
321
|
+
text-transform: var(--textOverlineTransform) !important;
|
|
322
|
+
font-weight: bold;
|
|
323
|
+
}
|
|
324
|
+
|
|
325
|
+
.body1 {
|
|
326
|
+
font-size: var(--textBody1FontSize) !important;
|
|
327
|
+
line-height: var(--textBody1LineHeight) !important;
|
|
328
|
+
}
|
|
329
|
+
|
|
330
|
+
.body2 {
|
|
331
|
+
font-size: var(--textBody2FontSize) !important;
|
|
332
|
+
line-height: var(--textBody2LineHeight) !important;
|
|
333
|
+
}
|
|
334
|
+
|
|
335
|
+
.uppercase {
|
|
336
|
+
text-transform: uppercase !important;
|
|
337
|
+
}
|