@appquality/unguess-design-system 2.10.52 → 2.10.53

package/CHANGELOG.md

@@ -1,3 +1,16 @@
+# v2.10.53 (Mon Jun 20 2022)
+
+#### 🐛 Bug Fix
+
+- Cup 823 page header [#72](https://github.com/AppQuality/unguess-design-system/pull/72) ([@marcbon](https://github.com/marcbon) [@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 2
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+- Marco Bonomo ([@marcbon](https://github.com/marcbon))
+
+---
+
 # v2.10.49 (Mon Jun 20 2022)
 
 #### 🐛 Bug Fix

package/build/index.js

@@ -239,7 +239,9 @@ var gradients = {
 };
 
 var _a, _b, _c, _d, _e, _f, _g$3, _h;
-var components = __assign(__assign({}, reactTheming.DEFAULT_THEME.components), { chrome: __assign(__assign({}, (_a = reactTheming.DEFAULT_THEME.components) === null || _a === void 0 ? void 0 : _a.chrome), { header: __assign(__assign({}, (_c = (_b = reactTheming.DEFAULT_THEME.components) === null || _b === void 0 ? void 0 : _b.chrome) === null || _c === void 0 ? void 0 : _c.header), { height: "64px" }), nav: __assign(__assign({}, (_e = (_d = reactTheming.DEFAULT_THEME.components) === null || _d === void 0 ? void 0 : _d.chrome) === null || _e === void 0 ? void 0 : _e.nav), { openWidth: 240, closedWidth: 36, workspaceDropdownWidth: 192 }) }), notification: __assign(__assign({}, (_f = reactTheming.DEFAULT_THEME.components) === null || _f === void 0 ? void 0 : _f.notification), { card: __assign(__assign({}, (_h = (_g$3 = reactTheming.DEFAULT_THEME.components) === null || _g$3 === void 0 ? void 0 : _g$3.notification) === null || _h === void 0 ? void 0 : _h.well), { padding: "16px" }) }) });
+var components = __assign(__assign({}, reactTheming.DEFAULT_THEME.components), { chrome: __assign(__assign({}, (_a = reactTheming.DEFAULT_THEME.components) === null || _a === void 0 ? void 0 : _a.chrome), { header: __assign(__assign({}, (_c = (_b = reactTheming.DEFAULT_THEME.components) === null || _b === void 0 ? void 0 : _b.chrome) === null || _c === void 0 ? void 0 : _c.header), { height: "64px" }), nav: __assign(__assign({}, (_e = (_d = reactTheming.DEFAULT_THEME.components) === null || _d === void 0 ? void 0 : _d.chrome) === null || _e === void 0 ? void 0 : _e.nav), { openWidth: 240, closedWidth: 36, workspaceDropdownWidth: 192 }) }), notification: __assign(__assign({}, (_f = reactTheming.DEFAULT_THEME.components) === null || _f === void 0 ? void 0 : _f.notification), { card: __assign(__assign({}, (_h = (_g$3 = reactTheming.DEFAULT_THEME.components) === null || _g$3 === void 0 ? void 0 : _g$3.notification) === null || _h === void 0 ? void 0 : _h.well), { padding: "16px" }) }), pageHeader: {
+        imgMaxHeight: "214px",
+    } });
 
 var theme = __assign(__assign({}, reactTheming.DEFAULT_THEME), { colors: __assign(__assign({}, reactTheming.DEFAULT_THEME.colors), { primaryHue: palette.blue[600], warningHue: palette.yellow[600], successHue: palette.teal["M600"], dangerHue: palette.red[400], accentHue: palette.water[600] }), palette: palette, fonts: __assign(__assign({}, reactTheming.DEFAULT_THEME.fonts), { system: '"Poppins",sans-serif,Helvetica,Arial,sans-serif' }), fontWeights: __assign(__assign({}, reactTheming.DEFAULT_THEME.fontWeights), { semibold: 500 }), gradients: gradients, borderRadii: __assign(__assign({}, reactTheming.DEFAULT_THEME.borderRadii), { lg: "8px", xl: "16px", xxl: "32px" }), components: components, shadows: __assign(__assign({}, reactTheming.DEFAULT_THEME.shadows), { boxShadow: boxShadow }) });
 

package/build/stories/navigation/page-header/_types.d.ts

@@ -0,0 +1,10 @@
+import React, { HTMLAttributes } from "react";
+export interface PageHeaderProps extends HTMLAttributes<HTMLDivElement> {
+}
+export interface PageHeaderMainProps extends HTMLAttributes<HTMLDivElement> {
+    infoTitle: string;
+    infoOverline?: string;
+    infoDescription?: string;
+    infoCounters?: Array<React.ReactNode>;
+    metaImage?: string;
+}

package/build/stories/navigation/page-header/index.d.ts

@@ -0,0 +1,17 @@
+import { PageHeaderProps } from "./_types";
+import { BreadcrumbArgs } from "../../breadcrumbs/_types";
+import { PropsWithChildren } from "react";
+/**
+ * A PageHeader is a modular container used for pages with an opinionated set of default spaces and subcomponents order.
+ * <hr>
+ * Used for this:
+    - Display page informations and meta data
+    - As a container for the top part of the page
+ */
+declare const PageHeader: {
+    (props: PageHeaderProps): JSX.Element;
+    Breadcrumb: (props: BreadcrumbArgs) => JSX.Element;
+    Main: (props: import("./_types").PageHeaderMainProps) => JSX.Element;
+    Buttons: (props: PropsWithChildren<{}>) => JSX.Element;
+};
+export { PageHeader };

package/build/stories/navigation/page-header/index.stories.d.ts

@@ -0,0 +1,19 @@
+import { ComponentMeta, Story } from "@storybook/react";
+import { PageHeaderMainProps } from "./_types";
+import React from "react";
+interface PageHeaderStoryProps {
+    pageHeaderArgs: {
+        buttons: Array<React.ReactNode>;
+    };
+    pageHeaderMainArgs: PageHeaderMainProps;
+}
+export declare const Default: Story<PageHeaderStoryProps>;
+declare const _default: ComponentMeta<{
+    (props: import("./_types").PageHeaderProps): JSX.Element;
+    Breadcrumb: (props: import("../../breadcrumbs/_types").BreadcrumbArgs) => JSX.Element;
+    Main: (props: PageHeaderMainProps) => JSX.Element;
+    Buttons: (props: {
+        children?: React.ReactNode;
+    }) => JSX.Element;
+}>;
+export default _default;

package/build/stories/navigation/page-header/styled/main.d.ts

@@ -0,0 +1,2 @@
+import { PageHeaderMainProps } from "../_types";
+export declare const Main: (props: PageHeaderMainProps) => JSX.Element;

package/build/stories/theme/components.d.ts

@@ -1,4 +1,7 @@
 export declare const components: {
     chrome: any;
     notification: any;
+    pageHeader: {
+        imgMaxHeight: string;
+    };
 };

package/build/stories/theme/index.d.ts

@@ -189,6 +189,9 @@ declare const theme: {
     components: {
         chrome: any;
         notification: any;
+        pageHeader: {
+            imgMaxHeight: string;
+        };
     };
     shadows: {
         boxShadow: (theme: import("@zendeskgarden/react-theming").IGardenTheme) => string;

package/package.json

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