@faststore/ui 2.0.14-alpha.0 → 2.0.16-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.16-alpha.0](https://github.com/vtex/faststore/compare/v2.0.15-alpha.0...v2.0.16-alpha.0) (2022-12-15)
+
+
+### Features
+
+* Adds `Toggle` & `ToggleField` & `SROnly` components ([#1555](https://github.com/vtex/faststore/issues/1555)) ([b055c0a](https://github.com/vtex/faststore/commit/b055c0aa67291ad88e865b60e96b8a898a97db14))
+
+
+
+## [2.0.15-alpha.0](https://github.com/vtex/faststore/compare/v2.0.14-alpha.0...v2.0.15-alpha.0) (2022-12-14)
+
+
+### Features
+
+* Adds `List` component ([#1549](https://github.com/vtex/faststore/issues/1549)) ([55858fe](https://github.com/vtex/faststore/commit/55858fe39c254786e7c7a1e1dd3da96ed3be0d16))
+
+
+
 ## [2.0.14-alpha.0](https://github.com/vtex/faststore/compare/v2.0.13-alpha.0...v2.0.14-alpha.0) (2022-12-14)
 
 

package/dist/components/molecules/AggregateRating/AggregateRating.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import type { ListProps } from '../../atoms/List';
-export interface AggregateRatingProps extends ListProps<HTMLUListElement> {
+import type { ListProps } from '@faststore/components';
+export interface AggregateRatingProps extends ListProps<'ul'> {
     /**
      * The current value of the rating, based on the quantity of child elements.
      */
@@ -14,5 +14,5 @@ export interface RatingItemProps {
     'data-fs-aggregate-rating-item'?: 'full' | 'partial' | 'empty';
     'data-testid'?: string;
 }
-declare const AggregateRating: React.ForwardRefExoticComponent<AggregateRatingProps & React.RefAttributes<HTMLUListElement>>;
+declare const AggregateRating: React.ForwardRefExoticComponent<Pick<AggregateRatingProps, "children" | "hidden" | "testId" | "slot" | "style" | "title" | "marker" | "as" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "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" | "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" | "value"> & React.RefAttributes<HTMLUListElement>>;
 export default AggregateRating;

package/dist/components/molecules/AggregateRating/AggregateRating.js

@@ -1,12 +1,12 @@
 import React, { forwardRef } from 'react';
-import List from '../../atoms/List';
+import { List } from '@faststore/components';
 const RatingItem = ({ children, ...otherProps }) => {
     if (!React.isValidElement(children)) {
         return React.createElement("li", Object.assign({}, otherProps), children);
     }
     return React.createElement("li", null, React.cloneElement(children, otherProps));
 };
-const AggregateRating = forwardRef(function AggregateRating({ children, testId = 'store-aggregate-rating', value, variant = 'unordered', ...otherProps }, ref) {
+const AggregateRating = forwardRef(function AggregateRating({ children, testId = 'store-aggregate-rating', value, ...otherProps }, ref) {
     const fillCheck = (itemValue) => {
         if (itemValue >= 1) {
             return 'full';
@@ -16,7 +16,7 @@ const AggregateRating = forwardRef(function AggregateRating({ children, testId =
         }
         return 'empty';
     };
-    return (React.createElement(List, Object.assign({ "data-fs-aggregate-rating": true, variant: variant, ref: ref, "data-testid": testId }, otherProps), React.Children.map(children, (child, index) => {
+    return (React.createElement(List, Object.assign({ "data-fs-aggregate-rating": true, ref: ref, "data-testid": testId }, otherProps), React.Children.map(children, (child, index) => {
         const currentItemNumber = index;
         const fill = fillCheck(value - currentItemNumber);
         return (React.createElement(RatingItem, { key: `aggregate-rating-${index}`, "data-fs-aggregate-rating-item": fill, "data-testid": `${testId}-item` }, child));

package/dist/components/molecules/AggregateRating/AggregateRating.js.map

@@ -1 +1 @@
-{"version":3,"file":"AggregateRating.js","sourceRoot":"","sources":["../../../../src/components/molecules/AggregateRating/AggregateRating.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,IAAI,MAAM,kBAAkB,CAAA;AAmBnC,MAAM,UAAU,GAA2C,CAAC,EAC1D,QAAQ,EACR,GAAG,UAAU,EACd,EAAE,EAAE;IACH,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;QACnC,OAAO,4CAAQ,UAAU,GAAG,QAAQ,CAAM,CAAA;KAC3C;IAED,OAAO,gCAAK,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAM,CAAA;AAC5D,CAAC,CAAA;AAED,MAAM,eAAe,GAAG,UAAU,CAChC,SAAS,eAAe,CACtB,EACE,QAAQ,EACR,MAAM,GAAG,wBAAwB,EACjC,KAAK,EACL,OAAO,GAAG,WAAW,EACrB,GAAG,UAAU,EACd,EACD,GAAG;IAEH,MAAM,SAAS,GAAG,CAAC,SAAiB,EAAE,EAAE;QACtC,IAAI,SAAS,IAAI,CAAC,EAAE;YAClB,OAAO,MAAM,CAAA;SACd;QAED,IAAI,CAAC,GAAG,SAAS,IAAI,SAAS,GAAG,CAAC,EAAE;YAClC,OAAO,SAAS,CAAA;SACjB;QAED,OAAO,OAAO,CAAA;IAChB,CAAC,CAAA;IAED,OAAO,CACL,oBAAC,IAAI,oDAEH,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,iBACK,MAAM,IACf,UAAU,GAEb,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAa,EAAE,EAAE;QACrD,MAAM,iBAAiB,GAAG,KAAK,CAAA;QAC/B,MAAM,IAAI,GAAG,SAAS,CAAC,KAAK,GAAG,iBAAiB,CAAC,CAAA;QAEjD,OAAO,CACL,oBAAC,UAAU,IACT,GAAG,EAAE,oBAAoB,KAAK,EAAE,mCACD,IAAI,iBACtB,GAAG,MAAM,OAAO,IAE5B,KAAK,CACK,CACd,CAAA;IACH,CAAC,CAAC,CACG,CACR,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,eAAe,CAAA"}
+{"version":3,"file":"AggregateRating.js","sourceRoot":"","sources":["../../../../src/components/molecules/AggregateRating/AggregateRating.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAmB5C,MAAM,UAAU,GAA2C,CAAC,EAC1D,QAAQ,EACR,GAAG,UAAU,EACd,EAAE,EAAE;IACH,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;QACnC,OAAO,4CAAQ,UAAU,GAAG,QAAQ,CAAM,CAAA;KAC3C;IAED,OAAO,gCAAK,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAM,CAAA;AAC5D,CAAC,CAAA;AAED,MAAM,eAAe,GAAG,UAAU,CAChC,SAAS,eAAe,CACtB,EAAE,QAAQ,EAAE,MAAM,GAAG,wBAAwB,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE,EACrE,GAAG;IAEH,MAAM,SAAS,GAAG,CAAC,SAAiB,EAAE,EAAE;QACtC,IAAI,SAAS,IAAI,CAAC,EAAE;YAClB,OAAO,MAAM,CAAA;SACd;QAED,IAAI,CAAC,GAAG,SAAS,IAAI,SAAS,GAAG,CAAC,EAAE;YAClC,OAAO,SAAS,CAAA;SACjB;QAED,OAAO,OAAO,CAAA;IAChB,CAAC,CAAA;IAED,OAAO,CACL,oBAAC,IAAI,oDAEH,GAAG,EAAE,GAAG,iBACK,MAAM,IACf,UAAU,GAEb,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAa,EAAE,EAAE;QACrD,MAAM,iBAAiB,GAAG,KAAK,CAAA;QAC/B,MAAM,IAAI,GAAG,SAAS,CAAC,KAAK,GAAG,iBAAiB,CAAC,CAAA;QAEjD,OAAO,CACL,oBAAC,UAAU,IACT,GAAG,EAAE,oBAAoB,KAAK,EAAE,mCACD,IAAI,iBACtB,GAAG,MAAM,OAAO,IAE5B,KAAK,CACK,CACd,CAAA;IACH,CAAC,CAAC,CACG,CACR,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,eAAe,CAAA"}

package/dist/components/molecules/Breadcrumb/Breadcrumb.js

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-import List from '../../atoms/List';
+import { List } from '@faststore/components';
 const Divider = ({ divider, testId }) => {
     const props = {
         'data-breadcrumb-divider': true,
@@ -29,7 +29,7 @@ const ListItem = ({ children, isLastItem, divider, testId, }) => {
 };
 const Breadcrumb = forwardRef(function Breadcrumb({ children, divider: rawDivider, testId = 'store-breadcrumb', ...otherProps }, ref) {
     return (React.createElement("nav", Object.assign({ "aria-label": "Breadcrumb", role: "navigation", ref: ref, "data-fs-breadcrumb": true, "data-testid": testId }, otherProps),
-        React.createElement(List, { "data-breadcrumb-list": true, variant: "ordered" }, React.Children.toArray(children).map((child, index, childrenArray) => {
+        React.createElement(List, { as: "ol", "data-breadcrumb-list": true }, React.Children.toArray(children).map((child, index, childrenArray) => {
             const isLastItem = index === childrenArray.length - 1;
             return (React.createElement(ListItem, { isLastItem: isLastItem, divider: rawDivider, key: `breadcrumb-${index}`, testId: testId }, child));
         }))));

package/dist/components/molecules/Breadcrumb/Breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.js","sourceRoot":"","sources":["../../../../src/components/molecules/Breadcrumb/Breadcrumb.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,IAAI,MAAM,kBAAkB,CAAA;AAanC,MAAM,OAAO,GAAwB,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE;IAC3D,MAAM,KAAK,GAAG;QACZ,yBAAyB,EAAE,IAAI;QAC/B,aAAa,EAAE,IAAI;QACnB,aAAa,EAAE,GAAG,MAAM,UAAU;KACnC,CAAA;IAED,IAAI,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE;QACjC,OAAO,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;KAC1C;IAED,OAAO,8CAAU,KAAK,GAAG,OAAO,IAAI,GAAG,CAAQ,CAAA;AACjD,CAAC,CAAA;AASD,MAAM,QAAQ,GAAsB,CAAC,EACnC,QAAQ,EACR,UAAU,EACV,OAAO,EACP,MAAM,GACP,EAAE,EAAE;IACH,MAAM,KAAK,GAAG;QACZ,aAAa,EAAE,GAAG,MAAM,OAAO;QAC/B,sBAAsB,EAAE,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI;QACrD,cAAc,EAAE,UAAU,CAAC,CAAC,CAAE,MAAgB,CAAC,CAAC,CAAC,SAAS;KAC3D,CAAA;IAED,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;QACnC,OAAO,CACL;YACE,8CAAU,KAAK;gBACZ,QAAQ;gBACR,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAC,OAAO,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,GAAI,CAC7D,CACJ,CACN,CAAA;KACF;IAED,OAAO,CACL;QACG,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,KAAK,CAAC;QACnC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAC,OAAO,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,GAAI,CAC/D,CACN,CAAA;AACH,CAAC,CAAA;AAED,MAAM,UAAU,GAAG,UAAU,CAC3B,SAAS,UAAU,CACjB,EACE,QAAQ,EACR,OAAO,EAAE,UAAU,EACnB,MAAM,GAAG,kBAAkB,EAC3B,GAAG,UAAU,EACd,EACD,GAAG;IAEH,OAAO,CACL,yDACa,YAAY,EACvB,IAAI,EAAC,YAAY,EACjB,GAAG,EAAE,GAAG,6CAEK,MAAM,IACf,UAAU;QAEd,oBAAC,IAAI,kCAAsB,OAAO,EAAC,SAAS,IACzC,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,GAAG,CACnC,CAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE;YAC9B,MAAM,UAAU,GAAG,KAAK,KAAK,aAAa,CAAC,MAAM,GAAG,CAAC,CAAA;YAErD,OAAO,CACL,oBAAC,QAAQ,IACP,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,UAAU,EACnB,GAAG,EAAE,cAAc,KAAK,EAAE,EAC1B,MAAM,EAAE,MAAM,IAEb,KAAK,CACG,CACZ,CAAA;QACH,CAAC,CACF,CACI,CACH,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,UAAU,CAAA"}
+{"version":3,"file":"Breadcrumb.js","sourceRoot":"","sources":["../../../../src/components/molecules/Breadcrumb/Breadcrumb.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAa5C,MAAM,OAAO,GAAwB,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE;IAC3D,MAAM,KAAK,GAAG;QACZ,yBAAyB,EAAE,IAAI;QAC/B,aAAa,EAAE,IAAI;QACnB,aAAa,EAAE,GAAG,MAAM,UAAU;KACnC,CAAA;IAED,IAAI,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE;QACjC,OAAO,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;KAC1C;IAED,OAAO,8CAAU,KAAK,GAAG,OAAO,IAAI,GAAG,CAAQ,CAAA;AACjD,CAAC,CAAA;AASD,MAAM,QAAQ,GAAsB,CAAC,EACnC,QAAQ,EACR,UAAU,EACV,OAAO,EACP,MAAM,GACP,EAAE,EAAE;IACH,MAAM,KAAK,GAAG;QACZ,aAAa,EAAE,GAAG,MAAM,OAAO;QAC/B,sBAAsB,EAAE,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI;QACrD,cAAc,EAAE,UAAU,CAAC,CAAC,CAAE,MAAgB,CAAC,CAAC,CAAC,SAAS;KAC3D,CAAA;IAED,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;QACnC,OAAO,CACL;YACE,8CAAU,KAAK;gBACZ,QAAQ;gBACR,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAC,OAAO,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,GAAI,CAC7D,CACJ,CACN,CAAA;KACF;IAED,OAAO,CACL;QACG,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,KAAK,CAAC;QACnC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAC,OAAO,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,GAAI,CAC/D,CACN,CAAA;AACH,CAAC,CAAA;AAED,MAAM,UAAU,GAAG,UAAU,CAC3B,SAAS,UAAU,CACjB,EACE,QAAQ,EACR,OAAO,EAAE,UAAU,EACnB,MAAM,GAAG,kBAAkB,EAC3B,GAAG,UAAU,EACd,EACD,GAAG;IAEH,OAAO,CACL,yDACa,YAAY,EACvB,IAAI,EAAC,YAAY,EACjB,GAAG,EAAE,GAAG,6CAEK,MAAM,IACf,UAAU;QAEd,oBAAC,IAAI,IAAC,EAAE,EAAC,IAAI,kCACV,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,GAAG,CACnC,CAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE;YAC9B,MAAM,UAAU,GAAG,KAAK,KAAK,aAAa,CAAC,MAAM,GAAG,CAAC,CAAA;YAErD,OAAO,CACL,oBAAC,QAAQ,IACP,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,UAAU,EACnB,GAAG,EAAE,cAAc,KAAK,EAAE,EAC1B,MAAM,EAAE,MAAM,IAEb,KAAK,CACG,CACZ,CAAA;QACH,CAAC,CACF,CACI,CACH,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,UAAU,CAAA"}

package/dist/components/molecules/OrderSummary/OrderSummary.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import { ListProps } from '../../atoms/List';
-export interface OrderSummaryProps<T = HTMLElement> extends Omit<ListProps<T>, 'variant'> {
+import type { ListProps } from '@faststore/components';
+export interface OrderSummaryProps extends ListProps<'ul'> {
     /**
      * ID to find this component in testing tools (e.g.: cypress,
      * testing-library, and jest).
@@ -31,5 +31,5 @@ export interface OrderSummaryProps<T = HTMLElement> extends Omit<ListProps<T>, '
      */
     totalValue?: string;
 }
-declare const OrderSummary: React.ForwardRefExoticComponent<OrderSummaryProps<HTMLElement> & React.RefAttributes<HTMLUListElement>>;
+declare const OrderSummary: React.ForwardRefExoticComponent<Pick<OrderSummaryProps, "children" | "hidden" | "testId" | "slot" | "style" | "title" | "marker" | "as" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "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" | "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" | "subtotalLabel" | "subtotalValue" | "discountLabel" | "discountValue" | "totalLabel" | "totalValue"> & React.RefAttributes<HTMLUListElement>>;
 export default OrderSummary;

package/dist/components/molecules/OrderSummary/OrderSummary.js

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-import List from '../../atoms/List';
+import { List } from '@faststore/components';
 const OrderSummary = forwardRef(function OrderSummary({ testId = 'store-order-summary', children, subtotalLabel, subtotalValue, discountLabel, discountValue, totalLabel, totalValue, ...otherProps }, ref) {
     return (React.createElement(List, Object.assign({ ref: ref, "data-fs-order-summary": true, "data-testid": testId }, otherProps),
         subtotalValue ? (React.createElement("li", { "data-fs-order-summary-subtotal": true },

package/dist/components/molecules/OrderSummary/OrderSummary.js.map

@@ -1 +1 @@
-{"version":3,"file":"OrderSummary.js","sourceRoot":"","sources":["../../../../src/components/molecules/OrderSummary/OrderSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,IAAmB,MAAM,kBAAkB,CAAA;AAkClD,MAAM,YAAY,GAAG,UAAU,CAC7B,SAAS,YAAY,CACnB,EACE,MAAM,GAAG,qBAAqB,EAC9B,QAAQ,EACR,aAAa,EACb,aAAa,EACb,aAAa,EACb,aAAa,EACb,UAAU,EACV,UAAU,EACV,GAAG,UAAU,EACd,EACD,GAAG;IAEH,OAAO,CACL,oBAAC,IAAI,kBACH,GAAG,EAAE,GAAG,gDAEK,MAAM,IACf,UAAU;QAEb,aAAa,CAAC,CAAC,CAAC,CACf;YACE,2FAEe,GAAG,MAAM,iBAAiB,IAEtC,aAAa,CACT;YACP,2FAEe,GAAG,MAAM,iBAAiB,IAEtC,aAAa,CACT,CACJ,CACN,CAAC,CAAC,CAAC,IAAI;QACP,aAAa,CAAC,CAAC,CAAC,CACf;YACE,2FAEe,GAAG,MAAM,iBAAiB,IAEtC,aAAa,CACT;YACP,2FAEe,GAAG,MAAM,iBAAiB,IAEtC,aAAa,CACT,CACJ,CACN,CAAC,CAAC,CAAC,IAAI;QACR;YACE,wFAEe,GAAG,MAAM,cAAc,IAEnC,UAAU,CACN;YACP,wFAEe,GAAG,MAAM,cAAc,IAEnC,UAAU,CACN,CACJ,CACA,CACR,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"OrderSummary.js","sourceRoot":"","sources":["../../../../src/components/molecules/OrderSummary/OrderSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAA;AAmC5C,MAAM,YAAY,GAAG,UAAU,CAC7B,SAAS,YAAY,CACnB,EACE,MAAM,GAAG,qBAAqB,EAC9B,QAAQ,EACR,aAAa,EACb,aAAa,EACb,aAAa,EACb,aAAa,EACb,UAAU,EACV,UAAU,EACV,GAAG,UAAU,EACd,EACD,GAAG;IAEH,OAAO,CACL,oBAAC,IAAI,kBACH,GAAG,EAAE,GAAG,gDAEK,MAAM,IACf,UAAU;QAEb,aAAa,CAAC,CAAC,CAAC,CACf;YACE,2FAEe,GAAG,MAAM,iBAAiB,IAEtC,aAAa,CACT;YACP,2FAEe,GAAG,MAAM,iBAAiB,IAEtC,aAAa,CACT,CACJ,CACN,CAAC,CAAC,CAAC,IAAI;QACP,aAAa,CAAC,CAAC,CAAC,CACf;YACE,2FAEe,GAAG,MAAM,iBAAiB,IAEtC,aAAa,CACT;YACP,2FAEe,GAAG,MAAM,iBAAiB,IAEtC,aAAa,CACT,CACJ,CACN,CAAC,CAAC,CAAC,IAAI;QACR;YACE,wFAEe,GAAG,MAAM,cAAc,IAEnC,UAAU,CACN;YACP,wFAEe,GAAG,MAAM,cAAc,IAEnC,UAAU,CACN,CACJ,CACA,CACR,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,YAAY,CAAA"}

package/dist/index.d.ts

@@ -5,8 +5,6 @@ export { default as TextArea } from './components/atoms/TextArea';
 export type { TextAreaProps } from './components/atoms/TextArea';
 export { default as Slider } from './components/atoms/Slider';
 export type { SliderProps } from './components/atoms/Slider';
-export { default as List } from './components/atoms/List';
-export type { ListProps } from './components/atoms/List';
 export { default as Skeleton } from './components/atoms/Skeleton';
 export type { SkeletonProps } from './components/atoms/Skeleton';
 export { default as Spinner } from './components/atoms/Spinner';

package/dist/index.js

@@ -3,7 +3,6 @@ export * from '@faststore/components';
 export { default as Popover } from './components/atoms/Popover';
 export { default as TextArea } from './components/atoms/TextArea';
 export { default as Slider } from './components/atoms/Slider';
-export { default as List } from './components/atoms/List';
 export { default as Skeleton } from './components/atoms/Skeleton';
 export { default as Spinner } from './components/atoms/Spinner';
 export { default as Incentive } from './components/atoms/Incentive';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA;AAErC,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,2BAA2B,CAAA;AAG7D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAGjE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,8BAA8B,CAAA;AAGnE,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAG3E,OAAO,EACL,OAAO,IAAI,IAAI,EACf,WAAW,EACX,SAAS,GACV,MAAM,6BAA6B,CAAA;AAOpC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAA;AAG7E,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,wCAAwC,CAAA;AAGnF,OAAO,EACL,OAAO,IAAI,WAAW,EACtB,gBAAgB,EAChB,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,oCAAoC,CAAA;AAQ3C,OAAO,EACL,OAAO,IAAI,IAAI,EACf,SAAS,EACT,WAAW,EACX,WAAW,GACZ,MAAM,6BAA6B,CAAA;AAQpC,OAAO,EACL,OAAO,IAAI,QAAQ,EACnB,eAAe,EACf,eAAe,EACf,aAAa,EACb,cAAc,EACd,eAAe,EACf,aAAa,GACd,MAAM,iCAAiC,CAAA;AAWxC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,gCAAgC,CAAA;AAGnE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAA;AAM3E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,iCAAiC,CAAA;AAGrE,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,8BAA8B,CAAA;AAG/D,OAAO,EACL,OAAO,IAAI,MAAM,EACjB,aAAa,EACb,WAAW,EACX,UAAU,GACX,MAAM,+BAA+B,CAAA;AAQtC,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,uCAAuC,CAAA;AAGjF,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAGzE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,sCAAsC,CAAA;AAG/E,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAGzE,OAAO,EACL,OAAO,IAAI,UAAU,EACrB,WAAW,GACZ,MAAM,mCAAmC,CAAA;AAM1C,OAAO,EACL,OAAO,IAAI,SAAS,EACpB,aAAa,EACb,eAAe,EACf,cAAc,GACf,MAAM,kCAAkC,CAAA;AAQzC,OAAO,EACL,KAAK,EACL,SAAS,EACT,SAAS,EACT,WAAW,EACX,SAAS,EACT,QAAQ,GACT,MAAM,8BAA8B,CAAA;AAUrC,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,6BAA6B,CAAA;AAG7D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,8BAA8B,CAAA;AAG/D,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,yCAAyC,CAAA;AAGrF,OAAO,EACL,OAAO,IAAI,QAAQ,EACnB,cAAc,EACd,YAAY,EACZ,YAAY,GACb,MAAM,iCAAiC,CAAA;AAQxC,YAAY;AACZ,OAAO,EACL,OAAO,IAAI,UAAU,EACrB,eAAe,EACf,iBAAiB,GAClB,MAAM,mCAAmC,CAAA;AAO1C,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,8BAA8B,CAAA;AAG1D,OAAO,EACL,OAAO,IAAI,IAAI,EACf,WAAW,EACX,SAAS,GACV,MAAM,6BAA6B,CAAA;AAOpC,QAAQ;AACR,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,mBAAmB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/ui",
-  "version": "2.0.14-alpha.0",
+  "version": "2.0.16-alpha.0",
   "description": "A lightweight, framework agnostic component library for React",
   "author": "emersonlaurentino",
   "license": "MIT",
@@ -78,5 +78,5 @@
     "node": "16.18.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "a8f4ca0ddc690e24df31abee9e4a4bbdb2d1a03b"
+  "gitHead": "2aa7d4ac5f4c0ad30a900e0239f1bcb5b9ddaab8"
 }

package/src/components/atoms/List/styles.scss

@@ -0,0 +1,27 @@
+[data-fs-list] {
+  // --------------------------------------------------------
+  // Design Tokens for List
+  // --------------------------------------------------------
+
+  // Default properties
+  --fs-list-style-unordered                    : initial;
+  --fs-list-style-ordered                      : decimal;
+
+  // --------------------------------------------------------
+  // Structural Styles
+  // --------------------------------------------------------
+
+  margin: 0;
+  padding: 0;
+
+  &[data-fs-list-marker="true"] {
+    list-style: var(--fs-list-style-unordered);
+    list-style-position: inside;
+
+    @at-root ol#{&} {
+      list-style: var(--fs-list-style-ordered);
+      list-style-position: inside;
+    }
+  }
+
+}

package/src/components/atoms/SROnly/styles.scss

@@ -0,0 +1,15 @@
+[data-fs-sr-only] {
+  // --------------------------------------------------------
+  // Structural Styles for SR Only
+  // --------------------------------------------------------
+
+  &:not(:focus):not(:active) {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    clip: rect(0 0 0 0);
+    clip-path: inset(50%);
+    white-space: nowrap;
+  }
+}

package/src/components/molecules/AggregateRating/AggregateRating.tsx

@@ -1,10 +1,10 @@
 import React, { forwardRef } from 'react'
 import type { FC, PropsWithChildren } from 'react'
 
-import List from '../../atoms/List'
-import type { ListProps } from '../../atoms/List'
+import { List } from '@faststore/components'
+import type { ListProps } from '@faststore/components'
 
-export interface AggregateRatingProps extends ListProps<HTMLUListElement> {
+export interface AggregateRatingProps extends ListProps<'ul'> {
   /**
    * The current value of the rating, based on the quantity of child elements.
    */
@@ -33,13 +33,7 @@ const RatingItem: FC<PropsWithChildren<RatingItemProps>> = ({
 
 const AggregateRating = forwardRef<HTMLUListElement, AggregateRatingProps>(
   function AggregateRating(
-    {
-      children,
-      testId = 'store-aggregate-rating',
-      value,
-      variant = 'unordered',
-      ...otherProps
-    },
+    { children, testId = 'store-aggregate-rating', value, ...otherProps },
     ref
   ) {
     const fillCheck = (itemValue: number) => {
@@ -57,7 +51,6 @@ const AggregateRating = forwardRef<HTMLUListElement, AggregateRatingProps>(
     return (
       <List
         data-fs-aggregate-rating
-        variant={variant}
         ref={ref}
         data-testid={testId}
         {...otherProps}

package/src/components/molecules/Breadcrumb/Breadcrumb.tsx

@@ -1,7 +1,7 @@
 import React, { forwardRef } from 'react'
 import type { FC, HTMLAttributes, ReactNode } from 'react'
 
-import List from '../../atoms/List'
+import { List } from '@faststore/components'
 
 export interface BreadcrumbProps extends HTMLAttributes<HTMLDivElement> {
   /**
@@ -85,7 +85,7 @@ const Breadcrumb = forwardRef<HTMLDivElement, BreadcrumbProps>(
         data-testid={testId}
         {...otherProps}
       >
-        <List data-breadcrumb-list variant="ordered">
+        <List as="ol" data-breadcrumb-list>
           {React.Children.toArray(children).map(
             (child, index, childrenArray) => {
               const isLastItem = index === childrenArray.length - 1

package/src/components/molecules/OrderSummary/OrderSummary.tsx

@@ -1,7 +1,8 @@
 import React, { forwardRef } from 'react'
-import List, { ListProps } from '../../atoms/List'
+import { List } from '@faststore/components'
+import type { ListProps } from '@faststore/components'
 
-export interface OrderSummaryProps<T = HTMLElement> extends Omit<ListProps<T>, 'variant'> {
+export interface OrderSummaryProps extends ListProps<'ul'> {
   /**
    * ID to find this component in testing tools (e.g.: cypress,
    * testing-library, and jest).

package/src/components/molecules/Toggle/styles.scss

@@ -0,0 +1,174 @@
+[data-fs-toggle] {
+  // --------------------------------------------------------
+  // Design Tokens for Toggle
+  // --------------------------------------------------------
+
+  // Default properties
+  --fs-toggle-height                           : calc(var(--fs-control-min-height) / 1.75);
+
+  --fs-toggle-bkg-color                        : var(--fs-control-bkg);
+  --fs-toggle-bkg-color-hover                  : var(--fs-color-primary-bkg-light);
+
+  --fs-toggle-shadow                           : var(--fs-shadow);
+  --fs-toggle-shadow-hover                     : var(--fs-shadow);
+
+  --fs-toggle-border-color                     : var(--fs-border-color);
+  --fs-toggle-border-color-hover               : var(--fs-border-color-hover);
+  --fs-toggle-border-radius                    : var(--fs-border-radius);
+  --fs-toggle-border-width                     : var(--fs-border-width);
+
+  --fs-toggle-transition-timing                : var(--fs-transition-timing);
+  --fs-toggle-transition-property              : var(--fs-transition-property);
+  --fs-toggle-transition-function              : var(--fs-transition-function);
+
+  // Knob
+  --fs-toggle-knob-shadow                      : var(--fs-shadow);
+  --fs-toggle-knob-bkg-color                   : var(--fs-color-primary-bkg);
+  --fs-toggle-knob-bkg-color-hover             : var(--fs-toggle-border-color-hover);
+  --fs-toggle-knob-border-radius               : var(--fs-border-radius-small);
+  --fs-toggle-knob-border-color                : var(--fs-toggle-knob-bkg-color);
+  --fs-toggle-knob-border-color-hover          : var(--fs-toggle-knob-bkg-color-hover);
+  --fs-toggle-knob-border-width                : var(--fs-border-width-thick);
+
+  --fs-toggle-knob-checked-bkg-color           : var(--fs-control-bkg);
+  --fs-toggle-knob-checked-border-color        : var(--fs-toggle-knob-checked-bkg-color);
+
+  --fs-toggle-knob-disabled-bkg-color          : var(--fs-color-neutral-5);
+  --fs-toggle-knob-disabled-border-color       : var(--fs-toggle-knob-disabled-bkg-color);
+
+  // Icon
+  --fs-toggle-knob-icon-color                  : transparent;
+
+  --fs-toggle-knob-icon-checked-color          : var(--fs-toggle-checked-bkg-color);
+  --fs-toggle-knob-icon-checked-color-hover    : var(--fs-toggle-checked-bkg-color-hover);
+
+  --fs-toggle-knob-icon-disabled-color         : var(--fs-toggle-disabled-bkg-color);
+
+  // Checked
+  --fs-toggle-checked-bkg-color                : var(--fs-color-primary-bkg-active);
+  --fs-toggle-checked-bkg-color-hover          : var(--fs-color-primary-bkg-hover);
+  --fs-toggle-checked-border-color             : var(--fs-toggle-checked-bkg-color);
+  --fs-toggle-checked-border-color-hover       : var(--fs-toggle-checked-bkg-color-hover);
+
+  // Disabled
+  --fs-toggle-disabled-bkg-color               : var(--fs-color-disabled-bkg);
+  --fs-toggle-disabled-border-color            : var(--fs-border-color-disabled);
+
+  // --------------------------------------------------------
+  // Structural Styles
+  // --------------------------------------------------------
+
+  position: relative;
+  overflow: visible;
+  width: fit-content;
+
+  input {
+    @include focus-ring-visible;
+    position: absolute;
+    z-index: 1;
+    display: block;
+    width: 100%;
+    height: 100%;
+    cursor: pointer;
+    background-color: var(--fs-toggle-bkg-color);
+    border: var(--fs-toggle-border-width) solid var(--fs-toggle-border-color);
+    border-radius: var(--fs-toggle-border-radius);
+    box-shadow: var(--fs-toggle-shadow);
+    transition: var(--fs-toggle-transition-property) var(--fs-toggle-transition-timing) var(--fs-toggle-transition-function);
+    appearance: none;
+    &:checked {
+      background-color: var(--fs-toggle-checked-bkg-color);
+      border: var(--fs-toggle-border-width) solid var(--fs-toggle-checked-border-color);
+      + [data-fs-toggle-knob] {
+        color: var(--fs-toggle-knob-icon-checked-color);
+        background-color: var(--fs-toggle-knob-checked-bkg-color);
+        border-color: var(--fs-toggle-knob-checked-border-color);
+      }
+      @media (hover: hover) {
+        &:hover:not(:disabled) {
+          background-color: var(--fs-toggle-checked-bkg-color-hover);
+          border: var(--fs-toggle-border-width) solid var(--fs-toggle-checked-border-color-hover);
+          + [data-fs-toggle-knob] {
+            color: var(--fs-toggle-knob-icon-checked-color-hover);
+          }
+        }
+      }
+    }
+    &:not(:checked) {
+      background-color: var(--fs-toggle-bkg-color);
+      border: var(--fs-toggle-border-width) solid var(--fs-toggle-border-color);
+      + [data-fs-toggle-knob] {
+        color: var(--fs-toggle-knob-icon-color);
+        background-color: var(--fs-toggle-knob-bkg-color);
+        border: var(--fs-toggle-border-width) solid var(--fs-toggle-knob-border-color);
+      }
+      @media (hover: hover) {
+        &:hover:not(:disabled) {
+          background-color: var(--fs-toggle-bkg-color-hover);
+          border-color: var(--fs-toggle-border-color-hover);
+          box-shadow: var(--fs-toggle-shadow-hover);
+          + [data-fs-toggle-knob] {
+            background-color: var(--fs-toggle-knob-bkg-color-hover);
+            border-color: var(--fs-toggle-knob-border-color-hover);
+          }
+        }
+      }
+    }
+    &:disabled {
+      pointer-events: none;
+      background-color: var(--fs-toggle-disabled-bkg-color);
+      border-color: var(--fs-toggle-disabled-border-color);
+      + [data-fs-toggle-knob] {
+        background-color: var(--fs-toggle-knob-disabled-bkg-color);
+        border-color: var(--fs-toggle-knob-disabled-border-color);
+      }
+      &:checked + [data-fs-toggle-knob] {
+        color: var(--fs-toggle-knob-icon-disabled-color);
+      }
+    }
+  }
+
+  [data-fs-toggle-knob] {
+      position: absolute;
+      z-index: 2;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      pointer-events: none;
+      border-radius: var(--fs-toggle-knob-border-radius);
+      box-shadow: var(--fs-toggle-knob-shadow);
+      transition: var(--fs-toggle-transition-property) var(--fs-toggle-transition-timing) var(--fs-toggle-transition-function);
+  }
+
+  // --------------------------------------------------------
+  // Variants Styles
+  // --------------------------------------------------------
+
+  &[data-fs-toggle-variant="horizontal"] {
+    min-width: calc(var(--fs-toggle-height) * 1.75);
+    height: var(--fs-toggle-height);
+
+    input:checked + [data-fs-toggle-knob] { left: calc(50% + var(--fs-toggle-border-width)); }
+
+    [data-fs-toggle-knob] {
+      top: calc(var(--fs-toggle-border-width) * 4);
+      left: calc(var(--fs-toggle-border-width) * 4);
+      width: calc(50% - (var(--fs-toggle-border-width) * 5));
+      height: calc(100% - (var(--fs-toggle-border-width) * 8));
+    }
+  }
+
+  &[data-fs-toggle-variant="vertical"] {
+    min-width: var(--fs-toggle-height);
+    height: calc(var(--fs-toggle-height) * 1.75);
+
+    input:checked + [data-fs-toggle-knob] { bottom: calc(50% + var(--fs-toggle-border-width)); }
+
+    [data-fs-toggle-knob] {
+      bottom: calc(var(--fs-toggle-border-width) * 4);
+      left: calc(var(--fs-toggle-border-width) * 4);
+      width: calc(100% - (var(--fs-toggle-border-width) * 8));
+      height: calc(50% - (var(--fs-toggle-border-width) * 5));
+    }
+  }
+}

package/src/components/molecules/ToggleField/styles.scss

@@ -0,0 +1,13 @@
+[data-fs-toggle-field] {
+  // --------------------------------------------------------
+  // Design Tokens for Toggle Field
+  // --------------------------------------------------------
+
+  // Default properties
+  display: flex;
+  align-items: center;
+
+  [data-fs-toggle-field-label] {
+    margin-left: var(--fs-spacing-1);
+  }
+}

package/src/index.ts

@@ -10,9 +10,6 @@ export type { TextAreaProps } from './components/atoms/TextArea'
 export { default as Slider } from './components/atoms/Slider'
 export type { SliderProps } from './components/atoms/Slider'
 
-export { default as List } from './components/atoms/List'
-export type { ListProps } from './components/atoms/List'
-
 export { default as Skeleton } from './components/atoms/Skeleton'
 export type { SkeletonProps } from './components/atoms/Skeleton'
 

package/src/styles/base.scss

@@ -1,3 +1,3 @@
 @import "../base/layout";
 @import "../base/tokens";
-@import "../base/typography";
+@import "../base/typography";

package/src/styles/components.scss

@@ -5,10 +5,12 @@
 @import "../components/atoms/Icon/styles";
 @import "../components/atoms/Link/styles";   
 @import "../components/atoms/Input/styles";
+@import "../components/atoms/List/styles";
 @import "../components/atoms/Overlay/styles";
 @import "../components/atoms/Price/styles";
 @import "../components/atoms/Radio/styles";
 @import "../components/atoms/Select/styles";
+@import "../components/atoms/SROnly/styles";
 
 // Molecules
 @import "../components/molecules/BuyButton/styles";
@@ -18,3 +20,5 @@
 @import "../components/molecules/RadioField/styles";
 @import "../components/molecules/SelectField/styles";
 @import "../components/molecules/Tag/styles";
+@import "../components/molecules/Toggle/styles";
+@import "../components/molecules/ToggleField/styles";

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

@@ -1,12 +0,0 @@
-import React from 'react';
-import type { ElementType, HTMLAttributes } from 'react';
-export interface ListProps<T = HTMLElement> extends HTMLAttributes<T> {
-    /**
-     * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-     */
-    testId?: string;
-    variant?: 'description' | 'ordered' | 'unordered';
-    as?: ElementType;
-}
-declare const List: React.ForwardRefExoticComponent<ListProps<HTMLElement> & React.RefAttributes<HTMLUListElement>>;
-export default List;

package/dist/components/atoms/List/List.js

@@ -1,16 +0,0 @@
-import React, { forwardRef } from 'react';
-const variantToElement = {
-    description: 'dl',
-    unordered: 'ul',
-    ordered: 'ol',
-};
-const List = forwardRef(function List({ testId = 'store-list', variant = 'unordered', as: MaybeComponent, ...otherProps }, ref) {
-    const dataAttributes = {
-        'data-testid': testId,
-        'data-fs-list': variant,
-    };
-    const Component = MaybeComponent ?? variantToElement[variant] ?? 'ul';
-    return React.createElement(Component, Object.assign({ ref: ref }, dataAttributes, otherProps));
-});
-export default List;
-//# sourceMappingURL=List.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"List.js","sourceRoot":"","sources":["../../../../src/components/atoms/List/List.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,MAAM,gBAAgB,GAAG;IACvB,WAAW,EAAE,IAAI;IACjB,SAAS,EAAE,IAAI;IACf,OAAO,EAAE,IAAI;CACd,CAAA;AAWD,MAAM,IAAI,GAAG,UAAU,CAA8B,SAAS,IAAI,CAChE,EACE,MAAM,GAAG,YAAY,EACrB,OAAO,GAAG,WAAW,EACrB,EAAE,EAAE,cAAc,EAClB,GAAG,UAAU,EACd,EACD,GAAG;IAEH,MAAM,cAAc,GAAG;QACrB,aAAa,EAAE,MAAM;QACrB,cAAc,EAAE,OAAO;KACxB,CAAA;IAED,MAAM,SAAS,GAAG,cAAc,IAAI,gBAAgB,CAAC,OAAO,CAAC,IAAI,IAAI,CAAA;IAErE,OAAO,oBAAC,SAAS,kBAAC,GAAG,EAAE,GAAG,IAAM,cAAc,EAAM,UAAU,EAAI,CAAA;AACpE,CAAC,CAAC,CAAA;AAEF,eAAe,IAAI,CAAA"}

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

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

package/dist/components/atoms/List/index.js

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

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

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

package/src/components/atoms/List/List.tsx

@@ -1,38 +0,0 @@
-import React, { forwardRef } from 'react'
-import type { ElementType, HTMLAttributes } from 'react'
-
-const variantToElement = {
-  description: 'dl',
-  unordered: 'ul',
-  ordered: 'ol',
-}
-
-export interface ListProps<T = HTMLElement> extends HTMLAttributes<T> {
-  /**
-   * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
-   */
-  testId?: string
-  variant?: 'description' | 'ordered' | 'unordered'
-  as?: ElementType
-}
-
-const List = forwardRef<HTMLUListElement, ListProps>(function List(
-  {
-    testId = 'store-list',
-    variant = 'unordered',
-    as: MaybeComponent,
-    ...otherProps
-  },
-  ref
-) {
-  const dataAttributes = {
-    'data-testid': testId,
-    'data-fs-list': variant,
-  }
-
-  const Component = MaybeComponent ?? variantToElement[variant] ?? 'ul'
-
-  return <Component ref={ref} {...dataAttributes} {...otherProps} />
-})
-
-export default List

package/src/components/atoms/List/index.ts

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

package/src/components/atoms/List/stories/List.mdx

@@ -1,33 +0,0 @@
-import { Story, Canvas, ArgsTable } from '@storybook/addon-docs'
-import List from '../List'
-
-# List
-
-## Unordered
-
-<Canvas>
-  <Story id="atoms-list--unordered-list" />
-</Canvas>
-
-## Ordered
-
-<Canvas>
-  <Story id="atoms-list--ordered-list" />
-</Canvas>
-
-## Description
-
-<Canvas>
-  <Story id="atoms-list--description-list" />
-</Canvas>
-
-## Props
-
-<ArgsTable of={List} />
-
-## CSS Selectors
-
-```css
-[data-fs-list] {}
-[data-fs-list='(description|ordered|unordered)'] {}
-```

package/src/components/atoms/List/stories/List.stories.tsx

@@ -1,73 +0,0 @@
-import type { Story } from '@storybook/react'
-import React from 'react'
-
-import type { ComponentArgTypes } from '../../../../typings/utils'
-import type { ListProps } from '../List'
-import Component from '../List'
-import mdx from './List.mdx'
-
-type ListStoryProps = ListProps & { options: string[] }
-type DescriptionListStoryProps = ListProps & { options: string[][] }
-
-const ListTemplate: Story<ListStoryProps> = ({ options, ...props }) => {
-  return (
-    <Component {...props}>
-      {options.map((value) => (
-        <li key={value}>{value}</li>
-      ))}
-    </Component>
-  )
-}
-
-const DescriptionListTemplate: Story<DescriptionListStoryProps> = ({
-  options,
-  ...props
-}) => {
-  return (
-    <Component {...props}>
-      {options.map(([title, value]) => [
-        <dt key={title}>{title}</dt>,
-        <dd key={value}>{value}</dd>,
-      ])}
-    </Component>
-  )
-}
-
-export const UnorderedList = ListTemplate.bind({})
-
-export const OrderedList = ListTemplate.bind({})
-OrderedList.args = {
-  variant: 'ordered',
-}
-
-export const DescriptionList = DescriptionListTemplate.bind({})
-DescriptionList.args = {
-  options: [
-    ['Ok', 'An ok item'],
-    ['Good', 'A good item'],
-    ['Bad', 'A bad item'],
-  ],
-  variant: 'description',
-}
-
-const argTypes: ComponentArgTypes<ListStoryProps> = {
-  options: {
-    control: { type: 'array' },
-    defaultValue: ['Great', 'Ok', 'Bad'],
-  },
-  variant: {
-    options: ['description', 'ordered', 'unordered'],
-    control: { type: 'select' },
-    defaultValue: 'unordered',
-  },
-}
-
-export default {
-  title: 'Atoms/List',
-  argTypes,
-  parameters: {
-    docs: {
-      page: mdx,
-    },
-  },
-}