@epilot/base-elements 3.6.2 → 3.7.1

package/dist/Chip/Chip.d.ts

@@ -1,3 +1,6 @@
 import React from 'react';
 import type { ChipProps } from './types';
+/**
+ * @deprecated Use Chip360 instead.
+ */
 export declare const Chip: React.ForwardRefExoticComponent<Pick<ChipProps, "key" | "label" | "security" | "style" | "title" | "translate" | "className" | "classes" | "innerRef" | "slot" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "disabled" | "href" | "size" | "icon" | "variant" | "component" | "avatar" | "clickable" | "deleteIcon" | "onDelete" | "randomColor"> & React.RefAttributes<HTMLDivElement>>;

package/dist/Chip/Chip.js

@@ -6,6 +6,9 @@ var core_1 = require("@material-ui/core");
 var react_1 = tslib_1.__importStar(require("react"));
 var Icon_1 = require("../Icon");
 var RandomColoredChip_1 = require("./RandomColoredChip");
+/**
+ * @deprecated Use Chip360 instead.
+ */
 exports.Chip = react_1.forwardRef(function (props, ref) {
     var _a = props.deleteIcon, deleteIcon = _a === void 0 ? react_1["default"].createElement(Icon_1.Icon, { name: "close" }) : _a, randomColor = props.randomColor, rest = tslib_1.__rest(props, ["deleteIcon", "randomColor"]);
     if (randomColor) {

package/dist/Chip/Chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../src/Chip/Chip.tsx"],"names":[],"mappings":";;;;AAAA,0CAAmD;AACnD,qDAAsE;AAEtE,gCAA8B;AAE9B,yDAAuD;AAG1C,QAAA,IAAI,GAAG,kBAAU,CAG5B,UAAC,KAAK,EAAE,GAAG;IACH,IAAA,KAA6D,KAAK,WAAhC,EAAlC,UAAU,mBAAG,iCAAC,WAAI,IAAC,IAAI,EAAC,OAAO,GAAG,KAAA,EAAE,WAAW,GAAc,KAAK,YAAnB,EAAK,IAAI,kBAAK,KAAK,EAApE,6BAA4D,CAAF,CAAU;IAE1E,IAAI,WAAW,EAAE;QACf,OAAO,iCAAC,qCAAiB,qBAAC,UAAU,EAAE,UAAU,EAAE,GAAG,EAAE,GAAG,IAAM,IAAI,EAAI,CAAA;KACzE;IAED,OAAO,iCAAC,WAAO,qBAAC,UAAU,EAAE,UAAU,EAAE,GAAG,EAAE,GAAG,IAAM,IAAI,EAAI,CAAA;AAChE,CAAC,CAAC,CAAA;AAEF,YAAI,CAAC,WAAW,GAAG,MAAM,CAAA"}
+{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../src/Chip/Chip.tsx"],"names":[],"mappings":";;;;AAAA,0CAAmD;AACnD,qDAAsE;AAEtE,gCAA8B;AAE9B,yDAAuD;AAGvD;;GAEG;AACU,QAAA,IAAI,GAAG,kBAAU,CAG5B,UAAC,KAAK,EAAE,GAAG;IACH,IAAA,KAA6D,KAAK,WAAhC,EAAlC,UAAU,mBAAG,iCAAC,WAAI,IAAC,IAAI,EAAC,OAAO,GAAG,KAAA,EAAE,WAAW,GAAc,KAAK,YAAnB,EAAK,IAAI,kBAAK,KAAK,EAApE,6BAA4D,CAAF,CAAU;IAE1E,IAAI,WAAW,EAAE;QACf,OAAO,iCAAC,qCAAiB,qBAAC,UAAU,EAAE,UAAU,EAAE,GAAG,EAAE,GAAG,IAAM,IAAI,EAAI,CAAA;KACzE;IAED,OAAO,iCAAC,WAAO,qBAAC,UAAU,EAAE,UAAU,EAAE,GAAG,EAAE,GAAG,IAAM,IAAI,EAAI,CAAA;AAChE,CAAC,CAAC,CAAA;AAEF,YAAI,CAAC,WAAW,GAAG,MAAM,CAAA"}

package/dist/Chip360/Chip360.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+export declare const Chip360: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | "security" | "style" | "title" | "translate" | "className" | "slot" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & {
+    label: React.ReactNode;
+    leftIcon?: "number" | "alarm" | "calculator" | "calendar" | "check" | "download" | "exclamation" | "file" | "filter" | "image" | "info" | "link" | "lock" | "map" | "message" | "paragraph" | "pause" | "phone" | "play" | "reply" | "search" | "share" | "star" | "sun" | "table" | "upload" | "add" | "add_circle" | "arrow_left" | "arrow_right" | "cable" | "call" | "category" | "check_box" | "check_circle" | "chevron_left" | "chevron_right" | "close" | "comment" | "content_copy" | "dashboard" | "delete" | "drag_indicator" | "edit" | "error" | "expand_less" | "expand_more" | "explore" | "help" | "lock_open" | "login" | "logout" | "mail" | "menu" | "more_horiz" | "more_vert" | "note" | "notifications" | "open_in_new" | "payment" | "refresh" | "settings" | "sort" | "thumb_down" | "thumb_up" | "visibility" | "visibility_off" | "warning" | "primary" | "address" | "meter" | "summary" | "document" | "action" | "order" | "resize" | "epilot" | "data_object" | "attributes" | "opportunity" | "contact" | "account" | "contract" | "templates" | "product" | "price" | "tax" | "submission" | "partner" | "partnering" | "entity" | "webhook" | "design" | "workflow" | "phase" | "automation" | "journey" | "relations" | "availability" | "desktop" | "arrow_circle_left" | "question_mark" | "skip" | "checklist" | "person_check" | "price_mapping" | "portal" | "entity_builder" | "connection" | "radio_button" | "text_field" | "signature" | "consent" | "attribute_edit" | "solar" | "sdk" | "lookup" | "previous_provider" | "success_confirmation" | "expand_content" | "collapse_content" | "frame" | "energy_savings_leaf" | "avg_time" | "table_rows_narrow" | "two_columns" | "diagram" | undefined;
+    rightIcon?: "close" | "expand_more" | undefined;
+    onClick?: ((event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined;
+    isFilled?: boolean | undefined;
+    isBordered?: boolean | undefined;
+    isDisabled?: boolean | undefined;
+    isClickable?: boolean | undefined;
+    href?: string | undefined;
+    target?: string | undefined;
+    rel?: string | undefined;
+    size?: "small" | "medium" | undefined;
+    variant?: "error" | "warning" | "primary" | "secondary" | "disabled" | "success" | "surface-container-low" | "surface-container-lowest" | "surface-container" | "surface-container-high" | "surface-container-highest" | "custom" | undefined;
+    color?: string | undefined;
+    backgroundColor?: string | undefined;
+    borderColor?: string | undefined;
+    hoverBgColor?: string | undefined;
+    activeBgColor?: string | undefined;
+    filledHoverBgColor?: string | undefined;
+    filledActiveBgColor?: string | undefined;
+} & React.RefAttributes<HTMLButtonElement>>;

package/dist/Chip360/Chip360.js

@@ -0,0 +1,66 @@
+"use strict";
+exports.__esModule = true;
+exports.Chip360 = void 0;
+var tslib_1 = require("tslib");
+var icons_1 = require("@epilot360/icons");
+var core_1 = require("@material-ui/core");
+var classnames_1 = tslib_1.__importDefault(require("classnames"));
+var react_1 = tslib_1.__importStar(require("react"));
+var styles_1 = require("./styles");
+exports.Chip360 = react_1.forwardRef(function (props, ref) {
+    var leftIcon = props.leftIcon, rightIcon = props.rightIcon, href = props.href, label = props.label, onClick = props.onClick, className = props.className, rel = props.rel, target = props.target, isFilled = props.isFilled, isBordered = props.isBordered, isDisabled = props.isDisabled, isClickable = props.isClickable, style = props.style, color = props.color, backgroundColor = props.backgroundColor, borderColor = props.borderColor, hoverBgColor = props.hoverBgColor, activeBgColor = props.activeBgColor, filledHoverBgColor = props.filledHoverBgColor, filledActiveBgColor = props.filledActiveBgColor, rest = tslib_1.__rest(props, ["leftIcon", "rightIcon", "href", "label", "onClick", "className", "rel", "target", "isFilled", "isBordered", "isDisabled", "isClickable", "style", "color", "backgroundColor", "borderColor", "hoverBgColor", "activeBgColor", "filledHoverBgColor", "filledActiveBgColor"]);
+    var classes = styles_1.useChipStyles();
+    var variant = getVariant(props.variant, isDisabled);
+    var size = getSize(props.size);
+    var isDisabledVariant = variant === 'disabled';
+    var isClickableChip = !isDisabledVariant && Boolean(onClick);
+    var isLink = href && !isDisabledVariant;
+    var variantClass = "chip-variant-" + variant;
+    var sizeClass = "chip-size-" + size;
+    var customVariantStyles = {
+        '--custom-color': color,
+        '--custom-background-color': backgroundColor,
+        '--custom-border-color': borderColor,
+        '--custom-hover-bg-color': hoverBgColor,
+        '--custom-active-bg-color': activeBgColor,
+        '--custom-filled-hover-bg-color': filledHoverBgColor,
+        '--custom-filled-active-bg-color': filledActiveBgColor
+    };
+    var customStyles = tslib_1.__assign(tslib_1.__assign({}, style), (variant === 'custom' ? customVariantStyles : null));
+    function handleKeyDown(event) {
+        if (!isClickableChip)
+            return;
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            var element = event.target;
+            element.click();
+        }
+    }
+    var chipBody = (react_1["default"].createElement(react_1["default"].Fragment, null,
+        leftIcon && (react_1["default"].createElement(icons_1.EpilotIcon, { color: styles_1.iconVariantColors[variant], name: leftIcon, size: styles_1.iconSizes[size] })),
+        react_1["default"].createElement("span", null, label),
+        rightIcon && (react_1["default"].createElement(icons_1.EpilotIcon, { color: styles_1.iconVariantColors[variant], name: rightIcon, size: styles_1.iconSizes[size] }))));
+    if (isLink) {
+        // Link Chip
+        return (react_1["default"].createElement(core_1.Link, { href: href, rel: rel, style: { textDecoration: 'none' }, target: target },
+            react_1["default"].createElement("button", tslib_1.__assign({ className: classnames_1["default"](className, classes['chip-root'], classes[variantClass], isFilled && 'chip-filled', isBordered && 'chip-bordered', 'chip-clickable', size && classes[sizeClass]), ref: ref, style: customStyles, tabIndex: -1 }, rest), chipBody)));
+    }
+    return (react_1["default"].createElement("button", tslib_1.__assign({ "aria-disabled": isDisabledVariant, className: classnames_1["default"](className, classes['chip-root'], classes[variantClass], isFilled && 'chip-filled', isBordered && 'chip-bordered', (isClickable || isClickableChip) && 'chip-clickable', size && classes[sizeClass]), onClick: isClickableChip ? onClick : undefined, onKeyDown: handleKeyDown, ref: ref, style: customStyles, tabIndex: isClickableChip ? 0 : -1 }, rest), chipBody));
+});
+exports.Chip360.displayName = 'Chip360';
+function getVariant(variant, isDisabled) {
+    if (isDisabled) {
+        return 'disabled';
+    }
+    if (!variant) {
+        return 'default';
+    }
+    return variant;
+}
+function getSize(size) {
+    if (!size) {
+        return 'medium';
+    }
+    return size;
+}
+//# sourceMappingURL=Chip360.js.map

package/dist/Chip360/Chip360.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip360.js","sourceRoot":"","sources":["../../src/Chip360/Chip360.tsx"],"names":[],"mappings":"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"}

package/dist/Chip360/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Chip360';
+export * from './types';

package/dist/Chip360/index.js

@@ -0,0 +1,6 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Chip360"), exports);
+tslib_1.__exportStar(require("./types"), exports);
+//# sourceMappingURL=index.js.map

package/dist/Chip360/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Chip360/index.ts"],"names":[],"mappings":";;;AAAA,oDAAyB;AACzB,kDAAuB"}

package/dist/Chip360/styles.d.ts

@@ -0,0 +1,20 @@
+export declare const useChipStyles: (props?: any) => Record<"chip-root" | "chip-variant-default" | "chip-variant-primary" | "chip-variant-secondary" | "chip-variant-warning" | "chip-variant-error" | "chip-variant-success" | "chip-variant-surface-container-lowest" | "chip-variant-surface-container-low" | "chip-variant-surface-container" | "chip-variant-surface-container-high" | "chip-variant-surface-container-highest" | "chip-variant-custom" | "chip-variant-disabled" | "chip-size-small" | "chip-size-medium", string>;
+export declare const iconVariantColors: {
+    default: string;
+    primary: string;
+    secondary: string;
+    warning: string;
+    error: string;
+    success: string;
+    'surface-container-lowest': string;
+    'surface-container-low': string;
+    'surface-container': string;
+    'surface-container-high': string;
+    'surface-container-highest': string;
+    custom: string;
+    disabled: string;
+};
+export declare const iconSizes: {
+    small: number;
+    medium: number;
+};

package/dist/Chip360/styles.js

@@ -0,0 +1,303 @@
+"use strict";
+exports.__esModule = true;
+exports.iconSizes = exports.iconVariantColors = exports.useChipStyles = void 0;
+var core_1 = require("@material-ui/core");
+exports.useChipStyles = core_1.makeStyles(function () {
+    return core_1.createStyles({
+        'chip-root': {
+            fontFamily: 'var(--font-family)',
+            display: 'flex',
+            alignItems: 'center',
+            gap: '6px',
+            cursor: 'default',
+            border: '1px solid transparent',
+            borderRadius: 'var(--border-radius-sm)'
+        },
+        // Variant styles
+        'chip-variant-default': getVariantStyle(),
+        'chip-variant-primary': getVariantStyle('primary'),
+        'chip-variant-secondary': getVariantStyle('secondary'),
+        'chip-variant-warning': getVariantStyle('warning'),
+        'chip-variant-error': getVariantStyle('error'),
+        'chip-variant-success': getVariantStyle('success'),
+        'chip-variant-surface-container-lowest': getVariantStyle('surface-container-lowest'),
+        'chip-variant-surface-container-low': getVariantStyle('surface-container-low'),
+        'chip-variant-surface-container': getVariantStyle('surface-container'),
+        'chip-variant-surface-container-high': getVariantStyle('surface-container-high'),
+        'chip-variant-surface-container-highest': getVariantStyle('surface-container-highest'),
+        'chip-variant-custom': getVariantStyle('custom'),
+        'chip-variant-disabled': getVariantStyle('disabled'),
+        // Size styles
+        'chip-size-small': getSizeStyle('small'),
+        'chip-size-medium': getSizeStyle()
+    });
+});
+var variantBgFallbacks = {
+    primary: {
+        hover: '#e0e4e8',
+        active: '#ccd1d8',
+        filledHover: '#bbcae8',
+        filledActive: '#aabcd8'
+    },
+    secondary: {
+        hover: '#e7e0e8',
+        active: '#d7ccd8',
+        filledHover: '#e7bce2',
+        filledActive: '#d7abd4'
+    },
+    warning: {
+        hover: '#e7e5df',
+        active: '#d6d4cc',
+        filledHover: '#e7dab4',
+        filledActive: '#d6c9a3'
+    },
+    error: {
+        hover: '#e7b4b8',
+        active: '#d6cccd',
+        filledHover: '#e7b4b8',
+        filledActive: '#d6a3a8'
+    },
+    success: {
+        hover: '#e1e5e2',
+        active: '#cfd3cf',
+        filledHover: '#c2d9c2',
+        filledActive: '#b1c8b1'
+    },
+    custom: {
+        hover: 'var(--custom-hover-bg-color)',
+        active: 'var(--custom-active-bg-color)',
+        filledHover: 'var(--custom-filled-hover-bg-color)',
+        filledActive: 'var(--custom-filled-active-bg-color)'
+    },
+    'surface-container-lowest': {
+        hover: '#dfe3e9',
+        active: '#ccd1db'
+    },
+    'surface-container-low': {
+        hover: '#d0d5e8',
+        active: '#bdc4da'
+    },
+    'surface-container': {
+        hover: '#c8cee7',
+        active: '#b7bed9'
+    },
+    'surface-container-high': {
+        hover: '#bfc8e6',
+        active: '#aeb8d7'
+    },
+    'surface-container-highest': {
+        hover: '#b8c1e5',
+        active: '#a7b2d7'
+    }
+};
+exports.iconVariantColors = {
+    "default": 'var(--text-primary)',
+    primary: 'var(--primary-40)',
+    secondary: 'var(--secondary-40)',
+    warning: 'var(--warning-40)',
+    error: 'var(--error-40)',
+    success: 'var(--success-40)',
+    'surface-container-lowest': 'var(--neutral-40)',
+    'surface-container-low': 'var(--neutral-40)',
+    'surface-container': 'var(--neutral-40)',
+    'surface-container-high': 'var(--neutral-40)',
+    'surface-container-highest': 'var(--neutral-40)',
+    custom: 'var(--custom-border-color, --custom-color)',
+    disabled: 'var(--neutral-variant-50)'
+};
+exports.iconSizes = {
+    small: 16,
+    medium: 20
+};
+function getVariantStyle(variant) {
+    var _a, _b, _c, _d, _e;
+    switch (variant) {
+        case 'primary':
+        case 'secondary':
+        case 'warning':
+        case 'error':
+        case 'success': {
+            var hoverBgColorMix = getColorMix('var(--surface-container-lowest)', "var(--" + variant + "-10) 12%");
+            var activeBgColorMix = getColorMix('var(--surface-container-lowest)', "var(--" + variant + "-10) 20%");
+            var filledHoverBgColorMix = getColorMix("var(--" + variant + "-90)", "var(--" + variant + "-10) 12%");
+            var filledActiveBgColorMix = getColorMix("var(--" + variant + "-90)", "var(--" + variant + "-10) 20%");
+            return {
+                color: "var(--" + variant + "-10)",
+                backgroundColor: 'var(--surface-container-lowest)',
+                '&.chip-clickable': (_a = {
+                        cursor: 'pointer',
+                        '&:hover': {
+                            backgroundColor: variantBgFallbacks[variant].hover
+                        },
+                        '&:active': {
+                            backgroundColor: variantBgFallbacks[variant].active
+                        }
+                    },
+                    // Checks support for color-mix()
+                    _a["@supports (background-color: " + hoverBgColorMix + ") and (background-color: " + activeBgColorMix + ")"] = {
+                        '&:hover': {
+                            backgroundColor: hoverBgColorMix
+                        },
+                        '&:active': {
+                            backgroundColor: activeBgColorMix
+                        }
+                    },
+                    _a),
+                '&.chip-filled': {
+                    backgroundColor: "var(--" + variant + "-90)",
+                    '&.chip-clickable': (_b = {
+                            '&:hover': {
+                                backgroundColor: variantBgFallbacks[variant].filledHover
+                            },
+                            '&:active': {
+                                backgroundColor: variantBgFallbacks[variant].filledActive
+                            }
+                        },
+                        // Checks support for color-mix()
+                        _b["@supports (background-color: " + filledHoverBgColorMix + ") and (background-color: " + filledActiveBgColorMix + ")"] = {
+                            '&:hover': {
+                                backgroundColor: filledHoverBgColorMix
+                            },
+                            '&:active': {
+                                backgroundColor: filledActiveBgColorMix
+                            }
+                        },
+                        _b)
+                },
+                '&.chip-bordered': {
+                    borderColor: "var(--" + variant + "-40)"
+                }
+            };
+        }
+        case 'surface-container-lowest':
+        case 'surface-container-low':
+        case 'surface-container':
+        case 'surface-container-high':
+        case 'surface-container-highest': {
+            var hoverBgColorMix = getColorMix("var(--" + variant + ")", 'var(--neutral-10) 12%');
+            var activeBgColorMix = getColorMix("var(--" + variant + ")", 'var(--neutral-10) 20%');
+            return {
+                color: 'var(--neutral-10)',
+                backgroundColor: "var(--" + variant + ")",
+                '&.chip-clickable': (_c = {
+                        cursor: 'pointer',
+                        '&:hover': {
+                            backgroundColor: variantBgFallbacks[variant].hover
+                        },
+                        '&:active': {
+                            backgroundColor: variantBgFallbacks[variant].active
+                        }
+                    },
+                    // Checks support for color-mix()
+                    _c["@supports (background-color: " + hoverBgColorMix + ") and (background-color: " + activeBgColorMix + ")"] = {
+                        '&:hover': {
+                            backgroundColor: hoverBgColorMix
+                        },
+                        '&:active': {
+                            backgroundColor: activeBgColorMix
+                        }
+                    },
+                    _c),
+                '&.chip-bordered': {
+                    borderColor: 'var(--neutral-variant-50)'
+                }
+            };
+        }
+        case 'custom': {
+            var hoverBgColorMix = getColorMix('var(--surface-container-lowest)', 'var(--custom-color) 12%');
+            var activeBgColorMix = getColorMix('var(--surface-container-lowest)', 'var(--custom-color) 20%');
+            var filledHoverBgColorMix = getColorMix('var(--custom-background-color)', 'var(--custom-color) 12%');
+            var filledActiveBgColorMix = getColorMix('var(--custom-background-color)', 'var(--custom-color) 20%');
+            return {
+                color: 'var(--custom-color)',
+                backgroundColor: 'var(--surface-container-lowest)',
+                '&.chip-clickable': (_d = {
+                        cursor: 'pointer'
+                    },
+                    // Checks support for color-mix() as the default
+                    _d["@supports (background-color: " + hoverBgColorMix + ") and (background-color: " + activeBgColorMix + ")"] = {
+                        '&:hover': {
+                            backgroundColor: hoverBgColorMix
+                        },
+                        '&:active': {
+                            backgroundColor: activeBgColorMix
+                        }
+                    },
+                    // Overrides the defaults above
+                    _d['&:hover'] = {
+                        backgroundColor: variantBgFallbacks[variant].hover
+                    },
+                    _d['&:active'] = {
+                        backgroundColor: variantBgFallbacks[variant].active
+                    },
+                    _d),
+                '&.chip-filled': {
+                    backgroundColor: 'var(--custom-background-color)',
+                    '&.chip-clickable': (_e = {},
+                        // Checks support for color-mix() as the default
+                        _e["@supports (background-color: " + filledHoverBgColorMix + ") and (background-color: " + filledActiveBgColorMix + ")"] = {
+                            '&:hover': {
+                                backgroundColor: filledHoverBgColorMix
+                            },
+                            '&:active': {
+                                backgroundColor: filledActiveBgColorMix
+                            }
+                        },
+                        // Overrides the defaults above
+                        _e['&:hover'] = {
+                            backgroundColor: variantBgFallbacks[variant].filledHover
+                        },
+                        _e['&:active'] = {
+                            backgroundColor: variantBgFallbacks[variant].filledActive
+                        },
+                        _e)
+                },
+                '&.chip-bordered': {
+                    borderColor: 'var(--custom-border-color)'
+                }
+            };
+        }
+        case 'disabled':
+            return {
+                color: 'var(--neutral-variant-30)',
+                backgroundColor: 'var(--neutral-variant-90)',
+                '&.chip-bordered': {
+                    borderColor: 'var(--neutral-variant-50)'
+                }
+            };
+        default:
+            return {
+                color: 'var(--text-primary)',
+                backgroundColor: 'var(--surface-container-lowest)',
+                '&.chip-bordered': {
+                    borderColor: 'var(--text-primary)'
+                }
+            };
+    }
+}
+function getSizeStyle(size) {
+    switch (size) {
+        case 'small':
+            return {
+                fontSize: '14px',
+                lineHeight: '16.8px',
+                paddingLeft: '4px',
+                paddingRight: '4px',
+                paddingTop: '2px',
+                paddingBottom: '2px'
+            };
+        default:
+            return {
+                fontSize: '16px',
+                lineHeight: '19.2px',
+                paddingLeft: '8px',
+                paddingRight: '8px',
+                paddingTop: '6px',
+                paddingBottom: '6px'
+            };
+    }
+}
+function getColorMix(color1, color2) {
+    return "color-mix(in srgb, " + color1 + ", " + color2 + ")";
+}
+//# sourceMappingURL=styles.js.map

package/dist/Chip360/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/Chip360/styles.ts"],"names":[],"mappings":"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"}

package/dist/Chip360/types.d.ts

@@ -0,0 +1,105 @@
+import { IconSVGName } from '@epilot360/icons';
+import { LinkProps } from '@material-ui/core';
+import { DetailedHTMLProps, HTMLAttributes, ReactNode } from 'react';
+declare type NativeButton = DetailedHTMLProps<HTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
+export declare type Chip360Props = Omit<NativeButton, 'ref' | 'onClick' | 'color'> & {
+    /**
+     * Sets the content of the chip
+     */
+    label: ReactNode;
+    /**
+     * Sets the left-positioned icon (use icon names from @epilot360/icons)
+     */
+    leftIcon?: IconSVGName;
+    /**
+     * Sets the right-positioned icon (accepts only 'close' or 'expand_more' from @epilot360/icons)
+     */
+    rightIcon?: Extract<IconSVGName, 'expand_more' | 'close'>;
+    /**
+     * Handler for click events on the chip and makes chip clickable. Use `isClickable` alternatively to turn on clickable styles.
+     */
+    onClick?: NativeButton['onClick'];
+    /**
+     * Adds a fill to the chip background
+     */
+    isFilled?: boolean;
+    /**
+     * Adds a border to the chip
+     */
+    isBordered?: boolean;
+    /**
+     * Disables the chip (alternatively use the `disabled` variant).
+     *
+     * Note: This nullifies all click events including links
+     */
+    isDisabled?: boolean;
+    /**
+     * Turns on clickable styles if `onClick` is not set
+     */
+    isClickable?: boolean;
+    /**
+     * Makes the chip a link chip and sets its href attribute.
+     */
+    href?: string;
+    /**
+     * Sets the target attribute of the link chip
+     */
+    target?: LinkProps['target'];
+    /**
+     * Sets the rel attribute of the link chip
+     */
+    rel?: LinkProps['rel'];
+    /**
+     * Sets the size of the chip. The default value is `medium`
+     */
+    size?: 'small' | 'medium';
+    /**
+     * Sets the chip color variants.
+     *
+     * Note: The `custom` variant lets you override the chip colors using the following props - `color`, `backgroundColor`, `borderColor`, `hoverBgColor`, `activeBgColor`, `filledHoverBgColor`, `filledActiveBgColor`. See below.
+     */
+    variant?: 'primary' | 'secondary' | 'error' | 'warning' | 'success' | 'surface-container-low' | 'surface-container-lowest' | 'surface-container' | 'surface-container-high' | 'surface-container-highest' | 'disabled' | 'custom';
+    /**
+     * Overrides the font color and icon color (superseded by `borderColor`) of a custom chip.
+     *
+     * Note: This prop only works on the `custom` variant
+     */
+    color?: string;
+    /**
+     * Overrides the background color of a custom chip.
+     *
+     * Note: This prop only works on the `custom` variant
+     */
+    backgroundColor?: string;
+    /**
+     * Overrides the border color and icon color (supersedes `color`) of a bordered custom chip.
+     *
+     * Note: This prop only works on the `custom` variant
+     */
+    borderColor?: string;
+    /**
+     * Overrides the hover background color of a custom chip.
+     *
+     * Note: This prop only works on the `custom` variant
+     */
+    hoverBgColor?: string;
+    /**
+     * Overrides the active background color of a custom chip.
+     *
+     * Note: This prop only works on the `custom` variant
+     */
+    activeBgColor?: string;
+    /**
+     * Overrides the hover background color of a filled custom chip.
+     *
+     * Note: This prop only works on the `custom` variant
+     */
+    filledHoverBgColor?: string;
+    /**
+     * Overrides the active background color of a filled custom chip.
+     *
+     * Note: This prop only works on the `custom` variant
+     */
+    filledActiveBgColor?: string;
+};
+export {};

package/dist/Chip360/types.js

@@ -0,0 +1,3 @@
+"use strict";
+exports.__esModule = true;
+//# sourceMappingURL=types.js.map

package/dist/Chip360/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/Chip360/types.ts"],"names":[],"mappings":""}

package/dist/ThemeProvider/DefaultEpilotTheme.js

@@ -282,6 +282,7 @@ exports.DefaultEpilotTheme = {
             secondary: '#43474e'
         },
         divider: '#C4C6CF',
+        portalLoginBackground: '#ffffff',
         green: {
             main: '#2FBC8A',
             contrastText: '#FFFFFF'
@@ -333,6 +334,7 @@ exports.DefaultEpilotTheme = {
     },
     spacing: 8,
     shape: {
+        borderRadiusSm: 8,
         borderRadius: 16
     },
     props: {