@evo-web/react 0.0.2 → 0.0.3
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.
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import type { AnchorButtonProps, NativeButtonProps } from "./types";
|
|
3
|
-
import "@ebay/skin/button";
|
|
3
|
+
import "@ebay/skin/button.mjs";
|
|
4
4
|
export declare function EvoButton(props: AnchorButtonProps): React.JSX.Element;
|
|
5
5
|
export declare function EvoButton(props: NativeButtonProps): React.JSX.Element;
|
|
6
6
|
//# sourceMappingURL=button.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/evo-button/button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EACV,iBAAiB,EACjB,iBAAiB,EAIlB,MAAM,SAAS,CAAC;AACjB,OAAO,
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/evo-button/button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EACV,iBAAiB,EACjB,iBAAiB,EAIlB,MAAM,SAAS,CAAC;AACjB,OAAO,uBAAuB,CAAC;AAE/B,wBAAgB,SAAS,CAAC,KAAK,EAAE,iBAAiB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;AACvE,wBAAgB,SAAS,CAAC,KAAK,EAAE,iBAAiB,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsxs, jsx } from "react/jsx-runtime";
|
|
3
3
|
import classNames from "classnames";
|
|
4
|
-
import "@ebay/skin/button";
|
|
4
|
+
import "@ebay/skin/button.mjs";
|
|
5
5
|
function EvoButton(props) {
|
|
6
6
|
const { priority = "secondary", variant = "standard", size, bodyState, split, transparent = false, fluid = false, disabled, partiallyDisabled, children, onKeyDown, onEscape, truncate = false, href, className: extraClasses, borderless, fixedHeight, ...rest } = props;
|
|
7
7
|
const classPrefix = href ? "fake-btn" : "btn";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sources":["../../src/evo-button/button.tsx"],"sourcesContent":["import type { KeyboardEvent } from \"react\";\nimport React from \"react\";\nimport classNames from \"classnames\";\nimport type {\n AnchorButtonProps,\n NativeButtonProps,\n Priority,\n Size,\n Split,\n} from \"./types\";\nimport \"@ebay/skin/button\";\n\nexport function EvoButton(props: AnchorButtonProps): React.JSX.Element;\nexport function EvoButton(props: NativeButtonProps): React.JSX.Element;\nexport function EvoButton(\n props: AnchorButtonProps | NativeButtonProps,\n): React.JSX.Element {\n const {\n priority = \"secondary\",\n variant = \"standard\",\n size,\n bodyState,\n split,\n transparent = false,\n fluid = false,\n disabled,\n partiallyDisabled,\n children,\n onKeyDown,\n onEscape,\n truncate = false,\n href,\n className: extraClasses,\n borderless,\n fixedHeight,\n ...rest\n } = props;\n const classPrefix = href ? \"fake-btn\" : \"btn\";\n const priorityStyles: { [key in Priority]: string } = {\n primary: `${classPrefix}--primary`,\n secondary: `${classPrefix}--secondary`,\n tertiary: `${classPrefix}--tertiary`,\n none: \"\",\n };\n const sizeStyles: { [key in Size]: string } = {\n large: `${classPrefix}--large`,\n small: `${classPrefix}--small`,\n };\n const splitStyles: { [key in Split]: string } = {\n start: `${classPrefix}--split-start`,\n end: `${classPrefix}--split-end`,\n };\n const isDestructive = variant === \"destructive\";\n const isForm = variant === \"form\";\n const className = classNames(\n classPrefix,\n extraClasses,\n priorityStyles[isForm || borderless ? \"none\" : priority],\n size && sizeStyles[size],\n split && splitStyles[split],\n isDestructive && `${classPrefix}--destructive`,\n isForm && `${classPrefix}--form`,\n transparent && `${classPrefix}--transparent`,\n fluid && `${classPrefix}--fluid`,\n truncate && `${classPrefix}--truncated`,\n borderless && `${classPrefix}--borderless`,\n fixedHeight &&\n (size && sizeStyles[size]\n ? `${sizeStyles[size]}-fixed-height`\n : `${classPrefix}--fixed-height`),\n );\n\n const bodyContent = (() => {\n switch (bodyState) {\n case \"loading\":\n return (\n <span className=\"btn__cell\">\n {/* TODO: Replace with <EvoProgressSpinner /> when available */}\n <span>Loading...</span>\n </span>\n );\n case \"expand\":\n return (\n <span className=\"btn__cell\">\n <span className=\"btn__text\">{children}</span>\n {/* TODO: Replace with <EvoIconChevronDown16 /> when available */}\n <span>▼</span>\n </span>\n );\n default:\n return children;\n }\n })();\n\n const ariaLive = bodyState === \"loading\" ? \"polite\" : undefined;\n\n const keyDownHandler = (\n event: KeyboardEvent<HTMLButtonElement | HTMLAnchorElement>,\n ) => {\n onKeyDown?.(\n event as KeyboardEvent<HTMLButtonElement> &\n KeyboardEvent<HTMLAnchorElement>,\n );\n if (event.key === \"Escape\" && !disabled && onEscape) {\n onEscape(\n event as KeyboardEvent<HTMLButtonElement> &\n KeyboardEvent<HTMLAnchorElement>,\n );\n }\n };\n\n if (href) {\n return (\n <a\n {...(rest as React.ComponentProps<\"a\">)}\n className={className}\n href={disabled ? undefined : href}\n onKeyDown={keyDownHandler}\n aria-live={ariaLive}\n >\n {bodyContent}\n </a>\n );\n }\n\n return (\n <button\n {...(rest as React.ComponentProps<\"button\">)}\n disabled={disabled}\n aria-disabled={partiallyDisabled ? \"true\" : undefined}\n aria-live={ariaLive}\n className={className}\n onKeyDown={keyDownHandler}\n >\n {bodyContent}\n </button>\n );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;AAcM,SAAU,UACd,OAA4C;AAE5C,QAAM,EACJ,WAAW,aACX,UAAU,YACV,MACA,WACA,OACA,cAAc,OACd,QAAQ,OACR,UACA,mBACA,UACA,WACA,UACA,WAAW,OACX,MACA,WAAW,cACX,YACA,aACA,GAAG,KAAA,IACD;AACJ,QAAM,cAAc,OAAO,aAAa;AACxC,QAAM,iBAAgD;AAAA,IACpD,SAAS,GAAG,WAAW;AAAA,IACvB,WAAW,GAAG,WAAW;AAAA,IACzB,UAAU,GAAG,WAAW;AAAA,IACxB,MAAM;AAAA,EAAA;AAER,QAAM,aAAwC;AAAA,IAC5C,OAAO,GAAG,WAAW;AAAA,IACrB,OAAO,GAAG,WAAW;AAAA,EAAA;AAEvB,QAAM,cAA0C;AAAA,IAC9C,OAAO,GAAG,WAAW;AAAA,IACrB,KAAK,GAAG,WAAW;AAAA,EAAA;AAErB,QAAM,gBAAgB,YAAY;AAClC,QAAM,SAAS,YAAY;AAC3B,QAAM,YAAY,WAChB,aACA,cACA,eAAe,UAAU,aAAa,SAAS,QAAQ,GACvD,QAAQ,WAAW,IAAI,GACvB,SAAS,YAAY,KAAK,GAC1B,iBAAiB,GAAG,WAAW,iBAC/B,UAAU,GAAG,WAAW,UACxB,eAAe,GAAG,WAAW,iBAC7B,SAAS,GAAG,WAAW,WACvB,YAAY,GAAG,WAAW,eAC1B,cAAc,GAAG,WAAW,gBAC5B,gBACG,QAAQ,WAAW,IAAI,IACpB,GAAG,WAAW,IAAI,CAAC,kBACnB,GAAG,WAAW,iBAAiB;AAGvC,QAAM,eAAe,MAAK;AACxB,YAAQ,WAAA;AAAA,MACN,KAAK;AACH,eACEA,cAAM,WAAU,aAAW,UAEzBA,IAAA,QAAA,EAAA,UAAA,aAAA,CAAA,GAAuB;AAAA,MAG7B,KAAK;AACH,eACEC,KAAA,QAAA,EAAM,WAAU,wBACdD,IAAA,QAAA,EAAM,WAAU,uBAAqB,GAErCA,IAAA,QAAA,EAAA,UAAA,KAAA,CAAc,GAAA;AAAA,MAGpB;AACE,eAAO;AAAA,IAAA;AAAA,EAEb,GAAA;AAEA,QAAM,WAAW,cAAc,YAAY,WAAW;AAEtD,QAAM,iBAAiB,CACrB,UACE;AACF,gBACE,KACkC;AAEpC,QAAI,MAAM,QAAQ,YAAY,CAAC,YAAY,UAAU;AACnD,eACE,KACkC;AAAA,IAEtC;AAAA,EACF;AAEA,MAAI,MAAM;AACR,WACEA,IAAA,KAAA,EAAA,GACO,MACL,WACA,MAAM,WAAW,SAAY,MAC7B,WAAW,gBAAc,aACd,UAAQ,UAElB,aAAW;AAAA,EAGlB;AAEA,SACEA,IAAA,UAAA,EAAA,GACO,MACL,UAAkB,iBACH,oBAAoB,SAAS,QAAS,aAC1C,UACX,WACA,WAAW,gBAAc,UAExB,aAAW;AAGlB;"}
|
|
1
|
+
{"version":3,"file":"button.js","sources":["../../src/evo-button/button.tsx"],"sourcesContent":["import type { KeyboardEvent } from \"react\";\nimport React from \"react\";\nimport classNames from \"classnames\";\nimport type {\n AnchorButtonProps,\n NativeButtonProps,\n Priority,\n Size,\n Split,\n} from \"./types\";\nimport \"@ebay/skin/button.mjs\";\n\nexport function EvoButton(props: AnchorButtonProps): React.JSX.Element;\nexport function EvoButton(props: NativeButtonProps): React.JSX.Element;\nexport function EvoButton(\n props: AnchorButtonProps | NativeButtonProps,\n): React.JSX.Element {\n const {\n priority = \"secondary\",\n variant = \"standard\",\n size,\n bodyState,\n split,\n transparent = false,\n fluid = false,\n disabled,\n partiallyDisabled,\n children,\n onKeyDown,\n onEscape,\n truncate = false,\n href,\n className: extraClasses,\n borderless,\n fixedHeight,\n ...rest\n } = props;\n const classPrefix = href ? \"fake-btn\" : \"btn\";\n const priorityStyles: { [key in Priority]: string } = {\n primary: `${classPrefix}--primary`,\n secondary: `${classPrefix}--secondary`,\n tertiary: `${classPrefix}--tertiary`,\n none: \"\",\n };\n const sizeStyles: { [key in Size]: string } = {\n large: `${classPrefix}--large`,\n small: `${classPrefix}--small`,\n };\n const splitStyles: { [key in Split]: string } = {\n start: `${classPrefix}--split-start`,\n end: `${classPrefix}--split-end`,\n };\n const isDestructive = variant === \"destructive\";\n const isForm = variant === \"form\";\n const className = classNames(\n classPrefix,\n extraClasses,\n priorityStyles[isForm || borderless ? \"none\" : priority],\n size && sizeStyles[size],\n split && splitStyles[split],\n isDestructive && `${classPrefix}--destructive`,\n isForm && `${classPrefix}--form`,\n transparent && `${classPrefix}--transparent`,\n fluid && `${classPrefix}--fluid`,\n truncate && `${classPrefix}--truncated`,\n borderless && `${classPrefix}--borderless`,\n fixedHeight &&\n (size && sizeStyles[size]\n ? `${sizeStyles[size]}-fixed-height`\n : `${classPrefix}--fixed-height`),\n );\n\n const bodyContent = (() => {\n switch (bodyState) {\n case \"loading\":\n return (\n <span className=\"btn__cell\">\n {/* TODO: Replace with <EvoProgressSpinner /> when available */}\n <span>Loading...</span>\n </span>\n );\n case \"expand\":\n return (\n <span className=\"btn__cell\">\n <span className=\"btn__text\">{children}</span>\n {/* TODO: Replace with <EvoIconChevronDown16 /> when available */}\n <span>▼</span>\n </span>\n );\n default:\n return children;\n }\n })();\n\n const ariaLive = bodyState === \"loading\" ? \"polite\" : undefined;\n\n const keyDownHandler = (\n event: KeyboardEvent<HTMLButtonElement | HTMLAnchorElement>,\n ) => {\n onKeyDown?.(\n event as KeyboardEvent<HTMLButtonElement> &\n KeyboardEvent<HTMLAnchorElement>,\n );\n if (event.key === \"Escape\" && !disabled && onEscape) {\n onEscape(\n event as KeyboardEvent<HTMLButtonElement> &\n KeyboardEvent<HTMLAnchorElement>,\n );\n }\n };\n\n if (href) {\n return (\n <a\n {...(rest as React.ComponentProps<\"a\">)}\n className={className}\n href={disabled ? undefined : href}\n onKeyDown={keyDownHandler}\n aria-live={ariaLive}\n >\n {bodyContent}\n </a>\n );\n }\n\n return (\n <button\n {...(rest as React.ComponentProps<\"button\">)}\n disabled={disabled}\n aria-disabled={partiallyDisabled ? \"true\" : undefined}\n aria-live={ariaLive}\n className={className}\n onKeyDown={keyDownHandler}\n >\n {bodyContent}\n </button>\n );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;AAcM,SAAU,UACd,OAA4C;AAE5C,QAAM,EACJ,WAAW,aACX,UAAU,YACV,MACA,WACA,OACA,cAAc,OACd,QAAQ,OACR,UACA,mBACA,UACA,WACA,UACA,WAAW,OACX,MACA,WAAW,cACX,YACA,aACA,GAAG,KAAA,IACD;AACJ,QAAM,cAAc,OAAO,aAAa;AACxC,QAAM,iBAAgD;AAAA,IACpD,SAAS,GAAG,WAAW;AAAA,IACvB,WAAW,GAAG,WAAW;AAAA,IACzB,UAAU,GAAG,WAAW;AAAA,IACxB,MAAM;AAAA,EAAA;AAER,QAAM,aAAwC;AAAA,IAC5C,OAAO,GAAG,WAAW;AAAA,IACrB,OAAO,GAAG,WAAW;AAAA,EAAA;AAEvB,QAAM,cAA0C;AAAA,IAC9C,OAAO,GAAG,WAAW;AAAA,IACrB,KAAK,GAAG,WAAW;AAAA,EAAA;AAErB,QAAM,gBAAgB,YAAY;AAClC,QAAM,SAAS,YAAY;AAC3B,QAAM,YAAY,WAChB,aACA,cACA,eAAe,UAAU,aAAa,SAAS,QAAQ,GACvD,QAAQ,WAAW,IAAI,GACvB,SAAS,YAAY,KAAK,GAC1B,iBAAiB,GAAG,WAAW,iBAC/B,UAAU,GAAG,WAAW,UACxB,eAAe,GAAG,WAAW,iBAC7B,SAAS,GAAG,WAAW,WACvB,YAAY,GAAG,WAAW,eAC1B,cAAc,GAAG,WAAW,gBAC5B,gBACG,QAAQ,WAAW,IAAI,IACpB,GAAG,WAAW,IAAI,CAAC,kBACnB,GAAG,WAAW,iBAAiB;AAGvC,QAAM,eAAe,MAAK;AACxB,YAAQ,WAAA;AAAA,MACN,KAAK;AACH,eACEA,cAAM,WAAU,aAAW,UAEzBA,IAAA,QAAA,EAAA,UAAA,aAAA,CAAA,GAAuB;AAAA,MAG7B,KAAK;AACH,eACEC,KAAA,QAAA,EAAM,WAAU,wBACdD,IAAA,QAAA,EAAM,WAAU,uBAAqB,GAErCA,IAAA,QAAA,EAAA,UAAA,KAAA,CAAc,GAAA;AAAA,MAGpB;AACE,eAAO;AAAA,IAAA;AAAA,EAEb,GAAA;AAEA,QAAM,WAAW,cAAc,YAAY,WAAW;AAEtD,QAAM,iBAAiB,CACrB,UACE;AACF,gBACE,KACkC;AAEpC,QAAI,MAAM,QAAQ,YAAY,CAAC,YAAY,UAAU;AACnD,eACE,KACkC;AAAA,IAEtC;AAAA,EACF;AAEA,MAAI,MAAM;AACR,WACEA,IAAA,KAAA,EAAA,GACO,MACL,WACA,MAAM,WAAW,SAAY,MAC7B,WAAW,gBAAc,aACd,UAAQ,UAElB,aAAW;AAAA,EAGlB;AAEA,SACEA,IAAA,UAAA,EAAA,GACO,MACL,UAAkB,iBACH,oBAAoB,SAAS,QAAS,aAC1C,UACX,WACA,WAAW,gBAAc,UAExB,aAAW;AAGlB;"}
|