@deque/cauldron-react 4.7.0-canary.26021aea → 4.7.0-canary.299bd7ab
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/lib/cauldron.css +4 -0
- package/lib/components/ClickOutsideListener/index.d.ts +1 -0
- package/lib/components/Icon/types.d.ts +1 -1
- package/lib/components/Link/index.d.ts +3 -1
- package/lib/components/LoaderOverlay/index.d.ts +1 -1
- package/lib/components/SideBar/SideBar.d.ts +1 -1
- package/lib/components/Table/Table.d.ts +5 -1
- package/lib/index.js +18 -10
- package/lib/link.js +25 -0
- package/package.json +3 -2
package/lib/cauldron.css
CHANGED
|
@@ -8,6 +8,7 @@ export interface ClickOutsideListenerProps<T extends HTMLElement = HTMLElement>
|
|
|
8
8
|
target?: T;
|
|
9
9
|
}
|
|
10
10
|
export default class ClickOutsideListener extends React.Component<ClickOutsideListenerProps> {
|
|
11
|
+
static displayName: string;
|
|
11
12
|
static defaultProps: {
|
|
12
13
|
mouseEvent: string;
|
|
13
14
|
touchEvent: string;
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
* GENERATED CODE. DO NOT EDIT DIRECTLY!
|
|
3
3
|
*/
|
|
4
4
|
/** IconType represents each valid icon type. */
|
|
5
|
-
export declare type IconType = 'add-user' | 'arrow-circle-up' | 'arrow-circle-down' | 'arrow-circle-left' | 'arrow-circle-right' | 'arrow-up' | 'arrow-down' | 'arrow-left' | 'arrow-right' | 'arrows-alt' | 'bolt' | 'caution' | 'check-circle' | 'check-shield' | 'check-solid' | 'check' | 'checkbox-checked' | 'checkbox-unchecked' | 'chevron-double-up' | 'chevron-double-down' | 'chevron-double-left' | 'chevron-double-right' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'clipboard' | 'close' | 'code' | 'copy' | 'download' | 'dropper' | 'exchange' | 'export-solid' | 'external-link' | 'eye' | 'filter-solid' | 'filter' | 'flag' | 'gears' | 'grid' | 'hamburger-menu' | 'highlight' | 'info-circle-alt' | 'info-circle' | 'info-square' | 'kabob' | 'list' | 'lock' | 'magnifying-glass' | 'menu' | 'minus' | 'new-releases' | 'new' | 'no' | 'pencil' | 'play' | 'plus' | 'question-circle-alt' | 'question-circle' | 'radio-checked' | 'radio-unchecked' | 'recycle-square' | 'recycle' | 'resend' | 'robot' | 'run-again' | 'save' | 'share' | 'sort-triangle' | 'sort' | 'star' | 'sun' | 'tag' | 'target' | 'trash' | 'triangle-up' | 'triangle-down' | 'triangle-left' | 'triangle-right' | 'upload';
|
|
5
|
+
export declare type IconType = 'add-user' | 'arrow-circle-up' | 'arrow-circle-down' | 'arrow-circle-left' | 'arrow-circle-right' | 'arrow-up' | 'arrow-down' | 'arrow-left' | 'arrow-right' | 'arrows-alt' | 'bolt' | 'caution' | 'check-circle' | 'check-shield' | 'check-solid' | 'check' | 'checkbox-checked' | 'checkbox-unchecked' | 'chevron-double-up' | 'chevron-double-down' | 'chevron-double-left' | 'chevron-double-right' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'clipboard' | 'close' | 'code' | 'copy' | 'download' | 'dropper' | 'exchange' | 'export-solid' | 'external-link' | 'eye' | 'filter-solid' | 'filter' | 'flag' | 'gears' | 'grid' | 'hamburger-menu' | 'highlight' | 'info-circle-alt' | 'info-circle' | 'info-square' | 'kabob' | 'link' | 'list' | 'lock' | 'magnifying-glass' | 'menu' | 'minus' | 'new-releases' | 'new' | 'no' | 'pencil' | 'play' | 'plus' | 'question-circle-alt' | 'question-circle' | 'radio-checked' | 'radio-unchecked' | 'recycle-square' | 'recycle' | 'resend' | 'robot' | 'run-again' | 'save' | 'share' | 'sort-triangle' | 'sort' | 'star' | 'sun' | 'tag' | 'target' | 'trash' | 'triangle-up' | 'triangle-down' | 'triangle-left' | 'triangle-right' | 'upload';
|
|
6
6
|
/** iconTypes holds each valid icon type. */
|
|
7
7
|
export declare const iconTypes: string[];
|
|
@@ -3,13 +3,15 @@ import PropTypes from 'prop-types';
|
|
|
3
3
|
export interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
4
4
|
linkRef?: React.Ref<HTMLAnchorElement>;
|
|
5
5
|
variant?: 'button' | 'button-secondary';
|
|
6
|
+
thin?: boolean;
|
|
6
7
|
}
|
|
7
8
|
declare const Link: {
|
|
8
|
-
({ children, linkRef, className, variant, ...other }: LinkProps): JSX.Element;
|
|
9
|
+
({ children, linkRef, className, variant, thin, ...other }: LinkProps): JSX.Element;
|
|
9
10
|
propTypes: {
|
|
10
11
|
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
|
|
11
12
|
className: PropTypes.Requireable<string>;
|
|
12
13
|
variant: PropTypes.Requireable<string>;
|
|
14
|
+
thin: PropTypes.Requireable<boolean>;
|
|
13
15
|
linkRef: PropTypes.Requireable<((...args: any[]) => any) | PropTypes.InferProps<{
|
|
14
16
|
current: PropTypes.Requireable<any>;
|
|
15
17
|
}>>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
interface LoaderOverlayProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
2
|
+
export interface LoaderOverlayProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
3
3
|
variant?: 'large' | 'small';
|
|
4
4
|
label?: string;
|
|
5
5
|
focusOnInitialRender?: boolean;
|
|
@@ -5,7 +5,7 @@ export interface SideBarProps extends React.HTMLAttributes<HTMLUListElement> {
|
|
|
5
5
|
onDismiss: () => void;
|
|
6
6
|
className?: string;
|
|
7
7
|
show: boolean;
|
|
8
|
-
navProps
|
|
8
|
+
navProps?: React.HTMLAttributes<HTMLElement>;
|
|
9
9
|
}
|
|
10
10
|
interface SideBarState {
|
|
11
11
|
wide: boolean;
|
|
@@ -1,11 +1,15 @@
|
|
|
1
1
|
import { TableHTMLAttributes } from 'react';
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
|
+
interface TableProps extends TableHTMLAttributes<HTMLTableElement> {
|
|
4
|
+
variant?: 'border';
|
|
5
|
+
}
|
|
3
6
|
declare const Table: {
|
|
4
|
-
({ children, className, ...other }:
|
|
7
|
+
({ children, className, variant, ...other }: TableProps): JSX.Element;
|
|
5
8
|
displayName: string;
|
|
6
9
|
propTypes: {
|
|
7
10
|
children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
|
|
8
11
|
className: PropTypes.Requireable<string>;
|
|
12
|
+
variant: PropTypes.Requireable<string>;
|
|
9
13
|
};
|
|
10
14
|
};
|
|
11
15
|
export default Table;
|
package/lib/index.js
CHANGED
|
@@ -164,6 +164,7 @@ var iconTypes = [
|
|
|
164
164
|
'info-circle',
|
|
165
165
|
'info-square',
|
|
166
166
|
'kabob',
|
|
167
|
+
'link',
|
|
167
168
|
'list',
|
|
168
169
|
'lock',
|
|
169
170
|
'magnifying-glass',
|
|
@@ -237,6 +238,7 @@ function __variableDynamicImportRuntime0__(path) {
|
|
|
237
238
|
case './icons/info-circle.svg': return Promise.resolve().then(function () { return require('./info-circle.js'); });
|
|
238
239
|
case './icons/info-square.svg': return Promise.resolve().then(function () { return require('./info-square.js'); });
|
|
239
240
|
case './icons/kabob.svg': return Promise.resolve().then(function () { return require('./kabob.js'); });
|
|
241
|
+
case './icons/link.svg': return Promise.resolve().then(function () { return require('./link.js'); });
|
|
240
242
|
case './icons/list.svg': return Promise.resolve().then(function () { return require('./list.js'); });
|
|
241
243
|
case './icons/lock.svg': return Promise.resolve().then(function () { return require('./lock.js'); });
|
|
242
244
|
case './icons/magnifying-glass.svg': return Promise.resolve().then(function () { return require('./magnifying-glass.js'); });
|
|
@@ -305,7 +307,7 @@ var Icon = React.forwardRef(function (_a, ref) {
|
|
|
305
307
|
var data = tslib.__assign(tslib.__assign({}, other), { 'aria-hidden': !label, className: classNames('Icon', "Icon--".concat(type), className, (_b = {},
|
|
306
308
|
_b["Icon__".concat(direction)] = !!direction,
|
|
307
309
|
_b)) });
|
|
308
|
-
return (React__default.createElement("
|
|
310
|
+
return (React__default.createElement("span", tslib.__assign({ ref: ref }, data),
|
|
309
311
|
label && React__default.createElement(Offscreen, null, label),
|
|
310
312
|
IconSVG && React__default.createElement(IconSVG, null)));
|
|
311
313
|
});
|
|
@@ -326,7 +328,7 @@ var PanelTrigger = function (_a) {
|
|
|
326
328
|
React__default.createElement("button", tslib.__assign({ className: classNames(className, 'ExpandCollapse__trigger', {
|
|
327
329
|
fullWidth: fullWidth
|
|
328
330
|
}), type: "button", "aria-expanded": open, onClick: onClick }, otherProps),
|
|
329
|
-
React__default.createElement("
|
|
331
|
+
React__default.createElement("span", { className: "ExpandCollapse__trigger-title" }, typeof children === 'function'
|
|
330
332
|
? children({ open: !!open })
|
|
331
333
|
: children),
|
|
332
334
|
React__default.createElement(Icon, { type: open ? iconExpanded : iconCollapsed }))));
|
|
@@ -899,6 +901,7 @@ var ClickOutsideListener = /** @class */ (function (_super) {
|
|
|
899
901
|
ref: resolveRef
|
|
900
902
|
});
|
|
901
903
|
};
|
|
904
|
+
ClickOutsideListener.displayName = 'ClickOutsideListener';
|
|
902
905
|
ClickOutsideListener.defaultProps = {
|
|
903
906
|
mouseEvent: 'click',
|
|
904
907
|
touchEvent: 'touchend'
|
|
@@ -1560,8 +1563,10 @@ var Dialog = /** @class */ (function (_super) {
|
|
|
1560
1563
|
};
|
|
1561
1564
|
Dialog.prototype.close = function () {
|
|
1562
1565
|
var _a, _b, _c;
|
|
1563
|
-
(
|
|
1564
|
-
|
|
1566
|
+
if (this.props.show) {
|
|
1567
|
+
(_a = this.state.isolator) === null || _a === void 0 ? void 0 : _a.deactivate();
|
|
1568
|
+
(_c = (_b = this.props).onClose) === null || _c === void 0 ? void 0 : _c.call(_b);
|
|
1569
|
+
}
|
|
1565
1570
|
};
|
|
1566
1571
|
Dialog.prototype.handleClickOutside = function () {
|
|
1567
1572
|
var _a = this.props, show = _a.show, forceAction = _a.forceAction;
|
|
@@ -1720,7 +1725,7 @@ var fireCustomEvent = function (show, button) {
|
|
|
1720
1725
|
if (!button) {
|
|
1721
1726
|
return;
|
|
1722
1727
|
}
|
|
1723
|
-
var event = new
|
|
1728
|
+
var event = new CustomEvent(show ? 'cauldron:tooltip:show' : 'cauldron:tooltip:hide', {
|
|
1724
1729
|
bubbles: true
|
|
1725
1730
|
});
|
|
1726
1731
|
button.dispatchEvent(event);
|
|
@@ -2436,17 +2441,19 @@ var Toast = /** @class */ (function (_super) {
|
|
|
2436
2441
|
}(React__default.Component));
|
|
2437
2442
|
|
|
2438
2443
|
var Link = function (_a) {
|
|
2439
|
-
var children = _a.children, linkRef = _a.linkRef, className = _a.className, variant = _a.variant, other = tslib.__rest(_a, ["children", "linkRef", "className", "variant"]);
|
|
2444
|
+
var children = _a.children, linkRef = _a.linkRef, className = _a.className, variant = _a.variant, thin = _a.thin, other = tslib.__rest(_a, ["children", "linkRef", "className", "variant", "thin"]);
|
|
2440
2445
|
return (React__default.createElement("a", tslib.__assign({ ref: linkRef, className: classNames(className, {
|
|
2441
2446
|
Link: !variant,
|
|
2442
2447
|
'Button--primary': variant === 'button',
|
|
2443
|
-
'Button--secondary': variant === 'button-secondary'
|
|
2448
|
+
'Button--secondary': variant === 'button-secondary',
|
|
2449
|
+
'Button--thin': thin
|
|
2444
2450
|
}) }, other), children));
|
|
2445
2451
|
};
|
|
2446
2452
|
Link.propTypes = {
|
|
2447
2453
|
children: PropTypes.node,
|
|
2448
2454
|
className: PropTypes.string,
|
|
2449
2455
|
variant: PropTypes.string,
|
|
2456
|
+
thin: PropTypes.bool,
|
|
2450
2457
|
linkRef: PropTypes.oneOfType([
|
|
2451
2458
|
PropTypes.func,
|
|
2452
2459
|
PropTypes.shape({ current: PropTypes.any })
|
|
@@ -8255,13 +8262,14 @@ Tag.propTypes = {
|
|
|
8255
8262
|
};
|
|
8256
8263
|
|
|
8257
8264
|
var Table = function (_a) {
|
|
8258
|
-
var children = _a.children, className = _a.className, other = tslib.__rest(_a, ["children", "className"]);
|
|
8259
|
-
return (React__default.createElement("table", tslib.__assign({ className: classNames('Table', className) }, other), children));
|
|
8265
|
+
var children = _a.children, className = _a.className, variant = _a.variant, other = tslib.__rest(_a, ["children", "className", "variant"]);
|
|
8266
|
+
return (React__default.createElement("table", tslib.__assign({ className: classNames('Table', variant === 'border' && 'Table--border', className) }, other), children));
|
|
8260
8267
|
};
|
|
8261
8268
|
Table.displayName = 'Table';
|
|
8262
8269
|
Table.propTypes = {
|
|
8263
8270
|
children: PropTypes.node.isRequired,
|
|
8264
|
-
className: PropTypes.string
|
|
8271
|
+
className: PropTypes.string,
|
|
8272
|
+
variant: PropTypes.string
|
|
8265
8273
|
};
|
|
8266
8274
|
|
|
8267
8275
|
var TableBody = function (_a) {
|
package/lib/link.js
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var React__default = _interopDefault(React);
|
|
7
|
+
|
|
8
|
+
var _path;
|
|
9
|
+
|
|
10
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
11
|
+
|
|
12
|
+
const SvgLink = props => /*#__PURE__*/React.createElement("svg", _extends({
|
|
13
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
14
|
+
overflow: "visible",
|
|
15
|
+
preserveAspectRatio: "none",
|
|
16
|
+
viewBox: "0 0 24 24",
|
|
17
|
+
height: 24,
|
|
18
|
+
width: 24
|
|
19
|
+
}, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
|
|
20
|
+
d: "M18.5 16.01c0 .26-.11.51-.29.7l-1.53 1.52c-.19.18-.45.28-.71.27-.26 0-.52-.1-.71-.28l-2.14-2.16a.99.99 0 0 1-.29-.71c0-.29.12-.57.34-.76l.19.2.22.22.2.16c.08.06.17.11.27.14.1.01.19.01.29 0 .55 0 1-.45 1-1 .01-.1.01-.19 0-.29a.867.867 0 0 0-.14-.27l-.2-.16-.22-.22-.2-.19c.19-.21.46-.33.75-.33.27 0 .52.1.71.29l2.17 2.17c.19.19.29.44.29.71v-.01zm-7.32-7.34c0 .29-.12.57-.34.76l-.19-.2-.23-.22-.2-.16a.744.744 0 0 0-.22-.14c-.1-.01-.19-.01-.29 0-.55 0-1 .45-1 1-.01.09-.01.19 0 .29.03.1.08.19.14.27l.15.16.22.22.2.19c-.19.21-.47.32-.75.32a.98.98 0 0 1-.67-.27L5.79 8.72c-.19-.19-.29-.45-.29-.71 0-.26.11-.51.29-.7l1.54-1.52c.18-.18.42-.28.67-.28.27 0 .52.1.71.29l2.14 2.16c.19.19.29.44.29.71h.04zm9.32 7.34c.01-.8-.3-1.56-.87-2.12l-2.17-2.17c-1.16-1.18-3.06-1.21-4.24-.05l-.05.05-.92-.92c.6-.57.93-1.36.92-2.18.02-.79-.29-1.56-.86-2.11L10.16 4.4C9.6 3.81 8.81 3.48 8 3.51c-.79-.02-1.56.29-2.11.86L4.39 5.9c-.58.54-.9 1.31-.89 2.11-.01.8.3 1.56.87 2.12l2.17 2.17c.56.57 1.32.88 2.12.87.82.01 1.61-.32 2.17-.92l.92.92c-.6.57-.93 1.36-.92 2.18-.02.79.29 1.56.86 2.11l2.14 2.16a3 3 0 0 0 4.24 0l1.53-1.52c.58-.54.9-1.3.9-2.09z",
|
|
21
|
+
fill: "currentColor",
|
|
22
|
+
vectorEffect: "non-scaling-stroke"
|
|
23
|
+
})));
|
|
24
|
+
|
|
25
|
+
exports.default = SvgLink;
|
package/package.json
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@deque/cauldron-react",
|
|
3
|
-
"version": "4.7.0-canary.
|
|
3
|
+
"version": "4.7.0-canary.299bd7ab",
|
|
4
4
|
"description": "Fully accessible react components library for Deque Cauldron",
|
|
5
|
+
"homepage": "https://cauldron.dequelabs.com/",
|
|
5
6
|
"publishConfig": {
|
|
6
7
|
"access": "public"
|
|
7
8
|
},
|
|
@@ -85,7 +86,7 @@
|
|
|
85
86
|
},
|
|
86
87
|
"repository": {
|
|
87
88
|
"type": "git",
|
|
88
|
-
"url": "git+https://github.com/dequelabs/cauldron
|
|
89
|
+
"url": "git+https://github.com/dequelabs/cauldron.git"
|
|
89
90
|
},
|
|
90
91
|
"peerDependencies": {
|
|
91
92
|
"react": ">=16.6 <= 18",
|