@automattic/vip-design-system 2.10.0 → 2.10.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/babel.config.js +23 -19
- package/build/declaration.d.js +0 -1
- package/build/system/Accordion/Accordion.js +28 -33
- package/build/system/Accordion/Accordion.stories.js +34 -35
- package/build/system/Accordion/Accordion.test.js +35 -34
- package/build/system/Accordion/index.js +5 -8
- package/build/system/Avatar/Avatar.js +13 -17
- package/build/system/Avatar/Avatar.stories.js +10 -12
- package/build/system/Avatar/Avatar.test.js +15 -14
- package/build/system/Avatar/index.js +4 -6
- package/build/system/Badge/Badge.js +9 -14
- package/build/system/Badge/Badge.stories.js +23 -23
- package/build/system/Badge/Badge.test.js +15 -14
- package/build/system/Badge/index.js +4 -6
- package/build/system/Box/Box.js +9 -13
- package/build/system/Box/Box.stories.js +5 -8
- package/build/system/Breadcrumbs/Breadcrumbs.js +34 -38
- package/build/system/Breadcrumbs/Breadcrumbs.stories.js +18 -21
- package/build/system/Breadcrumbs/Breadcrumbs.test.js +28 -30
- package/build/system/Breadcrumbs/styles.js +5 -9
- package/build/system/Button/Button.js +11 -17
- package/build/system/Button/Button.stories.js +34 -33
- package/build/system/Button/Button.test.js +17 -16
- package/build/system/Button/ButtonSubmit.js +12 -16
- package/build/system/Button/ButtonSubmit.stories.js +12 -16
- package/build/system/Button/ButtonSubmit.test.js +15 -14
- package/build/system/Button/index.js +5 -8
- package/build/system/Card/Card.js +12 -14
- package/build/system/Card/Card.stories.js +21 -24
- package/build/system/Card/Card.test.js +19 -18
- package/build/system/Card/index.js +4 -6
- package/build/system/Code/Code.js +19 -23
- package/build/system/Code/Code.stories.js +16 -18
- package/build/system/Code/Code.test.js +20 -19
- package/build/system/Code/index.js +4 -6
- package/build/system/Drawer/Drawer.js +25 -30
- package/build/system/Drawer/Drawer.stories.js +38 -39
- package/build/system/Drawer/Drawer.test.js +19 -18
- package/build/system/Drawer/styles.js +9 -11
- package/build/system/Dropdown/Dropdown.js +23 -26
- package/build/system/Dropdown/Dropdown.test.js +16 -18
- package/build/system/Dropdown/DropdownContent.js +14 -20
- package/build/system/Dropdown/DropdownItem.js +19 -25
- package/build/system/Dropdown/DropdownLabel.js +10 -16
- package/build/system/Dropdown/DropdownSeparator.js +10 -16
- package/build/system/Dropdown/index.js +20 -23
- package/build/system/FilterDropdown/FilterDropdown.js +23 -29
- package/build/system/FilterDropdown/FilterDropdown.stories.js +9 -11
- package/build/system/FilterDropdown/FilterDropdown.test.js +7 -10
- package/build/system/Flex/Flex.js +7 -10
- package/build/system/Flex/Flex.stories.js +6 -10
- package/build/system/Flex/index.js +4 -6
- package/build/system/Footer/Footer.d.ts +33 -0
- package/build/system/Footer/Footer.js +82 -0
- package/build/system/Footer/Footer.stories.d.ts +41 -0
- package/build/system/Footer/Footer.stories.js +53 -0
- package/build/system/Footer/Footer.test.d.ts +1 -0
- package/build/system/Footer/Footer.test.js +36 -0
- package/build/system/Form/Checkbox/Checkbox.js +14 -18
- package/build/system/Form/Checkbox/Checkbox.stories.js +47 -48
- package/build/system/Form/Checkbox/Checkbox.test.js +23 -21
- package/build/system/Form/Checkbox/styles.js +7 -10
- package/build/system/Form/Input.js +19 -18
- package/build/system/Form/Input.stories.js +16 -18
- package/build/system/Form/Input.styles.js +5 -9
- package/build/system/Form/Label.js +14 -16
- package/build/system/Form/Label.stories.js +15 -15
- package/build/system/Form/Radio/Radio.js +13 -18
- package/build/system/Form/Radio/Radio.stories.js +43 -43
- package/build/system/Form/Radio/Radio.test.js +19 -18
- package/build/system/Form/Radio/RadioOption.js +22 -23
- package/build/system/Form/Radio/styles.js +7 -10
- package/build/system/Form/RadioGroupChip.js +26 -29
- package/build/system/Form/RadioGroupChip.stories.js +12 -15
- package/build/system/Form/RadioGroupChip.test.js +12 -11
- package/build/system/Form/RequiredLabel.js +3 -7
- package/build/system/Form/Toggle.js +11 -16
- package/build/system/Form/Toggle.stories.js +25 -27
- package/build/system/Form/Toggle.test.js +12 -11
- package/build/system/Form/Validation.js +10 -12
- package/build/system/Form/index.d.ts +2 -1
- package/build/system/Form/index.js +2 -0
- package/build/system/Grid/Grid.js +7 -10
- package/build/system/Grid/Grid.stories.js +6 -10
- package/build/system/Grid/index.js +4 -6
- package/build/system/Heading/Heading.js +9 -14
- package/build/system/Heading/Heading.stories.js +13 -16
- package/build/system/Hr/Hr.js +3 -7
- package/build/system/Hr/Hr.stories.js +10 -11
- package/build/system/Hr/Hr.test.js +14 -14
- package/build/system/Link/Link.js +11 -14
- package/build/system/Link/Link.stories.js +11 -14
- package/build/system/Link/index.js +4 -6
- package/build/system/LinkExternal/LinkExternal.d.ts +23 -3
- package/build/system/LinkExternal/LinkExternal.js +17 -23
- package/build/system/LinkExternal/LinkExternal.stories.d.ts +1 -8
- package/build/system/LinkExternal/LinkExternal.stories.js +4 -9
- package/build/system/LinkExternal/LinkExternal.test.js +14 -15
- package/build/system/MobileMenu/MobileMenu.js +24 -29
- package/build/system/MobileMenu/MobileMenu.stories.js +66 -67
- package/build/system/MobileMenu/MobileMenu.test.js +21 -22
- package/build/system/Nav/Nav.js +26 -32
- package/build/system/Nav/Nav.stories.js +97 -99
- package/build/system/Nav/Nav.test.js +32 -28
- package/build/system/Nav/NavItem.js +40 -45
- package/build/system/Nav/NavItemGroup.js +34 -39
- package/build/system/Nav/NavItemGroup.test.js +26 -23
- package/build/system/Nav/styles/variants/breadcrumbs.js +4 -7
- package/build/system/Nav/styles/variants/menu.js +8 -12
- package/build/system/Nav/styles/variants/menugroup.js +7 -11
- package/build/system/Nav/styles/variants/primary.js +4 -8
- package/build/system/Nav/styles/variants/tabs.js +3 -7
- package/build/system/Nav/styles/variants/toolbar.js +5 -8
- package/build/system/Nav/styles.js +26 -29
- package/build/system/NewDialog/DialogClose.js +14 -18
- package/build/system/NewDialog/DialogClose.test.js +11 -14
- package/build/system/NewDialog/DialogDescription.js +9 -15
- package/build/system/NewDialog/DialogOverlay.js +11 -13
- package/build/system/NewDialog/DialogTitle.js +7 -15
- package/build/system/NewDialog/NewDialog.js +24 -29
- package/build/system/NewDialog/index.js +7 -11
- package/build/system/NewDialog/styles.js +1 -5
- package/build/system/NewForm/Fieldset.js +13 -17
- package/build/system/NewForm/Form.js +8 -13
- package/build/system/NewForm/FormAutocomplete.js +2 -2
- package/build/system/NewForm/Legend.js +11 -15
- package/build/system/Notice/Notice.js +22 -25
- package/build/system/Notice/Notice.stories.js +41 -43
- package/build/system/Notice/index.js +5 -5
- package/build/system/Page/Page.js +4 -8
- package/build/system/Page/Page.test.js +14 -14
- package/build/system/Progress/Progress.js +21 -24
- package/build/system/Progress/Progress.stories.js +9 -15
- package/build/system/Progress/Progress.test.js +14 -13
- package/build/system/Progress/index.js +4 -6
- package/build/system/ScreenReaderText/ScreenReaderText.js +9 -9
- package/build/system/Spinner/Spinner.js +9 -14
- package/build/system/Spinner/Spinner.stories.js +6 -10
- package/build/system/Spinner/Spinner.test.js +14 -13
- package/build/system/Spinner/index.js +1 -6
- package/build/system/Table/Table.js +20 -22
- package/build/system/Table/Table.stories.js +29 -30
- package/build/system/Table/TableCell.js +9 -11
- package/build/system/Table/TableRow.js +10 -11
- package/build/system/Table/index.js +6 -10
- package/build/system/Text/Text.js +9 -14
- package/build/system/Text/Text.stories.js +24 -25
- package/build/system/Text/index.js +4 -6
- package/build/system/Toolbar/Logo.js +11 -15
- package/build/system/Toolbar/Toolbar.js +12 -17
- package/build/system/Toolbar/Toolbar.stories.js +47 -50
- package/build/system/Toolbar/Toolbar.test.js +26 -24
- package/build/system/Toolbar/ToolbarUtilNav.js +9 -16
- package/build/system/Toolbar/index.js +10 -15
- package/build/system/Tooltip/Tooltip.js +9 -14
- package/build/system/Tooltip/Tooltip.stories.js +29 -31
- package/build/system/Tooltip/index.js +5 -5
- package/build/system/Wizard/Wizard.js +11 -18
- package/build/system/Wizard/Wizard.stories.js +37 -38
- package/build/system/Wizard/WizardStep.js +26 -32
- package/build/system/Wizard/index.js +6 -7
- package/build/system/assets/a8cLogo.d.ts +2 -0
- package/build/system/assets/a8cLogo.js +39 -0
- package/build/system/index.d.ts +2 -1
- package/build/system/index.js +2 -0
- package/build/system/theme/breakpoints.js +1 -5
- package/build/system/utils/stories/CustomLink.js +7 -13
- package/package.json +1 -1
- package/src/system/Footer/Footer.stories.tsx +46 -0
- package/src/system/Footer/Footer.test.tsx +40 -0
- package/src/system/Footer/Footer.tsx +120 -0
- package/src/system/Form/index.js +2 -0
- package/src/system/LinkExternal/LinkExternal.tsx +27 -8
- package/src/system/NewForm/FormAutocomplete.js +2 -2
- package/src/system/assets/a8cLogo.tsx +30 -0
- package/src/system/index.js +2 -0
|
@@ -1,17 +1,13 @@
|
|
|
1
|
-
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
2
|
+
/** @jsxImportSource theme-ui */
|
|
2
3
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
var
|
|
9
|
-
|
|
10
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
11
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
12
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); } /** @jsxImportSource theme-ui */
|
|
13
|
-
var DialogClose = exports.DialogClose = /*#__PURE__*/(0, _react.forwardRef)(function (props, forwardedRef) {
|
|
14
|
-
return (0, _jsxRuntime.jsx)(DialogPrimitive.Close, _extends({
|
|
4
|
+
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
5
|
+
import React, { forwardRef } from 'react';
|
|
6
|
+
import { IoClose } from 'react-icons/io5';
|
|
7
|
+
import { Button } from '..';
|
|
8
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
9
|
+
export var DialogClose = /*#__PURE__*/forwardRef(function (props, forwardedRef) {
|
|
10
|
+
return _jsx(DialogPrimitive.Close, _extends({
|
|
15
11
|
asChild: true
|
|
16
12
|
}, props, {
|
|
17
13
|
ref: forwardedRef,
|
|
@@ -19,7 +15,7 @@ var DialogClose = exports.DialogClose = /*#__PURE__*/(0, _react.forwardRef)(func
|
|
|
19
15
|
}));
|
|
20
16
|
});
|
|
21
17
|
DialogClose.displayName = 'DialogClose';
|
|
22
|
-
var defaultCloseStyles =
|
|
18
|
+
export var defaultCloseStyles = function defaultCloseStyles(variant) {
|
|
23
19
|
if (variant === void 0) {
|
|
24
20
|
variant = 'primary';
|
|
25
21
|
}
|
|
@@ -38,16 +34,16 @@ var defaultCloseStyles = exports.defaultCloseStyles = function defaultCloseStyle
|
|
|
38
34
|
}
|
|
39
35
|
};
|
|
40
36
|
};
|
|
41
|
-
var DialogCloseDefault =
|
|
37
|
+
export var DialogCloseDefault = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
|
|
42
38
|
var _ref$variant = _ref.variant,
|
|
43
39
|
variant = _ref$variant === void 0 ? 'primary' : _ref$variant;
|
|
44
|
-
return (
|
|
45
|
-
children: (
|
|
40
|
+
return _jsx(DialogClose, {
|
|
41
|
+
children: _jsx(Button, {
|
|
46
42
|
ref: forwardedRef,
|
|
47
43
|
"aria-label": "Close",
|
|
48
44
|
variant: "tertiary",
|
|
49
45
|
sx: defaultCloseStyles(variant),
|
|
50
|
-
children: (
|
|
46
|
+
children: _jsx(IoClose, {
|
|
51
47
|
"aria-hidden": "true",
|
|
52
48
|
width: 20,
|
|
53
49
|
height: 20
|
|
@@ -1,18 +1,15 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _reactDialog = require("@radix-ui/react-dialog");
|
|
4
|
-
var _react = require("@testing-library/react");
|
|
5
|
-
var _jestAxe = require("jest-axe");
|
|
6
|
-
var _react2 = _interopRequireDefault(require("react"));
|
|
7
|
-
var _DialogClose = require("./DialogClose");
|
|
8
|
-
var _jsxRuntime = require("theme-ui/jsx-runtime");
|
|
9
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
10
1
|
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == typeof h && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator["return"] && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(typeof e + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, "catch": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
|
|
11
2
|
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
|
|
12
3
|
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
|
|
13
4
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
5
|
+
import { Dialog } from '@radix-ui/react-dialog';
|
|
6
|
+
import { render, screen } from '@testing-library/react';
|
|
7
|
+
import { axe } from 'jest-axe';
|
|
8
|
+
import React from 'react';
|
|
9
|
+
import { DialogCloseDefault as DialogClose } from './DialogClose';
|
|
10
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
14
11
|
var Wrapper = function Wrapper(props) {
|
|
15
|
-
return (
|
|
12
|
+
return _jsx(Dialog, _extends({
|
|
16
13
|
open: true
|
|
17
14
|
}, props));
|
|
18
15
|
};
|
|
@@ -22,15 +19,15 @@ describe('<DialogClose />', function () {
|
|
|
22
19
|
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
|
23
20
|
while (1) switch (_context.prev = _context.next) {
|
|
24
21
|
case 0:
|
|
25
|
-
_render =
|
|
26
|
-
children: (
|
|
22
|
+
_render = render(_jsx(Wrapper, {
|
|
23
|
+
children: _jsx(DialogClose, {})
|
|
27
24
|
})), container = _render.container;
|
|
28
|
-
expect(
|
|
25
|
+
expect(screen.getByLabelText('Close')).toBeInTheDocument();
|
|
29
26
|
|
|
30
27
|
// Check for accessibility issues
|
|
31
28
|
_context.t0 = expect;
|
|
32
29
|
_context.next = 5;
|
|
33
|
-
return
|
|
30
|
+
return axe(container);
|
|
34
31
|
case 5:
|
|
35
32
|
_context.t1 = _context.sent;
|
|
36
33
|
(0, _context.t0)(_context.t1).toHaveNoViolations();
|
|
@@ -1,29 +1,23 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.DialogDescription = void 0;
|
|
5
|
-
var DialogPrimitive = _interopRequireWildcard(require("@radix-ui/react-dialog"));
|
|
6
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
7
|
-
var _ScreenReaderText = _interopRequireDefault(require("../ScreenReaderText"));
|
|
8
|
-
var _jsxRuntime = require("theme-ui/jsx-runtime");
|
|
9
1
|
var _excluded = ["description", "hidden"];
|
|
10
|
-
/** @jsxImportSource theme-ui */
|
|
11
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
12
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
13
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
14
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
15
3
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
16
|
-
|
|
4
|
+
/** @jsxImportSource theme-ui */
|
|
5
|
+
|
|
6
|
+
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
7
|
+
import React, { forwardRef } from 'react';
|
|
8
|
+
import ScreenReaderText from '../ScreenReaderText';
|
|
9
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
10
|
+
export var DialogDescription = /*#__PURE__*/forwardRef(function (_ref, forwardedRef) {
|
|
17
11
|
var description = _ref.description,
|
|
18
12
|
hidden = _ref.hidden,
|
|
19
13
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
20
14
|
var text = description;
|
|
21
15
|
if (hidden) {
|
|
22
|
-
text = (
|
|
16
|
+
text = _jsx(ScreenReaderText, {
|
|
23
17
|
children: text
|
|
24
18
|
});
|
|
25
19
|
}
|
|
26
|
-
return (
|
|
20
|
+
return _jsx(DialogPrimitive.Description, _extends({}, rest, {
|
|
27
21
|
ref: forwardedRef,
|
|
28
22
|
sx: {
|
|
29
23
|
margin: 0,
|
|
@@ -1,19 +1,17 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
exports.DialogOverlay = void 0;
|
|
5
|
-
var Dialog = _interopRequireWildcard(require("@radix-ui/react-dialog"));
|
|
6
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
7
|
-
var _jsxRuntime = require("theme-ui/jsx-runtime");
|
|
8
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
9
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
10
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); } /** @jsxImportSource theme-ui */ /**
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
2
|
+
/** @jsxImportSource theme-ui */
|
|
3
|
+
/**
|
|
11
4
|
* External dependencies
|
|
12
|
-
*/
|
|
5
|
+
*/
|
|
6
|
+
import * as Dialog from '@radix-ui/react-dialog';
|
|
7
|
+
import React, { forwardRef } from 'react';
|
|
8
|
+
|
|
9
|
+
/**
|
|
13
10
|
* Internal dependencies
|
|
14
11
|
*/
|
|
15
|
-
|
|
16
|
-
|
|
12
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
13
|
+
export var DialogOverlay = /*#__PURE__*/forwardRef(function (props, forwardedRef) {
|
|
14
|
+
return _jsx(Dialog.Overlay, _extends({
|
|
17
15
|
sx: {
|
|
18
16
|
position: 'fixed',
|
|
19
17
|
top: 0,
|
|
@@ -1,35 +1,27 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.DialogTitle = void 0;
|
|
5
|
-
var DialogPrimitive = _interopRequireWildcard(require("@radix-ui/react-dialog"));
|
|
6
|
-
var _react = _interopRequireDefault(require("react"));
|
|
7
|
-
var _ScreenReaderText = _interopRequireDefault(require("../ScreenReaderText"));
|
|
8
|
-
var _jsxRuntime = require("theme-ui/jsx-runtime");
|
|
9
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
10
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
11
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
12
1
|
/** @jsxImportSource theme-ui */
|
|
13
2
|
|
|
14
3
|
/**
|
|
15
4
|
* External dependencies
|
|
16
5
|
*/
|
|
6
|
+
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
7
|
+
import React from 'react';
|
|
8
|
+
import ScreenReaderText from '../ScreenReaderText';
|
|
17
9
|
|
|
18
10
|
/**
|
|
19
11
|
* Internal dependencies
|
|
20
12
|
*/
|
|
21
|
-
|
|
22
|
-
var DialogTitle =
|
|
13
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
14
|
+
export var DialogTitle = function DialogTitle(_ref) {
|
|
23
15
|
var title = _ref.title,
|
|
24
16
|
_ref$hidden = _ref.hidden,
|
|
25
17
|
hidden = _ref$hidden === void 0 ? false : _ref$hidden;
|
|
26
18
|
var titleNode = title;
|
|
27
19
|
if (hidden) {
|
|
28
|
-
titleNode = (
|
|
20
|
+
titleNode = _jsx(ScreenReaderText, {
|
|
29
21
|
children: titleNode
|
|
30
22
|
});
|
|
31
23
|
}
|
|
32
|
-
return (
|
|
24
|
+
return _jsx(DialogPrimitive.Title, {
|
|
33
25
|
sx: {
|
|
34
26
|
margin: 0,
|
|
35
27
|
fontSize: 3,
|
|
@@ -1,24 +1,19 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.NewDialog = void 0;
|
|
5
|
-
var DialogPrimitive = _interopRequireWildcard(require("@radix-ui/react-dialog"));
|
|
6
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
7
|
-
var _react = _interopRequireDefault(require("react"));
|
|
8
|
-
var _DialogClose = require("./DialogClose");
|
|
9
|
-
var _DialogDescription = require("./DialogDescription");
|
|
10
|
-
var _DialogOverlay = require("./DialogOverlay");
|
|
11
|
-
var _DialogTitle = require("./DialogTitle");
|
|
12
|
-
var _styles = require("./styles");
|
|
13
|
-
var _jsxRuntime = require("theme-ui/jsx-runtime");
|
|
14
1
|
var _excluded = ["trigger", "description", "title", "content", "showHeading", "disabled", "style", "contentProps", "className"];
|
|
15
|
-
/** @jsxImportSource theme-ui */
|
|
16
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
17
|
-
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
18
|
-
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
|
19
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
20
3
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
21
|
-
|
|
4
|
+
/** @jsxImportSource theme-ui */
|
|
5
|
+
|
|
6
|
+
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
7
|
+
import classNames from 'classnames';
|
|
8
|
+
import React from 'react';
|
|
9
|
+
import { DialogCloseDefault as DialogClose } from './DialogClose';
|
|
10
|
+
import { DialogDescription } from './DialogDescription';
|
|
11
|
+
import { DialogOverlay } from './DialogOverlay';
|
|
12
|
+
import { DialogTitle } from './DialogTitle';
|
|
13
|
+
import { contentStyles } from './styles';
|
|
14
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
15
|
+
import { jsxs as _jsxs } from "theme-ui/jsx-runtime";
|
|
16
|
+
export var NewDialog = function NewDialog(_ref) {
|
|
22
17
|
var _ref$trigger = _ref.trigger,
|
|
23
18
|
trigger = _ref$trigger === void 0 ? null : _ref$trigger,
|
|
24
19
|
description = _ref.description,
|
|
@@ -35,7 +30,7 @@ var NewDialog = exports.NewDialog = function NewDialog(_ref) {
|
|
|
35
30
|
_ref$className = _ref.className,
|
|
36
31
|
className = _ref$className === void 0 ? null : _ref$className,
|
|
37
32
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
38
|
-
var closeRef =
|
|
33
|
+
var closeRef = React.useRef(null);
|
|
39
34
|
if (disabled) {
|
|
40
35
|
return null;
|
|
41
36
|
}
|
|
@@ -46,24 +41,24 @@ var NewDialog = exports.NewDialog = function NewDialog(_ref) {
|
|
|
46
41
|
var _closeRef$current;
|
|
47
42
|
closeRef == null || (_closeRef$current = closeRef.current) == null || _closeRef$current.click();
|
|
48
43
|
};
|
|
49
|
-
return (
|
|
50
|
-
children: [trigger && (
|
|
44
|
+
return _jsxs(DialogPrimitive.Root, _extends({}, props, {
|
|
45
|
+
children: [trigger && _jsx(DialogPrimitive.Trigger, {
|
|
51
46
|
asChild: true,
|
|
52
47
|
children: trigger
|
|
53
|
-
}), (
|
|
54
|
-
children: [(
|
|
55
|
-
className: (
|
|
56
|
-
sx: _extends({},
|
|
48
|
+
}), _jsxs(DialogPrimitive.Portal, {
|
|
49
|
+
children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, _extends({
|
|
50
|
+
className: classNames('vip-dialog-component', className),
|
|
51
|
+
sx: _extends({}, contentStyles, extraStyles)
|
|
57
52
|
}, contentProps, {
|
|
58
|
-
children: [(
|
|
53
|
+
children: [_jsx(DialogClose, {
|
|
59
54
|
ref: closeRef
|
|
60
|
-
}), (
|
|
55
|
+
}), _jsx(DialogTitle, {
|
|
61
56
|
title: title,
|
|
62
57
|
hidden: !showHeading
|
|
63
|
-
}), (
|
|
58
|
+
}), _jsx(DialogDescription, {
|
|
64
59
|
description: description,
|
|
65
60
|
hidden: !showHeading
|
|
66
|
-
}), (
|
|
61
|
+
}), _jsx("div", {
|
|
67
62
|
role: "document",
|
|
68
63
|
children: isContentFunction ? content({
|
|
69
64
|
onClose: onClose
|
|
@@ -1,15 +1,11 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports["default"] = exports.Root = exports.CloseDefault = exports.Close = void 0;
|
|
5
|
-
var _DialogClose = require("./DialogClose");
|
|
6
|
-
var _NewDialog = require("./NewDialog");
|
|
7
|
-
exports.NewDialog = _NewDialog.NewDialog;
|
|
8
1
|
/**
|
|
9
2
|
* Internal dependencies
|
|
10
3
|
*/
|
|
11
4
|
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
var
|
|
15
|
-
var
|
|
5
|
+
import { DialogClose, DialogCloseDefault } from './DialogClose';
|
|
6
|
+
import { NewDialog } from './NewDialog';
|
|
7
|
+
var Root = NewDialog;
|
|
8
|
+
var Close = DialogClose;
|
|
9
|
+
var CloseDefault = DialogCloseDefault;
|
|
10
|
+
export { NewDialog, Root, Close, CloseDefault };
|
|
11
|
+
export default NewDialog;
|
|
@@ -1,10 +1,6 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.contentStyles = void 0;
|
|
5
1
|
/** @jsxImportSource theme-ui */
|
|
6
2
|
|
|
7
|
-
var contentStyles =
|
|
3
|
+
export var contentStyles = {
|
|
8
4
|
background: 'dialog',
|
|
9
5
|
variant: 'dialog.modal',
|
|
10
6
|
borderRadius: 2,
|
|
@@ -1,36 +1,32 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.Fieldset = void 0;
|
|
5
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
6
|
-
var _react = _interopRequireDefault(require("react"));
|
|
7
|
-
var _Input = require("../Form/Input.styles");
|
|
8
|
-
var _jsxRuntime = require("theme-ui/jsx-runtime");
|
|
9
1
|
var _excluded = ["children", "className", "sx"];
|
|
2
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
3
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
10
4
|
/** @jsxImportSource theme-ui */
|
|
5
|
+
|
|
11
6
|
/**
|
|
12
7
|
* External dependencies
|
|
13
8
|
*/
|
|
9
|
+
import classNames from 'classnames';
|
|
10
|
+
import React from 'react';
|
|
14
11
|
/**
|
|
15
12
|
* Internal dependencies
|
|
16
13
|
*/
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var Fieldset = exports.Fieldset = /*#__PURE__*/_react["default"].forwardRef(function (_ref, forwardRef) {
|
|
14
|
+
import { baseControlBorderStyle, inputBaseBackground, inputBaseText } from '../Form/Input.styles';
|
|
15
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
16
|
+
export var Fieldset = /*#__PURE__*/React.forwardRef(function (_ref, forwardRef) {
|
|
21
17
|
var children = _ref.children,
|
|
22
18
|
className = _ref.className,
|
|
23
19
|
_ref$sx = _ref.sx,
|
|
24
20
|
sx = _ref$sx === void 0 ? {} : _ref$sx,
|
|
25
21
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
26
|
-
return (
|
|
22
|
+
return _jsx("fieldset", _extends({
|
|
27
23
|
ref: forwardRef,
|
|
28
|
-
className: (
|
|
24
|
+
className: classNames('vip-form-fieldset-component', className),
|
|
29
25
|
sx: _extends({
|
|
30
26
|
all: 'unset'
|
|
31
|
-
},
|
|
32
|
-
backgroundColor:
|
|
33
|
-
color:
|
|
27
|
+
}, baseControlBorderStyle, {
|
|
28
|
+
backgroundColor: inputBaseBackground,
|
|
29
|
+
color: inputBaseText,
|
|
34
30
|
borderRadius: 1,
|
|
35
31
|
display: 'block',
|
|
36
32
|
pt: 1,
|
|
@@ -1,24 +1,19 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.Form = void 0;
|
|
5
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
6
|
-
var _react = _interopRequireDefault(require("react"));
|
|
7
|
-
var _jsxRuntime = require("theme-ui/jsx-runtime");
|
|
8
1
|
var _excluded = ["children", "className"];
|
|
2
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
3
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
9
4
|
/**
|
|
10
5
|
* External dependencies
|
|
11
6
|
*/
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
var Form =
|
|
7
|
+
import classNames from 'classnames';
|
|
8
|
+
import React from 'react';
|
|
9
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
10
|
+
export var Form = /*#__PURE__*/React.forwardRef(function (_ref, forwardRef) {
|
|
16
11
|
var children = _ref.children,
|
|
17
12
|
className = _ref.className,
|
|
18
13
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
19
|
-
return (
|
|
14
|
+
return _jsx("form", _extends({
|
|
20
15
|
ref: forwardRef,
|
|
21
|
-
className: (
|
|
16
|
+
className: classNames('vip-form-component', className),
|
|
22
17
|
noValidate: true
|
|
23
18
|
}, props, {
|
|
24
19
|
children: children
|
|
@@ -91,7 +91,7 @@ const searchIconStyles = {
|
|
|
91
91
|
},
|
|
92
92
|
};
|
|
93
93
|
|
|
94
|
-
const DefaultArrow = config => <FormSelectArrow
|
|
94
|
+
const DefaultArrow = config => <FormSelectArrow className={ config.className } />;
|
|
95
95
|
|
|
96
96
|
const FormAutocomplete = React.forwardRef(
|
|
97
97
|
(
|
|
@@ -368,7 +368,7 @@ FormAutocomplete.propTypes = {
|
|
|
368
368
|
getOptionValue: PropTypes.func,
|
|
369
369
|
hasError: PropTypes.bool,
|
|
370
370
|
isInline: PropTypes.bool,
|
|
371
|
-
label: PropTypes.
|
|
371
|
+
label: PropTypes.node,
|
|
372
372
|
loading: PropTypes.bool,
|
|
373
373
|
minLength: PropTypes.number,
|
|
374
374
|
noOptionsMessage: PropTypes.func,
|
|
@@ -1,34 +1,30 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
exports.__esModule = true;
|
|
4
|
-
exports.Legend = void 0;
|
|
5
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
6
|
-
var _react = _interopRequireDefault(require("react"));
|
|
7
|
-
var _Label = require("../Form/Label");
|
|
8
|
-
var _jsxRuntime = require("theme-ui/jsx-runtime");
|
|
9
1
|
var _excluded = ["children", "className", "sx"];
|
|
2
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
3
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
10
4
|
/** @jsxImportSource theme-ui */
|
|
5
|
+
|
|
11
6
|
/**
|
|
12
7
|
* External dependencies
|
|
13
8
|
*/
|
|
9
|
+
import classNames from 'classnames';
|
|
10
|
+
import React from 'react';
|
|
14
11
|
/**
|
|
15
12
|
* Internal dependencies
|
|
16
13
|
*/
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var Legend = exports.Legend = /*#__PURE__*/_react["default"].forwardRef(function (_ref, forwardRef) {
|
|
14
|
+
import { baseLabelStyle } from '../Form/Label';
|
|
15
|
+
import { jsx as _jsx } from "theme-ui/jsx-runtime";
|
|
16
|
+
export var Legend = /*#__PURE__*/React.forwardRef(function (_ref, forwardRef) {
|
|
21
17
|
var children = _ref.children,
|
|
22
18
|
className = _ref.className,
|
|
23
19
|
_ref$sx = _ref.sx,
|
|
24
20
|
sx = _ref$sx === void 0 ? {} : _ref$sx,
|
|
25
21
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
26
|
-
return (
|
|
22
|
+
return _jsx("legend", _extends({
|
|
27
23
|
ref: forwardRef,
|
|
28
|
-
className: (
|
|
24
|
+
className: classNames('vip-form-legend-component', className),
|
|
29
25
|
sx: _extends({
|
|
30
26
|
all: 'unset'
|
|
31
|
-
},
|
|
27
|
+
}, baseLabelStyle, {
|
|
32
28
|
px: 1,
|
|
33
29
|
mb: 0
|
|
34
30
|
}, sx)
|