@twilio-paste/checkbox - npm Package Compare versions

Comparing version 6.0.5 to 6.1.0

CHANGELOG.md

 # Change Log
 
+## 6.1.0
+
+### Minor Changes
+
+- [`b9658287`](https://github.com/twilio-labs/paste/commit/b96582875b124d953164b0c98cafa079b53e7d70) [#1899](https://github.com/twilio-labs/paste/pull/1899) Thanks [@gloriliale](https://github.com/gloriliale)! - [Checkbox] Enable Component to respect element customizations set on the customization provider. Component now enables setting an element name on the underlying HTML element and checks the emotion theme object to determine whether it should merge in custom styles to the ones set by the component author.
+
 ## 6.0.5
@@ -4,0 +10,0 @@

dist/Checkbox.d.ts

 import * as React from 'react';
-export interface CheckboxProps extends React.InputHTMLAttributes<HTMLInputElement> {
+import type { BoxProps } from '@twilio-paste/box';
+export interface CheckboxProps extends React.InputHTMLAttributes<HTMLInputElement>, Pick<BoxProps, 'element'> {
     children: NonNullable<React.ReactNode>;
@@ -4,0 +5,0 @@ hasError?: boolean;

dist/CheckboxGroup.d.ts

@@ -8,4 +8,4 @@ import * as React from 'react';
 }
-declare const CheckboxGroup: React.ForwardRefExoticComponent<Pick<CheckboxGroupProps, "disabled" | "id" | "name" | "onChange" | "required" | "children" | "helpText" | "isSelectAll" | "form" | "placeholder" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "slot" | "spellCheck" | "style" | "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" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "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" | "css" | "legend" | "errorText" | "orientation"> & React.RefAttributes<HTMLFieldSetElement>>;
+declare const CheckboxGroup: React.ForwardRefExoticComponent<Pick<CheckboxGroupProps, "element" | "color" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "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" | "css" | "disabled" | "name" | "required" | "helpText" | "isSelectAll" | "form" | "legend" | "errorText" | "orientation"> & React.RefAttributes<HTMLFieldSetElement>>;
 export { CheckboxGroup };
 //# sourceMappingURL=CheckboxGroup.d.ts.map

dist/index.es.js

@@ -1,1 +0,1 @@
-var H=Object.prototype.hasOwnProperty;var y=Object.getOwnPropertySymbols,L=Object.prototype.propertyIsEnumerable;var i=Object.assign;var d=(e,r)=>{var t={};for(var o in e)H.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&y)for(var o of y(e))r.indexOf(o)<0&&L.call(e,o)&&(t[o]=e[o]);return t};import{createElement as n,forwardRef as R,useContext as D}from"react";import{bool as be,func as he,node as xe,oneOfType as me,string as ue}from"prop-types";import{useUID as G}from"@twilio-paste/uid-library";import{Box as P,safelySpreadBoxProps as S}from"@twilio-paste/box";import{CheckboxCheckIcon as z}from"@twilio-paste/icons/esm/CheckboxCheckIcon";import{MinusIcon as V}from"@twilio-paste/icons/esm/MinusIcon";import{BaseRadioCheckboxControl as q,BaseRadioCheckboxLabel as A,BaseRadioCheckboxLabelText as F,BaseRadioCheckboxHelpText as W}from"@twilio-paste/base-radio-checkbox";import{MediaObject as j,MediaFigure as _,MediaBody as U}from"@twilio-paste/media-object";import{RequiredDot as J}from"@twilio-paste/label";import{createContext as O}from"react";var f=O({disabled:!1,name:void 0,hasError:void 0,onChange:()=>{}});var K=R((e,r)=>n(P,i(i({},e),{ref:r,as:"input",type:"checkbox",size:"size0",border:"none",overflow:"hidden",padding:"space0",margin:"space0",whiteSpace:"nowrap",textTransform:"none",position:"absolute",clip:"rect(0 0 0 0)"}))),Q=({checked:e,disabled:r,indeterminate:t})=>{let o=r&&(e||t)?"colorTextIcon":"colorTextWeakest";return t?n(V,{decorative:!0,color:o,size:"sizeIcon10"}):n(z,{hidden:!e,decorative:!0,color:o,size:"sizeIcon10"})},k=R((h,u)=>{var{checked:e,children:r,helpText:t,id:o,indeterminate:p,isSelectAll:l,isSelectAllChild:b,required:m}=h,a=d(h,["checked","children","helpText","id","indeterminate","isSelectAll","isSelectAllChild","required"]);let C=G(),s=D(f),c=a.disabled!=null?a.disabled:s.disabled,w=a.name!=null?a.name:s.name,M=a.hasError!=null?a.hasError:s.hasError,N=a.onChange!=null?a.onChange:s.onChange,T=null,g=null;return l&&(T="space20",e||p?g="colorBackgroundPrimaryWeakest":c||(g="colorBackground")),b&&(T="space30"),n(P,{backgroundColor:g,borderRadius:l?"borderRadius10":null,display:"inline-flex",flexDirection:"column",padding:l?"space30":null,paddingBottom:l?"space20":null,paddingLeft:T,paddingRight:b?"space30":null,paddingTop:l?"space20":null},n(K,i(i({},S(a)),{checked:e,disabled:c,name:w,onChange:N,"aria-describedby":C,"aria-checked":p?"mixed":e,"aria-invalid":M,id:o,required:m,ref:u})),n(A,{disabled:c,htmlFor:o},n(q,{alignItems:"center",borderRadius:"borderRadius10",disabled:c,position:"relative",type:"checkbox"},n(Q,{checked:e,disabled:c,indeterminate:p})),n(F,{fontWeight:l?null:"fontWeightMedium"},n(j,{verticalAlign:"top"},m&&n(_,{spacing:"space20"},n(J,null)),n(U,null,r)))),t&&n(W,{helpTextId:C},t))});k.displayName="Checkbox";import{Children as X,cloneElement as Y,createElement as E,forwardRef as Z,isValidElement as $,useCallback as ee,useMemo as oe}from"react";import{bool as Ie,func as we,oneOf as Me,string as Ne}from"prop-types";import{InlineControlGroup as re}from"@twilio-paste/inline-control-group";var v=Z((u,a)=>{var{children:e,disabled:r=!1,errorText:t,isSelectAll:o=!1,name:p,onChange:l,orientation:b="vertical"}=u,m=d(u,["children","disabled","errorText","isSelectAll","name","onChange","orientation"]);let h=ee(s=>{l!=null&&l(s.target.checked)},[l]),C=oe(()=>({disabled:r,name:p,onChange:h,hasError:t?!0:void 0}),[r,p,h]);return E(f.Provider,{value:C},E(re,i(i({},m),{disabled:r,errorText:t,name:p,orientation:b,ref:a}),X.map(e,(s,c)=>$(s)?Y(s,{isSelectAll:o&&c===0,isSelectAllChild:o&&b==="vertical"&&c!==0}):s)))});v.displayName="CheckboxGroup";import{Fragment as te,createElement as x,forwardRef as ne}from"react";import{node as Se,oneOfType as ze,string as Ve}from"prop-types";import{Box as B}from"@twilio-paste/box";import{HelpText as ae}from"@twilio-paste/help-text";var I=ne((p,o)=>{var{children:e,errorText:r}=p,t=d(p,["children","errorText"]);return x(te,null,x(B,{backgroundColor:"colorBackground",borderRadius:"borderRadius20",padding:"space50"},x(k,i(i({},t),{hasError:r!=null,ref:o}),e)),r&&x(B,{marginTop:"space30",marginLeft:"space50"},x(ae,{variant:"error"},r)))});I.displayName="CheckboxDisclaimer";export{k as Checkbox,I as CheckboxDisclaimer,v as CheckboxGroup};
+var M=Object.prototype.hasOwnProperty;var g=Object.getOwnPropertySymbols,N=Object.prototype.propertyIsEnumerable;var i=Object.assign;var b=(e,r)=>{var t={};for(var o in e)M.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&g)for(var o of g(e))r.indexOf(o)<0&&N.call(e,o)&&(t[o]=e[o]);return t};import{createElement as n,forwardRef as y,useContext as D}from"react";import{bool as me,func as xe,node as he,oneOfType as Ce,string as ue}from"prop-types";import{useUID as G}from"@twilio-paste/uid-library";import{Box as E,safelySpreadBoxProps as A}from"@twilio-paste/box";import{CheckboxCheckIcon as S}from"@twilio-paste/icons/esm/CheckboxCheckIcon";import{MinusIcon as z}from"@twilio-paste/icons/esm/MinusIcon";import{BaseRadioCheckboxControl as V,BaseRadioCheckboxLabel as W,BaseRadioCheckboxLabelText as X,BaseRadioCheckboxHelpText as q}from"@twilio-paste/base-radio-checkbox";import{MediaObject as F,MediaFigure as $,MediaBody as j}from"@twilio-paste/media-object";import{RequiredDot as K}from"@twilio-paste/label";import{createContext as _}from"react";var k=_({disabled:!1,name:void 0,hasError:void 0,onChange:()=>{}});var U=y((e,r)=>n(E,i(i({},e),{ref:r,as:"input",type:"checkbox",size:"size0",border:"none",overflow:"hidden",padding:"space0",margin:"space0",whiteSpace:"nowrap",textTransform:"none",position:"absolute",clip:"rect(0 0 0 0)"}))),J=({checked:e,element:r,disabled:t,indeterminate:o})=>{let l=t&&(e||o)?"colorTextIcon":"colorTextWeakest";return o?n(z,{element:r,decorative:!0,color:l,size:"sizeIcon10"}):n(S,{element:r,hidden:!e,decorative:!0,color:l,size:"sizeIcon10"})},T=y((x,u)=>{var{checked:e,element:r="CHECKBOX",children:t,helpText:o,id:l,indeterminate:p,isSelectAll:s,isSelectAllChild:m,required:C}=x,a=b(x,["checked","element","children","helpText","id","indeterminate","isSelectAll","isSelectAllChild","required"]);let f=G(),c=D(k),d=a.disabled!=null?a.disabled:c.disabled,w=a.name!=null?a.name:c.name,H=a.hasError!=null?a.hasError:c.hasError,L=a.onChange!=null?a.onChange:c.onChange,R=null,P=null;return s&&(R="space20",e||p?P="colorBackgroundPrimaryWeakest":d||(P="colorBackground")),m&&(R="space30"),n(E,{element:r,backgroundColor:P,borderRadius:s?"borderRadius10":null,display:"inline-flex",flexDirection:"column",padding:s?"space30":null,paddingBottom:s?"space20":null,paddingLeft:R,paddingRight:m?"space30":null,paddingTop:s?"space20":null},n(U,i(i({},A(a)),{checked:e,disabled:d,name:w,onChange:L,"aria-describedby":f,"aria-checked":p?"mixed":e,"aria-invalid":H,id:l,required:C,ref:u})),n(W,{disabled:d,htmlFor:l},n(V,{alignItems:"center",borderRadius:"borderRadius10",element:`${r}_CONTROL`,disabled:d,position:"relative",type:"checkbox"},n(J,{element:`${r}_ICON`,checked:e,disabled:d,indeterminate:p})),n(X,{element:`${r}_LABEL_TEXT_WRAPPER`,fontWeight:s?null:"fontWeightMedium"},n(F,{verticalAlign:"top"},C&&n($,{spacing:"space20"},n(K,null)),n(j,null,t)))),o&&n(q,{element:`${r}_HELP_TEXT_WRAPPER`,helpTextId:f},o))});T.displayName="Checkbox";import{Children as Q,cloneElement as Y,createElement as B,forwardRef as Z,isValidElement as ee,useCallback as oe,useMemo as re}from"react";import{bool as Oe,func as we,oneOf as He,string as Le}from"prop-types";import{InlineControlGroup as te}from"@twilio-paste/inline-control-group";var v=Z((u,a)=>{var{children:e,element:r="CHECKBOX_GROUP",disabled:t=!1,errorText:o,isSelectAll:l=!1,name:p,onChange:s,orientation:m="vertical"}=u,C=b(u,["children","element","disabled","errorText","isSelectAll","name","onChange","orientation"]);let x=oe(c=>{s!=null&&s(c.target.checked)},[s]),f=re(()=>({disabled:t,name:p,onChange:x,hasError:o?!0:void 0}),[t,p,x]);return B(k.Provider,{value:f},B(te,i(i({},C),{element:r,disabled:t,errorText:o,name:p,orientation:m,ref:a}),Q.map(e,(c,d)=>ee(c)?Y(c,{isSelectAll:l&&d===0,isSelectAllChild:l&&m==="vertical"&&d!==0}):c)))});v.displayName="CheckboxGroup";import{Fragment as ne,createElement as h,forwardRef as ae}from"react";import{node as Ae,oneOfType as Se,string as ze}from"prop-types";import{Box as I}from"@twilio-paste/box";import{HelpText as ie}from"@twilio-paste/help-text";var O=ae((p,l)=>{var{children:e,element:r="CHECKBOX_DISCLAIMER",errorText:t}=p,o=b(p,["children","element","errorText"]);return h(ne,null,h(I,{element:r,backgroundColor:"colorBackground",borderRadius:"borderRadius20",padding:"space50"},h(T,i(i({},o),{hasError:t!=null,ref:l}),e)),t&&h(I,{marginTop:"space30",element:`${r}_ERROR_TEXT_WRAPPER`,marginLeft:"space50"},h(ie,{variant:"error"},t)))});O.displayName="CheckboxDisclaimer";export{T as Checkbox,O as CheckboxDisclaimer,v as CheckboxGroup};

dist/index.js

@@ -1,1 +0,1 @@
-var J=Object.create,P=Object.defineProperty,K=Object.getPrototypeOf,H=Object.prototype.hasOwnProperty,Q=Object.getOwnPropertyNames,X=Object.getOwnPropertyDescriptor,L=Object.getOwnPropertySymbols,Y=Object.prototype.propertyIsEnumerable;var l=Object.assign,O=e=>P(e,"__esModule",{value:!0});var m=(e,o)=>{var t={};for(var r in e)H.call(e,r)&&o.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&L)for(var r of L(e))o.indexOf(r)<0&&Y.call(e,r)&&(t[r]=e[r]);return t};var Z=(e,o)=>{O(e);for(var t in o)P(e,t,{get:o[t],enumerable:!0})},$=(e,o,t)=>{if(O(e),o&&typeof o=="object"||typeof o=="function")for(let r of Q(o))!H.call(e,r)&&r!=="default"&&P(e,r,{get:()=>o[r],enumerable:!(t=X(o,r))||t.enumerable});return e},a=e=>e&&e.__esModule?e:$(P(e!=null?J(K(e)):{},"default",{value:e,enumerable:!0}),e);Z(exports,{Checkbox:()=>v,CheckboxDisclaimer:()=>W,CheckboxGroup:()=>A});var n=a(require("react")),k=a(require("prop-types")),G=a(require("@twilio-paste/uid-library")),T=a(require("@twilio-paste/box")),S=a(require("@twilio-paste/icons/cjs/CheckboxCheckIcon")),z=a(require("@twilio-paste/icons/cjs/MinusIcon")),x=a(require("@twilio-paste/base-radio-checkbox")),u=a(require("@twilio-paste/media-object")),V=a(require("@twilio-paste/label"));var D=a(require("react")),E=D.createContext({disabled:!1,name:void 0,hasError:void 0,onChange:()=>{}});var ee=n.forwardRef((e,o)=>n.createElement(T.Box,l(l({},e),{ref:o,as:"input",type:"checkbox",size:"size0",border:"none",overflow:"hidden",padding:"space0",margin:"space0",whiteSpace:"nowrap",textTransform:"none",position:"absolute",clip:"rect(0 0 0 0)"}))),oe=({checked:e,disabled:o,indeterminate:t})=>{let r=o&&(e||t)?"colorTextIcon":"colorTextWeakest";return t?n.createElement(z.MinusIcon,{decorative:!0,color:r,size:"sizeIcon10"}):n.createElement(S.CheckboxCheckIcon,{hidden:!e,decorative:!0,color:r,size:"sizeIcon10"})},v=n.forwardRef((f,y)=>{var{checked:e,children:o,helpText:t,id:r,indeterminate:s,isSelectAll:c,isSelectAllChild:C,required:g}=f,p=m(f,["checked","children","helpText","id","indeterminate","isSelectAll","isSelectAllChild","required"]);let R=G.useUID(),d=n.useContext(E),h=p.disabled!=null?p.disabled:d.disabled,j=p.name!=null?p.name:d.name,_=p.hasError!=null?p.hasError:d.hasError,U=p.onChange!=null?p.onChange:d.onChange,I=null,w=null;return c&&(I="space20",e||s?w="colorBackgroundPrimaryWeakest":h||(w="colorBackground")),C&&(I="space30"),n.createElement(T.Box,{backgroundColor:w,borderRadius:c?"borderRadius10":null,display:"inline-flex",flexDirection:"column",padding:c?"space30":null,paddingBottom:c?"space20":null,paddingLeft:I,paddingRight:C?"space30":null,paddingTop:c?"space20":null},n.createElement(ee,l(l({},T.safelySpreadBoxProps(p)),{checked:e,disabled:h,name:j,onChange:U,"aria-describedby":R,"aria-checked":s?"mixed":e,"aria-invalid":_,id:r,required:g,ref:y})),n.createElement(x.BaseRadioCheckboxLabel,{disabled:h,htmlFor:r},n.createElement(x.BaseRadioCheckboxControl,{alignItems:"center",borderRadius:"borderRadius10",disabled:h,position:"relative",type:"checkbox"},n.createElement(oe,{checked:e,disabled:h,indeterminate:s})),n.createElement(x.BaseRadioCheckboxLabelText,{fontWeight:c?null:"fontWeightMedium"},n.createElement(u.MediaObject,{verticalAlign:"top"},g&&n.createElement(u.MediaFigure,{spacing:"space20"},n.createElement(V.RequiredDot,null)),n.createElement(u.MediaBody,null,o)))),t&&n.createElement(x.BaseRadioCheckboxHelpText,{helpTextId:R},t))});v.displayName="Checkbox";var i=a(require("react")),B=a(require("prop-types")),q=a(require("@twilio-paste/inline-control-group"));var A=i.forwardRef((y,p)=>{var{children:e,disabled:o=!1,errorText:t,isSelectAll:r=!1,name:s,onChange:c,orientation:C="vertical"}=y,g=m(y,["children","disabled","errorText","isSelectAll","name","onChange","orientation"]);let f=i.useCallback(d=>{c!=null&&c(d.target.checked)},[c]),R=i.useMemo(()=>({disabled:o,name:s,onChange:f,hasError:t?!0:void 0}),[o,s,f]);return i.createElement(E.Provider,{value:R},i.createElement(q.InlineControlGroup,l(l({},g),{disabled:o,errorText:t,name:s,orientation:C,ref:p}),i.Children.map(e,(d,h)=>i.isValidElement(d)?i.cloneElement(d,{isSelectAll:r&&h===0,isSelectAllChild:r&&C==="vertical"&&h!==0}):d)))});A.displayName="CheckboxGroup";var b=a(require("react")),M=a(require("prop-types")),N=a(require("@twilio-paste/box")),F=a(require("@twilio-paste/help-text"));var W=b.forwardRef((s,r)=>{var{children:e,errorText:o}=s,t=m(s,["children","errorText"]);return b.createElement(b.Fragment,null,b.createElement(N.Box,{backgroundColor:"colorBackground",borderRadius:"borderRadius20",padding:"space50"},b.createElement(v,l(l({},t),{hasError:o!=null,ref:r}),e)),o&&b.createElement(N.Box,{marginTop:"space30",marginLeft:"space50"},b.createElement(F.HelpText,{variant:"error"},o)))});W.displayName="CheckboxDisclaimer";
+var K=Object.create,E=Object.defineProperty,U=Object.getPrototypeOf,M=Object.prototype.hasOwnProperty,J=Object.getOwnPropertyNames,Q=Object.getOwnPropertyDescriptor,N=Object.getOwnPropertySymbols,Y=Object.prototype.propertyIsEnumerable;var p=Object.assign,_=e=>E(e,"__esModule",{value:!0});var C=(e,o)=>{var t={};for(var r in e)M.call(e,r)&&o.indexOf(r)<0&&(t[r]=e[r]);if(e!=null&&N)for(var r of N(e))o.indexOf(r)<0&&Y.call(e,r)&&(t[r]=e[r]);return t};var Z=(e,o)=>{_(e);for(var t in o)E(e,t,{get:o[t],enumerable:!0})},ee=(e,o,t)=>{if(_(e),o&&typeof o=="object"||typeof o=="function")for(let r of J(o))!M.call(e,r)&&r!=="default"&&E(e,r,{get:()=>o[r],enumerable:!(t=Q(o,r))||t.enumerable});return e},a=e=>e&&e.__esModule?e:ee(E(e!=null?K(U(e)):{},"default",{value:e,enumerable:!0}),e);Z(exports,{Checkbox:()=>v,CheckboxDisclaimer:()=>q,CheckboxGroup:()=>W});var n=a(require("react")),T=a(require("prop-types")),G=a(require("@twilio-paste/uid-library")),R=a(require("@twilio-paste/box")),A=a(require("@twilio-paste/icons/cjs/CheckboxCheckIcon")),S=a(require("@twilio-paste/icons/cjs/MinusIcon")),h=a(require("@twilio-paste/base-radio-checkbox")),u=a(require("@twilio-paste/media-object")),z=a(require("@twilio-paste/label"));var D=a(require("react")),B=D.createContext({disabled:!1,name:void 0,hasError:void 0,onChange:()=>{}});var oe=n.forwardRef((e,o)=>n.createElement(R.Box,p(p({},e),{ref:o,as:"input",type:"checkbox",size:"size0",border:"none",overflow:"hidden",padding:"space0",margin:"space0",whiteSpace:"nowrap",textTransform:"none",position:"absolute",clip:"rect(0 0 0 0)"}))),re=({checked:e,element:o,disabled:t,indeterminate:r})=>{let s=t&&(e||r)?"colorTextIcon":"colorTextWeakest";return r?n.createElement(S.MinusIcon,{element:o,decorative:!0,color:s,size:"sizeIcon10"}):n.createElement(A.CheckboxCheckIcon,{element:o,hidden:!e,decorative:!0,color:s,size:"sizeIcon10"})},v=n.forwardRef((k,g)=>{var{checked:e,element:o="CHECKBOX",children:t,helpText:r,id:s,indeterminate:c,isSelectAll:d,isSelectAllChild:f,required:P}=k,l=C(k,["checked","element","children","helpText","id","indeterminate","isSelectAll","isSelectAllChild","required"]);let y=G.useUID(),b=n.useContext(B),x=l.disabled!=null?l.disabled:b.disabled,F=l.name!=null?l.name:b.name,$=l.hasError!=null?l.hasError:b.hasError,j=l.onChange!=null?l.onChange:b.onChange,O=null,w=null;return d&&(O="space20",e||c?w="colorBackgroundPrimaryWeakest":x||(w="colorBackground")),f&&(O="space30"),n.createElement(R.Box,{element:o,backgroundColor:w,borderRadius:d?"borderRadius10":null,display:"inline-flex",flexDirection:"column",padding:d?"space30":null,paddingBottom:d?"space20":null,paddingLeft:O,paddingRight:f?"space30":null,paddingTop:d?"space20":null},n.createElement(oe,p(p({},R.safelySpreadBoxProps(l)),{checked:e,disabled:x,name:F,onChange:j,"aria-describedby":y,"aria-checked":c?"mixed":e,"aria-invalid":$,id:s,required:P,ref:g})),n.createElement(h.BaseRadioCheckboxLabel,{disabled:x,htmlFor:s},n.createElement(h.BaseRadioCheckboxControl,{alignItems:"center",borderRadius:"borderRadius10",element:`${o}_CONTROL`,disabled:x,position:"relative",type:"checkbox"},n.createElement(re,{element:`${o}_ICON`,checked:e,disabled:x,indeterminate:c})),n.createElement(h.BaseRadioCheckboxLabelText,{element:`${o}_LABEL_TEXT_WRAPPER`,fontWeight:d?null:"fontWeightMedium"},n.createElement(u.MediaObject,{verticalAlign:"top"},P&&n.createElement(u.MediaFigure,{spacing:"space20"},n.createElement(z.RequiredDot,null)),n.createElement(u.MediaBody,null,t)))),r&&n.createElement(h.BaseRadioCheckboxHelpText,{element:`${o}_HELP_TEXT_WRAPPER`,helpTextId:y},r))});v.displayName="Checkbox";var i=a(require("react")),I=a(require("prop-types")),V=a(require("@twilio-paste/inline-control-group"));var W=i.forwardRef((g,l)=>{var{children:e,element:o="CHECKBOX_GROUP",disabled:t=!1,errorText:r,isSelectAll:s=!1,name:c,onChange:d,orientation:f="vertical"}=g,P=C(g,["children","element","disabled","errorText","isSelectAll","name","onChange","orientation"]);let k=i.useCallback(b=>{d!=null&&d(b.target.checked)},[d]),y=i.useMemo(()=>({disabled:t,name:c,onChange:k,hasError:r?!0:void 0}),[t,c,k]);return i.createElement(B.Provider,{value:y},i.createElement(V.InlineControlGroup,p(p({},P),{element:o,disabled:t,errorText:r,name:c,orientation:f,ref:l}),i.Children.map(e,(b,x)=>i.isValidElement(b)?i.cloneElement(b,{isSelectAll:s&&x===0,isSelectAllChild:s&&f==="vertical"&&x!==0}):b)))});W.displayName="CheckboxGroup";var m=a(require("react")),H=a(require("prop-types")),L=a(require("@twilio-paste/box")),X=a(require("@twilio-paste/help-text"));var q=m.forwardRef((c,s)=>{var{children:e,element:o="CHECKBOX_DISCLAIMER",errorText:t}=c,r=C(c,["children","element","errorText"]);return m.createElement(m.Fragment,null,m.createElement(L.Box,{element:o,backgroundColor:"colorBackground",borderRadius:"borderRadius20",padding:"space50"},m.createElement(v,p(p({},r),{hasError:t!=null,ref:s}),e)),t&&m.createElement(L.Box,{marginTop:"space30",element:`${o}_ERROR_TEXT_WRAPPER`,marginLeft:"space50"},m.createElement(X.HelpText,{variant:"error"},t)))});q.displayName="CheckboxDisclaimer";

package.json

 {
   "name": "@twilio-paste/checkbox",
-  "version": "6.0.5",
+  "version": "6.1.0",
   "category": "user input",
   "status": "production",
-  "description": "The Checkbox and Checkbox Group are used to enable binary choices",
+  "description": "A Checkbox is a form element that enables a binary choice and a Checkbox Group is a collection of Checkboxes.",
   "author": "Twilio Inc.",
@@ -51,6 +51,6 @@ "license": "MIT",
     "@twilio-paste/box": "^4.0.5",
-    "@twilio-paste/design-tokens": "^6.7.0",
+    "@twilio-paste/design-tokens": "^6.13.0",
     "@twilio-paste/help-text": "^6.0.3",
-    "@twilio-paste/icons": "^5.1.2",
-    "@twilio-paste/inline-control-group": "^6.0.3",
+    "@twilio-paste/icons": "^5.7.0",
+    "@twilio-paste/inline-control-group": "^6.1.0",
     "@twilio-paste/label": "^6.0.3",
@@ -57,0 +57,0 @@ "@twilio-paste/media-object": "^4.0.3",

No alert changes

Improved metrics

Lines of code

97

3.19%

Worsened metrics

Total package byte prevSize

380644

-3.13%

No dependency changes