@doist/reactist 10.0.0 → 11.2.0

package/lib/new-components/stack/stack.d.ts

@@ -0,0 +1,15 @@
+import type { ResponsiveProp } from '../responsive-props';
+import type { DividerWeight, Space } from '../common-types';
+import type { ReusableBoxProps } from '../box';
+declare type Align = 'start' | 'center' | 'end';
+interface StackProps extends ReusableBoxProps {
+    /** Space between items */
+    space?: ResponsiveProp<Space>;
+    /** Align items horizontally */
+    align?: ResponsiveProp<Align>;
+    /** The weight of the dividers to add. Defaults to 'none', which means no dividers are added */
+    dividers?: DividerWeight;
+}
+declare const Stack: import("../../utils/polymorphism").PolymorphicComponent<"div", StackProps, "obfuscateClassName">;
+export type { StackProps };
+export { Stack };

package/lib/new-components/stack/stack.js

@@ -0,0 +1,2 @@
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var r=require("../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),i=(e(t),require("../../utils/polymorphism.js")),s=require("../responsive-props.js"),a=require("../box/box.js"),l=require("../divider/divider.js"),n=e(require("react-keyed-flatten-children")),o=require("./stack.module.css.js"),u=["as","space","align","dividers","children","exceptionallySetClassName"];exports.Stack=i.polymorphicComponent((function(e,i){var c=e.as,d=e.space,p=e.align,m=void 0===p?"start":p,f=e.dividers,v=void 0===f?"none":f,x=e.children,j=e.exceptionallySetClassName,h=r.objectWithoutPropertiesLoose(e,u),g="start"===m?void 0:{width:"full",flexDirection:"column",display:"flex",alignItems:s.mapResponsiveProp(m,(function(e){return"start"===e?"flexStart":"end"===e?"flexEnd":"center"}))};return t.createElement(a.Box,Object.assign({},h,g,{as:c,className:[j,s.getClassNames(o.default,"space",d)],ref:i}),"none"!==v?t.Children.map(n(x),(function(e,r){return r>0?t.createElement(t.Fragment,null,t.createElement(l.Divider,{weight:v}),e):e})):x)}));
+//# sourceMappingURL=stack.js.map

package/lib/new-components/stack/stack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack.js","sources":["../../../src/new-components/stack/stack.tsx"],"sourcesContent":["import * as React from 'react'\nimport flattenChildren from 'react-keyed-flatten-children'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { getClassNames, mapResponsiveProp } from '../responsive-props'\nimport { Box } from '../box'\nimport { Divider } from '../divider'\n\nimport type { ResponsiveProp } from '../responsive-props'\nimport type { DividerWeight, Space } from '../common-types'\nimport type { BoxProps, ReusableBoxProps } from '../box'\n\nimport styles from './stack.module.css'\n\ntype Align = 'start' | 'center' | 'end'\n\ninterface StackProps extends ReusableBoxProps {\n    /** Space between items */\n    space?: ResponsiveProp<Space>\n    /** Align items horizontally */\n    align?: ResponsiveProp<Align>\n    /** The weight of the dividers to add. Defaults to 'none', which means no dividers are added */\n    dividers?: DividerWeight\n}\n\nconst Stack = polymorphicComponent<'div', StackProps>(function Stack(\n    {\n        as,\n        space,\n        align = 'start',\n        dividers = 'none',\n        children,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    const alignProps: BoxProps | undefined =\n        align === 'start'\n            ? undefined\n            : {\n                  width: 'full',\n                  flexDirection: 'column',\n                  display: 'flex',\n                  alignItems: mapResponsiveProp(align, (align) =>\n                      align === 'start' ? 'flexStart' : align === 'end' ? 'flexEnd' : 'center',\n                  ),\n              }\n\n    return (\n        <Box\n            {...props}\n            {...alignProps}\n            as={as}\n            className={[exceptionallySetClassName, getClassNames(styles, 'space', space)]}\n            ref={ref}\n        >\n            {dividers !== 'none'\n                ? React.Children.map(flattenChildren(children), (child, index) =>\n                      index > 0 ? (\n                          <>\n                              <Divider weight={dividers} />\n                              {child}\n                          </>\n                      ) : (\n                          child\n                      ),\n                  )\n                : children}\n        </Box>\n    )\n})\n\nexport type { StackProps }\nexport { Stack }\n"],"names":["polymorphicComponent","ref","as","space","align","dividers","children","exceptionallySetClassName","props","alignProps","undefined","width","flexDirection","display","alignItems","mapResponsiveProp","React","Box","className","getClassNames","styles","map","flattenChildren","child","index","Divider","weight"],"mappings":"qhBAwBcA,wBAAwC,WAUlDC,OARIC,IAAAA,GACAC,IAAAA,UACAC,MAAAA,aAAQ,cACRC,SAAAA,aAAW,SACXC,IAAAA,SACAC,IAAAA,0BACGC,sCAIDC,EACQ,UAAVL,OACMM,EACA,CACIC,MAAO,OACPC,cAAe,SACfC,QAAS,OACTC,WAAYC,oBAAkBX,GAAO,SAACA,SACxB,UAAVA,EAAoB,YAAwB,QAAVA,EAAkB,UAAY,oBAK9EY,gBAACC,uBACOT,EACAC,GACJP,GAAIA,EACJgB,UAAW,CAACX,EAA2BY,gBAAcC,UAAQ,QAASjB,IACtEF,IAAKA,IAES,SAAbI,EACKW,WAAeK,IAAIC,EAAgBhB,IAAW,SAACiB,EAAOC,UAClDA,EAAQ,EACJR,gCACIA,gBAACS,WAAQC,OAAQrB,IAChBkB,GAGLA,KAGRjB"}

package/lib/new-components/stack/stack.module.css.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={"space-xsmall":"_7b475ead","space-small":"_5641699f","space-medium":"_1a1c63e4","space-large":"_560f80a0","space-xlarge":"_84ffebbc","space-xxlarge":"b60a65cb","tablet-space-xsmall":"d808f5c3","tablet-space-small":"a51c76b3","tablet-space-medium":"_7185a7aa","tablet-space-large":"af82e610","tablet-space-xlarge":"_88b4ff46","tablet-space-xxlarge":"_9de15321","desktop-space-xsmall":"_6fb32d20","desktop-space-small":"_07ee315a","desktop-space-medium":"a270d7ec","desktop-space-large":"ea6ebb29","desktop-space-xlarge":"_35b36178","desktop-space-xxlarge":"_56c7dc23"};
+//# sourceMappingURL=stack.module.css.js.map

package/lib/new-components/stack/stack.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/lib/new-components/stack/stack.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/new-components/switch-field/index.d.ts

@@ -0,0 +1 @@
+export * from './switch-field';

package/lib/new-components/switch-field/switch-field.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { FieldComponentProps } from '../base-field';
+declare type SwitchFieldProps = Omit<FieldComponentProps<HTMLInputElement>, 'type' | 'secondaryLabel' | 'auxiliaryLabel' | 'maxWidth' | 'aria-describedby' | 'aria-label' | 'aria-labelledby'> & {
+    /** Identifies the element (or elements) that describes the switch for assistive technologies. */
+    'aria-describedby'?: string;
+    /** Defines a string value that labels the current switch for assistive technologies. */
+    'aria-label'?: string;
+    /** Identifies the element (or elements) that labels the current switch for assistive technologies. */
+    'aria-labelledby'?: string;
+};
+declare const SwitchField: React.ForwardRefExoticComponent<Pick<SwitchFieldProps, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "title" | "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" | "children" | "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" | "label" | "hint" | "key" | "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "readOnly" | "required" | "size" | "src" | "step" | "value" | "width"> & React.RefAttributes<HTMLInputElement>>;
+export { SwitchField };
+export type { SwitchFieldProps };

package/lib/new-components/switch-field/switch-field.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),l=require("react"),a=require("../box/box.js"),i=require("../stack/stack.js"),d=require("../hidden-visually/hidden-visually.js"),t=require("../text/text.js"),n=require("../common-helpers.js"),r=require("../base-field/base-field.js"),u=require("./switch-field.module.css.js"),s=["label","hint","disabled","hidden","defaultChecked","id","aria-describedby","aria-label","aria-labelledby","onChange"];exports.SwitchField=l.forwardRef((function(c,o){var b,h,f,v=c.label,m=c.hint,p=c.disabled,y=void 0!==p&&p,k=c.hidden,x=c.defaultChecked,g=c.id,j=c["aria-describedby"],q=c["aria-label"],E=c["aria-labelledby"],B=c.onChange,C=e.objectWithoutPropertiesLoose(c,s),S=n.useId(g),w=n.useId(),N=null!=j?j:m?w:void 0,P=null!=q?q:void 0,_=null!=E?E:void 0,F=l.useState(!1),H=F[0],I=F[1],K=l.useState(null!==(b=null!==(h=C.checked)&&void 0!==h?h:x)&&void 0!==b&&b),O=K[1],R=null!==(f=C.checked)&&void 0!==f?f:K[0];return l.createElement(i.Stack,{space:"small",hidden:k},l.createElement(a.Box,{className:[u.default.container,y?u.default.disabled:null,R?u.default.checked:null,H?u.default.keyFocused:null],as:"label",display:"flex",alignItems:"center"},l.createElement(a.Box,{position:"relative",display:"inlineBlock",overflow:"visible",marginRight:"small",flexShrink:0,className:u.default.toggle},l.createElement(d.HiddenVisually,null,l.createElement("input",Object.assign({},C,{id:S,type:"checkbox",disabled:y,"aria-describedby":N,"aria-label":P,"aria-labelledby":_,ref:o,checked:R,onChange:function(e){null==B||B(e),e.defaultPrevented||O(e.currentTarget.checked)},onBlur:function(e){var l;I(!1),null==C||null===(l=C.onBlur)||void 0===l||l.call(C,e)},onKeyUp:function(e){var l;I(!0),null==C||null===(l=C.onKeyUp)||void 0===l||l.call(C,e)}}))),l.createElement("span",{className:u.default.handle})),l.createElement(t.Text,{exceptionallySetClassName:u.default.label},v)),m?l.createElement(r.FieldHint,{id:w},m):null)}));
+//# sourceMappingURL=switch-field.js.map

package/lib/new-components/switch-field/switch-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch-field.js","sources":["../../../src/new-components/switch-field/switch-field.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Box } from '../box'\nimport { Stack } from '../stack'\nimport { Text } from '../text'\nimport { HiddenVisually } from '../hidden-visually'\nimport { FieldComponentProps, FieldHint } from '../base-field'\nimport { useId } from '../common-helpers'\nimport styles from './switch-field.module.css'\n\ntype SwitchFieldProps = Omit<\n    FieldComponentProps<HTMLInputElement>,\n    | 'type'\n    | 'secondaryLabel'\n    | 'auxiliaryLabel'\n    | 'maxWidth'\n    | 'aria-describedby'\n    | 'aria-label'\n    | 'aria-labelledby'\n> & {\n    /** Identifies the element (or elements) that describes the switch for assistive technologies. */\n    'aria-describedby'?: string\n    /** Defines a string value that labels the current switch for assistive technologies. */\n    'aria-label'?: string\n    /** Identifies the element (or elements) that labels the current switch for assistive technologies. */\n    'aria-labelledby'?: string\n}\n\nconst SwitchField = React.forwardRef<HTMLInputElement, SwitchFieldProps>(function SwitchField(\n    {\n        label,\n        hint,\n        disabled = false,\n        hidden,\n        defaultChecked,\n        id: originalId,\n        'aria-describedby': originalAriaDescribedBy,\n        'aria-label': originalAriaLabel,\n        'aria-labelledby': originalAriaLabelledby,\n        onChange,\n        ...props\n    },\n    ref,\n) {\n    const id = useId(originalId)\n    const hintId = useId()\n\n    const ariaDescribedBy = originalAriaDescribedBy ?? (hint ? hintId : undefined)\n    const ariaLabel = originalAriaLabel ?? undefined\n    const ariaLabelledBy = originalAriaLabelledby ?? undefined\n\n    const [keyFocused, setKeyFocused] = React.useState(false)\n    const [checkedState, setChecked] = React.useState(props.checked ?? defaultChecked ?? false)\n    const isChecked = props.checked ?? checkedState\n\n    return (\n        <Stack space=\"small\" hidden={hidden}>\n            <Box\n                className={[\n                    styles.container,\n                    disabled ? styles.disabled : null,\n                    isChecked ? styles.checked : null,\n                    keyFocused ? styles.keyFocused : null,\n                ]}\n                as=\"label\"\n                display=\"flex\"\n                alignItems=\"center\"\n            >\n                <Box\n                    position=\"relative\"\n                    display=\"inlineBlock\"\n                    overflow=\"visible\"\n                    marginRight=\"small\"\n                    flexShrink={0}\n                    className={styles.toggle}\n                >\n                    <HiddenVisually>\n                        <input\n                            {...props}\n                            id={id}\n                            type=\"checkbox\"\n                            disabled={disabled}\n                            aria-describedby={ariaDescribedBy}\n                            aria-label={ariaLabel}\n                            aria-labelledby={ariaLabelledBy}\n                            ref={ref}\n                            checked={isChecked}\n                            onChange={(event) => {\n                                onChange?.(event)\n                                if (!event.defaultPrevented) {\n                                    setChecked(event.currentTarget.checked)\n                                }\n                            }}\n                            onBlur={(event) => {\n                                setKeyFocused(false)\n                                props?.onBlur?.(event)\n                            }}\n                            onKeyUp={(event) => {\n                                setKeyFocused(true)\n                                props?.onKeyUp?.(event)\n                            }}\n                        />\n                    </HiddenVisually>\n                    <span className={styles.handle} />\n                </Box>\n                <Text exceptionallySetClassName={styles.label}>{label}</Text>\n            </Box>\n            {hint ? <FieldHint id={hintId}>{hint}</FieldHint> : null}\n        </Stack>\n    )\n})\n\nexport { SwitchField }\nexport type { SwitchFieldProps }\n"],"names":["React","ref","label","hint","disabled","hidden","defaultChecked","originalId","id","originalAriaDescribedBy","originalAriaLabel","originalAriaLabelledby","onChange","props","useId","hintId","ariaDescribedBy","undefined","ariaLabel","ariaLabelledBy","keyFocused","setKeyFocused","checked","setChecked","isChecked","Stack","space","Box","className","styles","container","as","display","alignItems","position","overflow","marginRight","flexShrink","toggle","HiddenVisually","type","event","defaultPrevented","currentTarget","onBlur","onKeyUp","handle","Text","exceptionallySetClassName","FieldHint"],"mappings":"iiBA2BoBA,cAAqD,WAcrEC,aAZIC,IAAAA,MACAC,IAAAA,SACAC,SAAAA,gBACAC,IAAAA,OACAC,IAAAA,eACIC,IAAJC,GACoBC,IAApB,oBACcC,IAAd,cACmBC,IAAnB,mBACAC,IAAAA,SACGC,sCAIDL,EAAKM,QAAMP,GACXQ,EAASD,UAETE,EAAkBP,MAAAA,EAAAA,EAA4BN,EAAOY,OAASE,EAC9DC,EAAYR,MAAAA,EAAAA,OAAqBO,EACjCE,EAAiBR,MAAAA,EAAAA,OAA0BM,IAEbjB,YAAe,GAA5CoB,OAAYC,SACgBrB,+BAAea,EAAMS,uBAAWhB,mBAA9CiB,OACfC,YAAYX,EAAMS,mCAGpBtB,gBAACyB,SAAMC,MAAM,QAAQrB,OAAQA,GACzBL,gBAAC2B,OACGC,UAAW,CACPC,UAAOC,UACP1B,EAAWyB,UAAOzB,SAAW,KAC7BoB,EAAYK,UAAOP,QAAU,KAC7BF,EAAaS,UAAOT,WAAa,MAErCW,GAAG,QACHC,QAAQ,OACRC,WAAW,UAEXjC,gBAAC2B,OACGO,SAAS,WACTF,QAAQ,cACRG,SAAS,UACTC,YAAY,QACZC,WAAY,EACZT,UAAWC,UAAOS,QAElBtC,gBAACuC,sBACGvC,yCACQa,GACJL,GAAIA,EACJgC,KAAK,WACLpC,SAAUA,qBACQY,eACNE,oBACKC,EACjBlB,IAAKA,EACLqB,QAASE,EACTZ,SAAU,SAAC6B,GACP7B,MAAAA,GAAAA,EAAW6B,GACNA,EAAMC,kBACPnB,EAAWkB,EAAME,cAAcrB,UAGvCsB,OAAQ,SAACH,SACLpB,GAAc,GACdR,MAAAA,aAAAA,EAAO+B,4BAAP/B,EAAgB4B,IAEpBI,QAAS,SAACJ,SACNpB,GAAc,GACdR,MAAAA,aAAAA,EAAOgC,6BAAPhC,EAAiB4B,QAI7BzC,wBAAM4B,UAAWC,UAAOiB,UAE5B9C,gBAAC+C,QAAKC,0BAA2BnB,UAAO3B,OAAQA,IAEnDC,EAAOH,gBAACiD,aAAUzC,GAAIO,GAASZ,GAAoB"}

package/lib/new-components/switch-field/switch-field.module.css.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={container:"ec63c3f1",disabled:"_7de9c06d",checked:"a37981fc",toggle:"_2a17ac45",label:"_68cc9707",handle:"_91409c7f",keyFocused:"a6490371"};
+//# sourceMappingURL=switch-field.module.css.js.map

package/lib/new-components/switch-field/switch-field.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch-field.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/lib/new-components/switch-field/switch-field.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/new-components/tabs/index.d.ts

@@ -0,0 +1 @@
+export * from './tabs';

package/lib/new-components/tabs/tabs.d.ts

@@ -0,0 +1,92 @@
+import * as React from 'react';
+import type { ResponsiveProp } from '../responsive-props';
+import type { Space } from '../common-types';
+declare type TabsProps = {
+    /** The `<Tabs>` component must be composed from a `<TabList>` and corresponding `<TabPanel>` components */
+    children: React.ReactNode;
+    /**
+     * Determines the primary colour of the tabs
+     */
+    color?: 'primary' | 'secondary' | 'tertiary';
+    /**
+     * Determines the style of the tabs
+     */
+    variant?: 'normal' | 'plain';
+    /**
+     * The id of the selected tab
+     */
+    selectedId?: string | null;
+};
+/**
+ * Used to group components that compose a set of tabs. There can only be one active tab within the same `<Tabs>` group.
+ */
+export declare function Tabs({ children, selectedId, color, variant, }: TabsProps): React.ReactElement;
+declare type TabProps = {
+    /** The content to render inside of the tab button */
+    children: React.ReactNode;
+    /** The tab's identifier. This must match its corresponding `<TabPanel>`'s id */
+    id: string;
+};
+/**
+ * Represents the individual tab elements within the group. Each `<Tab>` must have a corresponding `<TabPanel>` component.
+ */
+export declare function Tab({ children, id }: TabProps): React.ReactElement | null;
+declare type TabListProps = ({
+    /** Labels the tab list for assistive technologies. This must be provided if `aria-labelledby` is omitted. */
+    'aria-label': string;
+} | {
+    /**
+     * One or more element IDs used to label the tab list for assistive technologies. Required if
+     * `aria-label` is omitted.
+     */
+    'aria-labelledby': string;
+} | {
+    /**
+     * For cases where multiple instances of the tab list exists, the duplicates may be marked as aria-hidden
+     */
+    'aria-hidden': boolean;
+}) & {
+    /**
+     * A list of `<Tab>` elements
+     */
+    children: React.ReactNode;
+    /**
+     * Controls the spacing between tabs
+     */
+    space?: ResponsiveProp<Space>;
+};
+/**
+ * A component used to group `<Tab>` elements together.
+ */
+export declare function TabList({ children, space, ...props }: TabListProps): React.ReactElement | null;
+declare type TabPanelProps = {
+    /** The content to be rendered inside the tab */
+    children: React.ReactNode;
+    /** The tabPanel's identifier. This must match its corresponding `<Tab>`'s id */
+    id: string;
+    /**
+     * By default, the tab panel's content is always rendered even when they are not active. This behaviour can be changed to
+     * 'active', which renders only when the tab is active, and 'lazy', meaning while inactive tab panels will not be rendered
+     * initially, they will remain mounted once they are active until the entire Tabs tree is unmounted.
+     */
+    render?: 'always' | 'active' | 'lazy';
+};
+/**
+ * Used to define the content to be rendered when a tab is active. Each `<TabPanel>` must have a corresponding `<Tab>` component.
+ */
+export declare const TabPanel: import("../../utils/polymorphism").PolymorphicComponent<"div", TabPanelProps, "omitClassName">;
+declare type TabAwareSlotProps = {
+    /**
+     * Render prop used to provide the content to be rendered inside the slot. The render prop will be
+     * called with the current `selectedId`
+     */
+    children: (provided: {
+        selectedId?: string | null;
+    }) => React.ReactElement | null;
+};
+/**
+ * Allows content to be rendered based on the current tab being selected while outside of the TabPanel
+ * component. Can be placed freely within the main `<Tabs>` component.
+ */
+export declare function TabAwareSlot({ children }: TabAwareSlotProps): React.ReactElement | null;
+export {};

package/lib/new-components/tabs/tabs.js

@@ -0,0 +1,2 @@
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),o=(e(r),e(require("classnames"))),a=require("../../utils/polymorphism.js"),n=require("../inline/inline.js"),i=require("reakit/Tab"),l=require("../../hooks/use-previous/use-previous.js"),s=require("./tabs.module.css.js"),u=["color","variant"],c=["children","space"],d=["color","variant"],v=["children","id","as","render"],b=["color","variant"],p=r.createContext(null),f=a.polymorphicComponent((function(e,o){var a=e.children,n=e.id,l=e.as,s=e.render,u=void 0===s?"always":s,c=t.objectWithoutPropertiesLoose(e,v),d=r.useContext(p),f=r.useState(!1),j=f[0],m=f[1],h=(null==d?void 0:d.selectedId)===n;if(r.useEffect((function(){!j&&h&&m(!0)}),[j,h]),!d)return null;var x=t.objectWithoutPropertiesLoose(d,b);return r.createElement(i.TabPanel,Object.assign({tabId:n},x,c,{as:l,ref:o}),"always"===u?a:null,"active"===u&&h?a:null,"lazy"===u&&(h||j)?a:null)}));exports.Tab=function(e){var a=e.children,n=e.id,l=r.useContext(p);if(!l)return null;var c=l.color,d=l.variant,v=t.objectWithoutPropertiesLoose(l,u);return r.createElement(i.Tab,Object.assign({className:o(s.default.tab,s.default["tab-"+(null!=d?d:"")],s.default["tab-"+(null!=c?c:"")]),id:n},v),a)},exports.TabAwareSlot=function(e){var t=e.children,o=r.useContext(p);return o?t({selectedId:o.selectedId}):null},exports.TabList=function(e){var o=e.children,a=e.space,l=void 0===a?"medium":a,s=t.objectWithoutPropertiesLoose(e,c),u=r.useContext(p);if(!u)return null;var v=t.objectWithoutPropertiesLoose(u,d);return r.createElement(i.TabList,Object.assign({},s,v),r.createElement(n.Inline,{space:l},o))},exports.TabPanel=f,exports.Tabs=function(e){var o=e.children,a=e.selectedId,n=e.color,s=void 0===n?"primary":n,u=e.variant,c=void 0===u?"normal":u,d=i.useTabState({selectedId:a}),v=l.usePrevious(a),b=d.selectedId,f=d.select;r.useEffect((function(){v!==a&&a!==b&&void 0!==a&&f(a)}),[a,b,f,v]);var j=r.useMemo((function(){return t.objectSpread2(t.objectSpread2({},d),{},{color:s,variant:c})}),[s,c].concat(Object.values(d)));return r.createElement(p.Provider,{value:j},o)};
+//# sourceMappingURL=tabs.js.map

package/lib/new-components/tabs/tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.js","sources":["../../../src/new-components/tabs/tabs.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport {\n    useTabState,\n    Tab as BaseTab,\n    TabList as BaseTabList,\n    TabPanel as BaseTabPanel,\n    TabStateReturn,\n} from 'reakit/Tab'\nimport { Inline } from '../inline'\nimport { usePrevious } from '../../hooks/use-previous'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport type { ResponsiveProp } from '../responsive-props'\nimport type { Space } from '../common-types'\n\nimport styles from './tabs.module.css'\n\nconst TabsContext = React.createContext<\n    (TabStateReturn & Omit<TabsProps, 'children' | 'selectedId'>) | null\n>(null)\n\ntype TabsProps = {\n    /** The `<Tabs>` component must be composed from a `<TabList>` and corresponding `<TabPanel>` components */\n    children: React.ReactNode\n    /**\n     * Determines the primary colour of the tabs\n     */\n    color?: 'primary' | 'secondary' | 'tertiary'\n    /**\n     * Determines the style of the tabs\n     */\n    variant?: 'normal' | 'plain'\n    /**\n     * The id of the selected tab\n     */\n    selectedId?: string | null\n}\n\n/**\n * Used to group components that compose a set of tabs. There can only be one active tab within the same `<Tabs>` group.\n */\nexport function Tabs({\n    children,\n    selectedId,\n    color = 'primary',\n    variant = 'normal',\n}: TabsProps): React.ReactElement {\n    const tabState = useTabState({ selectedId })\n    const previousSelectedId = usePrevious(selectedId)\n    const { selectedId: actualSelectedId, select } = tabState\n\n    React.useEffect(\n        function selectTab() {\n            if (\n                previousSelectedId !== selectedId &&\n                selectedId !== actualSelectedId &&\n                selectedId !== undefined\n            ) {\n                select(selectedId)\n            }\n        },\n        [selectedId, actualSelectedId, select, previousSelectedId],\n    )\n\n    const memoizedTabState = React.useMemo(\n        function memoizeTabState() {\n            return {\n                ...tabState,\n                color,\n                variant,\n            }\n        },\n        // There is no guarantee that useTabState returns a stable object when there are no changes, so\n        // following reakit/Tab's example we only return a new objet when any of its values have changed\n        // eslint-disable-next-line\n        [color, variant, ...Object.values(tabState)],\n    )\n\n    return <TabsContext.Provider value={memoizedTabState}>{children}</TabsContext.Provider>\n}\n\ntype TabProps = {\n    /** The content to render inside of the tab button */\n    children: React.ReactNode\n\n    /** The tab's identifier. This must match its corresponding `<TabPanel>`'s id */\n    id: string\n}\n\n/**\n * Represents the individual tab elements within the group. Each `<Tab>` must have a corresponding `<TabPanel>` component.\n */\nexport function Tab({ children, id }: TabProps): React.ReactElement | null {\n    const tabContextValue = React.useContext(TabsContext)\n\n    if (!tabContextValue) {\n        return null\n    }\n\n    const { color, variant, ...tabState } = tabContextValue\n\n    return (\n        <BaseTab\n            className={classNames(\n                styles.tab,\n                styles[`tab-${variant ?? ''}`],\n                styles[`tab-${color ?? ''}`],\n            )}\n            id={id}\n            {...tabState}\n        >\n            {children}\n        </BaseTab>\n    )\n}\n\ntype TabListProps = (\n    | {\n          /** Labels the tab list for assistive technologies. This must be provided if `aria-labelledby` is omitted. */\n          'aria-label': string\n      }\n    | {\n          /**\n           * One or more element IDs used to label the tab list for assistive technologies. Required if\n           * `aria-label` is omitted.\n           */\n          'aria-labelledby': string\n      }\n    | {\n          /**\n           * For cases where multiple instances of the tab list exists, the duplicates may be marked as aria-hidden\n           */\n          'aria-hidden': boolean\n      }\n) & {\n    /**\n     * A list of `<Tab>` elements\n     */\n    children: React.ReactNode\n\n    /**\n     * Controls the spacing between tabs\n     */\n    space?: ResponsiveProp<Space>\n}\n\n/**\n * A component used to group `<Tab>` elements together.\n */\nexport function TabList({\n    children,\n    space = 'medium',\n    ...props\n}: TabListProps): React.ReactElement | null {\n    const tabContextValue = React.useContext(TabsContext)\n\n    if (!tabContextValue) {\n        return null\n    }\n\n    const { color, variant, ...tabState } = tabContextValue\n\n    return (\n        <BaseTabList {...props} {...tabState}>\n            <Inline space={space}>{children}</Inline>\n        </BaseTabList>\n    )\n}\n\ntype TabPanelProps = {\n    /** The content to be rendered inside the tab */\n    children: React.ReactNode\n\n    /** The tabPanel's identifier. This must match its corresponding `<Tab>`'s id */\n    id: string\n\n    /**\n     * By default, the tab panel's content is always rendered even when they are not active. This behaviour can be changed to\n     * 'active', which renders only when the tab is active, and 'lazy', meaning while inactive tab panels will not be rendered\n     * initially, they will remain mounted once they are active until the entire Tabs tree is unmounted.\n     */\n    render?: 'always' | 'active' | 'lazy'\n}\n\n/**\n * Used to define the content to be rendered when a tab is active. Each `<TabPanel>` must have a corresponding `<Tab>` component.\n */\nexport const TabPanel = polymorphicComponent<'div', TabPanelProps, 'omitClassName'>(\n    function TabPanel(\n        { children, id, as, render = 'always', ...props },\n        ref,\n    ): React.ReactElement | null {\n        const tabContextValue = React.useContext(TabsContext)\n        const [tabRendered, setTabRendered] = React.useState(false)\n        const tabIsActive = tabContextValue?.selectedId === id\n\n        React.useEffect(\n            function trackTabRenderedState() {\n                if (!tabRendered && tabIsActive) {\n                    setTabRendered(true)\n                }\n            },\n            [tabRendered, tabIsActive],\n        )\n\n        if (!tabContextValue) {\n            return null\n        }\n\n        const { color, variant, ...tabState } = tabContextValue\n\n        return (\n            <BaseTabPanel tabId={id} {...tabState} {...props} as={as} ref={ref}>\n                {render === 'always' ? children : null}\n                {render === 'active' && tabIsActive ? children : null}\n                {render === 'lazy' && (tabIsActive || tabRendered) ? children : null}\n            </BaseTabPanel>\n        )\n    },\n)\n\ntype TabAwareSlotProps = {\n    /**\n     * Render prop used to provide the content to be rendered inside the slot. The render prop will be\n     * called with the current `selectedId`\n     */\n    children: (provided: { selectedId?: string | null }) => React.ReactElement | null\n}\n\n/**\n * Allows content to be rendered based on the current tab being selected while outside of the TabPanel\n * component. Can be placed freely within the main `<Tabs>` component.\n */\nexport function TabAwareSlot({ children }: TabAwareSlotProps): React.ReactElement | null {\n    const tabContextValue = React.useContext(TabsContext)\n\n    return tabContextValue ? children({ selectedId: tabContextValue.selectedId }) : null\n}\n"],"names":["TabsContext","React","TabPanel","polymorphicComponent","ref","children","id","as","render","props","tabContextValue","tabRendered","setTabRendered","tabIsActive","selectedId","tabState","BaseTabPanel","tabId","color","variant","BaseTab","className","classNames","styles","tab","space","BaseTabList","Inline","useTabState","previousSelectedId","usePrevious","actualSelectedId","select","undefined","memoizedTabState","Object","values","Provider","value"],"mappings":"ijBAiBMA,EAAcC,gBAElB,MAwKWC,EAAWC,wBACpB,WAEIC,OADEC,IAAAA,SAAUC,IAAAA,GAAIC,IAAAA,OAAIC,OAAAA,aAAS,WAAaC,sCAGpCC,EAAkBT,aAAiBD,KACHC,YAAe,GAA9CU,OAAaC,OACdC,GAAcH,MAAAA,SAAAA,EAAiBI,cAAeR,KAEpDL,aACI,YACSU,GAAeE,GAChBD,GAAe,KAGvB,CAACD,EAAaE,KAGbH,SACM,SAGgBK,iCAAaL,YAGpCT,gBAACe,0BAAaC,MAAOX,GAAQS,EAAcN,GAAOF,GAAIA,EAAIH,IAAKA,IAC/C,WAAXI,EAAsBH,EAAW,KACtB,WAAXG,GAAuBK,EAAcR,EAAW,KACrC,SAAXG,IAAsBK,GAAeF,GAAeN,EAAW,qCA3H1DA,IAAAA,SAAUC,IAAAA,GACtBI,EAAkBT,aAAiBD,OAEpCU,SACM,SAGHQ,EAAgCR,EAAhCQ,MAAOC,EAAyBT,EAAzBS,QAAYJ,iCAAaL,YAGpCT,gBAACmB,qBACGC,UAAWC,EACPC,UAAOC,IACPD,kBAAcJ,MAAAA,EAAAA,EAAW,KACzBI,kBAAcL,MAAAA,EAAAA,EAAS,MAE3BZ,GAAIA,GACAS,GAEHV,yCA0HkBA,IAAAA,SACrBK,EAAkBT,aAAiBD,UAElCU,EAAkBL,EAAS,CAAES,WAAYJ,EAAgBI,aAAgB,sCAtFhFT,IAAAA,aACAoB,MAAAA,aAAQ,WACLhB,sCAEGC,EAAkBT,aAAiBD,OAEpCU,SACM,SAGgBK,iCAAaL,YAGpCT,gBAACyB,2BAAgBjB,EAAWM,GACxBd,gBAAC0B,UAAOF,MAAOA,GAAQpB,qDA1H/BA,IAAAA,SACAS,IAAAA,eACAI,MAAAA,aAAQ,gBACRC,QAAAA,aAAU,WAEJJ,EAAWa,cAAY,CAAEd,WAAAA,IACzBe,EAAqBC,cAAYhB,GACnBiB,EAA6BhB,EAAzCD,WAA8BkB,EAAWjB,EAAXiB,OAEtC/B,aACI,WAEQ4B,IAAuBf,GACvBA,IAAeiB,QACAE,IAAfnB,GAEAkB,EAAOlB,KAGf,CAACA,EAAYiB,EAAkBC,EAAQH,QAGrCK,EAAmBjC,WACrB,qDAEWc,OACHG,MAAAA,EACAC,QAAAA,OAMPD,EAAOC,UAAYgB,OAAOC,OAAOrB,YAG/Bd,gBAACD,EAAYqC,UAASC,MAAOJ,GAAmB7B"}

package/lib/new-components/tabs/tabs.module.css.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={tab:"d7928f1c","tab-normal":"_5d8e72b3","tab-primary":"_8a23756d","tab-secondary":"_88fd4c95","tab-tertiary":"_40c4cce9","tab-plain":"_13722523"};
+//# sourceMappingURL=tabs.module.css.js.map

package/lib/new-components/tabs/tabs.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/lib/new-components/tabs/tabs.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/new-components/test-helpers.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { ResponsiveProp } from './responsive-props';
+import { Space } from './common-types';
+declare type PropsWithSpace = {
+    space?: ResponsiveProp<Space>;
+    'data-testid'?: string;
+};
+declare function runSpaceTests<Props extends PropsWithSpace>(Component: React.ComponentType<Props>): void;
+export { runSpaceTests };

package/lib/new-components/text/index.d.ts

@@ -0,0 +1 @@
+export * from './text';

package/lib/new-components/text/text.d.ts

@@ -0,0 +1,47 @@
+import * as React from 'react';
+import type { Tone } from '../common-types';
+import type { BoxProps } from '../box';
+declare type TextProps = {
+    children: React.ReactNode;
+    /**
+     * The size of the text.
+     *
+     * The supported values, from smaller size to larger size, are:
+     * 'caption', 'copy', 'body', and 'subtitle'
+     *
+     * @default 'body'
+     */
+    size?: 'caption' | 'copy' | 'body' | 'subtitle';
+    /**
+     * The weight of the text font.
+     *
+     * @default 'regular'
+     */
+    weight?: 'regular' | 'semibold' | 'bold';
+    /**
+     * The tone (semantic color) of the text.
+     *
+     * @default 'normal'
+     */
+    tone?: Tone;
+    /**
+     * Used to truncate the text to a given number of lines.
+     *
+     * It will add an ellipsis (`…`) to the text at the end of the last line, only if the text was
+     * truncated. If the text fits without it being truncated, no ellipsis is added.
+     *
+     * By default, the text is not truncated at all, no matter how many lines it takes to render it.
+     *
+     * @default undefined
+     */
+    lineClamp?: 1 | 2 | 3 | 4 | 5 | '1' | '2' | '3' | '4' | '5';
+    /**
+     * How to align the text horizontally.
+     *
+     * @default 'start'
+     */
+    align?: BoxProps['textAlign'];
+};
+declare const Text: import("../../utils/polymorphism").PolymorphicComponent<"div", TextProps, "obfuscateClassName">;
+export type { TextProps };
+export { Text };

package/lib/new-components/text/text.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),l=require("react"),t=require("../../utils/polymorphism.js"),s=require("../responsive-props.js"),a=require("../box/box.js"),i=require("./text.module.css.js"),r=["as","size","weight","tone","align","children","lineClamp","exceptionallySetClassName"];exports.Text=t.polymorphicComponent((function(t,o){var n=t.as,u=t.size,p=void 0===u?"body":u,m=t.weight,d=void 0===m?"regular":m,g=t.tone,c=void 0===g?"normal":g,x=t.align,C=t.children,f=t.lineClamp,b=t.exceptionallySetClassName,h=e.objectWithoutPropertiesLoose(t,r),v="string"==typeof f?Number(f)>1:(null!=f?f:1)>1;return l.createElement(a.Box,Object.assign({},h,{as:n,className:[b,i.default.text,"body"!==p?s.getClassNames(i.default,"size",p):null,"regular"!==d?s.getClassNames(i.default,"weight",d):null,"normal"!==c?s.getClassNames(i.default,"tone",c):null,v?i.default.lineClampMultipleLines:null,f?s.getClassNames(i.default,"lineClamp",f.toString()):null],textAlign:x,paddingRight:f?"xsmall":void 0,ref:o}),C)}));
+//# sourceMappingURL=text.js.map

package/lib/new-components/text/text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.js","sources":["../../../src/new-components/text/text.tsx"],"sourcesContent":["import * as React from 'react'\nimport { getClassNames } from '../responsive-props'\nimport { Box } from '../box'\nimport { polymorphicComponent } from '../../utils/polymorphism'\n\nimport type { Tone } from '../common-types'\nimport type { BoxProps } from '../box'\n\nimport styles from './text.module.css'\n\ntype TextProps = {\n    children: React.ReactNode\n    /**\n     * The size of the text.\n     *\n     * The supported values, from smaller size to larger size, are:\n     * 'caption', 'copy', 'body', and 'subtitle'\n     *\n     * @default 'body'\n     */\n    size?: 'caption' | 'copy' | 'body' | 'subtitle'\n    /**\n     * The weight of the text font.\n     *\n     * @default 'regular'\n     */\n    weight?: 'regular' | 'semibold' | 'bold'\n    /**\n     * The tone (semantic color) of the text.\n     *\n     * @default 'normal'\n     */\n    tone?: Tone\n    /**\n     * Used to truncate the text to a given number of lines.\n     *\n     * It will add an ellipsis (`…`) to the text at the end of the last line, only if the text was\n     * truncated. If the text fits without it being truncated, no ellipsis is added.\n     *\n     * By default, the text is not truncated at all, no matter how many lines it takes to render it.\n     *\n     * @default undefined\n     */\n    lineClamp?: 1 | 2 | 3 | 4 | 5 | '1' | '2' | '3' | '4' | '5'\n    /**\n     * How to align the text horizontally.\n     *\n     * @default 'start'\n     */\n    align?: BoxProps['textAlign']\n}\n\nconst Text = polymorphicComponent<'div', TextProps>(function Text(\n    {\n        as,\n        size = 'body',\n        weight = 'regular',\n        tone = 'normal',\n        align,\n        children,\n        lineClamp,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    const lineClampMultipleLines =\n        typeof lineClamp === 'string' ? Number(lineClamp) > 1 : (lineClamp ?? 1) > 1\n\n    return (\n        <Box\n            {...props}\n            as={as}\n            className={[\n                exceptionallySetClassName,\n                styles.text,\n                size !== 'body' ? getClassNames(styles, 'size', size) : null,\n                weight !== 'regular' ? getClassNames(styles, 'weight', weight) : null,\n                tone !== 'normal' ? getClassNames(styles, 'tone', tone) : null,\n                lineClampMultipleLines ? styles.lineClampMultipleLines : null,\n                lineClamp ? getClassNames(styles, 'lineClamp', lineClamp.toString()) : null,\n            ]}\n            textAlign={align}\n            // Prevents emojis from being cut-off\n            // See https://github.com/Doist/reactist/pull/528\n            paddingRight={lineClamp ? 'xsmall' : undefined}\n            ref={ref}\n        >\n            {children}\n        </Box>\n    )\n})\n\nexport type { TextProps }\nexport { Text }\n"],"names":["polymorphicComponent","ref","as","size","weight","tone","align","children","lineClamp","exceptionallySetClassName","props","lineClampMultipleLines","Number","React","Box","className","styles","text","getClassNames","toString","textAlign","paddingRight","undefined"],"mappings":"sYAoDaA,wBAAuC,WAYhDC,OAVIC,IAAAA,OACAC,KAAAA,aAAO,aACPC,OAAAA,aAAS,gBACTC,KAAAA,aAAO,WACPC,IAAAA,MACAC,IAAAA,SACAC,IAAAA,UACAC,IAAAA,0BACGC,sCAIDC,EACmB,iBAAdH,EAAyBI,OAAOJ,GAAa,GAAKA,MAAAA,EAAAA,EAAa,GAAK,SAG3EK,gBAACC,uBACOJ,GACJR,GAAIA,EACJa,UAAW,CACPN,EACAO,UAAOC,KACE,SAATd,EAAkBe,gBAAcF,UAAQ,OAAQb,GAAQ,KAC7C,YAAXC,EAAuBc,gBAAcF,UAAQ,SAAUZ,GAAU,KACxD,WAATC,EAAoBa,gBAAcF,UAAQ,OAAQX,GAAQ,KAC1DM,EAAyBK,UAAOL,uBAAyB,KACzDH,EAAYU,gBAAcF,UAAQ,YAAaR,EAAUW,YAAc,MAE3EC,UAAWd,EAGXe,aAAcb,EAAY,cAAWc,EACrCrB,IAAKA,IAEJM"}

package/lib/new-components/text/text.module.css.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={text:"c5028ea8","size-caption":"_05d3a546","size-copy":"_100565e3","size-subtitle":"b8f72625","weight-semibold":"_398ecda1","weight-bold":"_8054cd6b","tone-secondary":"_6abd56b1","tone-danger":"_274b4a47",lineClampMultipleLines:"_724b0054","lineClamp-1":"_51ac6ee4","lineClamp-2":"b0742803","lineClamp-3":"dd664c95","lineClamp-4":"b02775b5","lineClamp-5":"da91b300"};
+//# sourceMappingURL=text.module.css.js.map

package/lib/new-components/text/text.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/lib/new-components/text/text.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/new-components/text-area/index.d.ts

@@ -0,0 +1 @@
+export * from './text-area';

package/lib/new-components/text-area/text-area.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { FieldComponentProps } from '../base-field';
+declare type TextAreaProps = FieldComponentProps<HTMLTextAreaElement> & {
+    rows?: number;
+};
+declare function TextArea({ id, label, secondaryLabel, auxiliaryLabel, hint, maxWidth, ...props }: TextAreaProps): JSX.Element;
+export { TextArea };
+export type { TextAreaProps };

package/lib/new-components/text-area/text-area.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),a=require("react"),r=require("../box/box.js"),t=require("../base-field/base-field.js"),i=require("./text-area.module.css.js"),l=["id","label","secondaryLabel","auxiliaryLabel","hint","maxWidth"];exports.TextArea=function(s){var u=s.id,n=s.label,o=s.secondaryLabel,b=s.auxiliaryLabel,d=s.hint,c=s.maxWidth,x=e.objectWithoutPropertiesLoose(s,l);return a.createElement(t.BaseField,{id:u,label:n,secondaryLabel:o,auxiliaryLabel:b,hint:d,className:i.default.container,maxWidth:c},(function(e){return a.createElement(r.Box,{width:"full"},a.createElement("textarea",Object.assign({},x,e)))}))};
+//# sourceMappingURL=text-area.js.map

package/lib/new-components/text-area/text-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-area.js","sources":["../../../src/new-components/text-area/text-area.tsx"],"sourcesContent":["import * as React from 'react'\nimport { BaseField, FieldComponentProps } from '../base-field'\nimport { Box } from '../box'\nimport styles from './text-area.module.css'\n\ntype TextAreaProps = FieldComponentProps<HTMLTextAreaElement> & {\n    rows?: number\n}\n\nfunction TextArea({\n    id,\n    label,\n    secondaryLabel,\n    auxiliaryLabel,\n    hint,\n    maxWidth,\n    ...props\n}: TextAreaProps) {\n    return (\n        <BaseField\n            id={id}\n            label={label}\n            secondaryLabel={secondaryLabel}\n            auxiliaryLabel={auxiliaryLabel}\n            hint={hint}\n            className={styles.container}\n            maxWidth={maxWidth}\n        >\n            {(extraProps) => (\n                <Box width=\"full\">\n                    <textarea {...props} {...extraProps} />\n                </Box>\n            )}\n        </BaseField>\n    )\n}\n\nexport { TextArea }\nexport type { TextAreaProps }\n"],"names":["id","label","secondaryLabel","auxiliaryLabel","hint","maxWidth","props","React","BaseField","className","styles","container","extraProps","Box","width"],"mappings":"qVASA,gBACIA,IAAAA,GACAC,IAAAA,MACAC,IAAAA,eACAC,IAAAA,eACAC,IAAAA,KACAC,IAAAA,SACGC,6CAGCC,gBAACC,aACGR,GAAIA,EACJC,MAAOA,EACPC,eAAgBA,EAChBC,eAAgBA,EAChBC,KAAMA,EACNK,UAAWC,UAAOC,UAClBN,SAAUA,IAET,SAACO,UACEL,gBAACM,OAAIC,MAAM,QACPP,4CAAcD,EAAWM"}

package/lib/new-components/text-area/text-area.module.css.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={container:"_5a579f96"};
+//# sourceMappingURL=text-area.module.css.js.map

package/lib/new-components/text-area/text-area.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-area.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/lib/new-components/text-field/index.d.ts

@@ -0,0 +1 @@
+export * from './text-field';

package/lib/new-components/text-field/text-field.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import type { FieldComponentProps } from '../base-field';
+declare type TextFieldType = 'email' | 'search' | 'tel' | 'text' | 'url';
+declare type TextFieldProps = Omit<FieldComponentProps<HTMLInputElement>, 'type'> & {
+    type?: TextFieldType;
+};
+declare const TextField: React.ForwardRefExoticComponent<Pick<TextFieldProps, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "title" | "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" | "children" | "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" | "label" | "secondaryLabel" | "auxiliaryLabel" | "hint" | "maxWidth" | "key" | "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "checked" | "crossOrigin" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "readOnly" | "required" | "size" | "src" | "step" | "type" | "value" | "width"> & React.RefAttributes<HTMLInputElement>>;
+export { TextField };
+export type { TextFieldProps, TextFieldType };

package/lib/new-components/text-field/text-field.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),i=require("../box/box.js"),a=require("../base-field/base-field.js"),t=require("./text-field.module.css.js"),l=["id","label","secondaryLabel","auxiliaryLabel","hint","type","maxWidth","hidden","aria-describedby"];exports.TextField=r.forwardRef((function(d,s){var b=d.id,n=d.label,u=d.secondaryLabel,o=d.auxiliaryLabel,c=d.hint,x=d.type,p=void 0===x?"text":x,y=d.maxWidth,f=d.hidden,h=d["aria-describedby"],m=e.objectWithoutPropertiesLoose(d,l);return r.createElement(a.BaseField,{id:b,label:n,secondaryLabel:u,auxiliaryLabel:o,hint:c,maxWidth:y,hidden:f,"aria-describedby":h},(function(e){return r.createElement(i.Box,{className:t.default.inputWrapper},r.createElement("input",Object.assign({},m,e,{type:p,ref:s})))}))}));
+//# sourceMappingURL=text-field.js.map

package/lib/new-components/text-field/text-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-field.js","sources":["../../../src/new-components/text-field/text-field.tsx"],"sourcesContent":["import * as React from 'react'\nimport { BaseField } from '../base-field'\nimport { Box } from '../box'\nimport styles from './text-field.module.css'\nimport type { FieldComponentProps } from '../base-field'\n\ntype TextFieldType = 'email' | 'search' | 'tel' | 'text' | 'url'\n\ntype TextFieldProps = Omit<FieldComponentProps<HTMLInputElement>, 'type'> & {\n    type?: TextFieldType\n}\n\nconst TextField = React.forwardRef<HTMLInputElement, TextFieldProps>(function TextField(\n    {\n        id,\n        label,\n        secondaryLabel,\n        auxiliaryLabel,\n        hint,\n        type = 'text',\n        maxWidth,\n        hidden,\n        'aria-describedby': ariaDescribedBy,\n        ...props\n    },\n    ref,\n) {\n    return (\n        <BaseField\n            id={id}\n            label={label}\n            secondaryLabel={secondaryLabel}\n            auxiliaryLabel={auxiliaryLabel}\n            hint={hint}\n            maxWidth={maxWidth}\n            hidden={hidden}\n            aria-describedby={ariaDescribedBy}\n        >\n            {(extraProps) => (\n                <Box className={styles.inputWrapper}>\n                    <input {...props} {...extraProps} type={type} ref={ref} />\n                </Box>\n            )}\n        </BaseField>\n    )\n})\n\nexport { TextField }\nexport type { TextFieldProps, TextFieldType }\n"],"names":["React","ref","id","label","secondaryLabel","auxiliaryLabel","hint","type","maxWidth","hidden","ariaDescribedBy","props","BaseField","extraProps","Box","className","styles","inputWrapper"],"mappings":"0XAYkBA,cAAmD,WAajEC,OAXIC,IAAAA,GACAC,IAAAA,MACAC,IAAAA,eACAC,IAAAA,eACAC,IAAAA,SACAC,KAAAA,aAAO,SACPC,IAAAA,SACAC,IAAAA,OACoBC,IAApB,oBACGC,6CAKHX,gBAACY,aACGV,GAAIA,EACJC,MAAOA,EACPC,eAAgBA,EAChBC,eAAgBA,EAChBC,KAAMA,EACNE,SAAUA,EACVC,OAAQA,qBACUC,IAEjB,SAACG,UACEb,gBAACc,OAAIC,UAAWC,UAAOC,cACnBjB,yCAAWW,EAAWE,GAAYN,KAAMA,EAAMN,IAAKA"}

package/lib/new-components/text-field/text-field.module.css.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={inputWrapper:"dd9ffeab"};
+//# sourceMappingURL=text-field.module.css.js.map

package/lib/new-components/text-field/text-field.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-field.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/lib/new-components/text-field/text-field.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/new-components/text-link/index.d.ts

@@ -0,0 +1 @@
+export * from './text-link';

package/lib/new-components/text-link/text-link.d.ts

@@ -0,0 +1,5 @@
+import type { OpenInNewTab } from '../common-types';
+declare type TextLinkProps = OpenInNewTab;
+declare const TextLink: import("../../utils/polymorphism").PolymorphicComponent<"a", OpenInNewTab, "obfuscateClassName">;
+export { TextLink };
+export type { TextLinkProps };

package/lib/new-components/text-link/text-link.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),o=require("../../utils/polymorphism.js"),t=require("../box/box.js"),i=require("./text-link.module.css.js"),s=["as","openInNewTab","exceptionallySetClassName"];exports.TextLink=o.polymorphicComponent((function(o,a){var l=o.as,n=void 0===l?"a":l,p=o.openInNewTab,u=void 0!==p&&p,c=o.exceptionallySetClassName,b=e.objectWithoutPropertiesLoose(o,s);return r.createElement(t.Box,Object.assign({},b,{as:n,display:"inline",className:[c,i.default.container],ref:a,target:u?"_blank":void 0,rel:u?"noopener noreferrer":void 0}))}));
+//# sourceMappingURL=text-link.js.map

package/lib/new-components/text-link/text-link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-link.js","sources":["../../../src/new-components/text-link/text-link.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Box } from '../box'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport styles from './text-link.module.css'\nimport type { OpenInNewTab } from '../common-types'\n\ntype TextLinkProps = OpenInNewTab\n\nconst TextLink = polymorphicComponent<'a', TextLinkProps>(function TextLink(\n    { as = 'a', openInNewTab = false, exceptionallySetClassName, ...props },\n    ref,\n) {\n    return (\n        <Box\n            {...props}\n            as={as}\n            display=\"inline\"\n            className={[exceptionallySetClassName, styles.container]}\n            ref={ref}\n            target={openInNewTab ? '_blank' : undefined}\n            rel={openInNewTab ? 'noopener noreferrer' : undefined}\n        />\n    )\n})\n\nexport { TextLink }\nexport type { TextLinkProps }\n"],"names":["polymorphicComponent","ref","as","openInNewTab","exceptionallySetClassName","props","React","Box","display","className","styles","container","target","undefined","rel"],"mappings":"oUAQiBA,wBAAyC,WAEtDC,WADEC,GAAAA,aAAK,UAAKC,aAAAA,gBAAsBC,IAAAA,0BAA8BC,6CAI5DC,gBAACC,uBACOF,GACJH,GAAIA,EACJM,QAAQ,SACRC,UAAW,CAACL,EAA2BM,UAAOC,WAC9CV,IAAKA,EACLW,OAAQT,EAAe,cAAWU,EAClCC,IAAKX,EAAe,2BAAwBU"}

package/lib/new-components/text-link/text-link.module.css.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={container:"b55607a1"};
+//# sourceMappingURL=text-link.module.css.js.map

package/lib/new-components/text-link/text-link.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-link.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}