@faststore/components 2.0.16-alpha.0 → 2.0.18-alpha.0

package/CHANGELOG.md

@@ -3,6 +3,24 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.0.18-alpha.0](https://github.com/vtex/faststore/compare/v2.0.17-alpha.0...v2.0.18-alpha.0) (2022-12-15)
+
+
+### Bug Fixes
+
+* Starter's Integration tests ([#1559](https://github.com/vtex/faststore/issues/1559)) ([d597d98](https://github.com/vtex/faststore/commit/d597d981079448ca46588a8e32964c4e5dcc84f8)), closes [#323](https://github.com/vtex/faststore/issues/323)
+
+
+
+## [2.0.17-alpha.0](https://github.com/vtex/faststore/compare/v2.0.16-alpha.0...v2.0.17-alpha.0) (2022-12-15)
+
+
+### Features
+
+* Create `LinkButton` component ([#1558](https://github.com/vtex/faststore/issues/1558)) ([bbbebdb](https://github.com/vtex/faststore/commit/bbbebdb081f9c40315d8b661461e3b09a34b84b6))
+
+
+
 ## [2.0.16-alpha.0](https://github.com/vtex/faststore/compare/v2.0.15-alpha.0...v2.0.16-alpha.0) (2022-12-15)
 
 

package/dist/atoms/List/List.d.ts

@@ -10,7 +10,7 @@ interface BaseProps {
      */
     marker?: boolean;
 }
-export declare type ListProps<T extends ElementType> = PolymorphicComponentPropsWithRef<T, BaseProps>;
+export declare type ListProps<T extends ElementType = 'ul'> = PolymorphicComponentPropsWithRef<T, BaseProps>;
 declare type ListComponent = <T extends ElementType = 'ul'>(props: ListProps<T>) => ReactElement | null;
 declare const List: ListComponent;
 export default List;

package/dist/atoms/List/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sourceRoot":"","sources":["../../../src/atoms/List/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AA4BzC,MAAM,IAAI,GAAkB,UAAU,CAAC,SAAS,IAAI,CAGlD,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,GAAG,SAAS,EAAE,GAAG,UAAU,EAAgB,EAC/D,GAAsB;IAEtB,MAAM,SAAS,GAAG,EAAE,IAAI,IAAI,CAAA;IAE5B,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,uCAEK,MAAM,yBACE,MAAM,KACvB,UAAU,GACd,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,IAAI,CAAA"}
+{"version":3,"file":"List.js","sourceRoot":"","sources":["../../../src/atoms/List/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AA0BzC,MAAM,IAAI,GAAkB,UAAU,CAAC,SAAS,IAAI,CAGlD,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,GAAG,SAAS,EAAE,GAAG,UAAU,EAAgB,EAC/D,GAAsB;IAEtB,MAAM,SAAS,GAAG,EAAE,IAAI,IAAI,CAAA;IAE5B,OAAO,CACL,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,uCAEK,MAAM,yBACE,MAAM,KACvB,UAAU,GACd,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,IAAI,CAAA"}

package/dist/index.d.ts

@@ -33,6 +33,8 @@ export { default as DiscountBadge } from './molecules/DiscountBadge';
 export type { DiscountBadgeProps } from './molecules/DiscountBadge';
 export { default as InputField } from './molecules/InputField';
 export type { InputFieldProps } from './molecules/InputField';
+export { default as LinkButton } from './molecules/LinkButton';
+export type { LinkButtonProps } from './molecules/LinkButton';
 export { default as RadioField } from './molecules/RadioField';
 export type { RadioFieldProps } from './molecules/RadioField';
 export { default as SelectField } from './molecules/SelectField';

package/dist/index.js

@@ -20,6 +20,7 @@ export { default as CheckboxField } from './molecules/CheckboxField';
 export { default as IconButton } from './molecules/IconButton';
 export { default as DiscountBadge } from './molecules/DiscountBadge';
 export { default as InputField } from './molecules/InputField';
+export { default as LinkButton } from './molecules/LinkButton';
 export { default as RadioField } from './molecules/RadioField';
 export { default as SelectField } from './molecules/SelectField';
 export { default as Tag } from './molecules/Tag';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,SAAS;AACT,cAAc,UAAU,CAAA;AAExB,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAElD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,cAAc,CAAA;AAE9C,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,cAAc,CAAA;AAE9C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,cAAc,CAAA;AAE9C,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,iBAAiB,CAAA;AAEpD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAElD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAElD,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,uBAAuB,CAAA;AAC5D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAEpE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAE9D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAEpE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAE9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAE9D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,yBAAyB,CAAA;AAEhE,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,iBAAiB,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,oBAAoB,CAAA;AAEtD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,yBAAyB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,SAAS;AACT,cAAc,UAAU,CAAA;AAExB,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAElD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,cAAc,CAAA;AAE9C,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,cAAc,CAAA;AAE9C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,cAAc,CAAA;AAE9C,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,iBAAiB,CAAA;AAEpD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAElD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAElD,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,uBAAuB,CAAA;AAC5D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAEpE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAE9D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,2BAA2B,CAAA;AAEpE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAE9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAE9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAE9D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,yBAAyB,CAAA;AAEhE,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,iBAAiB,CAAA;AAEhD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,oBAAoB,CAAA;AAEtD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,yBAAyB,CAAA"}

package/dist/molecules/LinkButton/LinkButton.d.ts

@@ -0,0 +1,5 @@
+import type { AnchorHTMLAttributes } from 'react';
+import type { ButtonProps } from '../..';
+export declare type LinkButtonProps = AnchorHTMLAttributes<HTMLAnchorElement> & ButtonProps;
+declare function LinkButton({ icon, inverse, children, disabled, iconPosition, size, variant, testId, ...otherProps }: LinkButtonProps): JSX.Element;
+export default LinkButton;

package/dist/molecules/LinkButton/LinkButton.js

@@ -0,0 +1,17 @@
+import React, { useRef } from 'react';
+import { Icon } from '../..';
+function LinkButton({ icon, inverse, children, disabled, iconPosition, size = 'regular', variant = 'primary', testId = 'fs-link-button', ...otherProps }) {
+    const linkRef = useRef(null);
+    function onFocus(e) {
+        e.preventDefault();
+        if (disabled) {
+            linkRef.current?.blur();
+        }
+    }
+    return (React.createElement("a", { ref: linkRef, onFocus: onFocus, "data-fs-button": true, "data-fs-link-button": true, "data-testid": testId, "data-fs-button-size": size, "data-fs-button-variant": variant, "data-fs-button-inverse": inverse, "data-fs-button-disabled": disabled, ...otherProps },
+        iconPosition === 'left' && React.createElement(Icon, { component: icon }),
+        children,
+        iconPosition === 'right' && React.createElement(Icon, { component: icon })));
+}
+export default LinkButton;
+//# sourceMappingURL=LinkButton.js.map

package/dist/molecules/LinkButton/LinkButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkButton.js","sourceRoot":"","sources":["../../../src/molecules/LinkButton/LinkButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAGrC,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAM5B,SAAS,UAAU,CAAC,EAClB,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,IAAI,GAAG,SAAS,EAChB,OAAO,GAAG,SAAS,EACnB,MAAM,GAAG,gBAAgB,EACzB,GAAG,UAAU,EACG;IAChB,MAAM,OAAO,GAAG,MAAM,CAA2B,IAAI,CAAC,CAAA;IAEtD,SAAS,OAAO,CAAC,CAAa;QAC5B,CAAC,CAAC,cAAc,EAAE,CAAA;QAElB,IAAI,QAAQ,EAAE;YACZ,OAAO,CAAC,OAAO,EAAE,IAAI,EAAE,CAAA;SACxB;IACH,CAAC;IAED,OAAO,CACL,2BACE,GAAG,EAAE,OAAO,EACZ,OAAO,EAAE,OAAO,sEAGH,MAAM,yBACE,IAAI,4BACD,OAAO,4BACP,OAAO,6BACN,QAAQ,KAC7B,UAAU;QAEb,YAAY,KAAK,MAAM,IAAI,oBAAC,IAAI,IAAC,SAAS,EAAE,IAAI,GAAI;QACpD,QAAQ;QACR,YAAY,KAAK,OAAO,IAAI,oBAAC,IAAI,IAAC,SAAS,EAAE,IAAI,GAAI,CACpD,CACL,CAAA;AACH,CAAC;AAED,eAAe,UAAU,CAAA"}

package/dist/molecules/LinkButton/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './LinkButton';
+export type { LinkButtonProps } from './LinkButton';

package/dist/molecules/LinkButton/index.js

@@ -0,0 +1,2 @@
+export { default } from './LinkButton';
+//# sourceMappingURL=index.js.map

package/dist/molecules/LinkButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/molecules/LinkButton/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA"}

package/dist/molecules/SelectField/SelectField.js

@@ -1,10 +1,9 @@
 import React, { forwardRef } from 'react';
-import Select from '../../atoms/Select';
-import Label from '../../atoms/Label';
+import { Label, Select } from '../..';
 const SelectField = forwardRef(function SelectField({ id, label, options, testId = 'fs-select-field', ...otherProps }, ref) {
-    return (React.createElement("div", { ref: ref, "data-fs-select-field": true, "data-testid": testId },
+    return (React.createElement("div", { ref: ref, "data-fs-select-field": true },
         React.createElement(Label, { "data-fs-select-field-label": true, htmlFor: id }, label),
-        React.createElement(Select, { id: id, options: options, ...otherProps })));
+        React.createElement(Select, { id: id, options: options, "data-testid": testId, ...otherProps })));
 });
 export default SelectField;
 //# sourceMappingURL=SelectField.js.map

package/dist/molecules/SelectField/SelectField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectField.js","sourceRoot":"","sources":["../../../src/molecules/SelectField/SelectField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,MAAM,MAAM,oBAAoB,CAAA;AAEvC,OAAO,KAAK,MAAM,mBAAmB,CAAA;AASrC,MAAM,WAAW,GAAG,UAAU,CAC5B,SAAS,WAAW,CAClB,EAAE,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,GAAG,iBAAiB,EAAE,GAAG,UAAU,EAAE,EACjE,GAAG;IAEH,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,+CAAoC,MAAM;QACrD,oBAAC,KAAK,wCAA4B,OAAO,EAAE,EAAE,IAAG,KAAK,CAAS;QAC9D,oBAAC,MAAM,IAAC,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,KAAM,UAAU,GAAI,CAChD,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,WAAW,CAAA"}
+{"version":3,"file":"SelectField.js","sourceRoot":"","sources":["../../../src/molecules/SelectField/SelectField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAUrC,MAAM,WAAW,GAAG,UAAU,CAG5B,SAAS,WAAW,CACpB,EAAE,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,GAAG,iBAAiB,EAAE,GAAG,UAAU,EAAE,EACjE,GAAG;IAEH,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG;QACX,oBAAC,KAAK,wCAA4B,OAAO,EAAE,EAAE,IAC1C,KAAK,CACA;QACR,oBAAC,MAAM,IAAC,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,OAAO,iBAAe,MAAM,KAAM,UAAU,GAAI,CACrE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,WAAW,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/components",
-  "version": "2.0.16-alpha.0",
+  "version": "2.0.18-alpha.0",
   "module": "dist/index.js",
   "typings": "dist/index.d.ts",
   "author": "Emerson Laurentino @emersonlaurentino",
@@ -28,5 +28,5 @@
     "node": "16.18.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "2aa7d4ac5f4c0ad30a900e0239f1bcb5b9ddaab8"
+  "gitHead": "f6117ac7008ebb70368642c145bab4e1f18be831"
 }

package/src/atoms/List/List.tsx

@@ -17,10 +17,8 @@ interface BaseProps {
   marker?: boolean
 }
 
-export type ListProps<T extends ElementType> = PolymorphicComponentPropsWithRef<
-  T,
-  BaseProps
->
+export type ListProps<T extends ElementType = 'ul'> =
+  PolymorphicComponentPropsWithRef<T, BaseProps>
 
 type ListComponent = <T extends ElementType = 'ul'>(
   props: ListProps<T>

package/src/index.ts

@@ -38,6 +38,8 @@ export { default as DiscountBadge } from './molecules/DiscountBadge'
 export type { DiscountBadgeProps } from './molecules/DiscountBadge'
 export { default as InputField } from './molecules/InputField'
 export type { InputFieldProps } from './molecules/InputField'
+export { default as LinkButton } from './molecules/LinkButton'
+export type { LinkButtonProps } from './molecules/LinkButton'
 export { default as RadioField } from './molecules/RadioField'
 export type { RadioFieldProps } from './molecules/RadioField'
 export { default as SelectField } from './molecules/SelectField'

package/src/molecules/LinkButton/LinkButton.tsx

@@ -0,0 +1,51 @@
+import React, { useRef } from 'react'
+import type { FocusEvent, AnchorHTMLAttributes } from 'react'
+
+import { Icon } from '../..'
+import type { ButtonProps } from '../..'
+
+export type LinkButtonProps = AnchorHTMLAttributes<HTMLAnchorElement> &
+  ButtonProps
+
+function LinkButton({
+  icon,
+  inverse,
+  children,
+  disabled,
+  iconPosition,
+  size = 'regular',
+  variant = 'primary',
+  testId = 'fs-link-button',
+  ...otherProps
+}: LinkButtonProps) {
+  const linkRef = useRef<HTMLAnchorElement | null>(null)
+
+  function onFocus(e: FocusEvent) {
+    e.preventDefault()
+
+    if (disabled) {
+      linkRef.current?.blur()
+    }
+  }
+
+  return (
+    <a
+      ref={linkRef}
+      onFocus={onFocus}
+      data-fs-button
+      data-fs-link-button
+      data-testid={testId}
+      data-fs-button-size={size}
+      data-fs-button-variant={variant}
+      data-fs-button-inverse={inverse}
+      data-fs-button-disabled={disabled}
+      {...otherProps}
+    >
+      {iconPosition === 'left' && <Icon component={icon} />}
+      {children}
+      {iconPosition === 'right' && <Icon component={icon} />}
+    </a>
+  )
+}
+
+export default LinkButton

package/src/molecules/LinkButton/index.ts

@@ -0,0 +1,2 @@
+export { default } from './LinkButton'
+export type { LinkButtonProps } from './LinkButton'

package/src/molecules/SelectField/SelectField.tsx

@@ -1,8 +1,8 @@
 import React, { forwardRef } from 'react'
 import type { PropsWithChildren } from 'react'
-import Select from '../../atoms/Select'
-import type {SelectProps} from '../../atoms/Select'
-import Label from '../../atoms/Label'
+
+import { Label, Select } from '../..'
+import type { SelectProps } from '../../atoms/Select'
 
 export interface SelectFieldProps extends SelectProps {
   /**
@@ -11,18 +11,21 @@ export interface SelectFieldProps extends SelectProps {
   label: string
 }
 
-const SelectField = forwardRef<HTMLDivElement, PropsWithChildren<SelectFieldProps>>(
-  function SelectField(
-    { id, label, options, testId = 'fs-select-field', ...otherProps },
-    ref
-  ) {
-    return (
-      <div ref={ref} data-fs-select-field data-testid={testId}>
-        <Label data-fs-select-field-label htmlFor={id}>{label}</Label>
-        <Select id={id} options={options} {...otherProps} />
-      </div>
-    )
-  }
-)
+const SelectField = forwardRef<
+  HTMLDivElement,
+  PropsWithChildren<SelectFieldProps>
+>(function SelectField(
+  { id, label, options, testId = 'fs-select-field', ...otherProps },
+  ref
+) {
+  return (
+    <div ref={ref} data-fs-select-field>
+      <Label data-fs-select-field-label htmlFor={id}>
+        {label}
+      </Label>
+      <Select id={id} options={options} data-testid={testId} {...otherProps} />
+    </div>
+  )
+})
 
 export default SelectField