@plesk/ui-library 3.35.1 → 3.35.3

package/esm/components/Dialog/Dialog.stories.js

@@ -1,42 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import { useState } from 'react';
-import Button from '../Button';
-import Dialog from './Dialog';
-import image from '../../docs/public/placeholders/placeholder_400x400.svg';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export const Basic = args => {
-  const [isOpen, setIsOpen] = useState(false);
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(Button, {
-      onClick: () => setIsOpen(true),
-      "data-id": "trigger",
-      children: 'Open'
-    }), /*#__PURE__*/_jsx(Dialog, {
-      ...args,
-      "data-type": "test",
-      isOpen: isOpen,
-      onClose: () => setIsOpen(false)
-    })]
-  });
-};
-Basic.args = {
-  children: 'Dialog content.',
-  title: 'Title',
-  subtitle: 'Subtitle'
-};
-export const WithSideBanner = args => /*#__PURE__*/_jsx(Basic, {
-  ...args
-});
-WithSideBanner.args = {
-  ...Basic.args,
-  size: 'xs',
-  sideBanner: /*#__PURE__*/_jsx("img", {
-    src: image
-  }),
-  sideBannerContainer: {
-    background: 'skyblue'
-  }
-};

package/esm/components/Drawer/Drawer.stories.js

@@ -1,56 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import { useState } from 'react';
-import Button from '../Button';
-import Drawer from './Drawer';
-import image from '../../docs/public/placeholders/placeholder_400x400.svg';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export const Basic = args => {
-  const [isOpen, setIsOpen] = useState(false);
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(Button, {
-      onClick: () => setIsOpen(true),
-      "data-id": "trigger",
-      children: 'Open'
-    }), /*#__PURE__*/_jsx(Drawer, {
-      ...args,
-      "data-type": "test",
-      isOpen: isOpen,
-      onClose: () => setIsOpen(false)
-    })]
-  });
-};
-Basic.args = {
-  children: 'Drawer content.',
-  title: 'Title',
-  subtitle: 'Subtitle'
-};
-export const WithForm = args => /*#__PURE__*/_jsx(Basic, {
-  ...args
-});
-WithForm.args = {
-  ...Basic.args,
-  form: {}
-};
-export const WithSideBanner = args => /*#__PURE__*/_jsx(Basic, {
-  ...args
-});
-WithSideBanner.args = {
-  ...Basic.args,
-  size: 'xs',
-  sideBanner: /*#__PURE__*/_jsx("img", {
-    src: image
-  }),
-  sideBannerContainer: {
-    background: 'skyblue'
-  }
-};
-export const WithClosingConfirmation = args => /*#__PURE__*/_jsx(Basic, {
-  ...args
-});
-WithClosingConfirmation.args = {
-  ...Basic.args,
-  closingConfirmation: true
-};

package/esm/components/Form/Form.stories.js

@@ -1,27 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import Form from './Form';
-import FormFieldText from '../FormFieldText';
-import FormFieldPassword from '../FormFieldPassword';
-import FormFieldCheckbox from '../FormFieldCheckbox';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(Form, {
-  ...args
-});
-Basic.args = {
-  values: {
-    field1: 'Value 1',
-    field2: 'Value 2',
-    field3: true
-  },
-  children: [/*#__PURE__*/_jsx(FormFieldText, {
-    label: "Field 1",
-    name: "field1"
-  }, "1"), /*#__PURE__*/_jsx(FormFieldPassword, {
-    label: "Field 2",
-    name: "field2"
-  }, "2"), /*#__PURE__*/_jsx(FormFieldCheckbox, {
-    label: "Field 3",
-    name: "field3"
-  }, "3")]
-};

package/esm/components/FormFieldCheckbox/FormFieldCheckbox.stories.js

@@ -1,23 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import Form from '../Form';
-import FormFieldCheckbox from './FormFieldCheckbox';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(Form, {
-  children: /*#__PURE__*/_jsx(FormFieldCheckbox, {
-    ...args
-  })
-});
-Basic.args = {
-  name: 'name',
-  label: 'Lorem ipsum dolor sit amet.'
-};
-export const WithFullDescription = args => /*#__PURE__*/_jsx(Basic, {
-  ...args
-});
-WithFullDescription.args = {
-  ...Basic.args,
-  label: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac justo sed neque interdum varius. Aenean sollicitudin placerat orci, quis viverra libero mattis a. Morbi ac erat sed elit ullamcorper laoreet sed eget tortor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.',
-  fullDescription: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac justo sed neque interdum varius. Aenean sollicitudin placerat orci, quis viverra libero mattis a.',
-  required: true
-};

package/esm/components/Icon/Icon.stories.js

@@ -1,23 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import Icon from './Icon';
-import { NAMES_12 } from './constants';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(Icon, {
-  ...args
-});
-Basic.args = {};
-export const All = () => /*#__PURE__*/_jsx("div", {
-  style: {
-    display: 'inline-block'
-  },
-  id: "icons",
-  children: NAMES_12.map(name => /*#__PURE__*/_jsx("div", {
-    style: {
-      margin: 16
-    },
-    children: /*#__PURE__*/_jsx(Icon, {
-      name: name
-    })
-  }, name))
-});

package/esm/components/ItemLink/ItemLink.stories.js

@@ -1,12 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import ItemLink from './ItemLink';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(ItemLink, {
-  ...args
-});
-Basic.args = {
-  children: 'Add new item',
-  onClick: () => {},
-  'data-test': 'item-link'
-};

package/esm/components/ItemList/ItemList.stories.js

@@ -1,109 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import { cloneElement } from 'react';
-import ItemList from './ItemList';
-import Item from '../Item';
-import Icon from '../Icon';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(ItemList, {
-  ...args
-});
-Basic.args = {
-  minColumnWidth: 220,
-  gap: 'md',
-  children: [/*#__PURE__*/_jsx(Item, {
-    value: "1",
-    title: "Title 1",
-    description: "Description 1",
-    "data-test": "item1",
-    icon: /*#__PURE__*/_jsx(Icon, {
-      name: "star-circle-filled",
-      intent: "info"
-    }),
-    onClick: () => {},
-    children: 'Content 1'
-  }, "1"), /*#__PURE__*/_jsx(Item, {
-    value: "2",
-    title: "Title 2",
-    description: "Description 2",
-    "data-test": "item2",
-    icon: /*#__PURE__*/_jsx(Icon, {
-      name: "star-circle-filled",
-      intent: "success"
-    }),
-    onClick: () => {},
-    children: 'Content 2'
-  }, "2"), /*#__PURE__*/_jsx(Item, {
-    value: "3",
-    title: "Title 3",
-    description: "Description 3",
-    "data-test": "item3",
-    icon: /*#__PURE__*/_jsx(Icon, {
-      name: "star-circle-filled",
-      intent: "warning"
-    }),
-    onClick: () => {},
-    hoverable: true,
-    children: 'Content 3'
-  }, "3"), /*#__PURE__*/_jsx(Item, {
-    value: "4",
-    title: "Title 4",
-    description: "Description 4",
-    "data-test": "item4",
-    icon: /*#__PURE__*/_jsx(Icon, {
-      name: "star-circle-filled",
-      intent: "danger"
-    }),
-    onClick: () => {},
-    disabled: true,
-    hoverable: true,
-    children: 'Content 4'
-  }, "4")]
-};
-export const Cards = Basic.bind(null);
-Cards.args = {
-  ...Basic.args,
-  children: Basic.args.children.map(child => child ? /*#__PURE__*/cloneElement(child, {
-    view: 'card',
-    footer: `Footer ${child.props.value}`
-  }) : null)
-};
-export const Reorderables = Basic.bind(null);
-Reorderables.args = {
-  ...Basic.args,
-  reorderable: true
-};
-export const Selectables = Basic.bind(null);
-Selectables.args = {
-  ...Basic.args,
-  selectable: true,
-  defaultValue: '2'
-};
-export const HoverableItemList = Basic.bind(null);
-HoverableItemList.args = {
-  ...Basic.args,
-  hoverable: true,
-  defaultValue: '2',
-  children: Basic.args.children.map((child, index) => {
-    if (!child) {
-      return null;
-    }
-    return /*#__PURE__*/cloneElement(child, {
-      hoverable: index === 0 ? false : undefined
-    });
-  })
-};
-export const HoverableItems = Basic.bind(null);
-HoverableItems.args = {
-  ...Basic.args,
-  hoverable: false,
-  defaultValue: '2',
-  children: Basic.args.children.map((child, index) => {
-    if (!child) {
-      return null;
-    }
-    return /*#__PURE__*/cloneElement(child, {
-      hoverable: index % 2 === 0
-    });
-  })
-};

package/esm/components/List/List.stories.js

@@ -1,139 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import { useState } from 'react';
-import List from './List';
-import ListActions from './ListActions';
-import ListAction from './ListAction';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(List, {
-  ...args
-});
-Basic.args = {
-  columns: [{
-    key: 'col1',
-    title: 'Countr 2',
-    type: 'title'
-  }, {
-    key: 'col2',
-    title: 'Population',
-    align: 'right'
-  }],
-  data: [{
-    key: '1',
-    col1: 'China',
-    col2: '1 433 783 686'
-  }, {
-    key: '2',
-    col1: 'India',
-    col2: '1 366 417 754'
-  }, {
-    key: '3',
-    col1: 'United States',
-    col2: '329 064 917'
-  }, {
-    key: '4',
-    col1: ' Indonesia',
-    col2: '270 625 568'
-  }, {
-    key: '5',
-    col1: 'Pakistan',
-    col2: '216 565 318'
-  }]
-};
-export const Vertical = Basic.bind(null);
-Vertical.args = {
-  ...Basic.args,
-  vertical: 480
-};
-export const Nested = Basic.bind(null);
-Nested.args = {
-  ...Basic.args,
-  data: [{
-    key: '1',
-    col1: 'China',
-    col2: '1 433 783 686',
-    data: [{
-      key: '2',
-      col1: 'Guangdong',
-      col2: '113 460 126'
-    }, {
-      key: '3',
-      col1: 'Shandong',
-      col2: '100 471 831'
-    }]
-  }, {
-    key: '4',
-    col1: 'India',
-    col2: '1 366 417 754',
-    data: [{
-      key: '5',
-      col1: 'Uttar Pradesh',
-      col2: '237 882 725'
-    }, {
-      key: '6',
-      col1: 'Bihar',
-      col2: '124 799 926'
-    }]
-  }]
-};
-export const NestedFullFeatured = Nested.bind(null);
-NestedFullFeatured.args = {
-  ...Nested.args,
-  onSelectionChange: () => {},
-  renderRowBody: () => null
-};
-export const ExpandedList = Nested.bind(null);
-ExpandedList.args = {
-  ...Nested.args,
-  onSelectionChange: () => {},
-  renderRowBody: () => 'row body',
-  expandedRows: ['1', '2', '4', '6']
-};
-export const Reorderable = args => {
-  const {
-    data: initialData,
-    ...props
-  } = args;
-  const [data, setData] = useState(initialData);
-  const handleReorderEnd = _ref => {
-    let {
-      oldIndex,
-      newIndex
-    } = _ref;
-    const nextData = [...data];
-    nextData.splice(newIndex, 0, nextData.splice(oldIndex, 1)[0]);
-    setData(nextData);
-  };
-  return /*#__PURE__*/_jsx(Basic, {
-    data: data,
-    reorderable: true,
-    onReorderEnd: handleReorderEnd,
-    ...props
-  });
-};
-Reorderable.args = {
-  ...Basic.args
-};
-export const ReorderableFullFeatured = Reorderable.bind(null);
-ReorderableFullFeatured.args = {
-  ...Reorderable.args,
-  columns: [...Reorderable.args.columns, {
-    key: 'actions',
-    type: 'actions',
-    render: () => /*#__PURE__*/_jsxs(ListActions, {
-      children: [/*#__PURE__*/_jsx(ListAction, {
-        icon: "clip",
-        primary: true
-      }), /*#__PURE__*/_jsx(ListAction, {
-        icon: "clock",
-        primary: true
-      }), /*#__PURE__*/_jsx(ListAction, {
-        icon: "clone",
-        primary: true
-      })]
-    })
-  }],
-  onSelectionChange: () => {},
-  renderRowBody: () => null
-};

package/esm/components/Markdown/Markdown.stories.js

@@ -1,43 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import Markdown from './Markdown';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(Markdown, {
-  ...args
-});
-Basic.args = {
-  children: `
-# Heading
-
-## Sub-heading
-
-### Another deeper heading
-
-Paragraphs are separated
-by a blank line.
-
-Two spaces at the end of a line leave a
-line break.
-
-Text attributes _italic_, *italic*, __bold__, **bold**, \`monospace\`.
-
-Horizontal rule:
-
----
-
-Bullet list:
-
-    * apples
-    * oranges
-    * pears
-
-Numbered list:
-
-    1. apples
-    2. oranges
-    3. pears
-
-A [link](http://example.com).
-
-<b>Sanitize</b>`
-};

package/esm/components/Menu/Menu.stories.js

@@ -1,65 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import { cloneElement } from 'react';
-import Menu, { MenuItem, MenuDivider, MenuHeader } from '.';
-import Label from '../Label';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(Menu, {
-  ...args
-});
-Basic.args = {
-  children: [/*#__PURE__*/_jsx(MenuItem, {
-    "data-test": "one",
-    children: 'One'
-  }, "1"), /*#__PURE__*/_jsx(MenuItem, {
-    "data-test": "two",
-    children: 'Two'
-  }, "2"), /*#__PURE__*/_jsx(MenuItem, {
-    "data-test": "three",
-    disabled: true,
-    children: 'Three'
-  }, "3")]
-};
-export const Tooltip = Basic.bind(null);
-Tooltip.args = {
-  children: Basic.args.children.map((item, index) => {
-    if (index === 0) {
-      return /*#__PURE__*/cloneElement(item, {
-        tooltip: 'One tooltip!'
-      });
-    }
-    return item;
-  })
-};
-export const FullFeatured = Basic.bind(null);
-FullFeatured.args = {
-  children: [/*#__PURE__*/_jsx(MenuHeader, {
-    children: 'Header 1'
-  }, "1"), /*#__PURE__*/_jsx(MenuItem, {
-    "data-test": "2",
-    onClick: () => {},
-    icon: "folder-open",
-    children: 'One'
-  }, "2"), /*#__PURE__*/_jsx(MenuItem, {
-    "data-test": "3",
-    onClick: () => {},
-    icon: "folder-open",
-    label: /*#__PURE__*/_jsx(Label, {
-      intent: "danger",
-      children: '99'
-    }),
-    children: 'Two'
-  }, "3"), /*#__PURE__*/_jsx(MenuDivider, {}, "4"), /*#__PURE__*/_jsx(MenuHeader, {
-    children: 'Header 2'
-  }, "5"), /*#__PURE__*/_jsx(MenuItem, {
-    "data-test": "6",
-    onClick: () => {},
-    icon: "folder-open",
-    children: 'Three'
-  }, "6"), /*#__PURE__*/_jsx(MenuItem, {
-    "data-test": "7",
-    onClick: () => {},
-    icon: "folder-open",
-    children: 'Four'
-  }, "7")]
-};

package/esm/components/Popover/Popover.stories.js

@@ -1,52 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import Link from '../Link';
-import Button from '../Button';
-import Paragraph from '../Paragraph';
-import Popover from './Popover';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(Popover, {
-  ...args
-});
-Basic.args = {
-  target: /*#__PURE__*/_jsx(Link, {
-    "data-id": "trigger",
-    children: 'Trigger'
-  }),
-  children: 'Content'
-};
-export const ThreeButtons = args => /*#__PURE__*/_jsx(Basic, {
-  ...args
-});
-ThreeButtons.args = {
-  ...Basic.args,
-  children: /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsx(Paragraph, {
-      children: 'Enim ea occaecat dolor veniam.'
-    }), /*#__PURE__*/_jsx(Button, {
-      "data-id": "button-1",
-      children: 'Button 1'
-    }), /*#__PURE__*/_jsx(Paragraph, {
-      children: 'Incididunt ipsum nulla officia adipisicing voluptate enim reprehenderit.'
-    }), /*#__PURE__*/_jsx(Button, {
-      "data-id": "button-2",
-      children: 'Button 2'
-    }), ` `, /*#__PURE__*/_jsx(Button, {
-      "data-id": "button-3",
-      children: 'Button 3'
-    }), /*#__PURE__*/_jsx(Paragraph, {
-      children: 'Cillum sunt nisi aute amet elit ut sit dolor in aliqua minim.'
-    })]
-  })
-};
-export const Autofocus = args => /*#__PURE__*/_jsx(Basic, {
-  ...args
-});
-Autofocus.args = {
-  ...Basic.args,
-  children: /*#__PURE__*/_jsx("input", {
-    autoFocus: true
-  })
-};

package/esm/components/Select/Select.stories.js

@@ -1,48 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import Select from './Select';
-import SelectOption from './SelectOption';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(Select, {
-  ...args
-});
-Basic.args = {
-  children: [/*#__PURE__*/_jsx(SelectOption, {
-    children: 'One'
-  }, "1"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Two'
-  }, "2"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Three'
-  }, "3"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Four'
-  }, "4"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Five'
-  }, "5"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Six'
-  }, "6"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Seven'
-  }, "7"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Eight'
-  }, "8"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Nine'
-  }, "9"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Ten'
-  }, "10"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Eleven'
-  }, "11"), /*#__PURE__*/_jsx(SelectOption, {
-    children: 'Twelve'
-  }, "12")],
-  'data-test': 'select'
-};
-export const SearchableAtBottom = () => /*#__PURE__*/_jsx("div", {
-  style: {
-    position: 'absolute',
-    left: 0,
-    bottom: 0,
-    padding: 16
-  },
-  children: /*#__PURE__*/_jsx(Basic, {
-    searchable: true,
-    ...Basic.args
-  })
-});

package/esm/components/Skeleton/Skeleton.stories.js

@@ -1,15 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import Skeleton from './Skeleton';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(Skeleton, {
-  ...args
-});
-Basic.args = {};
-export const CustomSize = args => /*#__PURE__*/_jsx(Basic, {
-  ...args
-});
-CustomSize.args = {
-  width: 200,
-  height: 100
-};

package/esm/components/Skeleton/SkeletonTabs.stories.js

@@ -1,7 +0,0 @@
-// Copyright 1999-2023. Plesk International GmbH. All rights reserved.
-
-import SkeletonTabs from './SkeletonTabs';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Basic = args => /*#__PURE__*/_jsx(SkeletonTabs, {
-  ...args
-});