@webiny/ui 0.0.0-unstable.de38392959 → 0.0.0-unstable.df7a8bb475

package/Accordion/Accordion.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
-import { ListItem } from "../List";
-import { AccordionItem } from "./AccordionItem";
-export interface AccordionProps {
+import type { ListItem } from "../List/index.js";
+import { type AccordionItem } from "./AccordionItem.js";
+interface AccordionProps {
     /**
      * Element displayed when accordion is expanded.
      */
@@ -15,5 +15,9 @@ export interface AccordionProps {
      */
     className?: string;
 }
-declare const Accordion: (props: AccordionProps) => JSX.Element;
-export { Accordion };
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Accordion` component from the `@webiny/admin-ui` package instead.
+ */
+declare const Accordion: (props: AccordionProps) => React.JSX.Element;
+export { Accordion, type AccordionProps };

package/Accordion/Accordion.js

@@ -1,32 +1,12 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Accordion = void 0;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireDefault(require("react"));
-var _List = require("../List");
-var _Elevation = require("../Elevation");
-var _emotion = require("emotion");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _excluded = ["children", "elevation", "className"];
-var listStyle = /*#__PURE__*/(0, _emotion.css)("&.mdc-list{padding:0;&.mdc-list--two-line .mdc-list-item{height:48px;padding:8px 20px;}}label:listStyle;");
-var Accordion = function Accordion(props) {
-  var children = props.children,
-    _props$elevation = props.elevation,
-    elevation = _props$elevation === void 0 ? 2 : _props$elevation,
-    className = props.className,
-    other = (0, _objectWithoutProperties2.default)(props, _excluded);
-  return /*#__PURE__*/_react.default.createElement(_Elevation.Elevation, {
-    z: elevation,
-    className: (0, _classnames.default)("webiny-ui-accordion", className)
-  }, /*#__PURE__*/_react.default.createElement(_List.List, Object.assign({
-    twoLine: true,
-    className: listStyle
-  }, other), children));
+import React from "react";
+import { Accordion as AdminUiAccordion } from "@webiny/admin-ui";
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Accordion` component from the `@webiny/admin-ui` package instead.
+ */
+const Accordion = props => {
+  return /*#__PURE__*/React.createElement(AdminUiAccordion, null, props.children);
 };
-exports.Accordion = Accordion;
+export { Accordion };
 
 //# sourceMappingURL=Accordion.js.map

package/Accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_List","_Elevation","_emotion","_classnames","_excluded","listStyle","css","Accordion","props","children","_props$elevation","elevation","className","other","_objectWithoutProperties2","default","createElement","Elevation","z","classNames","List","Object","assign","twoLine","exports"],"sources":["Accordion.tsx"],"sourcesContent":["import React from \"react\";\nimport { List, ListItem } from \"../List\";\nimport { AccordionItem } from \"./AccordionItem\";\nimport { Elevation } from \"../Elevation\";\nimport { css } from \"emotion\";\nimport classNames from \"classnames\";\n\nexport interface AccordionProps {\n    /**\n     * Element displayed when accordion is expanded.\n     */\n    children:\n        | React.ReactElement<typeof ListItem>[]\n        | React.ReactElement<typeof AccordionItem>\n        | React.ReactElement<typeof AccordionItem>[];\n\n    /**\n     * Elevation number, default set to 2\n     */\n    elevation?: number;\n\n    /**\n     * Append a class name\n     */\n    className?: string;\n}\n\nconst listStyle = css`\n    &.mdc-list {\n        padding: 0;\n        &.mdc-list--two-line .mdc-list-item {\n            height: 48px;\n            padding: 8px 20px;\n        }\n    }\n`;\n\nconst Accordion = (props: AccordionProps) => {\n    const { children, elevation = 2, className, ...other } = props;\n    return (\n        <Elevation z={elevation} className={classNames(\"webiny-ui-accordion\", className)}>\n            <List twoLine className={listStyle} {...other}>\n                {children}\n            </List>\n        </Elevation>\n    );\n};\n\nexport { Accordion };\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AAEA,IAAAE,UAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,WAAA,GAAAL,sBAAA,CAAAC,OAAA;AAAoC,IAAAK,SAAA;AAsBpC,IAAMC,SAAS,oBAAGC,YAAG,6GAQpB;AAED,IAAMC,SAAS,GAAG,SAAZA,SAASA,CAAIC,KAAqB,EAAK;EACzC,IAAQC,QAAQ,GAAyCD,KAAK,CAAtDC,QAAQ;IAAAC,gBAAA,GAAyCF,KAAK,CAA5CG,SAAS;IAATA,SAAS,GAAAD,gBAAA,cAAG,CAAC,GAAAA,gBAAA;IAAEE,SAAS,GAAeJ,KAAK,CAA7BI,SAAS;IAAKC,KAAK,OAAAC,yBAAA,CAAAC,OAAA,EAAKP,KAAK,EAAAJ,SAAA;EAC9D,oBACIP,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAACf,UAAA,CAAAgB,SAAS;IAACC,CAAC,EAAEP,SAAU;IAACC,SAAS,EAAE,IAAAO,mBAAU,EAAC,qBAAqB,EAAEP,SAAS;EAAE,gBAC7Ef,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAAChB,KAAA,CAAAoB,IAAI,EAAAC,MAAA,CAAAC,MAAA;IAACC,OAAO;IAACX,SAAS,EAAEP;EAAU,GAAKQ,KAAK,GACxCJ,QACC,CACC,CAAC;AAEpB,CAAC;AAACe,OAAA,CAAAjB,SAAA,GAAAA,SAAA"}
+{"version":3,"names":["React","Accordion","AdminUiAccordion","props","createElement","children"],"sources":["Accordion.tsx"],"sourcesContent":["import React from \"react\";\nimport { Accordion as AdminUiAccordion } from \"@webiny/admin-ui\";\nimport type { ListItem } from \"../List/index.js\";\nimport { type AccordionItem } from \"./AccordionItem.js\";\n\ninterface AccordionProps {\n    /**\n     * Element displayed when accordion is expanded.\n     */\n    children:\n        | React.ReactElement<typeof ListItem>[]\n        | React.ReactElement<typeof AccordionItem>\n        | React.ReactElement<typeof AccordionItem>[];\n\n    /**\n     * Elevation number, default set to 2\n     */\n    elevation?: number;\n\n    /**\n     * Append a class name\n     */\n    className?: string;\n}\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `Accordion` component from the `@webiny/admin-ui` package instead.\n */\nconst Accordion = (props: AccordionProps) => {\n    return <AdminUiAccordion>{props.children}</AdminUiAccordion>;\n};\n\nexport { Accordion, type AccordionProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,SAAS,IAAIC,gBAAgB,QAAQ,kBAAkB;AAwBhE;AACA;AACA;AACA;AACA,MAAMD,SAAS,GAAIE,KAAqB,IAAK;EACzC,oBAAOH,KAAA,CAAAI,aAAA,CAACF,gBAAgB,QAAEC,KAAK,CAACE,QAA2B,CAAC;AAChE,CAAC;AAED,SAASJ,SAAS","ignoreList":[]}

package/Accordion/AccordionItem.d.ts

@@ -1,53 +1,113 @@
 import React from "react";
-import { AccordionItemAction, AccordionItemActions, AccordionItemElement } from "./AccordionItemActions";
-declare const Divider: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: React.ElementType<any> | undefined;
-}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export interface AccordionItemProps {
     /**
-     * Can user toggle the accordion item by clicking it? Defaults to `true`.
+     * Element displayed when accordion is expanded.
      */
-    interactive?: boolean;
-    /**
-     * Actions to show on the right side of the accordion item
-     */
-    actions?: React.ReactElement | null;
-    /**
-     * Left side icon
-     */
-    icon?: React.ReactElement | null;
-    /**
-     * Accordion title
-     */
-    title?: React.ReactNode;
+    children: React.ReactNode;
     /**
-     * Optional description
+     * @deprecated This prop no longer has any effect.
+     * Elevation number, default set to 2
      */
-    description?: string;
+    elevation?: number;
     /**
      * Append a class name
      */
     className?: string;
-    /**
-     * Render item opened by default
-     */
+    value?: string;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
     open?: boolean;
+    interactive?: boolean;
+    handle?: React.ReactNode;
+    actions?: React.ReactNode;
+    icon?: React.ReactNode;
     /**
-     * For testing purpose
-     */
-    "data-testid"?: string;
-    /**
-     * Append a class name to Icon
+     * @deprecated This prop no longer has any effect.
      */
     iconClassName?: string;
-    children: React.ReactNode;
 }
-declare type AccordionItem = React.ComponentType<AccordionItemProps> & {
-    Divider: typeof Divider;
-    Actions: typeof AccordionItemActions;
-    Action: typeof AccordionItemAction;
-    Element: typeof AccordionItemElement;
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Accordion.Item` component from the `@webiny/admin-ui` package instead.
+ */
+export declare const AccordionItem: ((props: AccordionItemProps) => React.JSX.Element) & {
+    Divider: ((props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element) & {
+        original: (props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    } & {
+        original: ((props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element) & {
+            original: (props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element;
+            originalName: string;
+            displayName: string;
+        };
+        originalName: string;
+        displayName: string;
+    } & {
+        createDecorator: (decorator: import("../../../react-composition/src").ComponentDecorator<((props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element) & {
+            original: (props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element;
+            originalName: string;
+            displayName: string;
+        }>) => (props: unknown) => React.JSX.Element;
+    };
+    Action: (({ onClick, ...props }: import("@webiny/admin-ui/Accordion/components/AccordionItemAction").AccordionItemActionProps) => React.JSX.Element) & {
+        original: ({ onClick, ...props }: import("@webiny/admin-ui/Accordion/components/AccordionItemAction").AccordionItemActionProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    } & {
+        original: (({ onClick, ...props }: import("@webiny/admin-ui/Accordion/components/AccordionItemAction").AccordionItemActionProps) => React.JSX.Element) & {
+            original: ({ onClick, ...props }: import("@webiny/admin-ui/Accordion/components/AccordionItemAction").AccordionItemActionProps) => React.JSX.Element;
+            originalName: string;
+            displayName: string;
+        };
+        originalName: string;
+        displayName: string;
+    } & {
+        createDecorator: (decorator: import("../../../react-composition/src").ComponentDecorator<(({ onClick, ...props }: import("@webiny/admin-ui/Accordion/components/AccordionItemAction").AccordionItemActionProps) => React.JSX.Element) & {
+            original: ({ onClick, ...props }: import("@webiny/admin-ui/Accordion/components/AccordionItemAction").AccordionItemActionProps) => React.JSX.Element;
+            originalName: string;
+            displayName: string;
+        }>) => (props: unknown) => React.JSX.Element;
+    } & {
+        Separator: ((props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element) & {
+            original: (props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element;
+            originalName: string;
+            displayName: string;
+        } & {
+            original: ((props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element) & {
+                original: (props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element;
+                originalName: string;
+                displayName: string;
+            };
+            originalName: string;
+            displayName: string;
+        } & {
+            createDecorator: (decorator: import("../../../react-composition/src").ComponentDecorator<((props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element) & {
+                original: (props: import("@webiny/admin-ui").SeparatorProps) => React.JSX.Element;
+                originalName: string;
+                displayName: string;
+            }>) => (props: unknown) => React.JSX.Element;
+        };
+    };
+    Icon: ((props: import("@webiny/admin-ui").IconProps) => React.JSX.Element) & {
+        original: (props: import("@webiny/admin-ui").IconProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    } & {
+        original: ((props: import("@webiny/admin-ui").IconProps) => React.JSX.Element) & {
+            original: (props: import("@webiny/admin-ui").IconProps) => React.JSX.Element;
+            originalName: string;
+            displayName: string;
+        };
+        originalName: string;
+        displayName: string;
+    } & {
+        createDecorator: (decorator: import("../../../react-composition/src").ComponentDecorator<((props: import("@webiny/admin-ui").IconProps) => React.JSX.Element) & {
+            original: (props: import("@webiny/admin-ui").IconProps) => React.JSX.Element;
+            originalName: string;
+            displayName: string;
+        }>) => (props: unknown) => React.JSX.Element;
+    };
+    Actions: (props: any) => React.JSX.Element;
+    Element: (props: any) => React.JSX.Element;
 };
-export declare const AccordionItem: AccordionItem;
-export {};

package/Accordion/AccordionItem.js

@@ -1,131 +1,37 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.AccordionItem = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _List = require("../List");
-var _Transition = _interopRequireDefault(require("react-transition-group/Transition"));
-var _Icon = require("../Icon");
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _emotion = require("emotion");
-var _Typography = require("../Typography");
-var _roundKeyboard_arrow_up24px = require("./icons/round-keyboard_arrow_up-24px.svg");
-var _roundKeyboard_arrow_down24px = require("./icons/round-keyboard_arrow_down-24px.svg");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _AccordionItemActions = require("./AccordionItemActions");
-var Content = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "Content",
-  target: "eypjd5u0"
-})("width:100%;border-right:1px solid var(--mdc-theme-background);border-bottom:1px solid var(--mdc-theme-background);border-left:1px solid var(--mdc-theme-background);box-sizing:border-box;> .mdc-layout-grid{margin:-24px;}");
-var listItem = /*#__PURE__*/(0, _emotion.css)("cursor:pointer;border-bottom:1px solid var(--mdc-theme-background);&:last-child{border-bottom:none;}.mdc-list-item__graphic{margin-right:20px;}label:listItem;");
-var ListItemTitle = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "ListItemTitle",
-  target: "eypjd5u1"
-})("font-weight:600;line-height:100%;");
-var ListItemDescription = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "ListItemDescription",
-  target: "eypjd5u2"
-})("line-height:100%;");
-var TitleContent = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "TitleContent",
-  target: "eypjd5u3"
-})("display:flex;flex-direction:column;");
-var openedState = /*#__PURE__*/(0, _emotion.css)("background-color:var(--mdc-theme-on-background);label:openedState;");
-var nonInteractive = /*#__PURE__*/(0, _emotion.css)("background-color:var(--mdc-theme-surface);label:nonInteractive;");
-var duration = 150;
-var defaultStyle = {
-  transition: "all ".concat(duration, "ms ease-in-out"),
-  opacity: 0,
-  height: 0,
-  pointerEvents: "auto",
-  overflow: "hidden"
-};
-var transitionStyles = {
-  entering: {
-    opacity: 0,
-    height: 0,
-    padding: "20px",
-    pointerEvents: "auto",
-    overflow: "initial"
-  },
-  entered: {
-    opacity: 1,
-    height: "auto",
-    padding: "20px",
-    pointerEvents: "auto",
-    overflow: "initial"
-  },
-  exiting: {
-    height: "auto",
-    padding: "20px",
-    pointerEvents: "auto",
-    overflow: "initial"
-  }
-};
-var Divider = /*#__PURE__*/(0, _styled.default)("span", {
-  label: "Divider",
-  target: "eypjd5u4"
-})("width:1px;margin:0 15px;height:100%;background-color:var(--mdc-theme-on-background);");
-var Actions = /*#__PURE__*/(0, _styled.default)(_List.ListItemMeta, {
-  label: "Actions",
-  target: "eypjd5u5"
-})("display:flex;height:40%;align-items:center;");
-var AccordionItemComponent = function AccordionItemComponent(props) {
-  var _useState = (0, _react.useState)(props.open ? props.open : false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    open = _useState2[0],
-    setState = _useState2[1];
-  var _props$interactive = props.interactive,
-    interactive = _props$interactive === void 0 ? true : _props$interactive,
-    actions = props.actions;
-  var toggleState = (0, _react.useCallback)(function () {
-    setState(!open);
-  }, [open]);
-  var onClick = interactive ? toggleState : undefined;
-  var divider = interactive && actions ? /*#__PURE__*/_react.default.createElement(Divider, null) : null;
-  var arrowIcon = interactive ? /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
-    icon: !open ? /*#__PURE__*/_react.default.createElement(_roundKeyboard_arrow_down24px.ReactComponent, null) : /*#__PURE__*/_react.default.createElement(_roundKeyboard_arrow_up24px.ReactComponent, null)
-  }) : null;
-  (0, _react.useEffect)(function () {
-    setState(!!props.open);
+import React, { useMemo, useEffect, useState } from "react";
+import { Accordion as AdminUiAccordion } from "@webiny/admin-ui";
+import { withStaticProps } from "@webiny/admin-ui/utils.js";
+const AccordionItemBase = props => {
+  const [open, setOpen] = useState(props.open ?? false);
+  useEffect(() => {
+    setOpen(!!props.open);
   }, [props.open]);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("webiny-ui-accordion-item", props.className)
-  }, /*#__PURE__*/_react.default.createElement(_List.ListItem, {
-    disabled: !interactive,
-    className: (0, _classnames.default)(listItem, (0, _defineProperty2.default)({}, openedState, open), (0, _defineProperty2.default)({}, nonInteractive, !interactive), "webiny-ui-accordion-item__list-item"),
-    onClick: onClick,
-    "data-testid": props["data-testid"]
-  }, props.icon && /*#__PURE__*/_react.default.createElement(_List.ListItemGraphic, null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
-    icon: props.icon,
-    className: props.iconClassName
-  })), /*#__PURE__*/_react.default.createElement(TitleContent, {
-    className: "webiny-ui-accordion-item__title"
-  }, /*#__PURE__*/_react.default.createElement(ListItemTitle, null, props.title), props.description && /*#__PURE__*/_react.default.createElement(ListItemDescription, null, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
-    use: "body2"
-  }, props.description))), /*#__PURE__*/_react.default.createElement(Actions, null, props.actions ? props.actions : null, divider, arrowIcon)), /*#__PURE__*/_react.default.createElement(_Transition.default, {
-    in: open,
-    timeout: duration
-  }, function (state) {
-    return /*#__PURE__*/_react.default.createElement(Content, {
-      style: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, defaultStyle), transitionStyles[state]),
-      className: "webiny-ui-accordion-item__content"
-    }, props.children);
-  }));
+  const icon = useMemo(() => {
+    return props.icon ? /*#__PURE__*/React.createElement(AdminUiAccordion.Item.Icon, {
+      icon: props.icon,
+      label: typeof props.title === "string" ? props.title : ""
+    }) : null;
+  }, [props.icon]);
+  return /*#__PURE__*/React.createElement(AdminUiAccordion.Item, Object.assign({}, props, {
+    open: open,
+    onOpenChange: open => setOpen(open),
+    icon: icon,
+    title: props.title || ""
+  }), props.children);
 };
-var AccordionItem = Object.assign(AccordionItemComponent, {
-  Divider: Divider,
-  Action: _AccordionItemActions.AccordionItemAction,
-  Actions: _AccordionItemActions.AccordionItemActions,
-  Element: _AccordionItemActions.AccordionItemElement
+
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Accordion.Item` component from the `@webiny/admin-ui` package instead.
+ */
+export const AccordionItem = withStaticProps(AccordionItemBase, {
+  Divider: AdminUiAccordion.Item.Action.Separator,
+  Action: AdminUiAccordion.Item.Action,
+  Icon: AdminUiAccordion.Item.Icon,
+  Actions: props => /*#__PURE__*/React.createElement(React.Fragment, null, props.children),
+  Element: props => /*#__PURE__*/React.createElement("div", Object.assign({
+    "data-role": "accordion-element"
+  }, props))
 });
-exports.AccordionItem = AccordionItem;
 
 //# sourceMappingURL=AccordionItem.js.map

package/Accordion/AccordionItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_List","_Transition","_interopRequireDefault","_Icon","_styled","_emotion","_Typography","_roundKeyboard_arrow_up24px","_roundKeyboard_arrow_down24px","_classnames","_AccordionItemActions","Content","styled","label","target","listItem","css","ListItemTitle","ListItemDescription","TitleContent","openedState","nonInteractive","duration","defaultStyle","transition","concat","opacity","height","pointerEvents","overflow","transitionStyles","entering","padding","entered","exiting","Divider","Actions","ListItemMeta","AccordionItemComponent","props","_useState","useState","open","_useState2","_slicedToArray2","default","setState","_props$interactive","interactive","actions","toggleState","useCallback","onClick","undefined","divider","createElement","arrowIcon","Icon","icon","ReactComponent","useEffect","className","classNames","ListItem","disabled","_defineProperty2","ListItemGraphic","iconClassName","title","description","Typography","use","in","timeout","state","style","_objectSpread2","children","AccordionItem","Object","assign","Action","AccordionItemAction","AccordionItemActions","Element","AccordionItemElement","exports"],"sources":["AccordionItem.tsx"],"sourcesContent":["import React, { CSSProperties, useCallback, useEffect, useState } from \"react\";\nimport { ListItem, ListItemGraphic, ListItemMeta } from \"~/List\";\nimport Transition from \"react-transition-group/Transition\";\nimport { Icon } from \"~/Icon\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { Typography } from \"~/Typography\";\nimport { ReactComponent as UpArrow } from \"./icons/round-keyboard_arrow_up-24px.svg\";\nimport { ReactComponent as DownArrow } from \"./icons/round-keyboard_arrow_down-24px.svg\";\nimport classNames from \"classnames\";\nimport {\n    AccordionItemAction,\n    AccordionItemActions,\n    AccordionItemElement\n} from \"~/Accordion/AccordionItemActions\";\n\nconst Content = styled.div`\n    width: 100%;\n    border-right: 1px solid var(--mdc-theme-background);\n    border-bottom: 1px solid var(--mdc-theme-background);\n    border-left: 1px solid var(--mdc-theme-background);\n    box-sizing: border-box;\n    > .mdc-layout-grid {\n        margin: -24px;\n    }\n`;\n\nconst listItem = css`\n    cursor: pointer;\n    border-bottom: 1px solid var(--mdc-theme-background);\n    &:last-child {\n        border-bottom: none;\n    }\n    .mdc-list-item__graphic {\n        margin-right: 20px;\n    }\n`;\n\nconst ListItemTitle = styled.div`\n    font-weight: 600;\n    line-height: 100%;\n`;\n\nconst ListItemDescription = styled.div`\n    line-height: 100%;\n`;\n\nconst TitleContent = styled.div`\n    display: flex;\n    flex-direction: column;\n`;\n\nconst openedState = css`\n    background-color: var(--mdc-theme-on-background);\n`;\n\nconst nonInteractive = css`\n    background-color: var(--mdc-theme-surface);\n`;\n\nconst duration = 150;\nconst defaultStyle: CSSProperties = {\n    transition: `all ${duration}ms ease-in-out`,\n    opacity: 0,\n    height: 0,\n    pointerEvents: \"auto\",\n    overflow: \"hidden\"\n};\n\ntype TransitionStylesState = \"entering\" | \"entered\" | \"exiting\";\n\nconst transitionStyles: Record<string, CSSProperties> = {\n    entering: {\n        opacity: 0,\n        height: 0,\n        padding: \"20px\",\n        pointerEvents: \"auto\",\n        overflow: \"initial\"\n    },\n    entered: {\n        opacity: 1,\n        height: \"auto\",\n        padding: \"20px\",\n        pointerEvents: \"auto\",\n        overflow: \"initial\"\n    },\n    exiting: {\n        height: \"auto\",\n        padding: \"20px\",\n        pointerEvents: \"auto\",\n        overflow: \"initial\"\n    }\n};\n\nconst Divider = styled.span`\n    width: 1px;\n    margin: 0 15px;\n    height: 100%;\n    background-color: var(--mdc-theme-on-background);\n`;\n\nconst Actions = styled(ListItemMeta)`\n    display: flex;\n    height: 40%;\n    align-items: center;\n`;\n\nexport interface AccordionItemProps {\n    /**\n     * Can user toggle the accordion item by clicking it? Defaults to `true`.\n     */\n    interactive?: boolean;\n    /**\n     * Actions to show on the right side of the accordion item\n     */\n    actions?: React.ReactElement | null;\n    /**\n     * Left side icon\n     */\n    icon?: React.ReactElement | null;\n\n    /**\n     * Accordion title\n     */\n    title?: React.ReactNode;\n\n    /**\n     * Optional description\n     */\n    description?: string;\n\n    /**\n     * Append a class name\n     */\n    className?: string;\n\n    /**\n     * Render item opened by default\n     */\n    open?: boolean;\n    /**\n     * For testing purpose\n     */\n    \"data-testid\"?: string;\n    /**\n     * Append a class name to Icon\n     */\n    iconClassName?: string;\n\n    children: React.ReactNode;\n}\n\nconst AccordionItemComponent = (props: AccordionItemProps) => {\n    const [open, setState] = useState<boolean>(props.open ? props.open : false);\n    const { interactive = true, actions } = props;\n\n    const toggleState = useCallback(() => {\n        setState(!open);\n    }, [open]);\n\n    const onClick = interactive ? toggleState : undefined;\n    const divider = interactive && actions ? <Divider /> : null;\n    const arrowIcon = interactive ? <Icon icon={!open ? <DownArrow /> : <UpArrow />} /> : null;\n\n    useEffect(() => {\n        setState(!!props.open);\n    }, [props.open]);\n\n    return (\n        <div className={classNames(\"webiny-ui-accordion-item\", props.className)}>\n            <ListItem\n                disabled={!interactive}\n                className={classNames(\n                    listItem,\n                    { [openedState]: open },\n                    { [nonInteractive]: !interactive },\n                    \"webiny-ui-accordion-item__list-item\"\n                )}\n                onClick={onClick}\n                data-testid={props[\"data-testid\"]}\n            >\n                {props.icon && (\n                    <ListItemGraphic>\n                        <Icon icon={props.icon} className={props.iconClassName} />\n                    </ListItemGraphic>\n                )}\n\n                <TitleContent className=\"webiny-ui-accordion-item__title\">\n                    <ListItemTitle>{props.title}</ListItemTitle>\n                    {props.description && (\n                        <ListItemDescription>\n                            <Typography use={\"body2\"}>{props.description}</Typography>\n                        </ListItemDescription>\n                    )}\n                </TitleContent>\n                <Actions>\n                    {props.actions ? props.actions : null}\n                    {divider}\n                    {arrowIcon}\n                </Actions>\n            </ListItem>\n            <Transition in={open} timeout={duration}>\n                {(state: TransitionStylesState) => (\n                    <Content\n                        style={{ ...defaultStyle, ...transitionStyles[state] }}\n                        className=\"webiny-ui-accordion-item__content\"\n                    >\n                        {props.children}\n                    </Content>\n                )}\n            </Transition>\n        </div>\n    );\n};\n\ntype AccordionItem = React.ComponentType<AccordionItemProps> & {\n    Divider: typeof Divider;\n    Actions: typeof AccordionItemActions;\n    Action: typeof AccordionItemAction;\n    Element: typeof AccordionItemElement;\n};\n\nexport const AccordionItem: AccordionItem = Object.assign(AccordionItemComponent, {\n    Divider,\n    Action: AccordionItemAction,\n    Actions: AccordionItemActions,\n    Element: AccordionItemElement\n});\n"],"mappings":"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"}
+{"version":3,"names":["React","useMemo","useEffect","useState","Accordion","AdminUiAccordion","withStaticProps","AccordionItemBase","props","open","setOpen","icon","createElement","Item","Icon","label","title","Object","assign","onOpenChange","children","AccordionItem","Divider","Action","Separator","Actions","Fragment","Element"],"sources":["AccordionItem.tsx"],"sourcesContent":["import React, { useMemo, useEffect, useState } from \"react\";\nimport { Accordion as AdminUiAccordion } from \"@webiny/admin-ui\";\nimport { withStaticProps } from \"@webiny/admin-ui/utils.js\";\n\nexport interface AccordionItemProps {\n    /**\n     * Element displayed when accordion is expanded.\n     */\n    children: React.ReactNode;\n\n    /**\n     * @deprecated This prop no longer has any effect.\n     * Elevation number, default set to 2\n     */\n    elevation?: number;\n\n    /**\n     * Append a class name\n     */\n    className?: string;\n\n    value?: string;\n\n    title?: React.ReactNode;\n\n    description?: React.ReactNode;\n\n    open?: boolean;\n\n    interactive?: boolean;\n\n    handle?: React.ReactNode;\n\n    actions?: React.ReactNode;\n\n    icon?: React.ReactNode;\n\n    /**\n     * @deprecated This prop no longer has any effect.\n     */\n    iconClassName?: string;\n}\n\nconst AccordionItemBase = (props: AccordionItemProps) => {\n    const [open, setOpen] = useState<boolean>(props.open ?? false);\n\n    useEffect(() => {\n        setOpen(!!props.open);\n    }, [props.open]);\n\n    const icon = useMemo(() => {\n        return props.icon ? (\n            <AdminUiAccordion.Item.Icon\n                icon={props.icon}\n                label={typeof props.title === \"string\" ? props.title : \"\"}\n            />\n        ) : null;\n    }, [props.icon]);\n\n    return (\n        <AdminUiAccordion.Item\n            {...props}\n            open={open}\n            onOpenChange={open => setOpen(open)}\n            icon={icon}\n            title={props.title || \"\"}\n        >\n            {props.children as React.ReactElement}\n        </AdminUiAccordion.Item>\n    );\n};\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `Accordion.Item` component from the `@webiny/admin-ui` package instead.\n */\nexport const AccordionItem = withStaticProps(AccordionItemBase, {\n    Divider: AdminUiAccordion.Item.Action.Separator,\n    Action: AdminUiAccordion.Item.Action,\n    Icon: AdminUiAccordion.Item.Icon,\n    Actions: (props: any) => <>{props.children}</>,\n    Element: (props: any) => <div data-role={\"accordion-element\"} {...props} />\n});\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3D,SAASC,SAAS,IAAIC,gBAAgB,QAAQ,kBAAkB;AAChE,SAASC,eAAe,QAAQ,2BAA2B;AAyC3D,MAAMC,iBAAiB,GAAIC,KAAyB,IAAK;EACrD,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAGP,QAAQ,CAAUK,KAAK,CAACC,IAAI,IAAI,KAAK,CAAC;EAE9DP,SAAS,CAAC,MAAM;IACZQ,OAAO,CAAC,CAAC,CAACF,KAAK,CAACC,IAAI,CAAC;EACzB,CAAC,EAAE,CAACD,KAAK,CAACC,IAAI,CAAC,CAAC;EAEhB,MAAME,IAAI,GAAGV,OAAO,CAAC,MAAM;IACvB,OAAOO,KAAK,CAACG,IAAI,gBACbX,KAAA,CAAAY,aAAA,CAACP,gBAAgB,CAACQ,IAAI,CAACC,IAAI;MACvBH,IAAI,EAAEH,KAAK,CAACG,IAAK;MACjBI,KAAK,EAAE,OAAOP,KAAK,CAACQ,KAAK,KAAK,QAAQ,GAAGR,KAAK,CAACQ,KAAK,GAAG;IAAG,CAC7D,CAAC,GACF,IAAI;EACZ,CAAC,EAAE,CAACR,KAAK,CAACG,IAAI,CAAC,CAAC;EAEhB,oBACIX,KAAA,CAAAY,aAAA,CAACP,gBAAgB,CAACQ,IAAI,EAAAI,MAAA,CAAAC,MAAA,KACdV,KAAK;IACTC,IAAI,EAAEA,IAAK;IACXU,YAAY,EAAEV,IAAI,IAAIC,OAAO,CAACD,IAAI,CAAE;IACpCE,IAAI,EAAEA,IAAK;IACXK,KAAK,EAAER,KAAK,CAACQ,KAAK,IAAI;EAAG,IAExBR,KAAK,CAACY,QACY,CAAC;AAEhC,CAAC;;AAED;AACA;AACA;AACA;AACA,OAAO,MAAMC,aAAa,GAAGf,eAAe,CAACC,iBAAiB,EAAE;EAC5De,OAAO,EAAEjB,gBAAgB,CAACQ,IAAI,CAACU,MAAM,CAACC,SAAS;EAC/CD,MAAM,EAAElB,gBAAgB,CAACQ,IAAI,CAACU,MAAM;EACpCT,IAAI,EAAET,gBAAgB,CAACQ,IAAI,CAACC,IAAI;EAChCW,OAAO,EAAGjB,KAAU,iBAAKR,KAAA,CAAAY,aAAA,CAAAZ,KAAA,CAAA0B,QAAA,QAAGlB,KAAK,CAACY,QAAW,CAAC;EAC9CO,OAAO,EAAGnB,KAAU,iBAAKR,KAAA,CAAAY,aAAA,QAAAK,MAAA,CAAAC,MAAA;IAAK,aAAW;EAAoB,GAAKV,KAAK,CAAG;AAC9E,CAAC,CAAC","ignoreList":[]}

package/Accordion/AccordionItemActions.d.ts

@@ -2,15 +2,24 @@ import React from "react";
 interface AccordionItemActionsProps {
     children: React.ReactNode;
 }
-export declare const AccordionItemActions: ({ children }: AccordionItemActionsProps) => JSX.Element;
+export declare const AccordionItemActions: ({ children }: AccordionItemActionsProps) => React.JSX.Element;
 export interface AccordionItemActionProps {
     icon: JSX.Element;
     onClick: () => void;
+    tooltip?: string;
     disabled?: boolean;
 }
-export declare const AccordionItemAction: ({ icon, onClick, disabled }: AccordionItemActionProps) => JSX.Element;
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Accordion.Item.Action` component from the `@webiny/admin-ui` package instead.
+ */
+export declare const AccordionItemAction: ({ icon, onClick, tooltip, disabled }: AccordionItemActionProps) => React.JSX.Element;
 export interface AccordionItemElementProps {
     element: JSX.Element;
 }
-export declare const AccordionItemElement: ({ element }: AccordionItemElementProps) => JSX.Element;
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Accordion.Item.Action` component from the `@webiny/admin-ui` package instead.
+ */
+export declare const AccordionItemElement: ({ element }: AccordionItemElementProps) => React.JSX.Element;
 export {};

package/Accordion/AccordionItemActions.js

@@ -1,39 +1,47 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.AccordionItemElement = exports.AccordionItemActions = exports.AccordionItemAction = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Button = require("../Button");
-var AccordionItemActions = function AccordionItemActions(_ref) {
-  var children = _ref.children;
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children);
+import React from "react";
+import { IconButton } from "../Button/index.js";
+import { Tooltip } from "../Tooltip/index.js";
+export const AccordionItemActions = ({
+  children
+}) => {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, children);
 };
-exports.AccordionItemActions = AccordionItemActions;
-var AccordionItemAction = function AccordionItemAction(_ref2) {
-  var icon = _ref2.icon,
-    _onClick = _ref2.onClick,
-    disabled = _ref2.disabled;
-  return /*#__PURE__*/_react.default.createElement(_Button.IconButton, {
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Accordion.Item.Action` component from the `@webiny/admin-ui` package instead.
+ */
+export const AccordionItemAction = ({
+  icon,
+  onClick,
+  tooltip,
+  disabled
+}) => {
+  const iconButton = /*#__PURE__*/React.createElement(IconButton, {
     disabled: disabled,
     icon: icon,
-    onClick: function onClick(e) {
+    onClick: e => {
       e.stopPropagation();
-      _onClick();
+      onClick();
     }
   });
+  if (!tooltip) {
+    return iconButton;
+  }
+  return /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "bottom",
+    content: tooltip
+  }, iconButton);
 };
-exports.AccordionItemAction = AccordionItemAction;
-var AccordionItemElement = function AccordionItemElement(_ref3) {
-  var element = _ref3.element;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    onClick: function onClick(e) {
-      return e.stopPropagation();
-    }
+/**
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Accordion.Item.Action` component from the `@webiny/admin-ui` package instead.
+ */
+export const AccordionItemElement = ({
+  element
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    onClick: e => e.stopPropagation()
   }, element);
 };
-exports.AccordionItemElement = AccordionItemElement;
 
 //# sourceMappingURL=AccordionItemActions.js.map

package/Accordion/AccordionItemActions.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_Button","AccordionItemActions","_ref","children","default","createElement","Fragment","exports","AccordionItemAction","_ref2","icon","onClick","disabled","IconButton","e","stopPropagation","AccordionItemElement","_ref3","element"],"sources":["AccordionItemActions.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconButton } from \"~/Button\";\n\ninterface AccordionItemActionsProps {\n    children: React.ReactNode;\n}\n\nexport const AccordionItemActions = ({ children }: AccordionItemActionsProps) => {\n    return <>{children}</>;\n};\n\nexport interface AccordionItemActionProps {\n    icon: JSX.Element;\n    onClick: () => void;\n    disabled?: boolean;\n}\n\nexport const AccordionItemAction = ({ icon, onClick, disabled }: AccordionItemActionProps) => {\n    return (\n        <IconButton\n            disabled={disabled}\n            icon={icon}\n            onClick={e => {\n                e.stopPropagation();\n                onClick();\n            }}\n        />\n    );\n};\n\nexport interface AccordionItemElementProps {\n    element: JSX.Element;\n}\n\nexport const AccordionItemElement = ({ element }: AccordionItemElementProps) => {\n    return <div onClick={e => e.stopPropagation()}>{element}</div>;\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAMO,IAAME,oBAAoB,GAAG,SAAvBA,oBAAoBA,CAAAC,IAAA,EAAgD;EAAA,IAA1CC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;EAC3C,oBAAON,MAAA,CAAAO,OAAA,CAAAC,aAAA,CAAAR,MAAA,CAAAO,OAAA,CAAAE,QAAA,QAAGH,QAAW,CAAC;AAC1B,CAAC;AAACI,OAAA,CAAAN,oBAAA,GAAAA,oBAAA;AAQK,IAAMO,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,KAAA,EAA8D;EAAA,IAAxDC,IAAI,GAAAD,KAAA,CAAJC,IAAI;IAAEC,QAAO,GAAAF,KAAA,CAAPE,OAAO;IAAEC,QAAQ,GAAAH,KAAA,CAARG,QAAQ;EACzD,oBACIf,MAAA,CAAAO,OAAA,CAAAC,aAAA,CAACL,OAAA,CAAAa,UAAU;IACPD,QAAQ,EAAEA,QAAS;IACnBF,IAAI,EAAEA,IAAK;IACXC,OAAO,EAAE,SAAAA,QAAAG,CAAC,EAAI;MACVA,CAAC,CAACC,eAAe,CAAC,CAAC;MACnBJ,QAAO,CAAC,CAAC;IACb;EAAE,CACL,CAAC;AAEV,CAAC;AAACJ,OAAA,CAAAC,mBAAA,GAAAA,mBAAA;AAMK,IAAMQ,oBAAoB,GAAG,SAAvBA,oBAAoBA,CAAAC,KAAA,EAA+C;EAAA,IAAzCC,OAAO,GAAAD,KAAA,CAAPC,OAAO;EAC1C,oBAAOrB,MAAA,CAAAO,OAAA,CAAAC,aAAA;IAAKM,OAAO,EAAE,SAAAA,QAAAG,CAAC;MAAA,OAAIA,CAAC,CAACC,eAAe,CAAC,CAAC;IAAA;EAAC,GAAEG,OAAa,CAAC;AAClE,CAAC;AAACX,OAAA,CAAAS,oBAAA,GAAAA,oBAAA"}
+{"version":3,"names":["React","IconButton","Tooltip","AccordionItemActions","children","createElement","Fragment","AccordionItemAction","icon","onClick","tooltip","disabled","iconButton","e","stopPropagation","placement","content","AccordionItemElement","element"],"sources":["AccordionItemActions.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconButton } from \"~/Button/index.js\";\nimport { Tooltip } from \"~/Tooltip/index.js\";\n\ninterface AccordionItemActionsProps {\n    children: React.ReactNode;\n}\n\nexport const AccordionItemActions = ({ children }: AccordionItemActionsProps) => {\n    return <>{children}</>;\n};\n\nexport interface AccordionItemActionProps {\n    icon: JSX.Element;\n    onClick: () => void;\n    tooltip?: string;\n    disabled?: boolean;\n}\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `Accordion.Item.Action` component from the `@webiny/admin-ui` package instead.\n */\nexport const AccordionItemAction = ({\n    icon,\n    onClick,\n    tooltip,\n    disabled\n}: AccordionItemActionProps) => {\n    const iconButton = (\n        <IconButton\n            disabled={disabled}\n            icon={icon}\n            onClick={e => {\n                e.stopPropagation();\n                onClick();\n            }}\n        />\n    );\n\n    if (!tooltip) {\n        return iconButton;\n    }\n\n    return (\n        <Tooltip placement={\"bottom\"} content={tooltip}>\n            {iconButton}\n        </Tooltip>\n    );\n};\n\nexport interface AccordionItemElementProps {\n    element: JSX.Element;\n}\n\n/**\n * @deprecated This component is deprecated and will be removed in future releases.\n * Please use the `Accordion.Item.Action` component from the `@webiny/admin-ui` package instead.\n */\nexport const AccordionItemElement = ({ element }: AccordionItemElementProps) => {\n    return <div onClick={e => e.stopPropagation()}>{element}</div>;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU;AACnB,SAASC,OAAO;AAMhB,OAAO,MAAMC,oBAAoB,GAAGA,CAAC;EAAEC;AAAoC,CAAC,KAAK;EAC7E,oBAAOJ,KAAA,CAAAK,aAAA,CAAAL,KAAA,CAAAM,QAAA,QAAGF,QAAW,CAAC;AAC1B,CAAC;AASD;AACA;AACA;AACA;AACA,OAAO,MAAMG,mBAAmB,GAAGA,CAAC;EAChCC,IAAI;EACJC,OAAO;EACPC,OAAO;EACPC;AACsB,CAAC,KAAK;EAC5B,MAAMC,UAAU,gBACZZ,KAAA,CAAAK,aAAA,CAACJ,UAAU;IACPU,QAAQ,EAAEA,QAAS;IACnBH,IAAI,EAAEA,IAAK;IACXC,OAAO,EAAEI,CAAC,IAAI;MACVA,CAAC,CAACC,eAAe,CAAC,CAAC;MACnBL,OAAO,CAAC,CAAC;IACb;EAAE,CACL,CACJ;EAED,IAAI,CAACC,OAAO,EAAE;IACV,OAAOE,UAAU;EACrB;EAEA,oBACIZ,KAAA,CAAAK,aAAA,CAACH,OAAO;IAACa,SAAS,EAAE,QAAS;IAACC,OAAO,EAAEN;EAAQ,GAC1CE,UACI,CAAC;AAElB,CAAC;AAMD;AACA;AACA;AACA;AACA,OAAO,MAAMK,oBAAoB,GAAGA,CAAC;EAAEC;AAAmC,CAAC,KAAK;EAC5E,oBAAOlB,KAAA,CAAAK,aAAA;IAAKI,OAAO,EAAEI,CAAC,IAAIA,CAAC,CAACC,eAAe,CAAC;EAAE,GAAEI,OAAa,CAAC;AAClE,CAAC","ignoreList":[]}

package/Accordion/index.d.ts

@@ -1,2 +1,2 @@
-export * from "./Accordion";
-export * from "./AccordionItem";
+export * from "./Accordion.js";
+export * from "./AccordionItem.js";

package/Accordion/index.js

@@ -1,29 +1,4 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _Accordion = require("./Accordion");
-Object.keys(_Accordion).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Accordion[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Accordion[key];
-    }
-  });
-});
-var _AccordionItem = require("./AccordionItem");
-Object.keys(_AccordionItem).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _AccordionItem[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _AccordionItem[key];
-    }
-  });
-});
+export * from "./Accordion.js";
+export * from "./AccordionItem.js";
 
 //# sourceMappingURL=index.js.map

package/Accordion/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Accordion","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_AccordionItem"],"sources":["index.ts"],"sourcesContent":["export * from \"./Accordion\";\nexport * from \"./AccordionItem\";\n"],"mappings":";;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,UAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,UAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,UAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,cAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,cAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,cAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAC,cAAA,CAAAL,GAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./Accordion.js\";\nexport * from \"./AccordionItem.js\";\n"],"mappings":"AAAA;AACA","ignoreList":[]}

package/Alert/Alert.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-export declare type AlertType = "success" | "info" | "warning" | "danger";
+export type AlertType = "success" | "info" | "warning" | "danger";
 export interface AlertProps {
     title: string;
     type: AlertType;
@@ -8,7 +8,8 @@ export interface AlertProps {
     style?: React.CSSProperties;
 }
 /**
- * Use Alert component to display user's avatar.
+ * @deprecated This component is deprecated and will be removed in future releases.
+ * Please use the `Alert` component from the `@webiny/admin-ui` package instead.
  */
-declare const Alert: (props: AlertProps) => JSX.Element;
+declare const Alert: (props: AlertProps) => React.JSX.Element;
 export { Alert };