@canonical/react-components 1.2.5 → 1.3.1

package/dist/components/Button/Button.stories.js

@@ -1,180 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Small = exports.PositiveDisabled = exports.Positive = exports.NegativeDisabled = exports.Negative = exports.LinkDisabled = exports.Link = exports.Inline = exports.IconWithTooltip = exports.IconText = exports.Icon = exports.Dense = exports.DefaultDisabled = exports.Default = exports.BrandDisabled = exports.Brand = exports.BaseDisabled = exports.Base = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Tooltip = _interopRequireDefault(require("../Tooltip"));
-var _Button = _interopRequireWildcard(require("./Button"));
-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 _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const meta = {
-  component: _Button.default,
-  tags: ["autodocs"],
-  argTypes: {
-    children: {
-      control: {
-        type: "text"
-      }
-    },
-    appearance: {
-      control: {
-        options: _Button.ButtonAppearance,
-        type: "select"
-      }
-    }
-  },
-  args: {
-    children: "Click me!",
-    appearance: _Button.ButtonAppearance.DEFAULT
-  }
-};
-var _default = exports.default = meta;
-const Default = exports.Default = {
-  name: "Default",
-  args: {
-    children: "Button"
-  }
-};
-const DefaultDisabled = exports.DefaultDisabled = {
-  name: "Default disabled",
-  args: {
-    children: "Button",
-    disabled: true
-  }
-};
-const Base = exports.Base = {
-  name: "Base",
-  args: {
-    children: "Base button",
-    appearance: "base"
-  }
-};
-const BaseDisabled = exports.BaseDisabled = {
-  name: "Base disabled",
-  args: {
-    children: "Base button disabled",
-    appearance: "base",
-    disabled: true
-  }
-};
-const Link = exports.Link = {
-  name: "Link",
-  args: {
-    children: "Link button",
-    appearance: "base",
-    element: "a",
-    href: "#test"
-  }
-};
-const LinkDisabled = exports.LinkDisabled = {
-  name: "Link disabled",
-  args: {
-    children: "Link button disabled",
-    appearance: "base",
-    element: "a",
-    href: "#test",
-    disabled: true
-  }
-};
-const Positive = exports.Positive = {
-  name: "Positive",
-  args: {
-    children: "Positive button",
-    appearance: "positive"
-  }
-};
-const PositiveDisabled = exports.PositiveDisabled = {
-  name: "Positive disabled",
-  args: {
-    children: "Positive button disabled",
-    appearance: "positive",
-    disabled: true
-  }
-};
-const Negative = exports.Negative = {
-  name: "Negative",
-  args: {
-    children: "Negative button",
-    appearance: "negative"
-  }
-};
-const NegativeDisabled = exports.NegativeDisabled = {
-  name: "Negative disabled",
-  args: {
-    children: "Negative button disabled",
-    appearance: "negative",
-    disabled: true
-  }
-};
-const Brand = exports.Brand = {
-  name: "Brand",
-  args: {
-    children: "Brand button",
-    appearance: "brand"
-  }
-};
-const BrandDisabled = exports.BrandDisabled = {
-  name: "Brand disabled",
-  args: {
-    children: "Brand button disabled",
-    appearance: "brand",
-    disabled: true
-  }
-};
-const Inline = exports.Inline = {
-  render: () => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", null, "Everything you need to get started with Vanilla."), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    appearance: "neutral",
-    inline: true
-  }, "Inline button")),
-  name: "Inline"
-};
-const Dense = exports.Dense = {
-  render: () => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", null, "Everything you need to get started with Vanilla."), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    dense: true
-  }, "Dense button")),
-  name: "Dense"
-};
-const Small = exports.Small = {
-  render: () => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    small: true
-  }, "Small button"), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    small: true,
-    dense: true
-  }, "Small dense button")),
-  name: "Small"
-};
-const Icon = exports.Icon = {
-  name: "Icon",
-  args: {
-    children: /*#__PURE__*/_react.default.createElement("i", {
-      className: "p-icon--plus"
-    }),
-    hasIcon: true
-  }
-};
-const IconText = exports.IconText = {
-  name: "Icon & text",
-  args: {
-    children: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("i", {
-      className: "p-icon--plus"
-    }), " ", /*#__PURE__*/_react.default.createElement("span", null, "Button with icon & text")),
-    hasIcon: true
-  }
-};
-const IconWithTooltip = exports.IconWithTooltip = {
-  name: "Disabled with tooltip",
-  args: {
-    children: "Disabled button with a tooltip",
-    disabled: true
-  },
-  render: args => /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      paddingTop: "3rem"
-    }
-  }, /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
-    message: "This button is disabled"
-  }, /*#__PURE__*/_react.default.createElement(_Button.default, args)))
-};

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

@@ -1,33 +0,0 @@
-import React from "react";
-import type { Meta } from "@storybook/react";
-import Card from "./";
-declare const meta: Meta<typeof Card>;
-export default meta;
-export declare const Default: {
-    args: {
-        title: string;
-        children: string;
-    };
-};
-export declare const Header: {
-    args: {
-        title: string;
-        thumbnail: string;
-        children: string;
-    };
-};
-export declare const Highlighted: {
-    args: {
-        highlighted: boolean;
-        title: string;
-        children: string;
-    };
-};
-export declare const Overlay: {
-    args: {
-        title: string;
-        overlay: boolean;
-        children: string;
-    };
-    render: (args: any) => React.JSX.Element;
-};

package/dist/components/Card/Card.stories.js

@@ -1,51 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Overlay = exports.Highlighted = exports.Header = exports.Default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _ = _interopRequireDefault(require("./"));
-var _Col = _interopRequireDefault(require("../Col"));
-var _Row = _interopRequireDefault(require("../Row"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const meta = {
-  component: _.default,
-  tags: ["autodocs"]
-};
-var _default = exports.default = meta;
-const Default = exports.Default = {
-  args: {
-    title: "We'd love to have you join us as a partner.",
-    children: "If you are an independent software vendor or bundle author, it's easy to apply. You can find out more below."
-  }
-};
-const Header = exports.Header = {
-  args: {
-    title: "Raspberry Pi2 and Pi3",
-    thumbnail: "https://assets.ubuntu.com/v1/dca2e4c4-raspberry-logo.png",
-    children: "For fun, for education and for profit, the RPi makes device development personal and entertaining. With support for both the Pi2 and the new Pi3, Ubuntu Core supports the world’s most beloved board."
-  }
-};
-const Highlighted = exports.Highlighted = {
-  args: {
-    ...Default.args,
-    highlighted: true
-  }
-};
-const Overlay = exports.Overlay = {
-  args: {
-    title: "Web browsing",
-    overlay: true,
-    children: "Renowned for speed and security, Ubuntu and Firefox make browsing\nthe web a pleasure again. Ubuntu also includes Chrome, Opera and\nother browsers that can be installed from the Ubuntu Software\nCentre."
-  },
-  render: args => /*#__PURE__*/_react.default.createElement("section", {
-    className: "p-strip--image is-light",
-    style: {
-      backgroundImage: "url('https://assets.ubuntu.com/v1/0a98afcd-screenshot_desktop.jpg')"
-    }
-  }, /*#__PURE__*/_react.default.createElement(_Row.default, null, /*#__PURE__*/_react.default.createElement(_Col.default, {
-    size: 6,
-    emptyLarge: 7
-  }, /*#__PURE__*/_react.default.createElement(_.default, args))))
-};

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

@@ -1,11 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import CheckboxInput from "./CheckboxInput";
-declare const meta: Meta<typeof CheckboxInput>;
-export default meta;
-type Story = StoryObj<typeof CheckboxInput>;
-export declare const Default: Story;
-export declare const Children: Story;
-export declare const Disabled: Story;
-export declare const Required: Story;
-export declare const Inline: Story;
-export declare const Indeterminate: Story;

package/dist/components/CheckboxInput/CheckboxInput.stories.js

@@ -1,84 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.Required = exports.Inline = exports.Indeterminate = exports.Disabled = exports.Default = exports.Children = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _CheckboxInput = _interopRequireDefault(require("./CheckboxInput"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const meta = {
-  component: _CheckboxInput.default,
-  tags: ["autodocs"],
-  argTypes: {
-    label: {
-      control: {
-        type: "text"
-      }
-    },
-    disabled: {
-      control: {
-        type: "boolean"
-      }
-    },
-    required: {
-      control: {
-        type: "boolean"
-      }
-    },
-    inline: {
-      control: {
-        type: "boolean"
-      }
-    },
-    indeterminate: {
-      control: {
-        type: "boolean"
-      }
-    }
-  },
-  args: {
-    label: "CheckboxInput"
-  }
-};
-var _default = exports.default = meta;
-const Default = exports.Default = {
-  name: "Default"
-};
-const Children = exports.Children = {
-  render: () => /*#__PURE__*/_react.default.createElement(_CheckboxInput.default, {
-    label: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "I agree to", /*#__PURE__*/_react.default.createElement("a", {
-      href: "http://ubuntu.com/legal"
-    }, "Terms and Conditions")),
-    name: "CheckboxInput"
-  }),
-  name: "Label with child elements"
-};
-const Disabled = exports.Disabled = {
-  render: () => /*#__PURE__*/_react.default.createElement(_CheckboxInput.default, {
-    label: "Disabled",
-    disabled: true
-  }),
-  name: "Disabled"
-};
-const Required = exports.Required = {
-  render: () => /*#__PURE__*/_react.default.createElement(_CheckboxInput.default, {
-    label: "Required",
-    required: true
-  }),
-  name: "Required"
-};
-const Inline = exports.Inline = {
-  render: () => /*#__PURE__*/_react.default.createElement(_CheckboxInput.default, {
-    label: "Inline",
-    inline: true
-  }),
-  name: "Inline"
-};
-const Indeterminate = exports.Indeterminate = {
-  render: () => /*#__PURE__*/_react.default.createElement(_CheckboxInput.default, {
-    label: "Indeterminate",
-    indeterminate: true
-  }),
-  name: "Indeterminate"
-};

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

@@ -1,9 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import Chip from "./Chip";
-declare const meta: Meta<typeof Chip>;
-export default meta;
-type Story = StoryObj<typeof Chip>;
-export declare const Default: Story;
-export declare const LeadValue: Story;
-export declare const Appearance: Story;
-export declare const Dismissible: Story;

package/dist/components/Chip/Chip.stories.js

@@ -1,45 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.LeadValue = exports.Dismissible = exports.Default = exports.Appearance = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Chip = _interopRequireDefault(require("./Chip"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const meta = {
-  component: _Chip.default,
-  tags: ["autodocs"]
-};
-var _default = exports.default = meta;
-const Default = exports.Default = {
-  name: "Default",
-  args: {
-    value: "Default"
-  }
-};
-const LeadValue = exports.LeadValue = {
-  render: () => /*#__PURE__*/_react.default.createElement(_Chip.default, {
-    lead: "Owner",
-    value: "Bob"
-  }),
-  name: "Lead-value"
-};
-const Appearance = exports.Appearance = {
-  render: () => /*#__PURE__*/_react.default.createElement(_Chip.default, {
-    lead: "Type",
-    value: "Positive",
-    appearance: "positive"
-  }),
-  name: "Appearance"
-};
-const Dismissible = exports.Dismissible = {
-  render: () => /*#__PURE__*/_react.default.createElement(_Chip.default, {
-    lead: "Owner",
-    value: "Bob",
-    onDismiss: () => {
-      console.log("onDismiss called");
-    }
-  }),
-  name: "Dismissible"
-};

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

@@ -1,45 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import CodeSnippet from "./CodeSnippet";
-declare const meta: Meta<typeof CodeSnippet>;
-export default meta;
-type Story = StoryObj<typeof CodeSnippet>;
-export declare const Default: Story;
-/**
- * Use the `title` prop to add a title to a code block.
- */
-export declare const Title: Story;
-/**
- * Pass an array of `blocks` to render multiple code blocks (for example input and output) within a single code snippet.
- */
-export declare const MultipleBlocks: Story;
-/**
- * Use `appearance` to control the visual aspects of the code block. `"numbered"` appearance will add line numbers in the code blocks.
- * Values of `"linuxPrompt"`, `"windowsPrompt"`, `"url"` will add a relevant icon in the code block.
- */
-export declare const Appearance: Story;
-/**
- * Set `wrapLines` prop to `true` to enable line wrapping inside the code block.
- */
-export declare const WrapLines: Story;
-/**
- * Dropdown select menus can be added to the headers of code blocks to allow users to choose one of the options. The dropdowns options are passed via `dropdowns` property in the block options object.
- *
- * With the `options` being an array of option properties compatible with the `Select` options (`[{ label: string, value: string | number }]`).
- */
-export declare const Dropdown: Story;
-/**
- * Multiple dropdowns can be passed in if needed.
- */
-export declare const Dropdowns: Story;
-/**
- * If multiple dropdowns may overlap with long title you can use `stacked` variant, by setting the relevant property on code block options.
- */
-export declare const DropdownsStacked: Story;
-/**
- * Custom elements can be passed to a CodeBlock via the `content` prop. In these cases, a border will be added around the entire code snippet to visually associate the content with the code block.
- */
-export declare const Content: Story;
-/**
- * It's possible to pass JSX instead of strings to the `code` parameter, either as a single element or an array (e.g. if you want to display line numbers).
- */
-export declare const JsxCodeElements: Story;