@splunk/react-ui 4.24.0 → 4.25.0

package/Color.js

@@ -668,6 +668,8 @@
         palette: o().array,
         prepend: o().bool,
         /** @private */
+        required: o().bool,
+        /** @private */
         splunkTheme: o().object,
         value: o().string
     };
@@ -957,17 +959,17 @@
             key: "renderInput",
             value: function e(t) {
                 var a = t.textAppend, o = t.textPrepend, l = t.textInline, i = t.inDropdown;
-                var s = this.props.splunkTheme;
-                var u = this.state.displayValue;
-                var c = s.isPrisma;
-                var p = r.hasTransparent(this.props.palette) && g()(u) === "transparent";
-                var d = g()(u) === Fe;
-                var f = u;
-                if (!y()(u, "#")) {
-                    f = "#".concat(u);
+                var s = this.props, u = s.splunkTheme, c = s.required;
+                var p = this.state.displayValue;
+                var d = u.isPrisma;
+                var f = r.hasTransparent(this.props.palette) && g()(p) === "transparent";
+                var v = g()(p) === Fe;
+                var h = p;
+                if (!y()(p, "#")) {
+                    h = "#".concat(p);
                 }
-                f = p ? "transparent" : f;
-                f = d ? null : f;
+                h = f ? "transparent" : h;
+                h = v ? null : h;
                 
                 return n().createElement(Y, {
                     $inDropdown: i
@@ -977,17 +979,18 @@
                     autoCapitalize: "off",
                     autoComplete: "off",
                     autoCorrect: "off",
-                    spellCheck: false,
                     "aria-label": (0, _._)("Hexadecimal color value"),
-                    prepend: o,
                     inline: l,
+                    prepend: o,
                     onKeyDown: this.handleTextKeyDown,
                     onChange: this.handleTextChange,
-                    value: u
-                }), !c &&  n().createElement(J, {
+                    required: c,
+                    spellCheck: false,
+                    value: p
+                }), !d &&  n().createElement(J, {
                     "data-test": "textbox-swatch",
                     onClick: this.handleButtonClick,
-                    value: f,
+                    value: h,
                     tabIndex: -1,
                     style: {
                         marginLeft: "1px"

package/JSONTree.js

@@ -419,7 +419,7 @@
                 var t = this;
                 var o = r.withTooltip;
                 var a = this.state.open ? "[-]" : "[+]";
-                var i = this.state.open ? (0, K._)("Shift click to collapse all") : (0, K._)("Shift click to expand all");
+                var i = this.state.open ? (0, K._)("Collapse all") : (0, K._)("Shift click to expand all");
                 var l =  n().createElement(D, {
                     onClick: function e(r) {
                         t.handleExpandClick(r);

package/Modal.js

@@ -86,9 +86,9 @@
     var d =  e.n(f);
     // CONCATENATED MODULE: external "@splunk/react-ui/ModalLayer"
     const y = require("@splunk/react-ui/ModalLayer");
-    var m =  e.n(y);
+    var b =  e.n(y);
     // CONCATENATED MODULE: external "@splunk/ui-utils/focus"
-    const b = require("@splunk/ui-utils/focus");
+    const m = require("@splunk/ui-utils/focus");
     // CONCATENATED MODULE: external "@splunk/ui-utils/id"
     const v = require("@splunk/ui-utils/id");
     // CONCATENATED MODULE: external "@splunk/react-ui/ScrollContainerContext"
@@ -102,7 +102,7 @@
     // CONCATENATED MODULE: external "@splunk/themes"
     const w = require("@splunk/themes");
     // CONCATENATED MODULE: ./src/Modal/BodyStyles.ts
-    var k = x()(S()).withConfig({
+    var j = x()(S()).withConfig({
         displayName: "BodyStyles__StyledBox",
         componentId: "lv54z7-0"
     })([ "background-color:", ";", " flex:0 1 auto;overflow:auto;@media all and (-ms-high-contrast:none){*::-ms-backdrop,&{max-height:calc(100vh - 180px);}}" ], (0, 
@@ -120,8 +120,8 @@
         }
     }));
     // CONCATENATED MODULE: ./src/Modal/Body.tsx
-    function j() {
-        j = Object.assign || function(e) {
+    function k() {
+        k = Object.assign || function(e) {
             for (var t = 1; t < arguments.length; t++) {
                 var r = arguments[t];
                 for (var n in r) {
@@ -132,12 +132,12 @@
             }
             return e;
         };
-        return j.apply(this, arguments);
+        return k.apply(this, arguments);
     }
-    function C(e, t) {
-        return M(e) || E(e, t) || P(e, t) || I();
+    function I(e, t) {
+        return M(e) || E(e, t) || P(e, t) || C();
     }
-    function I() {
+    function C() {
         throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
     }
     function P(e, t) {
@@ -208,20 +208,20 @@
         }
         return r;
     }
-    var F = {
+    var D = {
         children: i().node
     };
     /**
  * A styled container for `Modal` body content.
- */    function D(e) {
+ */    function F(e) {
         var t = e.children, o = T(e, [ "children" ]);
         // @docs-props-type BodyPropsBase
-                var i = (0, r.useState)(), a = C(i, 2), l = a[0], c = a[1];
+                var i = (0, r.useState)(), a = I(i, 2), l = a[0], c = a[1];
         var s = (0, r.useCallback)((function(e) {
             c(e);
         }), []);
         
-        return n().createElement(k, j({
+        return n().createElement(j, k({
             "data-test": "body"
         }, o, {
             elementRef: s
@@ -229,8 +229,8 @@
             value: l
         }, t));
     }
-    D.propTypes = F;
-    /* harmony default export */    const R = D;
+    F.propTypes = D;
+    /* harmony default export */    const R = F;
     // CONCATENATED MODULE: external "@splunk/react-ui/Divider"
     const A = require("@splunk/react-ui/Divider");
     var B =  e.n(A);
@@ -353,10 +353,8 @@
     var Y = x().div.withConfig({
         displayName: "HeaderStyles__StyledIcon",
         componentId: "sc-1y722ut-2"
-    })([ "", ";align-items:center;justify-content:center;margin-right:", ";", " width:", ";height:", ";flex-shrink:0;" ], w.mixins.reset("inline-flex"), w.variables.spacingLarge, (0, 
+    })([ "", ";align-items:center;justify-content:center;margin-right:", ";background-color:", ";width:", ";height:", ";flex-shrink:0;" ], w.mixins.reset("inline-flex"), w.variables.spacingLarge, w.variables.transparent, (0, 
     w.pick)({
-        prisma: (0, g.css)([ "background-color:", ";" ], w.variables.transparent)
-    }), (0, w.pick)({
         comfortable: "40px",
         compact: "32px"
     }), (0, w.pick)({
@@ -366,19 +364,15 @@
     var Z = x().div.withConfig({
         displayName: "HeaderStyles__StyledTitle",
         componentId: "sc-1y722ut-3"
-    })([ "", ";font-size:20px;margin:0;overflow-wrap:break-word;font-weight:", ";", "" ], w.mixins.reset("block"), w.variables.fontWeightSemiBold, (0, 
+    })([ "", ";font-size:20px;margin:0;overflow-wrap:break-word;font-weight:", ";color:", ";", "" ], w.mixins.reset("block"), w.variables.fontWeightSemiBold, w.variables.contentColorActive, (0, 
     w.pick)({
         enterprise: (0, g.css)([ "line-height:22px;" ]),
-        prisma: (0, g.css)([ "color:", ";line-height:24px;" ], w.variables.contentColorActive)
+        prisma: (0, g.css)([ "line-height:24px;" ])
     }));
     var ee = x().div.withConfig({
         displayName: "HeaderStyles__StyledSubtitle",
         componentId: "sc-1y722ut-4"
-    })([ "", ";font-size:14px;overflow-wrap:break-word;line-height:", ";" ], w.mixins.reset("block"), (0, 
-    w.pick)({
-        enterprise: w.variables.lineHeight,
-        prisma: "20px"
-    }));
+    })([ "", ";font-size:14px;overflow-wrap:break-word;line-height:", ";" ], w.mixins.reset("block"), w.variables.lineHeight);
     var te = x().div.withConfig({
         displayName: "HeaderStyles__StyledButtonsWrapper",
         componentId: "sc-1y722ut-5"
@@ -459,8 +453,8 @@
  */    function le(e) {
         var t = e.children, o = e.icon, i = e.onRequestClose, a = e.subtitle, l = e.title, c = oe(e, [ "children", "icon", "onRequestClose", "subtitle", "title" ]);
         // @docs-props-type StepPropsBase
-                var s = (0, r.useContext)(z), u = s.titleId, p = s.divider;
-        var f = p === "both" || p === "header";
+                var s = (0, r.useContext)(z), u = s.titleId, p = s.subtitleId, f = s.divider;
+        var d = f === "both" || f === "header";
         
         return n().createElement(n().Fragment, null,  n().createElement(J, ne({
             $close: !!i,
@@ -469,11 +463,12 @@
             id: u,
             "data-test": "title"
         }, l), a &&  n().createElement(ee, {
+            id: p,
             "data-test": "subtitle"
         }, a)) : t, i &&  n().createElement(te, null, i &&  n().createElement(re, null,  n().createElement(G(), {
             onClick: i,
             "data-test": "close"
-        })))), f &&  n().createElement(B(), {
+        })))), d &&  n().createElement(B(), {
             "aria-hidden": true
         }));
     }
@@ -525,12 +520,12 @@
         return fe.apply(this, arguments);
     }
     function de(e) {
-        return ve(e) || be(e) || me(e) || ye();
+        return ve(e) || me(e) || be(e) || ye();
     }
     function ye() {
         throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
     }
-    function me(e, t) {
+    function be(e, t) {
         if (!e) return;
         if (typeof e === "string") return he(e, t);
         var r = Object.prototype.toString.call(e).slice(8, -1);
@@ -538,7 +533,7 @@
         if (r === "Map" || r === "Set") return Array.from(e);
         if (r === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)) return he(e, t);
     }
-    function be(e) {
+    function me(e) {
         if (typeof Symbol !== "undefined" && Symbol.iterator in Object(e)) return Array.from(e);
     }
     function ve(e) {
@@ -606,12 +601,12 @@
             Object.defineProperty(e, n.key, n);
         }
     }
-    function ke(e, t, r) {
+    function je(e, t, r) {
         if (t) we(e.prototype, t);
         if (r) we(e, r);
         return e;
     }
-    function je(e, t) {
+    function ke(e, t) {
         if (typeof t !== "function" && t !== null) {
             throw new TypeError("Super expression must either be null or a function");
         }
@@ -622,16 +617,16 @@
                 configurable: true
             }
         });
-        if (t) Ce(e, t);
+        if (t) Ie(e, t);
     }
-    function Ce(e, t) {
-        Ce = Object.setPrototypeOf || function e(t, r) {
+    function Ie(e, t) {
+        Ie = Object.setPrototypeOf || function e(t, r) {
             t.__proto__ = r;
             return t;
         };
-        return Ce(e, t);
+        return Ie(e, t);
     }
-    function Ie(e) {
+    function Ce(e) {
         var t = Ee();
         return function r() {
             var n = Me(e), o;
@@ -694,14 +689,14 @@
         onRequestClose: i().func,
         open: i().bool
     };
-    var Fe = {
+    var De = {
         divider: "both",
         initialFocus: "first",
         open: false
     };
-    var De =  function(e) {
-        je(o, e);
-        var t = Ie(o);
+    var Fe =  function(e) {
+        ke(o, e);
+        var t = Ce(o);
         // @docs-props-type ModalPropsBase
         // this timeout ensures that the Modal is finished rendering before setting the focus
                 function o(e) {
@@ -712,6 +707,7 @@
             Te(_e(i), "initialFocusTimeoutId", undefined);
             Te(_e(i), "initialFocus", null);
             Te(_e(i), "headerTitleId", void 0);
+            Te(_e(i), "headerSubtitleId", void 0);
             Te(_e(i), "getDefaultMotionStyle", (function() {
                 return {
                     top: 0
@@ -740,7 +736,7 @@
                                 if (i.el) {
                                     /* eslint-disable prefer-destructuring */
                                     /* prefer-desturucting leads to harder-to-read syntax in this case */
-                                    e = (0, b.getSortedTabbableElements)(i.el)[0];
+                                    e = (0, m.getSortedTabbableElements)(i.el)[0];
                                     /* eslint-enable prefer-destructuring */                                }
                             } else if (t === "container") {
                                 e = i.el;
@@ -765,7 +761,7 @@
             }));
             Te(_e(i), "handleModalKeyDown", (function(e) {
                 if (i.el !== null) {
-                    (0, b.handleTab)(i.el, e.nativeEvent);
+                    (0, m.handleTab)(i.el, e.nativeEvent);
                 }
             }));
             Te(_e(i), "handleRequestClose", (function(e) {
@@ -774,10 +770,11 @@
                 (t = (r = i.props).onRequestClose) === null || t === void 0 ? void 0 : t.call(r, e);
             }));
             Te(_e(i), "getProviderValue", p()((function(e) {
-                var t = e.titleId, r = e.divider;
+                var t = e.titleId, r = e.subtitleId, n = e.divider;
                 return {
                     titleId: t,
-                    divider: r
+                    subtitleId: r,
+                    divider: n
                 };
             })));
             Te(_e(i), "getModalStyles", p()((function(e) {
@@ -803,18 +800,21 @@
                     tabIndex: -1,
                     onKeyDown: i.handleModalKeyDown,
                     role: "dialog",
-                    "aria-labelledby": i.headerTitleId
+                    "aria-labelledby": i.headerTitleId,
+                    "aria-describedby": i.headerSubtitleId
                 }, d()(i.props, [].concat(de(s()(o.propTypes)), [ "style" ]))),  n().createElement(z.Provider, {
                     value: i.getProviderValue({
                         titleId: i.headerTitleId,
+                        subtitleId: i.headerSubtitleId,
                         divider: l
                     })
                 }, f));
             }));
             i.headerTitleId = (0, v.createDOMID)("titleId");
+            i.headerSubtitleId = (0, v.createDOMID)("subtitleId");
             return i;
         }
-        ke(o, [ {
+        je(o, [ {
             key: "componentDidMount",
             value: function e() {
                 this.handleInitialFocus();
@@ -834,7 +834,7 @@
             key: "render",
             value: function e() {
                 
-                return n().createElement(m(), {
+                return n().createElement(b(), {
                     open: this.props.open,
                     getDefaultMotionStyle: this.getDefaultMotionStyle,
                     renderModal: this.renderModal,
@@ -845,12 +845,12 @@
         } ]);
         return o;
     }(r.Component);
-    Te(De, "propTypes", qe);
-    Te(De, "defaultProps", Fe);
-    Te(De, "Header", ce);
-    Te(De, "Body", R);
-    Te(De, "Footer", V);
-    /* harmony default export */    const Re = De;
+    Te(Fe, "propTypes", qe);
+    Te(Fe, "defaultProps", De);
+    Te(Fe, "Header", ce);
+    Te(Fe, "Body", R);
+    Te(Fe, "Footer", V);
+    /* harmony default export */    const Re = Fe;
     // CONCATENATED MODULE: ./src/Modal/index.ts
     module.exports = t;
     /******/})();

package/RadioList.js

@@ -303,7 +303,8 @@
             value: b.toString(),
             checked: O,
             onChange: C,
-            "data-test": "input"
+            "data-test": "input",
+            required: x.required
         }),  o().createElement(f, {
             htmlFor: k,
             "data-test": "label"
@@ -413,19 +414,19 @@
         return a;
     }
     var N = {
-        direction: t().oneOf([ "row", "column" ]),
         children: t().node,
         defaultValue: t().any,
+        describedBy: t().string,
+        direction: t().oneOf([ "row", "column" ]),
         disabled: t().bool,
         elementRef: t().oneOfType([ t().func, t().object ]),
         error: t().bool,
+        labelledBy: t().string,
         name: t().string,
         onChange: t().func,
         /** @private. */
         required: t().bool,
-        value: t().any,
-        labelledBy: t().string,
-        describedBy: t().string
+        value: t().any
     };
     function R(e) {
         var r = e.children, i = e.defaultValue, t = e.describedBy, n = e.direction, c = n === void 0 ? "column" : n, u = e.disabled, b = u === void 0 ? false : u, p = e.error, v = p === void 0 ? false : p, f = e.labelledBy, y = e.name, g = e.onChange, m = e.required, h = e.value, k = B(e, [ "children", "defaultValue", "describedBy", "direction", "disabled", "error", "labelledBy", "name", "onChange", "required", "value" ]);
@@ -459,11 +460,12 @@
         
         return o().createElement(d.Provider, {
             value: {
-                value: _,
-                name: E,
-                onChange: D,
+                disabled: b,
                 error: v,
-                disabled: b
+                onChange: D,
+                name: E,
+                required: m,
+                value: _
             }
         },  o().createElement(S, j({
             flex: true,
@@ -473,8 +475,7 @@
             "data-test-value": _
         }, l()(k, [ "aria-labelledby", "aria-describedby" ]), {
             "aria-labelledby": M ? "".concat(M, " ").concat(f) : f,
-            "aria-describedby": T ? "".concat(T, " ").concat(t) : t,
-            "aria-required": m
+            "aria-describedby": T ? "".concat(T, " ").concat(t) : t
         }), r));
     }
     R.propTypes = N;

package/cypress/README.md

@@ -0,0 +1,11 @@
+#TS Configuration
+
+Cypress' expect type clashes with Jest's: see https://docs.cypress.io/guides/tooling/typescript-support#Clashing-types-with-Jest.
+To get around this we use separate tsconfigs to check src files from Cypress tests (.spec.tsx) files, following [cypress' example](https://github.com/cypress-io/cypress-and-jest-typescript-example)
+
+There are some notable specifics in the cypress config that need to be maintained:
+* Cypress tests only need to be compiled but do not have public types, so this config sets `"noEmit": true,`
+* When types are specified they must be relative paths to the tsconfig, hence the `../node_modules`.
+* The inheritance method when using `extends` means that `include` and `exclude` entries need to be explicitly listed or repeated. This affects:
+    * Common types, jest and cypress types.
+    * `include` must be repeated in `cypress.tsconfig` so that `.spec` files are not excluded

package/cypress/support/commands.ts

@@ -1 +1,2 @@
 import '@testing-library/cypress/add-commands';
+import 'cypress-real-events';

package/cypress/support/component.ts

@@ -1,5 +1,4 @@
 import { mount } from 'cypress/react';
-import 'cypress-real-events';
 import { setGlobalConfig } from '@storybook/testing-react';
 import { configure } from '@testing-library/cypress';
 

package/cypress/tsconfig.cypress.json

@@ -0,0 +1,14 @@
+// Cypress tests (.spec.tsx files) need a separate config to avoid clashing types with jest, see README for more details
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "noEmit": true,
+    "types": [
+      "../../../node_modules/@testing-library/cypress",
+      "../../../node_modules/cypress",
+      "../../../node_modules/cypress-real-events"
+    ]
+  },
+  "include": ["../stubs-*.d.ts", "../src/**/tests/*.spec.tsx", "../src/**/tests/*.spec.ts"],
+  "exclude": ["../src/docs/*"]
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@splunk/react-ui",
-  "version": "4.24.0",
+  "version": "4.25.0",
   "description": "Library of React components that implement the Splunk design language",
   "license": "Apache-2.0",
   "author": "Splunk Inc.",
@@ -29,7 +29,8 @@
     "test:watch": "jest --watch",
     "test:cypress": "yarn cypress open --component",
     "test:cypress:ci": "yarn cypress run --component",
-    "types:build": "tsc --emitDeclarationOnly --declaration --declarationDir ./types && node ./scripts/pruneTypes.js",
+    "types:build": "yarn types:build:cypress && tsc --emitDeclarationOnly --declaration --declarationDir ./types && node ./scripts/pruneTypes.js",
+    "types:build:cypress": "tsc --p cypress/tsconfig.cypress.json",
     "types:start": "yarn types:build --watch"
   },
   "peerDependencies": {
@@ -44,13 +45,6 @@
     "@splunk/react-icons": "^4.2.0",
     "@splunk/themes": "^0.16.4",
     "@splunk/ui-utils": "^1.6.0",
-    "@types/commonmark": "^0.27.6",
-    "@types/lodash": "^4.14.156",
-    "@types/react": "^16.9.38",
-    "@types/react-dom": "^16.9.8",
-    "@types/react-resize-detector": "^3.1.1",
-    "@types/styled-components": "^5.1.0",
-    "@types/tinycolor2": "^1.4.2",
     "commonmark": "^0.30.0",
     "commonmark-react-renderer": "^4.3.2",
     "decimal.js-light": "^2.2.3",
@@ -86,11 +80,17 @@
     "@testing-library/react": "^12.1.2",
     "@testing-library/react-hooks": "^7.0.2",
     "@testing-library/user-event": "^14.4.3",
+    "@types/commonmark": "^0.27.6",
     "@types/jest": "^26.0.0",
-    "@types/mocha": "^7.0.2",
+    "@types/lodash": "^4.14.156",
     "@types/node": "^10.17.26",
-    "@types/prismjs": "^1.16.1",
+    "@types/prismjs": "^1.26.3",
+    "@types/react": "^16.9.38",
+    "@types/react-dom": "^16.9.8",
+    "@types/react-resize-detector": "^3.1.1",
     "@types/sinon": "^4.3.3",
+    "@types/styled-components": "^5.1.0",
+    "@types/tinycolor2": "^1.4.2",
     "@types/webdriverio": "^5.0.0",
     "@types/webpack-env": "^1.15.2",
     "@typescript-eslint/eslint-plugin": "^4.8.2",
@@ -126,7 +126,7 @@
     "jest-stare": "^2.4.1",
     "mkdirp": "^0.5.1",
     "playwright": "^1.23.3",
-    "prismjs": "^1.25.0",
+    "prismjs": "^1.29.0",
     "prompt": "^1.0.0",
     "raw-loader": "^4.0.2",
     "react": "^16.12.0",

package/types/src/Button/Button.d.ts

@@ -21,8 +21,10 @@ interface ButtonPropsBase {
     children?: React.ReactNode;
     /** @private An additional className to add to the button. */
     classNamePrivate?: string;
-    /** Prevents user from clicking the button. */
-    disabled?: boolean;
+    /** Prevents user from clicking the button. If set to `dimmed`, the button
+     * does not respond to mouse events but can still receive focus, and
+     * `aria-disabled` is set to `true`. */
+    disabled?: boolean | 'dimmed';
     /**
      * A React ref which is set to the DOM element when the component mounts and null when it unmounts.
      */

package/types/src/Button/docs/examples/Block.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function Block(): JSX.Element;
+export default Block;

package/types/src/Button/docs/examples/Dimmed.d.ts

@@ -0,0 +1,2 @@
+declare function Dimmed(): JSX.Element;
+export default Dimmed;

package/types/src/Button/docs/examples/Disabled.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function Disabled(): JSX.Element;
+export default Disabled;

package/types/src/Button/docs/examples/Icons.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function Icons(): JSX.Element;
+export default Icons;

package/types/src/Button/docs/examples/Menus.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function Menus(): JSX.Element;
+export default Menus;

package/types/src/Button/docs/examples/To.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function To(): JSX.Element;
+export default To;

package/types/src/Button/docs/examples/Truncated.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function Truncated(): JSX.Element;
+export default Truncated;

package/types/src/Button/docs/examples/prisma/Basic.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function Basic(): JSX.Element;
+export default Basic;

package/types/src/Button/docs/examples/prisma/Block.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function Block(): JSX.Element;
+export default Block;

package/types/src/Button/docs/examples/prisma/Dimmed.d.ts

@@ -0,0 +1,2 @@
+declare function Dimmed(): JSX.Element;
+export default Dimmed;

package/types/src/Button/docs/examples/prisma/Disabled.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function Disabled(): JSX.Element;
+export default Disabled;

package/types/src/Button/docs/examples/prisma/Menus.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function Menus(): JSX.Element;
+export default Menus;

package/types/src/Button/docs/examples/prisma/To.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function To(): JSX.Element;
+export default To;

package/types/src/Button/docs/examples/prisma/Truncated.d.ts

@@ -1,2 +1,2 @@
-declare function Buttons(): JSX.Element;
-export default Buttons;
+declare function Truncated(): JSX.Element;
+export default Truncated;

package/types/src/ButtonSimple/ButtonSimple.d.ts

@@ -14,8 +14,10 @@ interface ButtonSimplePropsBase {
      * append things to it. */
     append?: boolean;
     children?: React.ReactNode;
-    /** Add a disabled attribute and prevent clicking. */
-    disabled?: boolean;
+    /** Add a disabled attribute and prevent clicking. If set to `dimmed`,
+     * the button does not respond to mouse events but can still receive
+     * focus, and `aria-disabled` is set to `true`. */
+    disabled?: boolean | 'dimmed';
     /**
      * Adds error styling to the button and applies `aria-invalid`.
      */