@canonical/react-components 1.2.5 → 1.3.1

package/dist-esm/index.js

@@ -0,0 +1,69 @@
+export { default as Accordion } from "./components/Accordion";
+export { default as ActionButton } from "./components/ActionButton";
+export { default as ArticlePagination } from "./components/ArticlePagination";
+export { default as ApplicationLayout } from "./components/ApplicationLayout";
+export { default as AppAside } from "./components/ApplicationLayout/AppAside";
+export { default as Application } from "./components/ApplicationLayout/Application";
+export { default as AppMain } from "./components/ApplicationLayout/AppMain";
+export { default as AppNavigation } from "./components/ApplicationLayout/AppNavigation";
+export { default as AppNavigationBar } from "./components/ApplicationLayout/AppNavigationBar";
+export { default as AppStatus } from "./components/ApplicationLayout/AppStatus";
+export { default as Badge } from "./components/Badge";
+export { default as Button, ButtonAppearance } from "./components/Button";
+export { default as Card } from "./components/Card";
+export { default as CheckboxInput } from "./components/CheckboxInput";
+export { default as Chip } from "./components/Chip";
+export { default as Code } from "./components/Code";
+export { default as CodeSnippet, CodeSnippetBlockAppearance } from "./components/CodeSnippet";
+export { default as Col } from "./components/Col";
+export { default as ConfirmationButton } from "./components/ConfirmationButton";
+export { default as ConfirmationModal } from "./components/ConfirmationModal";
+export { default as ContextualMenu } from "./components/ContextualMenu";
+export { default as EmptyState } from "./components/EmptyState";
+export { default as Field } from "./components/Field";
+export { default as Form } from "./components/Form";
+export { default as FormikField } from "./components/FormikField";
+export { default as Icon, ICONS } from "./components/Icon";
+export { default as Input } from "./components/Input";
+export { default as Label } from "./components/Label";
+export { default as Link } from "./components/Link";
+export { default as List } from "./components/List";
+export { default as Loader } from "./components/Loader";
+export { default as MainTable } from "./components/MainTable";
+export { default as ModularTable } from "./components/ModularTable";
+export { default as Navigation } from "./components/Navigation";
+export { default as Modal } from "./components/Modal";
+export * from "./components/MultiSelect";
+export { default as Notification, NotificationSeverity } from "./components/Notification";
+export { NotificationConsumer, NotificationProvider, useNotify, info, success, failure, queue } from "./components/NotificationProvider";
+export { default as LoginPageLayout } from "./components/LoginPageLayout";
+export { default as Pagination } from "./components/Pagination";
+export { default as Panel } from "./components/Panel";
+export { default as PasswordToggle } from "./components/PasswordToggle";
+export { default as RadioInput } from "./components/RadioInput";
+export { default as Row } from "./components/Row";
+export { default as SearchAndFilter } from "./components/SearchAndFilter";
+export { default as SearchBox } from "./components/SearchBox";
+export { default as Select } from "./components/Select";
+export { default as SideNavigation } from "./components/SideNavigation";
+export { default as SideNavigationItem } from "./components/SideNavigation/SideNavigationItem";
+export { default as SideNavigationLink } from "./components/SideNavigation/SideNavigationLink";
+export { default as SideNavigationText } from "./components/SideNavigation/SideNavigationText";
+export { default as Slider } from "./components/Slider";
+export { default as Switch } from "./components/Switch";
+export { default as Spinner } from "./components/Spinner";
+export { default as StatusLabel, StatusLabelAppearance } from "./components/StatusLabel";
+export { default as Strip } from "./components/Strip";
+export { default as SummaryButton } from "./components/SummaryButton";
+export { default as Table } from "./components/Table";
+export { default as TableCell } from "./components/TableCell";
+export { default as TableHeader } from "./components/TableHeader";
+export { default as TableRow } from "./components/TableRow";
+export { default as Tabs } from "./components/Tabs";
+export { default as Textarea } from "./components/Textarea";
+export { default as Tooltip } from "./components/Tooltip";
+export { default as TablePagination } from "./components/TablePagination";
+export { default as TablePaginationControls } from "./components/TablePagination/TablePaginationControls";
+export { useOnClickOutside, useClickOutside, useId, useListener, useOnEscapePressed, usePagination, usePrevious, useThrottle, useWindowFitment } from "./hooks";
+export { isNavigationAnchor, isNavigationButton } from "./utils";
+export { Theme } from "./enums";

package/dist-esm/types/index.js

@@ -0,0 +1 @@
+export {};

package/dist-esm/types/react-table-config.d.js

@@ -0,0 +1 @@
+export {};

package/dist-esm/utils.js

@@ -0,0 +1,41 @@
+import { isValidElement } from "react";
+export var IS_DEV = process.env.NODE_ENV === "development";
+
+/**
+ * Find substring and wrap in <strong /> tag
+ * @param {string} str - The string to search
+ * @param {string} subString - The substring to find
+ * @return {Obj} newStr - Object with text and match bool
+ */
+export var highlightSubString = (str, subString) => {
+  if (typeof str !== "string" || typeof subString !== "string") {
+    return {
+      text: str || "",
+      match: false
+    };
+  }
+  var escapedSubstring = subString.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+  var caseInsensitiveRegex = new RegExp(escapedSubstring, "gi");
+  var newStr = str.replace(caseInsensitiveRegex, match => "<strong>".concat(match, "</strong>"));
+  return {
+    text: subString === "" ? str : newStr,
+    match: newStr !== str
+  };
+};
+
+/**
+ * Whether a navigation item is an anchor.
+ * @param link - The navigation item.
+ */
+export var isNavigationAnchor = link => !!link.url;
+
+/**
+ * Whether a navigation item is a button.
+ * @param link - The navigation item.
+ */
+export var isNavigationButton = link => !link.url;
+
+/**
+ * A typeguard for whether an element is a ReactNode.
+ */
+export var isReactNode = element => /*#__PURE__*/isValidElement(element);

package/package.json

@@ -1,8 +1,9 @@
 {
   "name": "@canonical/react-components",
-  "version": "1.2.5",
+  "version": "1.3.1",
   "main": "dist/index.js",
-  "module": "dist/index.js",
+  "module": "dist-esm/index.js",
+  "types": "dist-types/index.d.ts",
   "author": {
     "email": "webteam@canonical.com",
     "name": "Canonical Webteam"
@@ -12,6 +13,8 @@
     "dist/**/*.js",
     "dist/**/*.d.*",
     "dist/**/*.scss",
+    "dist-types/**/*.d.ts",
+    "dist-esm/**/*.js",
     "!dist/**/*.test.js",
     "!dist/testing",
     "!dist/setupTests.js"
@@ -126,10 +129,12 @@
     "vanilla-framework": "^3.15.1 || ^4.0.0"
   },
   "scripts": {
-    "build": "rm -rf dist && yarn build-local; yarn build-declaration",
-    "build-local": "NODE_ENV=production babel src --out-dir dist --copy-files --extensions '.js,.jsx,.ts,.tsx'",
-    "build-declaration": "tsc --project tsconfig.json && tsc-alias -p tsconfig.json",
-    "build-watch": "yarn run build-local --watch",
+    "build": "yarn build-cjs && yarn build-declaration && yarn build-esm",
+    "build-base": "rm -rf $OUT_DIR && NODE_ENV=production BABEL_ENV=$BABEL_ENV babel src --out-dir $OUT_DIR --copy-files --no-copy-ignored --extensions '.js,.jsx,.ts,.tsx,.snap' --ignore '**/*.test.ts','**/*.test.tsx','**/*.stories.tsx','**/__snapshots__','src/setupTests.js','src/testing'",
+    "build-cjs": "OUT_DIR=dist BABEL_ENV=cjs yarn run build-base",
+    "build-esm": "OUT_DIR=dist-esm BABEL_ENV=esm yarn run build-base",
+    "build-declaration": "rm -rf dist-types && tsc --project tsconfig.build.json --outDir dist-types && tsc-alias -p tsconfig.build.json --outDir dist-types",
+    "build-watch": "yarn run build-cjs --watch",
     "build-docs": "storybook build -c .storybook -o docs",
     "clean": "rm -rf node_modules dist .out",
     "docs": "storybook dev -p ${PORT:-9009} --no-open",

package/dist/components/Accordion/Accordion.stories.d.ts

@@ -1,18 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import Accordion from "./Accordion";
-declare const meta: Meta<typeof Accordion>;
-export default meta;
-type Story = StoryObj<typeof Accordion>;
-export declare const Default: Story;
-/**
- * The expanded accordion section can be controlled by external state.
- */
-export declare const ExternalState: Story;
-/**
- * `titleElement` prop can be used to define heading element for section titles.
- */
-export declare const Headings: Story;
-/**
- * The `title` prop can be a `ReactNode`, allowing a higher degree of customisation of the section titles.
- */
-export declare const CustomHeadings: Story;

package/dist/components/Accordion/Accordion.stories.js

@@ -1,117 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Headings = exports.ExternalState = exports.Default = exports.CustomHeadings = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _Accordion = _interopRequireDefault(require("./Accordion"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-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 && {}.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; }
-const meta = {
-  component: _Accordion.default,
-  tags: ["autodocs"],
-  argTypes: {
-    sections: {
-      control: {
-        disable: true
-      }
-    },
-    externallyControlled: {
-      control: {
-        disable: true
-      }
-    }
-  }
-};
-var _default = exports.default = meta;
-const Default = exports.Default = {
-  name: "Default",
-  args: {
-    sections: [{
-      title: "Advanced topics",
-      content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Charm bundles"), /*#__PURE__*/_react.default.createElement("p", null, "Machine authentication"), /*#__PURE__*/_react.default.createElement("p", null, "Migrating models"), /*#__PURE__*/_react.default.createElement("p", null, "Using storage"), /*#__PURE__*/_react.default.createElement("p", null, "Working with actions"), /*#__PURE__*/_react.default.createElement("p", null, "Working with resources"), /*#__PURE__*/_react.default.createElement("p", null, "Cloud image metadata"), /*#__PURE__*/_react.default.createElement("p", null, "Tools"))
-    }, {
-      title: "Networking",
-      content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Working offline"), /*#__PURE__*/_react.default.createElement("p", null, "Fan container networking"), /*#__PURE__*/_react.default.createElement("p", null, "Network spaces"))
-    }, {
-      title: "Miscellaneous",
-      content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Juju GUI"), /*#__PURE__*/_react.default.createElement("p", null, "CentOS support"), /*#__PURE__*/_react.default.createElement("p", null, "Collecting Juju metrics"))
-    }]
-  }
-};
-
-/**
- * The expanded accordion section can be controlled by external state.
- */
-const ExternalState = exports.ExternalState = {
-  render: () => {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    const [expandedSection, setExpandedSection] = (0, _react.useState)();
-    return /*#__PURE__*/_react.default.createElement(_Accordion.default, {
-      expanded: expandedSection,
-      externallyControlled: true,
-      onExpandedChange: setExpandedSection,
-      sections: [{
-        title: "Advanced topics",
-        key: "advanced-topics",
-        content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Charm bundles"), /*#__PURE__*/_react.default.createElement("p", null, "Machine authentication"), /*#__PURE__*/_react.default.createElement("p", null, "Migrating models"), /*#__PURE__*/_react.default.createElement("p", null, "Using storage"), /*#__PURE__*/_react.default.createElement("p", null, "Working with actions"), /*#__PURE__*/_react.default.createElement("p", null, "Working with resources"), /*#__PURE__*/_react.default.createElement("p", null, "Cloud image metadata"), /*#__PURE__*/_react.default.createElement("p", null, "Tools"))
-      }, {
-        title: "Networking",
-        key: "networking",
-        content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Working offline"), /*#__PURE__*/_react.default.createElement("p", null, "Fan container networking"), /*#__PURE__*/_react.default.createElement("p", null, "Network spaces"))
-      }, {
-        title: "Miscellaneous",
-        key: "miscellaneous",
-        content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Juju GUI"), /*#__PURE__*/_react.default.createElement("p", null, "CentOS support"), /*#__PURE__*/_react.default.createElement("p", null, "Collecting Juju metrics"))
-      }]
-    });
-  },
-  name: "External state"
-};
-
-/**
- * `titleElement` prop can be used to define heading element for section titles.
- */
-const Headings = exports.Headings = {
-  name: "Headings",
-  args: {
-    sections: [{
-      title: "Advanced topics",
-      content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Charm bundles"), /*#__PURE__*/_react.default.createElement("p", null, "Machine authentication"), /*#__PURE__*/_react.default.createElement("p", null, "Migrating models"), /*#__PURE__*/_react.default.createElement("p", null, "Using storage"), /*#__PURE__*/_react.default.createElement("p", null, "Working with actions"), /*#__PURE__*/_react.default.createElement("p", null, "Working with resources"), /*#__PURE__*/_react.default.createElement("p", null, "Cloud image metadata"), /*#__PURE__*/_react.default.createElement("p", null, "Tools"))
-    }, {
-      title: "Networking",
-      content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Working offline"), /*#__PURE__*/_react.default.createElement("p", null, "Fan container networking"), /*#__PURE__*/_react.default.createElement("p", null, "Network spaces"))
-    }, {
-      title: "Miscellaneous",
-      content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Juju GUI"), /*#__PURE__*/_react.default.createElement("p", null, "CentOS support"), /*#__PURE__*/_react.default.createElement("p", null, "Collecting Juju metrics"))
-    }],
-    titleElement: "h3"
-  }
-};
-
-/**
- * The `title` prop can be a `ReactNode`, allowing a higher degree of customisation of the section titles.
- */
-const CustomHeadings = exports.CustomHeadings = {
-  args: {
-    sections: [{
-      title: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Advanced topics", " ", /*#__PURE__*/_react.default.createElement("span", {
-        className: "u-text--muted p-text--small"
-      }, "optional")),
-      content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Charm bundles"), /*#__PURE__*/_react.default.createElement("p", null, "Machine authentication"), /*#__PURE__*/_react.default.createElement("p", null, "Migrating models"), /*#__PURE__*/_react.default.createElement("p", null, "Using storage"), /*#__PURE__*/_react.default.createElement("p", null, "Working with actions"), /*#__PURE__*/_react.default.createElement("p", null, "Working with resources"), /*#__PURE__*/_react.default.createElement("p", null, "Cloud image metadata"), /*#__PURE__*/_react.default.createElement("p", null, "Tools"))
-    }, {
-      title: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Networking", " ", /*#__PURE__*/_react.default.createElement("span", {
-        className: "u-text--muted p-text--small"
-      }, "optional")),
-      content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Working offline"), /*#__PURE__*/_react.default.createElement("p", null, "Fan container networking"), /*#__PURE__*/_react.default.createElement("p", null, "Network spaces"))
-    }, {
-      title: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "Miscellaneous", " ", /*#__PURE__*/_react.default.createElement("span", {
-        className: "u-text--muted p-text--small"
-      }, "optional")),
-      content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", null, "Juju GUI"), /*#__PURE__*/_react.default.createElement("p", null, "CentOS support"), /*#__PURE__*/_react.default.createElement("p", null, "Collecting Juju metrics"))
-    }],
-    titleElement: "h3"
-  }
-};

package/dist/components/ActionButton/ActionButton.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import ActionButton from "./ActionButton";
-declare const meta: Meta<typeof ActionButton>;
-export default meta;
-type Story = StoryObj<typeof ActionButton>;
-export declare const Default: Story;
-export declare const Loading: Story;

package/dist/components/ActionButton/ActionButton.stories.js

@@ -1,36 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Loading = exports.Default = void 0;
-var _ActionButton = _interopRequireDefault(require("./ActionButton"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const meta = {
-  component: _ActionButton.default,
-  tags: ["autodocs"],
-  argTypes: {
-    children: {
-      control: {
-        type: "text"
-      }
-    }
-  }
-};
-var _default = exports.default = meta;
-const Default = exports.Default = {
-  name: "Default",
-  args: {
-    appearance: "positive",
-    children: "Click me!"
-  }
-};
-const Loading = exports.Loading = {
-  name: "Loading",
-  args: {
-    appearance: "positive",
-    loading: true,
-    disabled: true,
-    children: "Click me!"
-  }
-};

package/dist/components/ApplicationLayout/AppAside/AppAside.stories.d.ts

@@ -1,13 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import AppAside from "./AppAside";
-declare const meta: Meta<typeof AppAside>;
-export default meta;
-type Story = StoryObj<typeof AppAside>;
-/**
- * In most common cases an `AppAside` should contain a `<Panel>` to display the
- * content as intended in the application layout.
- *
- * `AppAside` should be a direct child of an `<Application>` or passed to the
- * application layout `<ApplicationLayout aside={<AppAside .../>}>`.
- */
-export declare const Default: Story;

package/dist/components/ApplicationLayout/AppAside/AppAside.stories.js

@@ -1,116 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _Application = _interopRequireDefault(require("../Application"));
-var _AppMain = _interopRequireDefault(require("../AppMain"));
-var _Button = _interopRequireDefault(require("../../Button"));
-var _Col = _interopRequireDefault(require("../../Col"));
-var _Form = _interopRequireDefault(require("../../Form"));
-var _Icon = _interopRequireDefault(require("../../Icon"));
-var _Input = _interopRequireDefault(require("../../Input"));
-var _Panel = _interopRequireDefault(require("../../Panel"));
-var _Row = _interopRequireDefault(require("../../Row"));
-var _AppAside = _interopRequireDefault(require("./AppAside"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-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 && {}.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; }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } /* eslint-disable react-hooks/rules-of-hooks */
-const meta = {
-  component: _AppAside.default,
-  tags: ["autodocs"],
-  argTypes: {
-    children: {
-      control: false
-    }
-  }
-};
-var _default = exports.default = meta;
-/**
- * In most common cases an `AppAside` should contain a `<Panel>` to display the
- * content as intended in the application layout.
- *
- * `AppAside` should be a direct child of an `<Application>` or passed to the
- * application layout `<ApplicationLayout aside={<AppAside .../>}>`.
- */
-const Default = exports.Default = {
-  render: args => {
-    const [pinned, setPinned] = (0, _react.useState)(false);
-    const [width, setWidth] = (0, _react.useState)(null);
-    const [collapsed, setCollapsed] = (0, _react.useState)(false);
-    return /*#__PURE__*/_react.default.createElement(_Application.default, null, /*#__PURE__*/_react.default.createElement(_AppMain.default, null, /*#__PURE__*/_react.default.createElement("p", null, "Scroll to the right to see the panel."), /*#__PURE__*/_react.default.createElement(_Button.default, {
-      onClick: () => setCollapsed(false)
-    }, "Open"), /*#__PURE__*/_react.default.createElement(_Button.default, {
-      onClick: () => setWidth("narrow")
-    }, "Narrow"), /*#__PURE__*/_react.default.createElement(_Button.default, {
-      onClick: () => setWidth(null)
-    }, "Default"), /*#__PURE__*/_react.default.createElement(_Button.default, {
-      onClick: () => setWidth("wide")
-    }, "Wide")), /*#__PURE__*/_react.default.createElement(_AppAside.default, _extends({}, args, {
-      pinned: pinned,
-      wide: width === "wide",
-      narrow: width === "narrow",
-      collapsed: collapsed
-    }), /*#__PURE__*/_react.default.createElement(_Panel.default, {
-      controls: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
-        onClick: () => setPinned(!pinned),
-        dense: true,
-        className: "u-no-margin--bottom"
-      }, "Pin"), /*#__PURE__*/_react.default.createElement(_Button.default, {
-        appearance: "base",
-        className: "u-no-margin--bottom",
-        hasIcon: true,
-        onClick: () => setCollapsed(!collapsed)
-      }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
-        name: "close"
-      }, "Close"))),
-      title: "App aside"
-    }, /*#__PURE__*/_react.default.createElement(_Form.default, {
-      stacked: true
-    }, /*#__PURE__*/_react.default.createElement(_Input.default, {
-      label: "Full name",
-      type: "text",
-      name: "fullName",
-      autoComplete: "name",
-      stacked: true
-    }), /*#__PURE__*/_react.default.createElement(_Input.default, {
-      label: "Username",
-      type: "text",
-      name: "username-stacked",
-      autoComplete: "username",
-      "aria-describedby": "exampleHelpTextMessage",
-      stacked: true,
-      help: "30 characters or fewer."
-    }), /*#__PURE__*/_react.default.createElement(_Input.default, {
-      type: "text",
-      label: "Email address",
-      "aria-invalid": "true",
-      name: "username-stackederror",
-      autoComplete: "email",
-      required: true,
-      error: "This field is required.",
-      stacked: true
-    }), /*#__PURE__*/_react.default.createElement(_Input.default, {
-      label: "Address line 1",
-      type: "text",
-      name: "address-optional-stacked",
-      autoComplete: "address-line1",
-      stacked: true
-    }), /*#__PURE__*/_react.default.createElement(_Input.default, {
-      label: "Address line 2",
-      type: "text",
-      name: "address-optional-stacked",
-      autoComplete: "address-line3",
-      stacked: true
-    }), /*#__PURE__*/_react.default.createElement(_Row.default, null, /*#__PURE__*/_react.default.createElement(_Col.default, {
-      size: 12
-    }, /*#__PURE__*/_react.default.createElement(_Button.default, {
-      appearance: "positive",
-      className: "u-float-right",
-      name: "add-details"
-    }, "Add details")))))));
-  }
-};

package/dist/components/ApplicationLayout/AppMain/AppMain.stories.d.ts

@@ -1,14 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import AppMain from "./AppMain";
-declare const meta: Meta<typeof AppMain>;
-export default meta;
-type Story = StoryObj<typeof AppMain>;
-/**
- * In most common cases an `AppMain` should contain a `<Panel>` to display the
- * content as intended in the application layout.
- *
- * `AppMain` should be a direct child of an `<Application>` or when using `ApplicationLayout`
- * it will automatically wrap the component's children.
- */
-export declare const Default: Story;
-export declare const Content: Story;

package/dist/components/ApplicationLayout/AppMain/AppMain.stories.js

@@ -1,45 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Default = exports.Content = void 0;
-var _Application = _interopRequireDefault(require("../Application"));
-var _Button = _interopRequireDefault(require("../../Button"));
-var _react = _interopRequireDefault(require("react"));
-var _Panel = _interopRequireDefault(require("../../Panel"));
-var _AppMain = _interopRequireDefault(require("./AppMain"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const meta = {
-  component: _AppMain.default,
-  tags: ["autodocs"]
-};
-var _default = exports.default = meta;
-/**
- * In most common cases an `AppMain` should contain a `<Panel>` to display the
- * content as intended in the application layout.
- *
- * `AppMain` should be a direct child of an `<Application>` or when using `ApplicationLayout`
- * it will automatically wrap the component's children.
- */
-const Default = exports.Default = {
-  args: {
-    children: "AppMain"
-  }
-};
-const Content = exports.Content = {
-  render: args => {
-    return /*#__PURE__*/_react.default.createElement(_Application.default, null, /*#__PURE__*/_react.default.createElement(_AppMain.default, args, /*#__PURE__*/_react.default.createElement(_Panel.default, {
-      controls: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
-        appearance: "positive",
-        onClick: () => {},
-        className: "u-no-margin--bottom"
-      }, "Add"), /*#__PURE__*/_react.default.createElement(_Button.default, {
-        appearance: "negative",
-        onClick: () => {},
-        className: "u-no-margin--bottom"
-      }, "Delete")),
-      title: "App main"
-    }, /*#__PURE__*/_react.default.createElement("p", null, "App main content."), /*#__PURE__*/_react.default.createElement("p", null, "Scroll to the right to see the controls."))));
-  }
-};

package/dist/components/ApplicationLayout/AppNavigation/AppNavigation.stories.d.ts

@@ -1,12 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import AppNavigation from "./AppNavigation";
-declare const meta: Meta<typeof AppNavigation>;
-export default meta;
-type Story = StoryObj<typeof AppNavigation>;
-/**
- * In most common cases an `AppNavigation` should contain a `<Panel>` and `<SideNavigation>`.
- *
- * `AppNavigation` should be a direct child of an `<Application>` or when using `ApplicationLayout`
- * it will wrap `navItems` and `sideNavigation`.
- */
-export declare const Default: Story;