@nimbus-ds/patterns 1.36.0-rc.1 → 1.36.0-rc.2

package/dist/ProductDataList/index.d.ts

@@ -0,0 +1,208 @@
+// Generated by dts-bundle-generator v8.1.2
+
+import { DndContextProps, DragEndEvent, DragOverEvent, DragOverlayProps, DragStartEvent, PointerSensorOptions, UniqueIdentifier } from '@dnd-kit/core';
+import { BoxProps } from '@nimbus-ds/components';
+import React from 'react';
+import { PropsWithChildren, ReactNode } from 'react';
+
+/**
+ * Properties specific to the ProductDataListItem component
+ */
+export interface ProductDataListItemProperties {
+	/**
+	 * The id of the product
+	 */
+	id: string;
+	/**
+	 * The title of the product
+	 */
+	title: string;
+	/**
+	 * The image URL of the product
+	 */
+	imageUrl?: string;
+	/**
+	 * Alternative text for the product image
+	 */
+	imageAlt?: string;
+	/**
+	 * Whether the item is draggable
+	 */
+	isDraggable?: boolean;
+	/**
+	 * Callback fired when remove button is clicked
+	 */
+	onRemove?: () => void;
+	/**
+	 * Whether the item has a divider
+	 */
+	withDivider?: boolean;
+	/**
+	 * Additional content to be rendered
+	 */
+	children?: ReactNode;
+	/**
+	 * Icon component for the tag
+	 */
+	tagIcon?: ReactNode;
+	/**
+	 * Text content for the tag
+	 */
+	tagText?: string;
+	/**
+	 * Appearance style for the tag
+	 * @default "warning"
+	 */
+	tagAppearance?: "warning" | "primary" | "neutral" | "success" | "danger";
+}
+/**
+ * Props that can be passed to the ProductDataListItem component
+ */
+export type ProductDataListItemProps = ProductDataListItemProperties;
+export declare const ProductDataListItem: React.FC<ProductDataListItemProps>;
+declare const orientation: {
+	readonly vertical: "vertical";
+	readonly horizontal: "horizontal";
+};
+/**
+ * Base type for items that can be sorted
+ */
+export type SortableItemType = {
+	/** Unique identifier for the sortable item */
+	id: UniqueIdentifier;
+};
+export type InternalDndContextSettings = Omit<DndContextProps, "children" | "sensors" | "collisionDetection" | "onDragStart" | "onDragOver" | "onDragEnd">;
+/**
+ * Properties specific to the Sortable component
+ */
+export interface SortableProperties<T extends SortableItemType> {
+	/** The children components */
+	children: ReactNode;
+	/** Whether to disable sorting functionality */
+	disabled?: boolean;
+	/** The items to be sorted */
+	items: T[];
+	/** Callback fired when items are reordered */
+	onReorder: (items: T[]) => void;
+	/** Callback fired when drag starts */
+	onDragStart?: (event: DragStartEvent) => void;
+	/** Callback fired during drag */
+	onDragOver?: (event: DragOverEvent) => void;
+	/** Callback fired when drag ends */
+	onDragEnd?: (event: DragEndEvent) => void;
+	/** The orientation of the sortable list */
+	orientation?: typeof orientation.vertical | typeof orientation.horizontal;
+	/**
+	 * Custom sensor options for drag detection
+	 * @example
+	 * ```tsx
+	 * <Sortable
+	 *   sensorOptions={{
+	 *     activationConstraint: {
+	 *       distance: 20, // Allow movements up to 20px
+	 *       delay: 150,  // Wait 150ms before canceling
+	 *       tolerance: 5 // Tolerate 5px of movement
+	 *     }
+	 *   }}
+	 * >
+	 * ```
+	 */
+	sensorOptions?: PointerSensorOptions;
+	/** Configuration for the drag overlay appearance and behavior */
+	overlaySettings?: Omit<DragOverlayProps, "wrapperElement" | "style">;
+	/** Settings for the DndContext */
+	dndContextSettings?: Omit<InternalDndContextSettings, "accessibility">;
+	/** Render function for the dragged item overlay */
+	renderOverlay?: (item: T) => ReactNode;
+}
+export type SortableProps<T extends SortableItemType> = SortableProperties<T> & {
+	/** Configuration for the drag overlay appearance and behavior */
+	overlaySettings?: DragOverlayProps;
+	/** Settings for the DndContext */
+	dndContextSettings?: InternalDndContextSettings;
+};
+/**
+ * Properties specific to the ProductDataListProducts component
+ *
+ * @template T - The type of each sortable item in the list
+ */
+export interface ProductDataListProductsProperties<T extends SortableItemType> {
+	/**
+	 * The array of items to be rendered and sorted in the list.
+	 */
+	items: T[];
+	/**
+	 * Callback fired when the order of items changes.
+	 *
+	 * @param items - The reordered array of items
+	 */
+	onReorder: (items: T[]) => void;
+	/**
+	 * If true, enables drag-and-drop sorting for the list items.
+	 * @default false
+	 */
+	sortable?: boolean;
+	/**
+	 * Function to render each item in the list.
+	 *
+	 * @param item - The item to render
+	 * @param index - The index of the item in the list
+	 * @returns The rendered node for the item
+	 */
+	renderItem: (item: T, index: number) => ReactNode;
+	/**
+	 * Additional properties to pass to the sortable container.
+	 */
+	sortableProps?: object;
+}
+/**
+ * Props that can be passed to the ProductDataListProducts component, including sortable and layout properties.
+ *
+ * @template T - The type of each sortable item in the list
+ */
+export type ProductDataListProductsProps<T extends SortableItemType> = ProductDataListProductsProperties<T> & {
+	/**
+	 * Additional properties for the sortable container, omitting core sortable and layout props.
+	 */
+	sortableProps?: Omit<SortableProps<T>, "items" | "onReorder" | "orientation" | "disabled" | "renderOverlay" | "children">;
+} & Omit<BoxProps, "my" | "display" | "flexDirection" | "gap">;
+export declare function ProductDataListProducts<T extends SortableItemType>({ sortable, items, onReorder, renderItem, sortableProps, children, ...props }: ProductDataListProductsProps<T>): React.ReactElement;
+export declare namespace ProductDataListProducts {
+	var displayName: string;
+}
+export type ProductDataListSectionProperties = PropsWithChildren<{
+	title?: ReactNode;
+	description?: ReactNode;
+	content?: ReactNode;
+	link: ReactNode;
+}>;
+export type ProductDataListSectionProps = ProductDataListSectionProperties & Omit<BoxProps, "padding" | "display" | "flexDirection" | "gap" | "content">;
+export declare const ProductDataListSection: React.FC<ProductDataListSectionProps>;
+export type ProductDataListItemDividerProperties = Pick<BoxProps, "borderTopWidth" | "borderBottomWidth" | "borderColor" | "borderStyle" | "width" | "id">;
+export declare const ProductDataListItemDivider: React.FC<ProductDataListItemDividerProperties>;
+/**
+ * Properties specific to the ProductDataList component
+ */
+export interface ProductDataListProperties {
+	/**
+	 * The content to be rendered inside the list
+	 */
+	children: ReactNode;
+	/**
+	 * Optional title for the list section
+	 */
+	title?: ReactNode;
+}
+/**
+ * Props that can be passed to the ProductDataList component
+ */
+export type ProductDataListProps = ProductDataListProperties & Omit<BoxProps, "padding" | "display" | "flexDirection" | "gap">;
+export interface ProductDataListComponents {
+	Products: typeof ProductDataListProducts;
+	Item: typeof ProductDataListItem;
+	Section: typeof ProductDataListSection;
+	ItemDivider: typeof ProductDataListItemDivider;
+}
+export declare const ProductDataList: React.FC<ProductDataListProps> & ProductDataListComponents;
+
+export {};

package/dist/ProductDataList/index.js

@@ -0,0 +1,2 @@
+"use client";
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("@nimbus-ds/components"),require("@nimbus-ds/icons"),require("@dnd-kit/core"),require("@dnd-kit/sortable"),require("@dnd-kit/utilities")):"function"==typeof define&&define.amd?define(["react","@nimbus-ds/components","@nimbus-ds/icons","@dnd-kit/core","@dnd-kit/sortable","@dnd-kit/utilities"],t):"object"==typeof exports?exports["@nimbus-ds/patterns"]=t(require("react"),require("@nimbus-ds/components"),require("@nimbus-ds/icons"),require("@dnd-kit/core"),require("@dnd-kit/sortable"),require("@dnd-kit/utilities")):e["@nimbus-ds/patterns"]=t(e.react,e["@nimbus-ds/components"],e["@nimbus-ds/icons"],e["@dnd-kit/core"],e["@dnd-kit/sortable"],e["@dnd-kit/utilities"])}(global,((e,t,r,o,n,a)=>(()=>{"use strict";var i={3454:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductDataList=void 0;const o=r(5163).__importDefault(r(8156)),n=r(5280),a=r(385),i=({children:e,title:t,...r})=>o.default.createElement(n.Box,{padding:"4",display:"flex",flexDirection:"column",gap:"4",...r},t&&o.default.createElement(n.Title,{as:"h4"},t),e);t.ProductDataList=i,i.Item=a.ProductDataListItem,i.Products=a.ProductDataListProducts,i.Section=a.ProductDataListSection,i.ItemDivider=a.ProductDataListItemDivider,i.displayName="ProductDataList",i.Item.displayName="ProductDataList.Item",i.Products.displayName="ProductDataList.Products",i.ItemDivider.displayName="ProductDataList.ItemDivider",i.Section.displayName="ProductDataList.Section"},3289:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const o=r(5163);o.__exportStar(r(3660),t),o.__exportStar(r(385),t)},985:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductDataListItem=void 0;const o=r(5163).__importDefault(r(8156)),n=r(5280),a=r(3215),i=r(7880),l=r(8583),c=({id:e,title:t,imageUrl:r,imageAlt:c,isDraggable:u=!1,withDivider:d=!1,onRemove:s,children:f,tagIcon:p,tagText:m,tagAppearance:b="warning"})=>{const y=o.default.createElement(n.Box,{display:"flex",flexDirection:"column",gap:"2"},o.default.createElement(n.Box,{display:"flex",alignItems:"center",gap:"3",px:"2"},u&&o.default.createElement(n.Box,{as:"span",className:"handle",cursor:"grab"},o.default.createElement(i.Sortable.ItemHandle,null,o.default.createElement(n.Box,{display:"flex",alignItems:"center",justifyContent:"center"},o.default.createElement(n.Text,null,o.default.createElement(a.DragDotsIcon,{size:"small"}))))),r&&o.default.createElement(n.Box,{width:"12",height:"12",borderRadius:"1"},o.default.createElement(n.Thumbnail,{src:r,alt:c||t,width:"56px",height:"56px"})),o.default.createElement(n.Box,{flex:"1",display:"flex",flexDirection:"column",gap:"1"},o.default.createElement(n.Text,null,t),m&&p&&o.default.createElement(n.Box,{display:"flex",flexWrap:"wrap",gap:"2",pt:"2"},o.default.createElement(n.Tag,{appearance:b},o.default.createElement(n.Icon,{color:"currentColor",source:p}),m)),f&&o.default.createElement(n.Box,{display:"flex",flexWrap:"wrap",gap:"2",pt:"2"},f)),s&&o.default.createElement(n.Box,{justifyContent:"flex-end"},o.default.createElement(n.IconButton,{source:o.default.createElement(a.TrashIcon,null),size:"2rem",onClick:s}))),d&&o.default.createElement(l.ProductDataListItemDivider,{"data-testid":"divider"}));return u?o.default.createElement(i.Sortable.Item,{key:e,id:e,handle:!0},y):y};t.ProductDataListItem=c,c.displayName="ProductDataList.Item"},2919:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductDataListItem=void 0;var o=r(985);Object.defineProperty(t,"ProductDataListItem",{enumerable:!0,get:function(){return o.ProductDataListItem}})},8583:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductDataListItemDivider=void 0;const o=r(5163).__importDefault(r(8156)),n=r(5280);t.ProductDataListItemDivider=({...e})=>o.default.createElement(n.Box,{borderTopWidth:"1",borderBottomWidth:"none",borderColor:"neutral-surfaceHighlight",borderStyle:"solid",...e})},892:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductDataListItemDivider=void 0;var o=r(8583);Object.defineProperty(t,"ProductDataListItemDivider",{enumerable:!0,get:function(){return o.ProductDataListItemDivider}})},4017:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductDataListProducts=void 0;const o=r(5163).__importStar(r(8156)),n=r(5280),a=r(7880),i=r(892);function l({sortable:e,items:t,onReorder:r,renderItem:l,sortableProps:c,children:u,...d}){const[s,f]=(0,o.useState)(null);return o.default.createElement(a.Sortable,{...c,items:t,onReorder:r,orientation:"vertical",disabled:!e,renderOverlay:e=>o.default.createElement(n.Box,{display:"flex",flexDirection:"column",backgroundColor:"neutral-background",boxShadow:"3",paddingTop:"2"},l(e,0)),onDragStart:e=>{f(e.active.id),c?.onDragStart?.(e)},onDragEnd:e=>{f(null),c?.onDragEnd?.(e)}},o.default.createElement(n.Box,{display:"flex",flexDirection:"column",gap:"2",overflowY:"auto",maxHeight:"370px",...d},u,o.default.createElement(i.ProductDataListItemDivider,null),t.map(((e,t)=>o.default.createElement(o.default.Fragment,{key:e.id},o.default.createElement("div",{"aria-hidden":s===e.id,style:{opacity:s===e.id?0:1}},l(e,t)))))))}t.ProductDataListProducts=l,l.displayName="ProductDataList.Products"},1820:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductDataListProducts=void 0;var o=r(4017);Object.defineProperty(t,"ProductDataListProducts",{enumerable:!0,get:function(){return o.ProductDataListProducts}})},4735:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductDataListSection=void 0;const o=r(5163).__importDefault(r(8156)),n=r(5280);t.ProductDataListSection=({title:e,description:t,content:r,link:a,children:i,...l})=>o.default.createElement(n.Box,{display:"flex",flexDirection:"column",gap:"4",...l},o.default.createElement(n.Box,{display:"flex",flexDirection:"column",gap:"4"},o.default.createElement(n.Box,{display:"flex",flexDirection:"column",gap:"1"},e&&o.default.createElement(n.Text,{fontSize:"highlight"},e),t&&o.default.createElement(n.Text,{color:"neutral-textLow"},t),r),a),i)},3549:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductDataListSection=void 0;var o=r(4735);Object.defineProperty(t,"ProductDataListSection",{enumerable:!0,get:function(){return o.ProductDataListSection}})},385:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const o=r(5163);o.__exportStar(r(2919),t),o.__exportStar(r(1820),t),o.__exportStar(r(3549),t),o.__exportStar(r(892),t)},3660:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductDataList=void 0;var o=r(3454);Object.defineProperty(t,"ProductDataList",{enumerable:!0,get:function(){return o.ProductDataList}})},977:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.DEFAULT_OVERLAY_SETTINGS=t.orientation=void 0,t.orientation={vertical:"vertical",horizontal:"horizontal"},t.DEFAULT_OVERLAY_SETTINGS={dropAnimation:{duration:0,easing:"ease"}}},8753:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.Sortable=void 0;const o=r(5163).__importStar(r(8156)),n=r(2948),a=r(1762),i=r(421),l=r(977);function c({items:e,onReorder:t,orientation:r="vertical",sensorOptions:i,onDragStart:c,onDragOver:u,onDragEnd:d,disabled:s=!1,children:f,overlaySettings:p=l.DEFAULT_OVERLAY_SETTINGS,renderOverlay:m,dndContextSettings:b}){const[y,v]=(0,o.useState)(null),_=y?e.find((e=>e.id===y)):null,g=(0,n.useSensors)((0,n.useSensor)(n.PointerSensor,{activationConstraint:{distance:8},...i}),(0,n.useSensor)(n.KeyboardSensor,{coordinateGetter:a.sortableKeyboardCoordinates,...i})),h=(0,o.useMemo)((()=>"vertical"===r?a.verticalListSortingStrategy:a.horizontalListSortingStrategy),[r]);return s?o.default.createElement(o.default.Fragment,null,f):o.default.createElement(n.DndContext,{sensors:g,collisionDetection:n.closestCenter,onDragStart:e=>{v(e.active.id),c?.(e)},onDragOver:u,onDragEnd:r=>{const{active:o,over:n}=r;if(n&&o.id!==n.id){const r=e.findIndex((e=>e.id===o.id)),a=e.findIndex((e=>e.id===n.id)),i=[...e],[l]=i.splice(r,1);i.splice(a,0,l),t(i)}v(null),d?.(r)},...b},o.default.createElement(a.SortableContext,{items:e.map((e=>e.id)),strategy:h},f),o.default.createElement(n.DragOverlay,{...p},_&&m?m(_):null))}t.Sortable=c,c.Item=i.SortableItem,c.ItemHandle=i.SortableItemHandle,c.displayName="Sortable",c.Item.displayName="Sortable.Item",c.ItemHandle.displayName="Sortable.ItemHandle"},6456:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.SortableItem=void 0;const o=r(5163).__importStar(r(8156)),n=r(1762),a=r(8927),i=r(3750);t.SortableItem=({id:e,disabled:t=!1,handle:r=!1,children:l,renderItem:c})=>{const{attributes:u,listeners:d,setNodeRef:s,setActivatorNodeRef:f,transform:p,transition:m,isDragging:b}=(0,n.useSortable)({id:e,disabled:t}),y=(0,o.useMemo)((()=>({transform:a.CSS.Transform.toString(p),transition:m,touchAction:"none"})),[p,m]),v=(0,o.useMemo)((()=>({setActivatorNodeRef:f,attributes:u,listeners:d})),[f,u,d]);return c?c({isDragging:b,attributes:u,listeners:r?void 0:d,setNodeRef:s,style:y}):o.default.createElement(i.SortableItemContext.Provider,{value:v},o.default.createElement("div",{ref:s,style:y,...!r&&{...u,...d}},l))}},3750:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useSortableItemContext=t.SortableItemContext=void 0;const o=r(8156);t.SortableItemContext=(0,o.createContext)(null);t.useSortableItemContext=()=>{const e=(0,o.useContext)(t.SortableItemContext);if(!e)throw new Error("useSortableItemContext must be used within a SortableItem");return e}},1882:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.SortableItem=void 0;var o=r(6456);Object.defineProperty(t,"SortableItem",{enumerable:!0,get:function(){return o.SortableItem}})},3429:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.SortableItemHandle=void 0;const o=r(5163).__importDefault(r(8156)),n=r(5280),a=r(3750),i=({children:e})=>{const{setActivatorNodeRef:t,attributes:r,listeners:i}=(0,a.useSortableItemContext)();return o.default.createElement(n.Box,{...r,...i,ref:t,cursor:"grab"},e)};t.SortableItemHandle=i,i.displayName="SortableItemHandle"},2595:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.SortableItemHandle=void 0;var o=r(3429);Object.defineProperty(t,"SortableItemHandle",{enumerable:!0,get:function(){return o.SortableItemHandle}})},421:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const o=r(5163);o.__exportStar(r(1882),t),o.__exportStar(r(2595),t)},7880:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.Sortable=void 0;const o=r(8753);var n=r(8753);Object.defineProperty(t,"Sortable",{enumerable:!0,get:function(){return n.Sortable}}),t.default=o.Sortable},5163:(e,t,r)=>{r.r(t),r.d(t,{__assign:()=>a,__asyncDelegator:()=>w,__asyncGenerator:()=>D,__asyncValues:()=>O,__await:()=>x,__awaiter:()=>m,__classPrivateFieldGet:()=>T,__classPrivateFieldIn:()=>C,__classPrivateFieldSet:()=>M,__createBinding:()=>y,__decorate:()=>l,__esDecorate:()=>u,__exportStar:()=>v,__extends:()=>n,__generator:()=>b,__importDefault:()=>L,__importStar:()=>E,__makeTemplateObject:()=>I,__metadata:()=>p,__param:()=>c,__propKey:()=>s,__read:()=>g,__rest:()=>i,__runInitializers:()=>d,__setFunctionName:()=>f,__spread:()=>h,__spreadArray:()=>S,__spreadArrays:()=>P,__values:()=>_});var o=function(e,t){return o=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])},o(e,t)};function n(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function r(){this.constructor=e}o(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}var a=function(){return a=Object.assign||function(e){for(var t,r=1,o=arguments.length;r<o;r++)for(var n in t=arguments[r])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e},a.apply(this,arguments)};function i(e,t){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(e);n<o.length;n++)t.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(e,o[n])&&(r[o[n]]=e[o[n]])}return r}function l(e,t,r,o){var n,a=arguments.length,i=a<3?t:null===o?o=Object.getOwnPropertyDescriptor(t,r):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,o);else for(var l=e.length-1;l>=0;l--)(n=e[l])&&(i=(a<3?n(i):a>3?n(t,r,i):n(t,r))||i);return a>3&&i&&Object.defineProperty(t,r,i),i}function c(e,t){return function(r,o){t(r,o,e)}}function u(e,t,r,o,n,a){function i(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var l,c=o.kind,u="getter"===c?"get":"setter"===c?"set":"value",d=!t&&e?o.static?e:e.prototype:null,s=t||(d?Object.getOwnPropertyDescriptor(d,o.name):{}),f=!1,p=r.length-1;p>=0;p--){var m={};for(var b in o)m[b]="access"===b?{}:o[b];for(var b in o.access)m.access[b]=o.access[b];m.addInitializer=function(e){if(f)throw new TypeError("Cannot add initializers after decoration has completed");a.push(i(e||null))};var y=(0,r[p])("accessor"===c?{get:s.get,set:s.set}:s[u],m);if("accessor"===c){if(void 0===y)continue;if(null===y||"object"!=typeof y)throw new TypeError("Object expected");(l=i(y.get))&&(s.get=l),(l=i(y.set))&&(s.set=l),(l=i(y.init))&&n.push(l)}else(l=i(y))&&("field"===c?n.push(l):s[u]=l)}d&&Object.defineProperty(d,o.name,s),f=!0}function d(e,t,r){for(var o=arguments.length>2,n=0;n<t.length;n++)r=o?t[n].call(e,r):t[n].call(e);return o?r:void 0}function s(e){return"symbol"==typeof e?e:"".concat(e)}function f(e,t,r){return"symbol"==typeof t&&(t=t.description?"[".concat(t.description,"]"):""),Object.defineProperty(e,"name",{configurable:!0,value:r?"".concat(r," ",t):t})}function p(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}function m(e,t,r,o){return new(r||(r=Promise))((function(n,a){function i(e){try{c(o.next(e))}catch(e){a(e)}}function l(e){try{c(o.throw(e))}catch(e){a(e)}}function c(e){var t;e.done?n(e.value):(t=e.value,t instanceof r?t:new r((function(e){e(t)}))).then(i,l)}c((o=o.apply(e,t||[])).next())}))}function b(e,t){var r,o,n,a,i={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return a={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(a[Symbol.iterator]=function(){return this}),a;function l(l){return function(c){return function(l){if(r)throw new TypeError("Generator is already executing.");for(;a&&(a=0,l[0]&&(i=0)),i;)try{if(r=1,o&&(n=2&l[0]?o.return:l[0]?o.throw||((n=o.return)&&n.call(o),0):o.next)&&!(n=n.call(o,l[1])).done)return n;switch(o=0,n&&(l=[2&l[0],n.value]),l[0]){case 0:case 1:n=l;break;case 4:return i.label++,{value:l[1],done:!1};case 5:i.label++,o=l[1],l=[0];continue;case 7:l=i.ops.pop(),i.trys.pop();continue;default:if(!(n=i.trys,(n=n.length>0&&n[n.length-1])||6!==l[0]&&2!==l[0])){i=0;continue}if(3===l[0]&&(!n||l[1]>n[0]&&l[1]<n[3])){i.label=l[1];break}if(6===l[0]&&i.label<n[1]){i.label=n[1],n=l;break}if(n&&i.label<n[2]){i.label=n[2],i.ops.push(l);break}n[2]&&i.ops.pop(),i.trys.pop();continue}l=t.call(e,i)}catch(e){l=[6,e],o=0}finally{r=n=0}if(5&l[0])throw l[1];return{value:l[0]?l[1]:void 0,done:!0}}([l,c])}}}var y=Object.create?function(e,t,r,o){void 0===o&&(o=r);var n=Object.getOwnPropertyDescriptor(t,r);n&&!("get"in n?!t.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,o,n)}:function(e,t,r,o){void 0===o&&(o=r),e[o]=t[r]};function v(e,t){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(t,r)||y(t,e,r)}function _(e){var t="function"==typeof Symbol&&Symbol.iterator,r=t&&e[t],o=0;if(r)return r.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&o>=e.length&&(e=void 0),{value:e&&e[o++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function g(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var o,n,a=r.call(e),i=[];try{for(;(void 0===t||t-- >0)&&!(o=a.next()).done;)i.push(o.value)}catch(e){n={error:e}}finally{try{o&&!o.done&&(r=a.return)&&r.call(a)}finally{if(n)throw n.error}}return i}function h(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(g(arguments[t]));return e}function P(){for(var e=0,t=0,r=arguments.length;t<r;t++)e+=arguments[t].length;var o=Array(e),n=0;for(t=0;t<r;t++)for(var a=arguments[t],i=0,l=a.length;i<l;i++,n++)o[n]=a[i];return o}function S(e,t,r){if(r||2===arguments.length)for(var o,n=0,a=t.length;n<a;n++)!o&&n in t||(o||(o=Array.prototype.slice.call(t,0,n)),o[n]=t[n]);return e.concat(o||Array.prototype.slice.call(t))}function x(e){return this instanceof x?(this.v=e,this):new x(e)}function D(e,t,r){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var o,n=r.apply(e,t||[]),a=[];return o={},i("next"),i("throw"),i("return"),o[Symbol.asyncIterator]=function(){return this},o;function i(e){n[e]&&(o[e]=function(t){return new Promise((function(r,o){a.push([e,t,r,o])>1||l(e,t)}))})}function l(e,t){try{(r=n[e](t)).value instanceof x?Promise.resolve(r.value.v).then(c,u):d(a[0][2],r)}catch(e){d(a[0][3],e)}var r}function c(e){l("next",e)}function u(e){l("throw",e)}function d(e,t){e(t),a.shift(),a.length&&l(a[0][0],a[0][1])}}function w(e){var t,r;return t={},o("next"),o("throw",(function(e){throw e})),o("return"),t[Symbol.iterator]=function(){return this},t;function o(o,n){t[o]=e[o]?function(t){return(r=!r)?{value:x(e[o](t)),done:!1}:n?n(t):t}:n}}function O(e){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var t,r=e[Symbol.asyncIterator];return r?r.call(e):(e=_(e),t={},o("next"),o("throw"),o("return"),t[Symbol.asyncIterator]=function(){return this},t);function o(r){t[r]=e[r]&&function(t){return new Promise((function(o,n){(function(e,t,r,o){Promise.resolve(o).then((function(t){e({value:t,done:r})}),t)})(o,n,(t=e[r](t)).done,t.value)}))}}}function I(e,t){return Object.defineProperty?Object.defineProperty(e,"raw",{value:t}):e.raw=t,e}var j=Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t};function E(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&y(t,e,r);return j(t,e),t}function L(e){return e&&e.__esModule?e:{default:e}}function T(e,t,r,o){if("a"===r&&!o)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!o:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?o:"a"===r?o.call(e):o?o.value:t.get(e)}function M(e,t,r,o,n){if("m"===o)throw new TypeError("Private method is not writable");if("a"===o&&!n)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!n:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===o?n.call(e,r):n?n.value=r:t.set(e,r),r}function C(e,t){if(null===t||"object"!=typeof t&&"function"!=typeof t)throw new TypeError("Cannot use 'in' operator on non-object");return"function"==typeof e?t===e:e.has(t)}},2948:e=>{e.exports=o},1762:e=>{e.exports=n},8927:e=>{e.exports=a},5280:e=>{e.exports=t},3215:e=>{e.exports=r},8156:t=>{t.exports=e}},l={};function c(e){var t=l[e];if(void 0!==t)return t.exports;var r=l[e]={exports:{}};return i[e](r,r.exports,c),r.exports}return c.d=(e,t)=>{for(var r in t)c.o(t,r)&&!c.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},c.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),c.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},c(3289)})()));

package/dist/ProductUpdates/index.d.ts

@@ -0,0 +1,79 @@
+// Generated by dts-bundle-generator v8.1.2
+
+import { BoxProperties, PopoverProperties } from '@nimbus-ds/components';
+import React from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+export interface ProductUpdatesPaginatorProperties {
+	/**
+	 * Total number of items/steps in the pagination.
+	 */
+	totalItems: number;
+	/**
+	 * Zero-based index of the currently active item.
+	 */
+	activeIndex: number;
+}
+export type ProductUpdatesPaginatorProps = ProductUpdatesPaginatorProperties & Omit<HTMLAttributes<HTMLElement>, "color" | "className" | "style">;
+export declare const ProductUpdatesPaginator: React.FC<ProductUpdatesPaginatorProps>;
+export interface ProductUpdatesFooterProperties {
+	/**
+	 * Optional link rendered on the left side of the footer.
+	 * @TJS-type React.ReactNode
+	 */
+	leftLink?: ReactNode;
+	/**
+	 * Optional paginator element rendered in the center of the footer.
+	 * @TJS-type React.ReactNode
+	 */
+	paginator?: ReactNode;
+	/**
+	 * Optional action button rendered on the right side of the footer.
+	 * @TJS-type React.ReactNode
+	 */
+	rightButton?: ReactNode;
+	/**
+	 * When true, renders a full-width divider above the footer content.
+	 * @default false
+	 */
+	renderDivider?: boolean;
+}
+export type ProductUpdatesFooterProps = ProductUpdatesFooterProperties & Omit<BoxProperties, "pt" | "children">;
+export declare const ProductUpdatesFooter: React.FC<ProductUpdatesFooterProps>;
+export interface ProductUpdatesComponents {
+	Paginator: typeof ProductUpdatesPaginator;
+	Footer: typeof ProductUpdatesFooter;
+}
+export interface ProductUpdatesProperties extends Omit<PopoverProperties, "content" | "appearance" | "padding" | "enabledDismiss"> {
+	/**
+	 * Title of the Popover.
+	 */
+	title: string;
+	/**
+	 * Content text of the Popover.
+	 */
+	text: string;
+	/**
+	 * Optional tag element rendered inline before the title.
+	 * @TJS-type React.ReactNode
+	 */
+	tag?: ReactNode;
+	/**
+	 * Optional content for the body of the Popover.
+	 * @TJS-type React.ReactNode
+	 */
+	bodyContent?: ReactNode;
+	/**
+	 * Optional properties for the content container of the popover body.
+	 */
+	bodyContentProps?: Omit<BoxProperties, "children">;
+	/**
+	 * Optional bottom link to dismiss the Popover. If unset, an IconButton with an X will appear on the superior right corner.
+	 * @TJS-type React.ReactNode
+	 */
+	dismissLink?: ReactNode;
+}
+export type ProductUpdatesProps = ProductUpdatesProperties & HTMLAttributes<HTMLElement>;
+export declare const ProductUpdates: React.FC<ProductUpdatesProps> & ProductUpdatesComponents;
+
+export {};

package/dist/ProductUpdates/index.js

@@ -0,0 +1,2 @@
+"use client";
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("@nimbus-ds/components"),require("@nimbus-ds/icons")):"function"==typeof define&&define.amd?define(["react","@nimbus-ds/components","@nimbus-ds/icons"],t):"object"==typeof exports?exports["@nimbus-ds/patterns"]=t(require("react"),require("@nimbus-ds/components"),require("@nimbus-ds/icons")):e["@nimbus-ds/patterns"]=t(e.react,e["@nimbus-ds/components"],e["@nimbus-ds/icons"])}(global,((e,t,r)=>(()=>{"use strict";var n={6666:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductUpdates=void 0;const n=r(5163).__importStar(r(8156)),o=r(5280),a=r(3215),i=r(1880),c=({style:e,title:t,text:r,tag:i,bodyContent:c,dismissLink:l,bodyContentProps:u,...s})=>{const[f,d]=(0,n.useState)(!!s.visible),p=s?.onVisibility?()=>s.onVisibility?.(!1):()=>d(!f),y=n.default.createElement(o.Box,{display:"flex",flexDirection:"column",gap:"2",width:"100%"},i?n.default.createElement(o.Box,{display:"flex",flexDirection:"row",alignItems:"center",gap:"2"},i,n.default.createElement(o.Text,{color:"neutral-background",fontSize:"base",fontWeight:"bold"},t)):n.default.createElement(o.Text,{color:"neutral-background",fontSize:"base",fontWeight:"bold"},t),n.default.createElement(o.Text,{color:"neutral-background",fontSize:"base"},r)),b=l?n.default.createElement(o.Box,{display:"flex",flexDirection:"column",gap:"4",width:"100%",...u},y,c,n.default.createElement(o.Link,{as:"button",onClick:p,appearance:"neutral-background"},l)):n.default.createElement(o.Box,{display:"flex",flexDirection:"column",gap:"4",width:"100%",...u},n.default.createElement(o.Box,{pr:"8",position:"relative"},y,n.default.createElement(o.Box,{position:"absolute",top:"-16px",right:"-16px"},n.default.createElement(o.IconButton,{onClick:p,"aria-label":"Close",size:"2.75rem",source:n.default.createElement(o.Icon,{color:"neutral-background",source:n.default.createElement(a.CloseIcon,null)}),borderColor:"transparent",backgroundColor:"transparent"}))),c);return n.default.createElement(o.Popover,{...s,backgroundColor:"primary-interactiveHover",content:b,visible:void 0===s.visible?f:s.visible,onVisibility:s.onVisibility||(e=>d(e)),enabledDismiss:!1,enabledClick:!1})};t.ProductUpdates=c,c.Paginator=i.ProductUpdatesPaginator,c.Footer=i.ProductUpdatesFooter,c.displayName="ProductUpdates",c.Paginator.displayName="ProductUpdates.Paginator",c.Footer.displayName="ProductUpdates.Footer"},4096:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const n=r(5163);n.__exportStar(r(6787),t),n.__exportStar(r(1880),t)},3016:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductUpdatesFooter=void 0;const n=r(5163).__importDefault(r(8156)),o=r(5280),a=({leftLink:e,paginator:t,rightButton:r,renderDivider:a,...i})=>n.default.createElement(o.Box,{...i},a&&n.default.createElement(o.Box,null,n.default.createElement(o.Divider,null)),n.default.createElement(o.Box,{paddingTop:"4",display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center",width:"100%"},e&&n.default.createElement(o.Box,{display:"flex",alignItems:"center",flex:"1",mr:"2"},e),t&&n.default.createElement(o.Box,{display:"flex",flex:"2",alignItems:"center",justifyContent:"flex-start"},t),r&&n.default.createElement(o.Box,{display:"flex",alignItems:"center",justifyContent:"flex-end",flex:"1"},r)));t.ProductUpdatesFooter=a,a.displayName="ProductUpdatesFooter"},4743:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductUpdatesFooter=void 0;const n=r(3016);var o=r(3016);Object.defineProperty(t,"ProductUpdatesFooter",{enumerable:!0,get:function(){return o.ProductUpdatesFooter}}),t.default=n.ProductUpdatesFooter},649:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductUpdatesPaginator=void 0;const n=r(5163).__importDefault(r(8156)),o=r(5280);t.ProductUpdatesPaginator=({totalItems:e,activeIndex:t,...r})=>n.default.createElement(o.Box,{display:"flex",flexDirection:"row",gap:"1-5",alignItems:"center",role:"img","aria-label":`Step ${t+1} of ${e}`,...r},Array.from({length:e},((e,t)=>t)).map((e=>n.default.createElement(o.Box,{key:`paginator-dot-${e}`,width:e===t?"24px":"6px",height:"6px",borderRadius:"full",backgroundColor:e===t?"neutral-background":"primary-textLow","aria-hidden":"true"}))))},8332:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductUpdatesPaginator=void 0;const n=r(649);var o=r(649);Object.defineProperty(t,"ProductUpdatesPaginator",{enumerable:!0,get:function(){return o.ProductUpdatesPaginator}}),t.default=n.ProductUpdatesPaginator},1880:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const n=r(5163);n.__exportStar(r(8332),t),n.__exportStar(r(4743),t)},6787:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.ProductUpdates=void 0;const n=r(6666);var o=r(6666);Object.defineProperty(t,"ProductUpdates",{enumerable:!0,get:function(){return o.ProductUpdates}}),t.default=n.ProductUpdates},5163:(e,t,r)=>{r.r(t),r.d(t,{__assign:()=>a,__asyncDelegator:()=>j,__asyncGenerator:()=>O,__asyncValues:()=>E,__await:()=>x,__awaiter:()=>y,__classPrivateFieldGet:()=>T,__classPrivateFieldIn:()=>B,__classPrivateFieldSet:()=>C,__createBinding:()=>m,__decorate:()=>c,__esDecorate:()=>u,__exportStar:()=>v,__extends:()=>o,__generator:()=>b,__importDefault:()=>I,__importStar:()=>k,__makeTemplateObject:()=>S,__metadata:()=>p,__param:()=>l,__propKey:()=>f,__read:()=>h,__rest:()=>i,__runInitializers:()=>s,__setFunctionName:()=>d,__spread:()=>g,__spreadArray:()=>P,__spreadArrays:()=>w,__values:()=>_});var n=function(e,t){return n=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])},n(e,t)};function o(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function r(){this.constructor=e}n(e,t),e.prototype=null===t?Object.create(t):(r.prototype=t.prototype,new r)}var a=function(){return a=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var o in t=arguments[r])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},a.apply(this,arguments)};function i(e,t){var r={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(r[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(n=Object.getOwnPropertySymbols(e);o<n.length;o++)t.indexOf(n[o])<0&&Object.prototype.propertyIsEnumerable.call(e,n[o])&&(r[n[o]]=e[n[o]])}return r}function c(e,t,r,n){var o,a=arguments.length,i=a<3?t:null===n?n=Object.getOwnPropertyDescriptor(t,r):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)i=Reflect.decorate(e,t,r,n);else for(var c=e.length-1;c>=0;c--)(o=e[c])&&(i=(a<3?o(i):a>3?o(t,r,i):o(t,r))||i);return a>3&&i&&Object.defineProperty(t,r,i),i}function l(e,t){return function(r,n){t(r,n,e)}}function u(e,t,r,n,o,a){function i(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var c,l=n.kind,u="getter"===l?"get":"setter"===l?"set":"value",s=!t&&e?n.static?e:e.prototype:null,f=t||(s?Object.getOwnPropertyDescriptor(s,n.name):{}),d=!1,p=r.length-1;p>=0;p--){var y={};for(var b in n)y[b]="access"===b?{}:n[b];for(var b in n.access)y.access[b]=n.access[b];y.addInitializer=function(e){if(d)throw new TypeError("Cannot add initializers after decoration has completed");a.push(i(e||null))};var m=(0,r[p])("accessor"===l?{get:f.get,set:f.set}:f[u],y);if("accessor"===l){if(void 0===m)continue;if(null===m||"object"!=typeof m)throw new TypeError("Object expected");(c=i(m.get))&&(f.get=c),(c=i(m.set))&&(f.set=c),(c=i(m.init))&&o.push(c)}else(c=i(m))&&("field"===l?o.push(c):f[u]=c)}s&&Object.defineProperty(s,n.name,f),d=!0}function s(e,t,r){for(var n=arguments.length>2,o=0;o<t.length;o++)r=n?t[o].call(e,r):t[o].call(e);return n?r:void 0}function f(e){return"symbol"==typeof e?e:"".concat(e)}function d(e,t,r){return"symbol"==typeof t&&(t=t.description?"[".concat(t.description,"]"):""),Object.defineProperty(e,"name",{configurable:!0,value:r?"".concat(r," ",t):t})}function p(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}function y(e,t,r,n){return new(r||(r=Promise))((function(o,a){function i(e){try{l(n.next(e))}catch(e){a(e)}}function c(e){try{l(n.throw(e))}catch(e){a(e)}}function l(e){var t;e.done?o(e.value):(t=e.value,t instanceof r?t:new r((function(e){e(t)}))).then(i,c)}l((n=n.apply(e,t||[])).next())}))}function b(e,t){var r,n,o,a,i={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]};return a={next:c(0),throw:c(1),return:c(2)},"function"==typeof Symbol&&(a[Symbol.iterator]=function(){return this}),a;function c(c){return function(l){return function(c){if(r)throw new TypeError("Generator is already executing.");for(;a&&(a=0,c[0]&&(i=0)),i;)try{if(r=1,n&&(o=2&c[0]?n.return:c[0]?n.throw||((o=n.return)&&o.call(n),0):n.next)&&!(o=o.call(n,c[1])).done)return o;switch(n=0,o&&(c=[2&c[0],o.value]),c[0]){case 0:case 1:o=c;break;case 4:return i.label++,{value:c[1],done:!1};case 5:i.label++,n=c[1],c=[0];continue;case 7:c=i.ops.pop(),i.trys.pop();continue;default:if(!(o=i.trys,(o=o.length>0&&o[o.length-1])||6!==c[0]&&2!==c[0])){i=0;continue}if(3===c[0]&&(!o||c[1]>o[0]&&c[1]<o[3])){i.label=c[1];break}if(6===c[0]&&i.label<o[1]){i.label=o[1],o=c;break}if(o&&i.label<o[2]){i.label=o[2],i.ops.push(c);break}o[2]&&i.ops.pop(),i.trys.pop();continue}c=t.call(e,i)}catch(e){c=[6,e],n=0}finally{r=o=0}if(5&c[0])throw c[1];return{value:c[0]?c[1]:void 0,done:!0}}([c,l])}}}var m=Object.create?function(e,t,r,n){void 0===n&&(n=r);var o=Object.getOwnPropertyDescriptor(t,r);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,n,o)}:function(e,t,r,n){void 0===n&&(n=r),e[n]=t[r]};function v(e,t){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(t,r)||m(t,e,r)}function _(e){var t="function"==typeof Symbol&&Symbol.iterator,r=t&&e[t],n=0;if(r)return r.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&n>=e.length&&(e=void 0),{value:e&&e[n++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function h(e,t){var r="function"==typeof Symbol&&e[Symbol.iterator];if(!r)return e;var n,o,a=r.call(e),i=[];try{for(;(void 0===t||t-- >0)&&!(n=a.next()).done;)i.push(n.value)}catch(e){o={error:e}}finally{try{n&&!n.done&&(r=a.return)&&r.call(a)}finally{if(o)throw o.error}}return i}function g(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(h(arguments[t]));return e}function w(){for(var e=0,t=0,r=arguments.length;t<r;t++)e+=arguments[t].length;var n=Array(e),o=0;for(t=0;t<r;t++)for(var a=arguments[t],i=0,c=a.length;i<c;i++,o++)n[o]=a[i];return n}function P(e,t,r){if(r||2===arguments.length)for(var n,o=0,a=t.length;o<a;o++)!n&&o in t||(n||(n=Array.prototype.slice.call(t,0,o)),n[o]=t[o]);return e.concat(n||Array.prototype.slice.call(t))}function x(e){return this instanceof x?(this.v=e,this):new x(e)}function O(e,t,r){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var n,o=r.apply(e,t||[]),a=[];return n={},i("next"),i("throw"),i("return"),n[Symbol.asyncIterator]=function(){return this},n;function i(e){o[e]&&(n[e]=function(t){return new Promise((function(r,n){a.push([e,t,r,n])>1||c(e,t)}))})}function c(e,t){try{(r=o[e](t)).value instanceof x?Promise.resolve(r.value.v).then(l,u):s(a[0][2],r)}catch(e){s(a[0][3],e)}var r}function l(e){c("next",e)}function u(e){c("throw",e)}function s(e,t){e(t),a.shift(),a.length&&c(a[0][0],a[0][1])}}function j(e){var t,r;return t={},n("next"),n("throw",(function(e){throw e})),n("return"),t[Symbol.iterator]=function(){return this},t;function n(n,o){t[n]=e[n]?function(t){return(r=!r)?{value:x(e[n](t)),done:!1}:o?o(t):t}:o}}function E(e){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var t,r=e[Symbol.asyncIterator];return r?r.call(e):(e=_(e),t={},n("next"),n("throw"),n("return"),t[Symbol.asyncIterator]=function(){return this},t);function n(r){t[r]=e[r]&&function(t){return new Promise((function(n,o){(function(e,t,r,n){Promise.resolve(n).then((function(t){e({value:t,done:r})}),t)})(n,o,(t=e[r](t)).done,t.value)}))}}}function S(e,t){return Object.defineProperty?Object.defineProperty(e,"raw",{value:t}):e.raw=t,e}var U=Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t};function k(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&m(t,e,r);return U(t,e),t}function I(e){return e&&e.__esModule?e:{default:e}}function T(e,t,r,n){if("a"===r&&!n)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!n:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===r?n:"a"===r?n.call(e):n?n.value:t.get(e)}function C(e,t,r,n,o){if("m"===n)throw new TypeError("Private method is not writable");if("a"===n&&!o)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!o:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===n?o.call(e,r):o?o.value=r:t.set(e,r),r}function B(e,t){if(null===t||"object"!=typeof t&&"function"!=typeof t)throw new TypeError("Cannot use 'in' operator on non-object");return"function"==typeof e?t===e:e.has(t)}},5280:e=>{e.exports=t},3215:e=>{e.exports=r},8156:t=>{t.exports=e}},o={};function a(e){var t=o[e];if(void 0!==t)return t.exports;var r=o[e]={exports:{}};return n[e](r,r.exports,a),r.exports}return a.d=(e,t)=>{for(var r in t)a.o(t,r)&&!a.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),a.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a(4096)})()));

package/dist/README.md

@@ -0,0 +1,235 @@
+# `@nimbus-ds/patterns`
+
+[![@nimbus-ds/patterns](https://img.shields.io/npm/v/@nimbus-ds/patterns?label=%40nimbus-ds%2Fpatterns)](https://www.npmjs.com/package/@nimbus-ds/patterns)
+
+Nimbus components is a component library built with [React](https://reactjs.org), designed to help our teams and ecosystem build better products for our merchants.
+
+## 🚀 Getting started
+
+Install `@nimbus-ds/patterns` using any package manager.
+
+```sh
+$ yarn add @nimbus-ds/patterns
+# or
+$ npm install @nimbus-ds/patterns
+```
+
+## 💻 Usage
+
+```jsx
+import { Button } from "@nimbus-ds/patterns";
+
+const ComponentExample = () => <Button>Hello World</Button>;
+```
+
+For more information about our components, check out our [Storybook](https://tiendanube.github.io/nimbus-design-system/).
+
+### Folder & file structures 📁 📄
+
+- For best practices in structure files please read this [document](https://redux.js.org/style-guide/style-guide#structure-files-as-feature-folders-with-single-file-logic)
+- When creating a new component, do so inside the **src/atomic** or **src/composite** directory
+
+```
+  ├─ 📁 src
+  │  └─ 📁 components
+```
+
+- Every directory must contain a 📄 **CHANGELOG.md** which serves to document all changes and changes made to each component.
+
+```
+  ├─ 📁 src
+  │  ├─ 📁 components
+  │  │  ├─ 📁 ComponentExample
+  │  │  │  ├─ 📁 src
+  │  │  │  └─ CHANGELOG.md
+```
+
+- Every directory should contain a 📄 **README.md** which serves to document the installation steps and a brief summary of each component.
+
+```
+  ├─ 📁 src
+  │  ├─ 📁 components
+  │  │  ├─ 📁 ComponentExample
+  │  │  │  ├─ 📁 src
+  │  │  │  ├─ CHANGELOG.md
+  │  │  │  └─ README.md
+```
+
+- The directory should have the same name as the component. The component file should have the name of the component in Pascal Case format and the extension `.tsx`
+
+```
+  ├─ 📁 src
+  │  ├─ 📁 components
+  │  │  ├─ 📁 ComponentExample
+  │  │  │  ├─ 📁 src
+  │  │  │  │  └─ ComponentExample.tsx
+  │  │  │  ├─ CHANGELOG.md
+  │  │  │  └─ README.md
+```
+
+- Every directory should contain a 📄 **index.ts** which serves as an entry point for the module, component, utils and/or hooks.
+
+```
+  ├─ 📁 src
+  │  ├─ 📁 components
+  │  │  ├─ 📁 ComponentExample
+  │  │  │  ├─ 📁 src
+  │  │  │  │  ├─ index.ts
+  │  │  │  │  └─ ComponentExample.tsx
+  │  │  │  ├─ CHANGELOG.md
+  │  │  │  └─ README.md
+```
+
+- Every component, utils and/or hooks should come with a test. The test must have the same name as the file being tested and the extension must be `.spec.tsx`
+
+```
+  ├─ 📁 src
+  │  ├─ 📁 components
+  │  │  ├─ 📁 ComponentExample
+  │  │  │  ├─ 📁 src
+  │  │  │  │  ├─ index.ts
+  │  │  │  │  ├─ ComponentExample.tsx
+  │  │  │  │  └─ componentExample.spec.tsx
+  │  │  │  ├─ CHANGELOG.md
+  │  │  │  └─ README.md
+```
+
+- Every component must come with documentation. The documentation must have the same name as the file being documented and the extension must be `.stories.tsx`.
+
+```
+  ├─ 📁 src
+  │  ├─ 📁 components
+  │  │  ├─ 📁 ComponentExample
+  │  │  │  ├─ 📁 src
+  │  │  │  │  ├─ index.ts
+  │  │  │  │  ├─ ComponentExample.tsx
+  │  │  │  │  ├─ componentExample.spec.tsx
+  │  │  │  │  └─ componentExample.stories.tsx
+  │  │  │  ├─ CHANGELOG.md
+  │  │  │  └─ README.md
+```
+
+- Every component must come with a typing. The type must have the same name as the file being documented and the extension must be `.types.tsx`.
+
+```
+  ├─ 📁 src
+  │  ├─ 📁 components
+  │  │  ├─ 📁 ComponentExample
+  │  │  │  ├─ 📁 src
+  │  │  │  │  ├─ index.ts
+  │  │  │  │  ├─ ComponentExample.tsx
+  │  │  │  │  ├─ componentExample.spec.tsx
+  │  │  │  │  ├─ componentExample.stories.tsx
+  │  │  │  │  └─ componentExample.types.ts
+  │  │  │  ├─ CHANGELOG.md
+  │  │  │  └─ README.md
+```
+
+- If a component has one or more children components, a subdirectory **📁 components** must be created inside de main directory of the component.
+
+```
+  ├─ 📁 src
+  │  ├─ 📁 components
+  │  │  ├─ 📁 ComponentExample
+  │  │  │  ├─ 📁 src
+  │  │  │  │  ├─ 📁 components
+  │  │  │  │  │  ├─ 📁 ComponentChild
+  │  │  │  │  │  │  ├─ index.ts
+  │  │  │  │  │  │  ├─ ComponentChild.tsx
+  │  │  │  │  │  │  ├─ componentChild.spec.tsx
+  │  │  │  │  │  │  └─ componentExample.types.ts
+  │  │  │  │  │  └─ index.ts
+  │  │  │  │  ├─ index.ts
+  │  │  │  │  ├─ ComponentExample.tsx
+  │  │  │  │  ├─ componentExample.spec.tsx
+  │  │  │  │  ├─ componentExample.stories.tsx
+  │  │  │  │  └─ componentExample.types.ts
+  │  │  │  ├─ CHANGELOG.md
+  │  │  │  └─ README.md
+```
+
+### Component coding 🤖 ⌨️
+
+- The component should have the same name as the file using Pascal Case format. It should be declared in a Arrow Function, always typying the expected answer and making the default export at the end of the file.
+
+  ```jsx
+  // ComponentExample.tsx
+  import React from "react";
+
+  const ComponentExample: React.FC = () => <div>...</div>;
+
+  export { ComponentExample };
+  ```
+
+- If the component has props, they will be imported from the corresponding `.definitions.ts` file adding initial prefix corresponding to their type. Example interface ` ILogin`, type `TLogin`, enum `ELogin`.
+
+  ```jsx
+  // ComponentExample.tsx
+  import React from "react";
+  import { ComponentExampleProps } from "./componentExampleProps.types";
+
+  const ComponentExample: React.FC<ComponentExampleProps> = ({
+    title,
+    description,
+  }) => (
+    <div>
+      <h1>{title}</h1>
+      <p>{description}</p>
+    </div>
+  );
+
+  export { ComponentExample };
+  ```
+
+### Testing 🧪🔬
+
+- For testing best practices, please read this [document](https://kentcdodds.com/blog/common-mistakes-with-react-testing-library).
+- To create a test is necessary to import from the testing library both the render and the screen.
+
+```jsx
+import { render, screen } from "@testing-library/react";
+```
+
+- The component to be tested should also be imported.
+
+```jsx
+import { render, screen } from "@testing-library/react";
+import { ComponentExample } from "./ComponentExample";
+```
+
+- The heading of the tests must be written following the order Given-When-Then [Documentation](https://cucumber.io/docs/gherkin/reference/)
+  - **Given** represents a precondition
+  - **When** an action
+  - **Then** a result or consequence of the action (user acceptance criteria).
+  - **And** a result or consequence of other consequence (user acceptance criteria).
+  - **But** a result which should not be possibly observable
+
+```jsx
+import { render, screen } from "@testing-library/react";
+import { ComponentExample } from "./ComponentExample";
+
+describe("GIVEN <ComponentExample />", () => {
+  describe("WHEN rendered", () => {
+      it("THEN should display the correct text", () => {
+        ...
+      });
+  });
+});
+```
+
+- In this first instance, we will verify the right rendering of the component by checking the text in each of the elements.
+
+```jsx
+import { render, screen } from "@testing-library/react";
+import { ComponentExample } from "./ComponentExample";
+
+describe("GIVEN <ComponentExample />", () => {
+  describe("WHEN rendered", () => {
+    it("THEN should display the correct text", () => {
+      render(<ComponentExample title="title" description="description" />);
+      expect(screen.getByText(/title/i)).toBeInTheDocument();
+      expect(screen.getByText(/description/i)).toBeInTheDocument();
+    });
+  });
+});
+```