@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 CHANGED
@@ -39,6 +39,10 @@ a.Button--secondary {
39
39
  padding: 9px 18px;
40
40
  }
41
41
 
42
+ a.Button--thin {
43
+ padding: 0 16px;
44
+ }
45
+
42
46
  .Icon {
43
47
  display: inline-block;
44
48
  vertical-align: middle;
@@ -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: React.HTMLAttributes<HTMLElement>;
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 }: TableHTMLAttributes<HTMLTableElement>): JSX.Element;
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("div", tslib.__assign({ ref: ref }, data),
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("div", { className: "ExpandCollapse__trigger-title" }, typeof children === 'function'
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
- (_a = this.state.isolator) === null || _a === void 0 ? void 0 : _a.deactivate();
1564
- (_c = (_b = this.props).onClose) === null || _c === void 0 ? void 0 : _c.call(_b);
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 Event(show ? 'cauldron:tooltip:show' : 'cauldron:tooltip:hide', {
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.26021aea",
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-react.git"
89
+ "url": "git+https://github.com/dequelabs/cauldron.git"
89
90
  },
90
91
  "peerDependencies": {
91
92
  "react": ">=16.6 <= 18",