@dilicorp/ui 0.2.7 → 0.2.8

package/dist/index.js

@@ -15,7 +15,6 @@ export * from './atoms/separator';
 export * from './atoms/spinner';
 export * from './atoms/typography';
 export * from './atoms/skeleton';
-export * from './atoms/panel/panel';
 export * from './atoms/pluxee-icon/pluxee-icon';
 // Molecules
 export * from './molecules/alert';
@@ -25,6 +24,8 @@ export * from './molecules/dropdown/dropdown';
 export * from './molecules/field';
 export * from './molecules/paginate';
 export * from './molecules/table';
+export * from './molecules/panel/panel';
+export * from './molecules/card-summary/card-summary';
 // Components
 export * from './components/form-builder/form-builder';
 export * from './components/side-navigation-bar/side-navigation-bar';
@@ -61,3 +62,4 @@ export { default as windowsHelper } from './utils/window-helper';
 // Images
 export * from './components/layout/pluxee-logo/pluxee-logo';
 export * from './components/layout/pluxee-logo/pluxee-logo-inverted';
+export * from './components/layout/pluxee-logo/pluxee-logo-card';

package/dist/molecules/card-summary/card-summary-body.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+declare type CardSummaryBodyProps = {
+    label: string | ReactNode;
+    labelClass?: string;
+    href?: string;
+};
+export declare const CardSummaryBody: {
+    ({ label, href, labelClass }: CardSummaryBodyProps): JSX.Element;
+    displayName: string;
+};
+export {};
+//# sourceMappingURL=card-summary-body.d.ts.map

package/dist/molecules/card-summary/card-summary-body.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+export const CardSummaryBody = ({ label, href, labelClass = 'fs-2' }) => {
+    return (React.createElement("div", { className: "dash-body" }, href
+        ? (React.createElement(Link, { className: "normal-link", to: href },
+            React.createElement("div", { className: `value ${labelClass}` }, label)))
+        : (React.createElement("div", { className: `value ${labelClass}` }, label))));
+};
+CardSummaryBody.displayName = 'CardSummaryBody';

package/dist/molecules/card-summary/card-summary-container.d.ts

@@ -0,0 +1,14 @@
+import { HtmlHTMLAttributes, ReactNode } from 'react';
+import { SkeletonProps } from 'react-loading-skeleton';
+declare type CardSummaryContainerProps = {
+    children: ReactNode;
+    loading?: boolean;
+    skeleton?: SkeletonProps;
+    color?: 'primary' | 'primary-contrast' | 'success' | 'default';
+} & HtmlHTMLAttributes<HTMLDivElement>;
+export declare const CardSummaryContainer: {
+    ({ children, className, loading, color, skeleton }: CardSummaryContainerProps): JSX.Element;
+    displayName: string;
+};
+export {};
+//# sourceMappingURL=card-summary-container.d.ts.map

package/dist/molecules/card-summary/card-summary-container.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { Skeleton } from '../../atoms/skeleton';
+import classNames from 'classnames';
+export const CardSummaryContainer = ({ children, className, loading, color = 'primary-contrast', skeleton = {
+    height: 188,
+    count: 1,
+    duration: 0.9,
+    containerClassName: 'col',
+    style: {
+        marginTop: 32, marginBottom: '2rem'
+    }
+} }) => {
+    if (loading) {
+        return React.createElement(Skeleton, Object.assign({}, skeleton));
+    }
+    const classes = classNames(`dashboard-card-item ${color}`, className);
+    return (React.createElement("div", { className: classes }, children));
+};
+CardSummaryContainer.displayName = 'CardSummaryContainer';

package/dist/molecules/card-summary/card-summary-footer.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+declare type CardSummaryFooterProps = {
+    label: string;
+    href?: string;
+    button?: {
+        label: string;
+        href: string;
+    };
+};
+export declare const CardSummaryFooter: {
+    ({ label, href, button }: CardSummaryFooterProps): JSX.Element;
+    displayName: string;
+};
+export {};
+//# sourceMappingURL=card-summary-footer.d.ts.map

package/dist/molecules/card-summary/card-summary-footer.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+import { Button } from '../../atoms/button';
+export const CardSummaryFooter = ({ label, href, button }) => {
+    return (React.createElement("div", { className: "dash-footer" },
+        href
+            ? (React.createElement(Link, { className: "normal-link", to: href }, label))
+            : React.createElement(React.Fragment, null, label),
+        button && React.createElement(Button, { small: true, href: button.href }, button.label)));
+};
+CardSummaryFooter.displayName = 'CardSummaryFooter';

package/dist/molecules/card-summary/card-summary-header.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+declare type CardSummaryHeaderProps = {
+    label: string;
+    href?: string;
+};
+export declare const CardSummaryHeader: {
+    ({ label, href }: CardSummaryHeaderProps): JSX.Element;
+    displayName: string;
+};
+export {};
+//# sourceMappingURL=card-summary-header.d.ts.map

package/dist/molecules/card-summary/card-summary-header.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+export const CardSummaryHeader = ({ label, href }) => {
+    return (React.createElement("div", { className: "dash-header" }, href
+        ? (React.createElement(Link, { className: "normal-link", to: href },
+            React.createElement("div", { className: "dash-title" }, label)))
+        : (React.createElement("div", { className: "dash-title" }, label))));
+};
+CardSummaryHeader.displayName = 'CardSummaryHeader';

package/dist/molecules/card-summary/card-summary.d.ts

@@ -0,0 +1,39 @@
+/// <reference types="react" />
+export declare const CardSummary: {
+    Container: {
+        ({ children, className, loading, color, skeleton }: {
+            children: import("react").ReactNode;
+            loading?: boolean | undefined;
+            skeleton?: import("react-loading-skeleton").SkeletonProps | undefined;
+            color?: "primary" | "success" | "default" | "primary-contrast" | undefined;
+        } & import("react").HtmlHTMLAttributes<HTMLDivElement>): JSX.Element;
+        displayName: string;
+    };
+    Header: {
+        ({ label, href }: {
+            label: string;
+            href?: string | undefined;
+        }): JSX.Element;
+        displayName: string;
+    };
+    Body: {
+        ({ label, href, labelClass }: {
+            label: import("react").ReactNode;
+            labelClass?: string | undefined;
+            href?: string | undefined;
+        }): JSX.Element;
+        displayName: string;
+    };
+    Footer: {
+        ({ label, href, button }: {
+            label: string;
+            href?: string | undefined;
+            button?: {
+                label: string;
+                href: string;
+            } | undefined;
+        }): JSX.Element;
+        displayName: string;
+    };
+};
+//# sourceMappingURL=card-summary.d.ts.map

package/dist/molecules/card-summary/card-summary.js

@@ -0,0 +1,10 @@
+import { CardSummaryBody } from './card-summary-body';
+import { CardSummaryContainer } from './card-summary-container';
+import { CardSummaryFooter } from './card-summary-footer';
+import { CardSummaryHeader } from './card-summary-header';
+export const CardSummary = {
+    Container: CardSummaryContainer,
+    Header: CardSummaryHeader,
+    Body: CardSummaryBody,
+    Footer: CardSummaryFooter
+};

package/dist/molecules/panel/panel-container.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+declare type PanelContainerProps = {
+    children: React.ReactNode;
+    type?: 'row' | 'flex';
+    containerClassName?: string;
+} & React.HTMLAttributes<HTMLDivElement>;
+export declare const PanelContainer: {
+    ({ children, className, type, containerClassName }: PanelContainerProps): JSX.Element;
+    displayName: string;
+};
+export {};
+//# sourceMappingURL=panel-container.d.ts.map

package/dist/molecules/panel/panel-container.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import classNames from 'classnames';
+export const PanelContainer = ({ children, className, type = 'row', containerClassName }) => {
+    const classes = classNames(className, type === 'row' ? 'row' : 'd-flex');
+    const classesContainer = classNames(containerClassName, 'panel-container');
+    return (React.createElement("div", { className: classesContainer },
+        React.createElement("div", { className: classes }, children)));
+};
+PanelContainer.displayName = 'PanelContainer';

package/dist/molecules/panel/panel-field.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+declare type PanelFieldProps = {
+    label: string;
+    value?: React.ReactNode;
+    forceShow?: boolean;
+};
+export declare const PanelField: {
+    ({ label, value, forceShow }: PanelFieldProps): JSX.Element | null;
+    displayName: string;
+};
+export {};
+//# sourceMappingURL=panel-field.d.ts.map

package/dist/molecules/panel/panel-field.js

@@ -0,0 +1,12 @@
+import React from 'react';
+export const PanelField = ({ label, value, forceShow = true }) => {
+    if (!forceShow && !value)
+        return null;
+    return (React.createElement("div", { className: "panel-field" },
+        label ? React.createElement(React.Fragment, null,
+            label,
+            ":") : '',
+        " ",
+        React.createElement("strong", null, value)));
+};
+PanelField.displayName = 'PanelField';

package/dist/molecules/panel/panel-group.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { ColProps } from '../../atoms/col';
+declare type Props = {
+    label?: string;
+    value?: React.ReactNode | string;
+    big?: boolean;
+    upper?: boolean;
+} & ColProps;
+export declare const PanelGroup: {
+    ({ value, label, size, big, upper }: Props): JSX.Element;
+    displayName: string;
+};
+export {};
+//# sourceMappingURL=panel-group.d.ts.map

package/dist/molecules/panel/panel-group.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import { Col } from '../../atoms/col';
+export const PanelGroup = ({ value, label, size = [12, 6], big = false, upper = true }) => {
+    return (React.createElement(Col, { size: size },
+        React.createElement("div", { className: "panel-group" },
+            React.createElement("label", null, label),
+            React.createElement("div", { className: `${upper ? ' upper' : ''} text${big ? ' big' : ''}` }, value || '-'))));
+};
+PanelGroup.displayName = 'PanelGroup';

package/dist/molecules/panel/panel.d.ts

@@ -0,0 +1,31 @@
+/// <reference types="react" />
+export declare const Panel: {
+    Container: {
+        ({ children, className, type, containerClassName }: {
+            children: import("react").ReactNode;
+            type?: "row" | "flex" | undefined;
+            containerClassName?: string | undefined;
+        } & import("react").HTMLAttributes<HTMLDivElement>): JSX.Element;
+        displayName: string;
+    };
+    Group: {
+        ({ value, label, size, big, upper }: {
+            label?: string | undefined;
+            value?: import("react").ReactNode;
+            big?: boolean | undefined;
+            upper?: boolean | undefined;
+        } & {
+            size?: boolean | ("none" | 1 | 2 | 3 | 4 | 5 | "auto" | 6 | 7 | 8 | 9 | 10 | 11 | 12) | ("none" | 1 | 2 | 3 | 4 | 5 | "auto" | 6 | 7 | 8 | 9 | 10 | 11 | 12)[] | undefined;
+        } & import("react").HTMLAttributes<HTMLDivElement>): JSX.Element;
+        displayName: string;
+    };
+    Field: {
+        ({ label, value, forceShow }: {
+            label: string;
+            value?: import("react").ReactNode;
+            forceShow?: boolean | undefined;
+        }): JSX.Element | null;
+        displayName: string;
+    };
+};
+//# sourceMappingURL=panel.d.ts.map

package/dist/molecules/panel/panel.js

@@ -0,0 +1,8 @@
+import { PanelContainer } from './panel-container';
+import { PanelField } from './panel-field';
+import { PanelGroup } from './panel-group';
+export const Panel = {
+    Container: PanelContainer,
+    Group: PanelGroup,
+    Field: PanelField
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dilicorp/ui",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "description": "A simple UI design for Dilicorp",
   "repository": {
     "type": "git",