@dilicorp/ui 0.2.9 → 0.2.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ export declare const IconIdentification: {
3
+ (): JSX.Element;
4
+ displayName: string;
5
+ };
6
+ //# sourceMappingURL=icon-identification.d.ts.map
@@ -0,0 +1,10 @@
1
+ import React from 'react';
2
+ export const IconIdentification = () => {
3
+ return (React.createElement(React.Fragment, null,
4
+ React.createElement("path", { d: "M8 0H0V8H3V3H8V0Z", fill: "currentColor" }),
5
+ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M18.7705 16.3235C20.6897 15.3226 22 13.3143 22 11C22 7.68629 19.3137 5 16 5C12.6863 5 10 7.68629 10 11C10 13.3143 11.3103 15.3226 13.2295 16.3235C9.40574 17.2415 6.38992 20.0542 5.3716 24C5.12925 24.9391 5.00004 25.9423 5 26.9995L27 27C27 25.9428 26.8708 24.9391 26.6284 24C25.6101 20.0541 22.5943 17.2414 18.7705 16.3235ZM19 11C19 12.6569 17.6569 14 16 14C14.3431 14 13 12.6569 13 11C13 9.34315 14.3431 8 16 8C17.6569 8 19 9.34315 19 11ZM8.51226 24C9.64125 20.9175 12.5217 19 16 19C19.4783 19 22.3588 20.9175 23.4877 24H8.51226Z", fill: "currentColor" }),
6
+ React.createElement("path", { d: "M32 0V8H29V3H24V0H32Z", fill: "currentColor" }),
7
+ React.createElement("path", { d: "M24 32H32V24H29V29H24V32Z", fill: "currentColor" }),
8
+ React.createElement("path", { d: "M0 32V24H3V29H8V32H0Z", fill: "currentColor" })));
9
+ };
10
+ IconIdentification.displayName = 'IconIdentification';
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ export declare const IconNegotiation: {
3
+ (): JSX.Element;
4
+ displayName: string;
5
+ };
6
+ //# sourceMappingURL=icon-negotiation.d.ts.map
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ export const IconNegotiation = () => {
3
+ return (React.createElement(React.Fragment, null,
4
+ React.createElement("path", { d: "M17.707 4.86586L25.6471 10.066L32.0006 9.82591V7.15586L26.3938 7.36591L17.6737 1.65576L13.4703 4.53252H0V7.19924H9.57683L7.06344 8.91924L6.96346 8.9959C5.62344 10.1126 5.24344 12.0393 6.05679 13.5827C6.92347 15.2227 8.89016 15.9727 10.6302 15.326L14.6436 13.8327L16.6636 15.7727L23.4371 22.3095C23.6671 22.5429 23.6671 22.9196 23.4371 23.1529C23.2071 23.3862 22.8271 23.3862 22.5937 23.1529L15.9536 16.4627L14.0603 18.3427L20.8437 25.1695C21.0771 25.4029 21.0771 25.7795 20.8437 26.0129C20.6104 26.2462 20.2304 26.2462 19.997 26.0129L13.2479 19.1547L11.3612 21.0381L17.157 26.9429C17.277 27.0863 17.3003 27.2396 17.3003 27.3229C17.3003 27.4162 17.277 27.5929 17.1236 27.7462C16.8903 27.9796 16.5136 27.9762 16.2803 27.7462L10.4602 21.9061L8.57014 23.7895L13.2703 28.5029C13.4603 28.7629 13.4402 29.133 13.2036 29.3663C12.9436 29.6263 12.5202 29.6263 12.2602 29.3663L12.2502 29.3763L0 17.1261V20.8962L10.4002 31.2963L10.4135 31.283C11.0602 31.9097 11.8969 32.223 12.7335 32.223C13.5702 32.223 14.4403 31.8963 15.0903 31.2463C15.3403 30.9963 15.5403 30.7163 15.6936 30.4196C16.0136 30.523 16.3536 30.5796 16.7003 30.5796C17.5736 30.5796 18.3903 30.2397 19.007 29.623C19.267 29.363 19.4737 29.0663 19.6304 28.7463C19.887 28.8096 20.1537 28.8463 20.417 28.8463C21.2537 28.8463 22.0904 28.5296 22.7238 27.893C23.2604 27.3563 23.5871 26.6629 23.6638 25.9162C24.2704 25.7929 24.8471 25.4996 25.3171 25.0296C26.4338 23.9162 26.5705 22.1861 25.7304 20.9195L31.9939 20.6728V18.0061L23.2071 18.3594L15.2736 10.7426L9.69016 12.8194C9.20015 12.9994 8.64681 12.7893 8.40347 12.3293C8.18347 11.9093 8.27348 11.3893 8.62015 11.0726L17.697 4.85919L17.707 4.86586Z", fill: "currentColor" })));
5
+ };
6
+ IconNegotiation.displayName = 'IconNegotiation';
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ export declare const IconQrcode: {
3
+ (): JSX.Element;
4
+ displayName: string;
5
+ };
6
+ //# sourceMappingURL=icon-qrcode.d.ts.map
@@ -0,0 +1,17 @@
1
+ import React from 'react';
2
+ export const IconQrcode = () => {
3
+ return (React.createElement(React.Fragment, null,
4
+ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8 3.49691e-07H0V8H3V3H8V3.49691e-07Z", fill: "currentColor" }),
5
+ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M24 32H32V24H29V29H24V32Z", fill: "currentColor" }),
6
+ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M32 8V3.49691e-07L24 0V3L29 3V8H32Z", fill: "currentColor" }),
7
+ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.04907e-06 24L0 32H8V29L3 29L3 24H1.04907e-06Z", fill: "currentColor" }),
8
+ React.createElement("path", { d: "M5.5 8H8.5V24H5.5V8Z", fill: "currentColor" }),
9
+ React.createElement("path", { d: "M10 8H13V18H10V8Z", fill: "currentColor" }),
10
+ React.createElement("path", { d: "M10 20H13V24H10V20Z", fill: "currentColor" }),
11
+ React.createElement("path", { d: "M14.5 8H17.5V24H14.5V8Z", fill: "currentColor" }),
12
+ React.createElement("path", { d: "M19 14H22V18H19V14Z", fill: "currentColor" }),
13
+ React.createElement("path", { d: "M19 8H22V12H19V8Z", fill: "currentColor" }),
14
+ React.createElement("path", { d: "M19 20H22V24H19V20Z", fill: "currentColor" }),
15
+ React.createElement("path", { d: "M23.5 8H26.5V24H23.5V8Z", fill: "currentColor" })));
16
+ };
17
+ IconQrcode.displayName = 'IconQrcode';
@@ -1,4 +1,11 @@
1
1
  /// <reference types="react" />
2
+ export declare const IconsList: {
3
+ key: string;
4
+ Element: {
5
+ (): JSX.Element;
6
+ displayName: string;
7
+ };
8
+ }[];
2
9
  export declare type PluxeeIconColors = 'primary' | 'primary-contrast' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'white';
3
10
  declare type PluxeeIconProps = {
4
11
  icon: string;
@@ -32,7 +32,10 @@ import { IconClock } from './icon-clock';
32
32
  import { IconUpdateLimit } from './icon-update-limit';
33
33
  import { IconUserGroup } from './icon-user-group';
34
34
  import { IconEyeClosedOutline } from './icon-eye-closed-outline';
35
- const IconsList = [
35
+ import { IconNegotiation } from './icon-negotiation';
36
+ import { IconQrcode } from './icon-qrcode';
37
+ import { IconIdentification } from './icon-identification';
38
+ export const IconsList = [
36
39
  { key: 'fa-double-chevron-left', Element: IconDoubleChevronLeft },
37
40
  { key: 'fa-double-chevron-right', Element: IconDoubleChevronRight },
38
41
  { key: 'fa-home', Element: IconHome },
@@ -79,7 +82,10 @@ const IconsList = [
79
82
  { key: 'fa-card-slashed', Element: IconCardSlashed },
80
83
  { key: 'fa-clock-circle', Element: IconClock },
81
84
  { key: 'fa-update-limit', Element: IconUpdateLimit },
82
- { key: 'fa-user-group', Element: IconUserGroup }
85
+ { key: 'fa-user-group', Element: IconUserGroup },
86
+ { key: 'fa-negotiation', Element: IconNegotiation },
87
+ { key: 'fa-qrcode', Element: IconQrcode },
88
+ { key: 'fa-identification', Element: IconIdentification }
83
89
  ];
84
90
  export const PluxeeIcon = ({ icon, size = 'md' }) => {
85
91
  const item = IconsList.find(item => item.key === icon);
@@ -14,7 +14,7 @@ import { positions, Provider } from 'react-alert';
14
14
  import { AlertTemplate } from './alert-template';
15
15
  const options = {
16
16
  position: positions.MIDDLE,
17
- timeout: 5000
17
+ timeout: 10000
18
18
  };
19
19
  export const AlertProvider = (_a) => {
20
20
  var { children } = _a, props = __rest(_a, ["children"]);
@@ -8,6 +8,7 @@ export declare type SideNavigationBarItemProps = LinkProps & {
8
8
  items?: SideNavigationBarItemProps[];
9
9
  dataLink?: boolean;
10
10
  pathname?: string;
11
+ iconSize?: 'lg' | 'md' | 'sm';
11
12
  };
12
13
  export declare const SideNavigationBarItem: React.FC<SideNavigationBarItemProps>;
13
14
  //# sourceMappingURL=side-navigation-bar-item.d.ts.map
@@ -12,18 +12,19 @@ var __rest = (this && this.__rest) || function (s, e) {
12
12
  import React, { useState } from 'react';
13
13
  import { Icon } from '../../atoms/icon';
14
14
  import { Link } from '../../index';
15
- const InnerItem = ({ icon, pluxee, label, dataLink }) => {
15
+ const InnerItem = ({ icon, iconSize = 'md', pluxee, label, dataLink }) => {
16
16
  return (React.createElement(React.Fragment, null,
17
- icon && React.createElement(Icon, { icon: icon, pluxee: pluxee }),
18
- React.createElement("span", { className: "link-name", "data-link": `${dataLink ? 'link' : 'container'}` }, label)));
17
+ icon && React.createElement(Icon, { icon: icon, pluxee: pluxee, size: iconSize }),
18
+ React.createElement("span", { style: Object.assign({}, (iconSize === 'sm' && { fontSize: 12 })), className: "link-name", "data-link": `${dataLink ? 'link' : 'container'}` }, label)));
19
19
  };
20
20
  export const SideNavigationBarItem = (props) => {
21
21
  var _a;
22
22
  const { className = '', items, index, pathname = '' } = props, attrs = __rest(props, ["className", "items", "index", "pathname"]);
23
23
  const [active, setActive] = useState(false);
24
24
  const sanitizedHref = ((attrs === null || attrs === void 0 ? void 0 : attrs.href) ? (_a = attrs === null || attrs === void 0 ? void 0 : attrs.href) === null || _a === void 0 ? void 0 : _a.split('?')[0] : '/').split('/')[1];
25
+ const sanitizedPath = pathname === null || pathname === void 0 ? void 0 : pathname.split('/')[1];
25
26
  const isHomePage = (sanitizedHref === '' && pathname === '/');
26
- const isPathActive = sanitizedHref && pathname.includes(sanitizedHref);
27
+ const isPathActive = sanitizedHref && sanitizedPath.includes(sanitizedHref);
27
28
  const activeClass = isHomePage || isPathActive ? ' active' : '';
28
29
  const submenClass = items && items.length > 0 ? ' submenu-li' : ' link-li';
29
30
  return (React.createElement("li", { className: `${className}${activeClass}${submenClass}` }, items
@@ -33,7 +34,7 @@ export const SideNavigationBarItem = (props) => {
33
34
  React.createElement(InnerItem, Object.assign({}, props))),
34
35
  React.createElement(Icon, { icon: "fa-angle-down" })),
35
36
  active && React.createElement("div", null,
36
- React.createElement("ul", { className: "sub-menu-list" }, items.map((item, i) => (React.createElement(SideNavigationBarItem, Object.assign({ key: `side-navigation-bar-item-${index}-${i}` }, Object.assign(Object.assign({}, item), { index: i }))))))))
37
+ React.createElement("ul", { className: "sub-menu-list" }, items.map((item, i) => (React.createElement(SideNavigationBarItem, Object.assign({ key: `side-navigation-bar-item-${index}-${i}`, iconSize: "sm" }, Object.assign(Object.assign({}, item), { index: i }))))))))
37
38
  : React.createElement(Link, Object.assign({}, attrs),
38
39
  React.createElement(InnerItem, Object.assign({}, props, { dataLink: true })))));
39
40
  };
@@ -2,9 +2,10 @@
2
2
  declare type CardSummaryHeaderProps = {
3
3
  label: string;
4
4
  href?: string;
5
+ className?: string;
5
6
  };
6
7
  export declare const CardSummaryHeader: {
7
- ({ label, href }: CardSummaryHeaderProps): JSX.Element;
8
+ ({ label, href, className }: CardSummaryHeaderProps): JSX.Element;
8
9
  displayName: string;
9
10
  };
10
11
  export {};
@@ -1,9 +1,11 @@
1
1
  import React from 'react';
2
2
  import { Link } from 'react-router-dom';
3
- export const CardSummaryHeader = ({ label, href }) => {
3
+ import classNames from 'classnames';
4
+ export const CardSummaryHeader = ({ label, href, className }) => {
5
+ const classes = classNames('dash-title', className);
4
6
  return (React.createElement("div", { className: "dash-header" }, href
5
7
  ? (React.createElement(Link, { className: "normal-link", to: href },
6
- React.createElement("div", { className: "dash-title" }, label)))
7
- : (React.createElement("div", { className: "dash-title" }, label))));
8
+ React.createElement("div", { className: classes }, label)))
9
+ : (React.createElement("div", { className: classes }, label))));
8
10
  };
9
11
  CardSummaryHeader.displayName = 'CardSummaryHeader';
@@ -10,9 +10,10 @@ export declare const CardSummary: {
10
10
  displayName: string;
11
11
  };
12
12
  Header: {
13
- ({ label, href }: {
13
+ ({ label, href, className }: {
14
14
  label: string;
15
15
  href?: string | undefined;
16
+ className?: string | undefined;
16
17
  }): JSX.Element;
17
18
  displayName: string;
18
19
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dilicorp/ui",
3
- "version": "0.2.9",
3
+ "version": "0.2.12",
4
4
  "description": "A simple UI design for Dilicorp",
5
5
  "repository": {
6
6
  "type": "git",