@zonos/amino 5.4.2 → 5.4.4
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.
- package/all.d.ts +4 -0
- package/components/dialog/BaseDialog.d.ts +2 -1
- package/components/dialog/BaseDialog.js +1 -1
- package/components/dialog/Dialog.d.ts +1 -0
- package/components/dialog/announcement/AnnouncementDialog.d.ts +1 -0
- package/components/input/MultiInput.js +1 -1
- package/components/slide-over/SlideOver.d.ts +2 -1
- package/components/slide-over/SlideOver.js +1 -1
- package/icons/MaximizeDuotoneIcon.d.ts +6 -0
- package/icons/MaximizeDuotoneIcon.js +1 -0
- package/icons/MaximizeIcon.d.ts +3 -0
- package/icons/MaximizeIcon.js +1 -0
- package/icons/MinimizeDuotoneIcon.d.ts +6 -0
- package/icons/MinimizeDuotoneIcon.js +1 -0
- package/icons/MinimizeIcon.d.ts +3 -0
- package/icons/MinimizeIcon.js +1 -0
- package/package.json +1 -1
package/all.d.ts
CHANGED
|
@@ -619,8 +619,12 @@ import './icons/LogoutDuotoneIcon';
|
|
|
619
619
|
import './icons/LogoutIcon';
|
|
620
620
|
import './icons/MailDuotoneIcon';
|
|
621
621
|
import './icons/MailIcon';
|
|
622
|
+
import './icons/MaximizeDuotoneIcon';
|
|
623
|
+
import './icons/MaximizeIcon';
|
|
622
624
|
import './icons/MenuDuotoneIcon';
|
|
623
625
|
import './icons/MenuIcon';
|
|
626
|
+
import './icons/MinimizeDuotoneIcon';
|
|
627
|
+
import './icons/MinimizeIcon';
|
|
624
628
|
import './icons/MinusCircleDuotoneIcon';
|
|
625
629
|
import './icons/MinusCircleIcon';
|
|
626
630
|
import './icons/MinusDuotoneIcon';
|
|
@@ -4,6 +4,7 @@ import type { BaseProps } from "../../types/BaseProps";
|
|
|
4
4
|
import type { Theme } from "../../types/Theme";
|
|
5
5
|
export type BaseDialogProps = BaseProps & {
|
|
6
6
|
children: ReactNode;
|
|
7
|
+
fullWindowWidth?: boolean;
|
|
7
8
|
/** Don't close when clicking outside dialog (on the backdrop)
|
|
8
9
|
* @default false
|
|
9
10
|
*/
|
|
@@ -45,4 +46,4 @@ export type BaseDialogProps = BaseProps & {
|
|
|
45
46
|
withBackdrop?: boolean;
|
|
46
47
|
onClose?: () => void;
|
|
47
48
|
};
|
|
48
|
-
export declare const BaseDialog: ({ children, className, noCloseOnBlur, noCloseOnEsc, onClose, open, popupMotionProps, rootSelector, style, themeOverride, width, withBackdrop, }: BaseDialogProps) => React.ReactPortal | null;
|
|
49
|
+
export declare const BaseDialog: ({ children, className, fullWindowWidth, noCloseOnBlur, noCloseOnEsc, onClose, open, popupMotionProps, rootSelector, style, themeOverride, width, withBackdrop, }: BaseDialogProps) => React.ReactPortal | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("../../_tslib-bd4862e8.js"),o=require("react/jsx-runtime"),n=require("react"),t=require("react-dom"),i=require("clsx"),a=require("framer-motion"),r=require("../../style-inject.es-d4ddeae4.js");function l(e){return e&&e.__esModule?e:{default:e}}var d=l(i),u="Amino_BaseDialog-module__backdrop--Tykyp",c="Amino_BaseDialog-module__popup--1AFN-";r.styleInject(".Amino_BaseDialog-module__backdrop--Tykyp{align-items:center;color:var(--amino-text-color);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100vw;z-index:1000}.Amino_BaseDialog-module__popup--1AFN-{background:var(--amino-page-background);border-radius:var(--amino-radius-12);box-shadow:var(--amino-v3-shadow-xxl);display:flex;flex-direction:column;max-height:90vh;outline:none;overflow:hidden;width:var(--amino-base-dialog-width);z-index:1001}");exports.BaseDialog=function(i){var r=i.children,l=i.className,s=i.
|
|
1
|
+
"use strict";var e=require("../../_tslib-bd4862e8.js"),o=require("react/jsx-runtime"),n=require("react"),t=require("react-dom"),i=require("clsx"),a=require("framer-motion"),r=require("../../style-inject.es-d4ddeae4.js");function l(e){return e&&e.__esModule?e:{default:e}}var d=l(i),u="Amino_BaseDialog-module__backdrop--Tykyp",c="Amino_BaseDialog-module__popup--1AFN-";r.styleInject(".Amino_BaseDialog-module__backdrop--Tykyp{align-items:center;color:var(--amino-text-color);display:flex;height:100vh;justify-content:center;left:0;position:fixed;top:0;width:100vw;z-index:1000}.Amino_BaseDialog-module__popup--1AFN-{background:var(--amino-page-background);border-radius:var(--amino-radius-12);box-shadow:var(--amino-v3-shadow-xxl);display:flex;flex-direction:column;max-height:90vh;outline:none;overflow:hidden;width:var(--amino-base-dialog-width);z-index:1001}");exports.BaseDialog=function(i){var r=i.children,l=i.className,s=i.fullWindowWidth,m=i.noCloseOnBlur,p=void 0!==m&&m,v=i.noCloseOnEsc,f=void 0!==v&&v,g=i.onClose,y=i.open,h=i.popupMotionProps,_=i.rootSelector,b=i.style,x=i.themeOverride,k=i.width,w=void 0===k?444:k,q=i.withBackdrop,j=void 0!==q&&q,A=n.useRef(null),B=n.useRef(null);n.useEffect((function(){var e,o;(null===(e=B.current)||void 0===e?void 0:e.contains(document.activeElement))||null===(o=B.current)||void 0===o||o.focus(),(null===document||void 0===document?void 0:document.body)&&(document.body.style.overflow=y?"hidden":"auto")}),[y]);var C=j?{animate:{backgroundColor:"rgba(16, 17, 22, 0.65)"},exit:{backgroundColor:"rgba(16, 17, 22, 0)"},initial:{backgroundColor:"rgba(16, 17, 22, 0)"}}:{},D=e.__assign({animate:{opacity:1,scale:1},exit:{opacity:0,scale:.95},initial:{opacity:0,scale:.95},transition:{duration:.3,ease:[.4,0,.2,1]}},h);if("undefined"!=typeof document){var E=document.querySelector(_||"body");if(E)return t.createPortal(o.jsx(a.AnimatePresence,{children:y&&n.createElement(a.motion.div,e.__assign({className:u},C,{key:"dialog-backdrop",ref:B,"data-theme":x,onKeyDown:function(e){"Escape"===e.key&&(e.stopPropagation(),g&&!f&&g())},onMouseDown:function(e){A.current=e.target},onMouseUp:function(e){var o=e.target===A.current,n=g&&!p&&e.target===B.current;o&&n&&g(),A.current=null},style:{"--amino-base-dialog-width":s?"100%":"".concat(w,"px")},tabIndex:-1,transition:{duration:.3}}),n.createElement(a.motion.div,e.__assign({},D,{key:"dialog",className:d.default(l,c,"elevated"),onClick:function(e){e.stopPropagation()},style:b}),r))}),E)}return null};
|
|
@@ -9,6 +9,7 @@ export type DialogProps = BaseDialogProps & {
|
|
|
9
9
|
};
|
|
10
10
|
export declare const Dialog: import("react").ForwardRefExoticComponent<import("../../types/BaseProps").BaseProps & {
|
|
11
11
|
children: ReactNode;
|
|
12
|
+
fullWindowWidth?: boolean | undefined;
|
|
12
13
|
noCloseOnBlur?: boolean | undefined;
|
|
13
14
|
noCloseOnEsc?: boolean | undefined;
|
|
14
15
|
open: boolean;
|
|
@@ -9,6 +9,7 @@ export type AnnouncementDialogProps = BaseDialogProps & {
|
|
|
9
9
|
};
|
|
10
10
|
export declare const AnnouncementDialog: import("react").ForwardRefExoticComponent<import("../../../types/BaseProps").BaseProps & {
|
|
11
11
|
children: ReactNode;
|
|
12
|
+
fullWindowWidth?: boolean | undefined;
|
|
12
13
|
noCloseOnBlur?: boolean | undefined;
|
|
13
14
|
noCloseOnEsc?: boolean | undefined;
|
|
14
15
|
open: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("../../_tslib-bd4862e8.js"),
|
|
1
|
+
"use strict";var e=require("../../_tslib-bd4862e8.js"),n=require("react/jsx-runtime"),t=require("react"),r=require("clsx"),u=require("../flex/Flex.js"),a=require("../tag/Tag.js"),l=require("../../style-inject.es-d4ddeae4.js");function i(e){return e&&e.__esModule?e:{default:e}}require("../../icons/RemoveIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../../styles/constants/theme.js");var o=i(r),s="Amino_MultiInput-module__tagInputWrapper--FTdAL",c="Amino_MultiInput-module__tagInput--cBsz8";l.styleInject(".Amino_MultiInput-module__tagInputWrapper--FTdAL.Amino_MultiInput-module__tagInputWrapper--FTdAL{border:var(--amino-border);border-radius:var(--amino-radius-10);overflow-x:auto;padding:6px}.Amino_MultiInput-module__tagInputWrapper--FTdAL.Amino_MultiInput-module__tagInputWrapper--FTdAL .Amino_MultiInput-module__tagInput--cBsz8{background-color:initial;border:none;flex:1 1 auto;flex-grow:1;font-size:var(--amino-font-size-base);font-weight:500;min-width:100px;min-width:50px;outline:none;padding:6px}");exports.MultiInput=function(r){var l=r.className,i=r.placeholder,d=void 0===i?"":i,p=r.setHasValidationError,g=r.setTags,_=r.style,f=r.tags,m=r.tagValidation,h=e.__read(t.useState(""),2),I=h[0],x=h[1],v=t.useRef(null),A=e.__read(t.useState(null),2),j=A[0],y=A[1];t.useEffect((function(){if(p&&m){var e=f.some((function(e){return!m(e)}));p(e)}}),[f,m,p]);var q=function(e){g(f.filter((function(n,t){return t!==e})))};return n.jsxs(u.Flex,{alignItems:"center",className:o.default([l,s]),flexWrap:"wrap",gap:4,style:_,children:[f.map((function(e,t){var r=!(!m||m(e)),l=j===t,i=r?"error":"default";return n.jsx(u.Flex,{alignItems:"center",gap:0,children:n.jsx(a.Tag,{highlighted:l,intent:i,onClick:function(){return y(t)},onClose:function(){return q(t)},size:"lg",children:e})},e)})),n.jsx("input",{ref:v,className:c,onChange:function(e){x(e.target.value)},onFocus:function(){v.current&&(v.current.selectionStart=v.current.value.length,v.current.selectionEnd=v.current.value.length)},onKeyDown:function(n){var t;"Enter"!==n.key&&","!==n.key&&" "!==n.key||!I?"Backspace"===n.key?""===I&&f.length>0&&(null===j?y(f.length-1):(q(j),y(null))):"ArrowLeft"===n.key?null===j&&f.length>0?y(f.length-1):null!==j&&j>0&&y(j-1):"ArrowRight"===n.key&&null!==j&&j<f.length-1?y(j+1):y(null):(n.preventDefault(),(t=I.trim())&&(g(e.__spreadArray(e.__spreadArray([],e.__read(f),!1),[t],!1)),x("")))},placeholder:f.length?"":d,value:I})]})};
|
|
@@ -3,7 +3,8 @@ import { type BaseDialogProps } from "../dialog/BaseDialog";
|
|
|
3
3
|
export type SlideOverProps = BaseDialogProps & {
|
|
4
4
|
actions?: ReactNode;
|
|
5
5
|
bottomActions?: ReactNode;
|
|
6
|
+
fullWindowWidth?: boolean;
|
|
6
7
|
label?: string;
|
|
7
8
|
subtitle?: ReactNode;
|
|
8
9
|
};
|
|
9
|
-
export declare const SlideOver: ({ actions, bottomActions, children, label, onClose, subtitle, width, ...props }: SlideOverProps) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare const SlideOver: ({ actions, bottomActions, children, fullWindowWidth, label, onClose, subtitle, width, ...props }: SlideOverProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("../../_tslib-bd4862e8.js"),i=require("react/jsx-runtime"),r=require("../button/Button.js"),o=require("../dialog/BaseDialog.js"),s=require("../stack/HStack.js"),n=require("../stack/VStack.js"),t=require("../text/Text.js"),l=require("../../icons/RemoveIcon.js"),
|
|
1
|
+
"use strict";var e=require("../../_tslib-bd4862e8.js"),i=require("react/jsx-runtime"),r=require("../button/Button.js"),o=require("../dialog/BaseDialog.js"),s=require("../stack/HStack.js"),n=require("../stack/VStack.js"),t=require("../text/Text.js"),l=require("../../icons/RemoveIcon.js"),d=require("../../style-inject.es-d4ddeae4.js");require("react"),require("clsx"),require("../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../button/_Ripple.js"),require("../../utils/getAminoColor.js"),require("../../styles/constants/theme.js"),require("../button/useRipple.js"),require("../spinner/Spinner.js"),require("react-dom"),require("../stack/Stack.js"),require("../../icons/icon-base/_IconBase.js");var a="Amino_SlideOver-module__styledBaseDialog--kdoHN",u="Amino_SlideOver-module__wrapper--h4h0-",c="Amino_SlideOver-module__slideOverHeader--QseSi",m="Amino_SlideOver-module__slideOverContent--vCKvH",v="Amino_SlideOver-module__footer--mwPVV";d.styleInject(".Amino_SlideOver-module__styledBaseDialog--kdoHN{background:#0000;border:none;border-radius:0;box-shadow:none;height:100vh;max-height:none;overflow:visible;overflow:initial;position:absolute;right:0;top:0}.Amino_SlideOver-module__wrapper--h4h0-{background:var(--amino-page-background);border-radius:12px;box-shadow:var(--amino-v3-shadow-large);display:flex;flex-direction:column;height:100%;margin:8px}.Amino_SlideOver-module__slideOverHeader--QseSi{align-items:center;border-bottom:var(--amino-border-subtle);display:flex;gap:16px;justify-content:space-between;padding:16px}.Amino_SlideOver-module__slideOverHeader--QseSi>div{align-items:center;display:flex;gap:16px}.Amino_SlideOver-module__slideOverContent--vCKvH{flex:1;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;padding:24px}.Amino_SlideOver-module__footer--mwPVV{align-items:center;background:var(--amino-page-background);border-radius:0 0 12px 12px;display:flex;justify-content:flex-end;padding:24px}.Amino_SlideOver-module__footer--mwPVV>div+div{margin-left:8px}");exports.SlideOver=function(d){var p=d.actions,x=d.bottomActions,_=d.children,h=d.fullWindowWidth,j=d.label,b=d.onClose,g=d.subtitle,f=d.width,q=void 0===f?444:f,S=e.__rest(d,["actions","bottomActions","children","fullWindowWidth","label","onClose","subtitle","width"]);return i.jsx(o.BaseDialog,e.__assign({className:a,fullWindowWidth:h,onClose:b,popupMotionProps:{animate:{x:0},exit:{x:q},initial:{x:q},transition:{duration:.45,ease:[.4,0,.2,1]}},width:q},S,{children:i.jsxs("div",{className:u,children:[i.jsxs("header",{className:c,children:[i.jsxs("div",{children:[i.jsx(r.Button,{icon:i.jsx(l.RemoveIcon,{}),onClick:b}),g?i.jsxs(n.VStack,{spacing:0,children:[i.jsx(t.Text,{type:"subheader",children:j}),g]}):i.jsx(t.Text,{type:"subheader",children:j})]}),p&&i.jsx("div",{children:p})]}),i.jsx("div",{className:m,children:_}),x&&i.jsx("div",{className:v,children:i.jsx(s.HStack,{spacing:8,children:x})})]})}))};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { Color } from "../types";
|
|
3
|
+
import type { IconProps } from "../types/IconProps";
|
|
4
|
+
export declare const MaximizeDuotoneIcon: import("react").ForwardRefExoticComponent<IconProps & {
|
|
5
|
+
secondaryColor?: Color | undefined;
|
|
6
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("react"),a=require("./icon-base/_IconBase.js"),o=require("../styles/constants/theme.js"),s=r.forwardRef((function(r,s){var c=r.className,i=r.color,t=r.inlineBlock,l=r.secondaryColor,n=r.size;return e.jsxs(a.IconBase,{ref:s,className:c,color:i||"gray800",inlineBlock:t,size:n,viewBox:"0 0 24 24",children:[e.jsx("path",{d:"M10.53 14.53a.75.75 0 1 0-1.06-1.06L5.5 17.44v-2.19a.75.75 0 0 0-1.5 0v4c0 .414.336.75.75.75h4a.75.75 0 0 0 0-1.5H6.56l3.97-3.97Z","data-is-secondary-color":"true",fill:"".concat(l?o.theme[l]:o.theme.gray400)}),e.jsx("path",{d:"M13.47 9.47a.75.75 0 1 0 1.06 1.06l3.97-3.97v2.19a.75.75 0 0 0 1.5 0v-4a.75.75 0 0 0-.75-.75h-4a.75.75 0 0 0 0 1.5h2.19l-3.97 3.97Z",fill:"currentColor"})]})}));exports.MaximizeDuotoneIcon=s;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("react"),a=require("./icon-base/_IconBase.js");require("../styles/constants/theme.js");var s=r.forwardRef((function(r,s){var i=r.className,c=r.color,o=r.inlineBlock,l=r.size;return e.jsx(a.IconBase,{ref:s,className:i,color:c,inlineBlock:o,size:l,viewBox:"0 0 24 24",children:e.jsx("path",{d:"M13.47 9.47a.75.75 0 1 0 1.06 1.06l3.97-3.97v2.19a.75.75 0 0 0 1.5 0v-4a.75.75 0 0 0-.75-.75h-4a.75.75 0 0 0 0 1.5h2.19l-3.97 3.97Zm-2.94 5.06a.75.75 0 1 0-1.06-1.06L5.5 17.44v-2.19a.75.75 0 0 0-1.5 0v4c0 .414.336.75.75.75h4a.75.75 0 0 0 0-1.5H6.56l3.97-3.97Z",fill:"currentColor"})})}));exports.MaximizeIcon=s;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { Color } from "../types";
|
|
3
|
+
import type { IconProps } from "../types/IconProps";
|
|
4
|
+
export declare const MinimizeDuotoneIcon: import("react").ForwardRefExoticComponent<IconProps & {
|
|
5
|
+
secondaryColor?: Color | undefined;
|
|
6
|
+
} & import("react").RefAttributes<SVGSVGElement>>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("react"),a=require("./icon-base/_IconBase.js"),o=require("../styles/constants/theme.js"),s=r.forwardRef((function(r,s){var c=r.className,i=r.color,l=r.inlineBlock,n=r.secondaryColor,t=r.size;return e.jsxs(a.IconBase,{ref:s,className:c,color:i||"gray800",inlineBlock:l,size:t,viewBox:"0 0 24 24",children:[e.jsx("path",{d:"M6 13.25a.75.75 0 0 0 0 1.5h2.19l-3.97 3.97a.75.75 0 1 0 1.06 1.06l3.97-3.97V18a.75.75 0 0 0 1.5 0v-4a.75.75 0 0 0-.75-.75H6Z","data-is-secondary-color":"true",fill:"".concat(n?o.theme[n]:o.theme.gray400)}),e.jsx("path",{d:"M19.78 5.28a.75.75 0 0 0-1.06-1.06l-3.97 3.97V6a.75.75 0 0 0-1.5 0v4c0 .414.336.75.75.75h4a.75.75 0 0 0 0-1.5h-2.19l3.97-3.97Z",fill:"currentColor"})]})}));exports.MinimizeDuotoneIcon=s;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),r=require("react"),a=require("./icon-base/_IconBase.js");require("../styles/constants/theme.js");var s=r.forwardRef((function(r,s){var i=r.className,c=r.color,l=r.inlineBlock,n=r.size;return e.jsx(a.IconBase,{ref:s,className:i,color:c,inlineBlock:l,size:n,viewBox:"0 0 24 24",children:e.jsx("path",{d:"M19.78 5.28a.75.75 0 0 0-1.06-1.06l-3.97 3.97V6a.75.75 0 0 0-1.5 0v4c0 .414.336.75.75.75h4a.75.75 0 0 0 0-1.5h-2.19l3.97-3.97ZM6 13.25a.75.75 0 0 0 0 1.5h2.19l-3.97 3.97a.75.75 0 1 0 1.06 1.06l3.97-3.97V18a.75.75 0 0 0 1.5 0v-4a.75.75 0 0 0-.75-.75H6Z",fill:"currentColor"})})}));exports.MinimizeIcon=s;
|