@zonos/amino 4.2.2 → 4.2.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 +1 -0
- package/components/mdx-bread-crumbs/MdxBreadCrumbs.d.ts +2 -1
- package/components/mdx-bread-crumbs/MdxBreadCrumbs.js +1 -1
- package/components/mdx-card/MdxCard.js +1 -1
- package/components/mdx-code-block/MdxCodeBlock.d.ts +2 -1
- package/components/mdx-code-block/MdxCodeBlock.js +1 -1
- package/components/mdx-hero/MdxHero.d.ts +6 -0
- package/components/mdx-hero/MdxHero.js +1 -0
- package/package.json +1 -1
package/all.d.ts
CHANGED
|
@@ -50,6 +50,7 @@ import './components/mdx-card/MdxCard';
|
|
|
50
50
|
import './components/mdx-code-block/MdxCodeBlock';
|
|
51
51
|
import './components/mdx-collapse/MdxCollapse';
|
|
52
52
|
import './components/mdx-copy-value/MdxCopyValue';
|
|
53
|
+
import './components/mdx-hero/MdxHero';
|
|
53
54
|
import './components/mdx-image/MdxImage';
|
|
54
55
|
import './components/mdx-progress-checkbox/MdxProgressCheckbox';
|
|
55
56
|
import './components/mdx-related-content/MdxRelatedContent';
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
2
|
export declare type Props = {
|
|
3
3
|
children: ReactNode;
|
|
4
|
+
className?: string;
|
|
4
5
|
};
|
|
5
|
-
export declare const MdxBreadCrumbs: ({ children }: Props) => JSX.Element;
|
|
6
|
+
export declare const MdxBreadCrumbs: ({ children, className }: Props) => JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var n=require("../../_tslib-fe391a2e.js"),e=require("react/jsx-runtime"),t=require("../../styles/constants/theme.js");function r(n){return n&&n.__esModule?n:{default:n}}var o,a=r(require("styled-components")).default.div(o||(o=n.__makeTemplateObject(["\n font-size: 14px;\n font-weight: 500;\n padding: 0 16px;\n\n > a,\n span {\n color: ",";\n border-bottom: none;\n margin: 0 3px 0 5px;\n :hover {\n opacity: 0.9;\n }\n :after {\n content: '/';\n color: ",";\n margin-left: 8px;\n }\n }\n a:first-of-type {\n margin-left: 0;\n }\n span:last-of-type {\n color: ",";\n :after {\n content: none;\n }\n }\n"],["\n font-size: 14px;\n font-weight: 500;\n padding: 0 16px;\n\n > a,\n span {\n color: ",";\n border-bottom: none;\n margin: 0 3px 0 5px;\n :hover {\n opacity: 0.9;\n }\n :after {\n content: '/';\n color: ",";\n margin-left: 8px;\n }\n }\n a:first-of-type {\n margin-left: 0;\n }\n span:last-of-type {\n color: ",";\n :after {\n content: none;\n }\n }\n"])),t.theme.gray800,t.theme.gray500,t.theme.gray300);exports.MdxBreadCrumbs=function(
|
|
1
|
+
"use strict";var n=require("../../_tslib-fe391a2e.js"),e=require("react/jsx-runtime"),t=require("../../styles/constants/theme.js");function r(n){return n&&n.__esModule?n:{default:n}}var o,a=r(require("styled-components")).default.div(o||(o=n.__makeTemplateObject(["\n font-size: 14px;\n font-weight: 500;\n padding: 0 16px;\n\n > a,\n span {\n color: ",";\n border-bottom: none;\n margin: 0 3px 0 5px;\n :hover {\n opacity: 0.9;\n }\n :after {\n content: '/';\n color: ",";\n margin-left: 8px;\n }\n }\n a:first-of-type {\n margin-left: 0;\n }\n span:last-of-type {\n color: ",";\n :after {\n content: none;\n }\n }\n"],["\n font-size: 14px;\n font-weight: 500;\n padding: 0 16px;\n\n > a,\n span {\n color: ",";\n border-bottom: none;\n margin: 0 3px 0 5px;\n :hover {\n opacity: 0.9;\n }\n :after {\n content: '/';\n color: ",";\n margin-left: 8px;\n }\n }\n a:first-of-type {\n margin-left: 0;\n }\n span:last-of-type {\n color: ",";\n :after {\n content: none;\n }\n }\n"])),t.theme.gray800,t.theme.gray500,t.theme.gray300);exports.MdxBreadCrumbs=function(t){var r=t.children,o=t.className;return e.jsx(a,n.__assign({className:o},{children:r}))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var n=require("../../_tslib-fe391a2e.js"),e=require("react/jsx-runtime"),r=require("react"),t=require("../../styles/constants/theme.js"),o=require("../../utils/getProductDetails.js"),i=require("styled-components");function
|
|
1
|
+
"use strict";var n=require("../../_tslib-fe391a2e.js"),e=require("react/jsx-runtime"),r=require("react"),t=require("../../styles/constants/theme.js"),o=require("../../utils/getProductDetails.js"),i=require("styled-components"),s=require("../mdx-anchor/MdxAnchor.js");function c(n){return n&&n.__esModule?n:{default:n}}require("../../icons/custom/products/CheckoutIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../../icons/custom/products/ClassifyIcon.js"),require("../../icons/custom/products/ClearIcon.js"),require("../../icons/custom/products/DashboardIcon.js"),require("../../icons/custom/products/HelloIcon.js"),require("../../icons/custom/products/LandedCostIcon.js"),require("../../icons/custom/products/RateIcon.js"),require("../../icons/custom/products/RestrictIcon.js"),require("../../icons/custom/products/ScreenIcon.js"),require("../../utils/getIsInternalLink.js");var a,l,p,d,u=c(i),x=u.default(s.MdxAnchor)(a||(a=n.__makeTemplateObject([""],[""]))),g=u.default.div(p||(p=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n padding: 1px;\n box-shadow: inset 0px 0px 1px 1px ",";\n border-radius: 12px;\n position: relative;\n font-size: 14px;\n gap: 4px;\n line-height: 24px;\n overflow: hidden;\n cursor: pointer;\n z-index: 0;\n\n ",""," {\n background: ",";\n height: 100%;\n border-radius: 11px;\n padding: 20px 24px;\n }\n ","\n\n b {\n color: ",";\n font-weight: 700;\n }\n p {\n font-weight: 400;\n color: ",";\n margin: 0;\n }\n\n > div {\n display: flex;\n gap: 8px;\n align-items: center;\n\n span {\n color: ",";\n font-size: 12px;\n margin-bottom: 0;\n }\n }\n"],["\n display: flex;\n flex-direction: column;\n padding: 1px;\n box-shadow: inset 0px 0px 1px 1px ",";\n border-radius: 12px;\n position: relative;\n font-size: 14px;\n gap: 4px;\n line-height: 24px;\n overflow: hidden;\n cursor: pointer;\n z-index: 0;\n\n ",""," {\n background: ",";\n height: 100%;\n border-radius: 11px;\n padding: 20px 24px;\n }\n ","\n\n b {\n color: ",";\n font-weight: 700;\n }\n p {\n font-weight: 400;\n color: ",";\n margin: 0;\n }\n\n > div {\n display: flex;\n gap: 8px;\n align-items: center;\n\n span {\n color: ",";\n font-size: 12px;\n margin-bottom: 0;\n }\n }\n"])),t.theme.gray200,x,x,t.theme.gray0,(function(e){return!e.noGlowOnHover&&e.glowingColor&&i.css(l||(l=n.__makeTemplateObject(["\n &::after {\n content: '';\n position: absolute;\n opacity: 0;\n width: 100%;\n height: 100%;\n top: calc(var(--y, 0) * 1px - 50%);\n left: calc(var(--x, 0) * 1px - 50%);\n background: radial-gradient(\n circle,\n "," 0%,\n white 70%\n );\n filter: blur(20px);\n transition: opacity 0.5s;\n z-index: -1;\n }\n :hover {\n &::after {\n opacity: 1;\n }\n }\n "],["\n &::after {\n content: '';\n position: absolute;\n opacity: 0;\n width: 100%;\n height: 100%;\n top: calc(var(--y, 0) * 1px - 50%);\n left: calc(var(--x, 0) * 1px - 50%);\n background: radial-gradient(\n circle,\n "," 0%,\n white 70%\n );\n filter: blur(20px);\n transition: opacity 0.5s;\n z-index: -1;\n }\n :hover {\n &::after {\n opacity: 1;\n }\n }\n "])),t.theme["".concat(e.glowingColor,"600")])}),t.theme.primary,t.theme.gray700,t.theme.gray800),h=u.default.div(d||(d=n.__makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: 24px;\n"],["\n display: flex;\n align-items: center;\n gap: 24px;\n"])));exports.MdxCard=function(t){var i=t.product,s=t.glowingColor,c=void 0===s?"gray":s,a=t.noGlowOnHover,l=void 0!==a&&a,p=t.xlabel,d=t.xsubLabel,u=t.children,f=r.useRef(null);r.useEffect((function(){var n=f.current,e=function(e){if(n){var r=n.getBoundingClientRect(),t=r.x,o=r.y;n.style.setProperty("--x",(e.clientX-t).toString()),n.style.setProperty("--y",(e.clientY-o).toString())}};return l||null==n||n.addEventListener("mousemove",e),function(){l||null==n||n.removeEventListener("mousemove",e)}}),[l]);var m=function(){if(u){var n=(u.props||u.props.children.props).href;if(n)return n;throw new Error("MdxCard will only accept one link as a child.")}return null}(),v=o.getProductDetails(i),b=i?v.color:c;return e.jsx(g,n.__assign({ref:f,glowingColor:b,noGlowOnHover:l},{children:e.jsx(x,n.__assign({as:m?"a":"div",href:m||void 0,title:p,className:"link-button"},{children:e.jsxs(h,{children:[i&&e.jsx("div",{children:v.icon}),e.jsxs("div",{children:[e.jsx("b",{children:p}),e.jsx("p",{children:d})]})]})}))}))};
|
|
@@ -3,6 +3,7 @@ declare type Props = {
|
|
|
3
3
|
children?: ReactElement;
|
|
4
4
|
xlabel: string;
|
|
5
5
|
type: 'JSON' | 'GraphQL';
|
|
6
|
+
maxHeight?: number;
|
|
6
7
|
};
|
|
7
|
-
export declare const MdxCodeBlock: ({ children, xlabel, type }: Props) => JSX.Element;
|
|
8
|
+
export declare const MdxCodeBlock: ({ children, xlabel, type, maxHeight, }: Props) => JSX.Element;
|
|
8
9
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var n=require("../../_tslib-fe391a2e.js"),e=require("react/jsx-runtime"),r=require("react"),t=require("../badge/Badge.js"),o=require("../button/Button.js"),i=require("../stack/HStack.js"),a=require("../../icons/CopyIcon.js"),s=require("../../styles/constants/theme.js"),l=require("styled-components"),p=require("../../utils/useCopyText.js");function c(n){return n&&n.__esModule?n:{default:n}}require("../spinner/Spinner.js"),require("../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../button/_Ripple.js"),require("../button/useRipple.js"),require("../stack/Stack.js"),require("../../icons/icon-base/_IconBase.js");var d,u,g,h,x,f
|
|
1
|
+
"use strict";var n=require("../../_tslib-fe391a2e.js"),e=require("react/jsx-runtime"),r=require("react"),t=require("../badge/Badge.js"),o=require("../button/Button.js"),i=require("../stack/HStack.js"),a=require("../../icons/CopyIcon.js"),s=require("../../styles/constants/theme.js"),l=require("styled-components"),p=require("../../utils/useCopyText.js");function c(n){return n&&n.__esModule?n:{default:n}}require("../spinner/Spinner.js"),require("../button/RippleGroup.js"),require("framer-motion"),require("uuid"),require("../button/_Ripple.js"),require("../button/useRipple.js"),require("../stack/Stack.js"),require("../../icons/icon-base/_IconBase.js");var d,u,g,h,x,m,f=c(l),b=f.default.div(d||(d=n.__makeTemplateObject(["\n width: 100%;\n background-color: ",";\n border-radius: 12px;\n color: ",";\n margin-bottom: 16px;\n"],["\n width: 100%;\n background-color: ",";\n border-radius: 12px;\n color: ",";\n margin-bottom: 16px;\n"])),s.theme.gray1100,s.theme.gray0),j=f.default.div(u||(u=n.__makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n background-color: ",";\n padding: 8px 16px;\n border-top-left-radius: 12px;\n border-top-right-radius: 12px;\n\n p {\n margin: 0;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n }\n"],["\n display: flex;\n justify-content: space-between;\n align-items: center;\n background-color: ",";\n padding: 8px 16px;\n border-top-left-radius: 12px;\n border-top-right-radius: 12px;\n\n p {\n margin: 0;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n }\n"])),s.theme.gray1000),y=f.default.div(g||(g=n.__makeTemplateObject(["\n padding: 16px;\n display: flex;\n max-height: ","px;\n overflow: auto;\n height: fit-content;\n\n pre {\n white-space: pre;\n word-break: break-word;\n border-radius: 0;\n padding: 0;\n background: transparent;\n\n .hljs {\n color: ",";\n background: transparent;\n }\n\n code {\n display: block;\n font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier,\n monospace;\n line-height: 20px;\n font-weight: 600;\n font-size: 12px;\n\n .hljs- {\n &attr,\n &tag {\n color: ",";\n }\n\n &literal,\n &number {\n color: ",";\n }\n\n &string {\n color: ",";\n }\n }\n\n .key {\n color: ",";\n }\n\n div {\n height: 21px;\n }\n }\n }\n"],["\n padding: 16px;\n display: flex;\n max-height: ","px;\n overflow: auto;\n height: fit-content;\n\n pre {\n white-space: pre;\n word-break: break-word;\n border-radius: 0;\n padding: 0;\n background: transparent;\n\n .hljs {\n color: ",";\n background: transparent;\n }\n\n code {\n display: block;\n font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier,\n monospace;\n line-height: 20px;\n font-weight: 600;\n font-size: 12px;\n\n .hljs- {\n &attr,\n &tag {\n color: ",";\n }\n\n &literal,\n &number {\n color: ",";\n }\n\n &string {\n color: ",";\n }\n }\n\n .key {\n color: ",";\n }\n\n div {\n height: 21px;\n }\n }\n }\n"])),(function(n){return n.maxHeight}),s.theme.gray100,s.theme.gray200,s.theme.blue400,s.theme.purple400,s.theme.orange500),k=f.default(t.Badge)(h||(h=n.__makeTemplateObject(["\n > div {\n background-color: ",";\n p {\n color: #fff;\n }\n }\n"],["\n > div {\n background-color: ",";\n p {\n color: #fff;\n }\n }\n"])),s.theme.gray800),_=f.default.div(x||(x=n.__makeTemplateObject(["\n min-width: 24px;\n line-height: 20px;\n padding: 4px 0;\n font-size: 10px;\n color: ",";\n font-weight: 600;\n -webkit-user-select: none; /* Safari */\n -moz-user-select: none; /* Firefox */\n -ms-user-select: none; /* IE10+/Edge */\n user-select: none; /* Standard */\n"],["\n min-width: 24px;\n line-height: 20px;\n padding: 4px 0;\n font-size: 10px;\n color: ",";\n font-weight: 600;\n -webkit-user-select: none; /* Safari */\n -moz-user-select: none; /* Firefox */\n -ms-user-select: none; /* IE10+/Edge */\n user-select: none; /* Standard */\n"])),s.theme.gray500),w=f.default(i.HStack)(m||(m=n.__makeTemplateObject(["\n align-items: center;\n"],["\n align-items: center;\n"]))),v=function(n){return n?"string"==typeof n?("".concat(n).match(/\n/g)||[]).length:Array.isArray(n)?n.reduce((function(n,e){return n+v(e)}),0):n.props.children?v(n.props.children):0:0};exports.MdxCodeBlock=function(t){var i=t.children,s=t.xlabel,l=t.type,c=t.maxHeight,d=void 0===c?260:c,u="pre"===(null==i?void 0:i.type)&&i.props.children,g="code"===(null==u?void 0:u.type)&&u.props.children||[],h=v(g),x=p.useCopyText(),m=x.showTooltip,f=x.copyText,q=r.useRef(null);return e.jsxs(b,{children:[e.jsxs(j,{children:[e.jsx("p",{children:s}),e.jsxs(w,n.__assign({spacing:16},{children:[l&&e.jsx(k,{children:l}),m?e.jsx("p",{children:"Copied!"}):e.jsx(o.Button,{intent:"text",icon:e.jsx(a.CopyIcon,{color:"gray100",size:20}),onClick:function(){var n;return f((null===(n=q.current)||void 0===n?void 0:n.innerText)||"Oops... Something went wrong copying the text")}})]}))]}),e.jsxs(y,n.__assign({maxHeight:d},{children:[e.jsx(_,{children:n.__spreadArray([],n.__read(Array(h)),!1).map((function(n,r){return e.jsx("div",{children:r+1},r)}))}),e.jsx("div",n.__assign({ref:q},{children:i}))]}))]})};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var e=require("../../_tslib-fe391a2e.js"),n=require("react/jsx-runtime"),t=require("../../styles/constants/theme.js"),r=require("../../styles/devices.js"),i=require("styled-components"),s=require("../mdx-section/MdxSection.js");function a(e){return e&&e.__esModule?e:{default:e}}require("react"),require("../../icons/LinkIcon.js"),require("../../icons/icon-base/_IconBase.js"),require("../../utils/getHashId.js"),require("../../utils/useCopyText.js");var o,d,l,c=a(i),p=c.default(s.MdxSection)(o||(o=e.__makeTemplateObject(["\n width: 100%;\n display: flex;\n justify-content: space-between;\n gap: 48px;\n align-items: center;\n\n @media "," {\n flex-direction: column;\n }\n\n > div {\n height: fit-content;\n width: 100%;\n }\n\n h1,\n h2 {\n margin-bottom: 16px;\n }\n\n p {\n margin-bottom: 16px;\n }\n"],["\n width: 100%;\n display: flex;\n justify-content: space-between;\n gap: 48px;\n align-items: center;\n\n @media "," {\n flex-direction: column;\n }\n\n > div {\n height: fit-content;\n width: 100%;\n }\n\n h1,\n h2 {\n margin-bottom: 16px;\n }\n\n p {\n margin-bottom: 16px;\n }\n"])),r.devices.desktop),m=c.default.div(d||(d=e.__makeTemplateObject(["\n img,\n .gatsby-resp-image-wrapper {\n box-shadow: ",";\n border-radius: 10px;\n }\n"],["\n img,\n .gatsby-resp-image-wrapper {\n box-shadow: ",";\n border-radius: 10px;\n }\n"])),t.theme.v3ShadowLarge),u=c.default.div(l||(l=e.__makeTemplateObject(["\n display: flex;\n gap: 8px;\n flex-wrap: wrap;\n\n && > a:hover {\n border-bottom: none;\n }\n"],["\n display: flex;\n gap: 8px;\n flex-wrap: wrap;\n\n && > a:hover {\n border-bottom: none;\n }\n"])));exports.MdxHero=function(e){var t=e.children;if(!Array.isArray(t))return console.error("The MdxHero component requires at least 2 children elements. See https://amino.zonos.com/?path=/story/amino-mdxhero--mdx-hero for details."),null;var r=t.filter((function(e){return"MdxButton"===e.type.stableName})),i=t.find((function(e){return"MdxImage"===e.type.stableName}))||"",s=r&&t.filter((function(e){return!r.includes(e)&&i!==e}));return n.jsx(p,{children:n.jsxs(n.Fragment,{children:[n.jsxs("div",{children:[s,n.jsx(u,{children:r})]}),i&&n.jsx(m,{children:i})]})})};
|