@appquality/unguess-design-system 2.8.35 → 2.9.0

package/CHANGELOG.md

@@ -1,3 +1,39 @@
+# v2.9.0 (Fri Apr 29 2022)
+
+#### 🚀 Enhancement
+
+- Cup 646 allow creation on select [#45](https://github.com/AppQuality/unguess-design-system/pull/45) ([@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 1
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+
+---
+
+# v2.8.37 (Thu Apr 28 2022)
+
+#### 🐛 Bug Fix
+
+- Cup 642 modal fullscreen [#44](https://github.com/AppQuality/unguess-design-system/pull/44) ([@marcbon](https://github.com/marcbon))
+
+#### Authors: 1
+
+- Marco Bonomo ([@marcbon](https://github.com/marcbon))
+
+---
+
+# v2.8.36 (Thu Apr 28 2022)
+
+#### ⚠️ Pushed to `master`
+
+- fix(campaignscard): pillIcon cannot be used as JSX component ([@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 1
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+
+---
+
 # v2.8.35 (Wed Apr 27 2022)
 
 #### ⚠️ Pushed to `master`

package/build/hooks/useDebounce.d.ts

@@ -0,0 +1,2 @@
+declare function useDebounce<T>(value: T, delay?: number): T;
+export default useDebounce;

package/build/index.d.ts

@@ -18,6 +18,7 @@ export * from "./stories/dropdowns/item";
 export * from "./stories/dropdowns/menu";
 export * from "./stories/dropdowns/multiselect";
 export * from "./stories/dropdowns/select";
+export * from "./stories/dropdowns/autocomplete";
 export * from "./stories/forms/checkbox";
 export * as FormField from "./stories/forms/field";
 export * from "./stories/forms/input";

package/build/index.js

@@ -606,18 +606,18 @@ var getStatusIcon = function (status) {
             return SvgOnGoingStatusRoundIcon;
         case "INCOMING":
             return SvgArrivalStatusRoundIcon;
+        default:
+            return SvgOnGoingStatusRoundIcon;
     }
 };
-var getTypeData = function (type) {
+var getTypeDataIcon = function (type) {
     switch (type) {
         case "EXPERIENTIAL":
-            return {
-                pillIcon: SvgRegressionTestRoundIcon,
-            };
+            return SvgRegressionTestRoundIcon;
         case "FUNCTIONAL":
-            return {
-                pillIcon: SvgFunctionalTestRoundIcon,
-            };
+            return SvgFunctionalTestRoundIcon;
+        default:
+            return SvgFunctionalTestRoundIcon;
     }
 };
 var Wrapper$1 = styled__default["default"](Card)(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n  border-radius: ", ";\n  padding: ", ";\n  border: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n\n  &:hover {\n    box-shadow: ", ";\n  }\n\n  cursor: pointer;\n"], ["\n  border-radius: ", ";\n  padding: ", ";\n  border: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n\n  &:hover {\n    box-shadow: ", ";\n  }\n\n  cursor: pointer;\n"])), function (_a) {
@@ -683,8 +683,7 @@ var CardFooter$1 = styled__default["default"].div(templateObject_9 || (templateO
 var CampaignCard = function (props) {
     var isNew = props.isNew, date = props.date, projectTitle = props.projectTitle, campaignTitle = props.campaignTitle, status = props.status, type = props.type, labelNew = props.labelNew;
     var StatusIcon = getStatusIcon(status !== null && status !== void 0 ? status : "PROGRESS");
-    var typeData = getTypeData(type);
-    var PillIcon = typeData === null || typeData === void 0 ? void 0 : typeData.pillIcon;
+    var PillIcon = getTypeDataIcon(type);
     var projectTitleCut = projectTitle;
     if (projectTitle.length > 42) {
         projectTitleCut = "".concat(projectTitle.substring(0, 39), "...");
@@ -693,7 +692,7 @@ var CampaignCard = function (props) {
     if (campaignTitle.length > 29) {
         campaignTitleCut = "".concat(campaignTitle.substring(0, 26), "...");
     }
-    return props.isLoading ? (jsxRuntime.jsx(CampaignCardSkeleton, {})) : (jsxRuntime.jsxs(Wrapper$1, __assign({}, props, { children: [jsxRuntime.jsxs(CardHeader, { children: [jsxRuntime.jsx(StyledLabel$1, __assign({ isRegular: true }, { children: date })), isNew && (jsxRuntime.jsx(StyledTagNew$1, __assign({ hue: theme.palette.fuschia["600"], isPill: true, size: "medium", title: labelNew ? labelNew : "New!" }, { children: labelNew ? labelNew : "New!" })))] }), jsxRuntime.jsxs(CardBody$1, { children: [jsxRuntime.jsx(StyledLabel$1, __assign({ isRegular: true }, { children: projectTitleCut })), jsxRuntime.jsx(StyledTitleLabel$1, __assign({ isRegular: true }, { children: campaignTitleCut }))] }), jsxRuntime.jsx(Divider$1, {}), jsxRuntime.jsxs(CardFooter$1, { children: [typeData && (jsxRuntime.jsxs(StyledTag$1, __assign({ size: "large", isPill: true, isRegular: true, hue: theme.palette.grey[100] }, { children: [jsxRuntime.jsx(Tag.Avatar, { children: jsxRuntime.jsx(PillIcon, {}) }), props.pillText] }))), jsxRuntime.jsx(StatusIcon, {})] })] })));
+    return props.isLoading ? (jsxRuntime.jsx(CampaignCardSkeleton, {})) : (jsxRuntime.jsxs(Wrapper$1, __assign({}, props, { children: [jsxRuntime.jsxs(CardHeader, { children: [jsxRuntime.jsx(StyledLabel$1, __assign({ isRegular: true }, { children: date })), isNew && (jsxRuntime.jsx(StyledTagNew$1, __assign({ hue: theme.palette.fuschia["600"], isPill: true, size: "medium", title: labelNew ? labelNew : "New!" }, { children: labelNew ? labelNew : "New!" })))] }), jsxRuntime.jsxs(CardBody$1, { children: [jsxRuntime.jsx(StyledLabel$1, __assign({ isRegular: true }, { children: projectTitleCut })), jsxRuntime.jsx(StyledTitleLabel$1, __assign({ isRegular: true }, { children: campaignTitleCut }))] }), jsxRuntime.jsx(Divider$1, {}), jsxRuntime.jsxs(CardFooter$1, { children: [props.pillText && (jsxRuntime.jsxs(StyledTag$1, __assign({ size: "large", isPill: true, isRegular: true, hue: theme.palette.grey[100] }, { children: [jsxRuntime.jsx(Tag.Avatar, { children: jsxRuntime.jsx(PillIcon, {}) }), props.pillText] }))), jsxRuntime.jsx(StatusIcon, {})] })] })));
 };
 var templateObject_1$L, templateObject_2$d, templateObject_3$8, templateObject_4$4, templateObject_5$2, templateObject_6$2, templateObject_7$1, templateObject_8$1, templateObject_9;
 
@@ -1067,6 +1066,17 @@ var Dropdown = function (props) { return (jsxRuntime.jsx(reactDropdowns.Dropdown
 var Message = function (props) { return jsxRuntime.jsx(reactDropdowns.Message, __assign({}, props)); };
 var templateObject_1$F;
 
+/**
+ * Autocomplete is an input field that filters results as users type. This helps users find something quickly in a large list of options.
+ * <hr>
+ * Used for this:
+    - To filter down a large list of options
+    - To quickly find a known option
+ * Not for this:
+    - To make more than one selection, use Multiselect instead
+ */
+var Autocomplete = function (props) { return jsxRuntime.jsx(reactDropdowns.Autocomplete, __assign({}, props)); };
+
 var UgCheckbox = styled__default["default"](reactForms.Checkbox)(templateObject_1$E || (templateObject_1$E = __makeTemplateObject([""], [""])));
 /**
    * A Checkbox lets users select and unselect options from a list.
@@ -2212,6 +2222,7 @@ Object.defineProperty(exports, 'ModalClose', {
 exports.Accordion = Accordion;
 exports.Anchor = Anchor;
 exports.AppHeader = AppHeader;
+exports.Autocomplete = Autocomplete;
 exports.Avatar = Avatar;
 exports.Blockquote = Blockquote;
 exports.Body = Body$1;

package/build/stories/dropdowns/autocomplete/_types.d.ts

@@ -0,0 +1,3 @@
+import { IAutocompleteProps } from "@zendeskgarden/react-dropdowns";
+export interface AutocompleteArgs extends IAutocompleteProps {
+}

package/build/stories/dropdowns/autocomplete/index.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { AutocompleteArgs } from "./_types";
+/**
+ * Autocomplete is an input field that filters results as users type. This helps users find something quickly in a large list of options.
+ * <hr>
+ * Used for this:
+    - To filter down a large list of options
+    - To quickly find a known option
+ * Not for this:
+    - To make more than one selection, use Multiselect instead
+ */
+declare const Autocomplete: (props: AutocompleteArgs) => JSX.Element;
+export { Autocomplete };

package/build/stories/dropdowns/autocomplete/index.stories.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { ComponentMeta, Story } from "@storybook/react";
+import { AutocompleteArgs } from "./_types";
+interface AutocompleteStoryArgs extends AutocompleteArgs {
+    allowNew?: boolean;
+}
+export declare const Default: Story<AutocompleteStoryArgs>;
+declare const _default: ComponentMeta<(props: AutocompleteArgs) => JSX.Element>;
+export default _default;

package/build/stories/modals/fullscreen/index.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { ModalArgs } from "../_types";
+declare const ModalFullScreen: {
+    (props: ModalArgs): JSX.Element;
+    Header: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@zendeskgarden/react-modals/dist/typings/elements/Header").IHeaderProps & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
+    Body: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
+    Footer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
+    Close: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>, any, {}, never>;
+    FooterItem: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLSpanElement> & import("react").RefAttributes<HTMLSpanElement>>;
+};
+export { ModalFullScreen };

package/build/stories/modals/fullscreen/index.stories.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { ModalArgs } from "../_types";
+import { ComponentMeta, Story } from "@storybook/react";
+interface ModalStoryArgs extends ModalArgs {
+    breadcrumbs?: any;
+    isDanger?: boolean;
+}
+export declare const Default: Story<ModalStoryArgs>;
+declare const _default: ComponentMeta<{
+    (props: ModalArgs): JSX.Element;
+    Header: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@zendeskgarden/react-modals/dist/typings/elements/Header").IHeaderProps & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
+    Body: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
+    Footer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
+    Close: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>, any, {}, never>;
+    FooterItem: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLSpanElement> & import("react").RefAttributes<HTMLSpanElement>>;
+}>;
+export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appquality/unguess-design-system",
-  "version": "2.8.35",
+  "version": "2.9.0",
   "dependencies": {
     "@zendeskgarden/css-bedrock": "^9.0.0",
     "@zendeskgarden/react-accordions": "^8.49.0",