@utilitywarehouse/hearth-react 0.10.3 → 0.10.5

package/dist/chunk-FHD3M3NL.js

@@ -1,2 +0,0 @@
-import{c as C}from"./chunk-5OLLJKEO.js";import{c as u}from"./chunk-T64W7Q7K.js";import{a as f}from"./chunk-DE7VJBWP.js";import{a as x}from"./chunk-555MHYMJ.js";import{a as p}from"./chunk-QAR6M5CT.js";import{a as k}from"./chunk-KJ4W3OTX.js";import{b as h}from"./chunk-JTQWB7E2.js";import*as e from"react";import S from"clsx";import{TickSmallIcon as U}from"@utilitywarehouse/hearth-react-icons";import{Checkbox as T}from"radix-ui";var R="CheckboxTile",M=h(R),O=e.forwardRef(({className:I,id:N,disabled:a,value:o="on",onCheckedChange:i,label:c,helperText:l,image:y,"aria-labelledby":E,...G},H)=>{let{id:s,labelId:m,helperTextId:n}=k({providedId:N,prefix:"radio"}),r=C(),t=u(),w=t?.value?.includes(o),F=r?.hasGroupHelperText,L=r?r["aria-describedby"]:"",b=!F&&!!l,P=!!c;return e.createElement("label",{className:S(M,I),"data-disabled":a?"":void 0},e.createElement(T.Root,{ref:H,className:"hearth-CheckboxRoot",name:t?.name,checked:w,value:o,...G,id:s,disabled:a,"aria-describedby":b?n:L,"aria-labelledby":E||P?m:void 0,onCheckedChange:d=>{r&&(d?t?.onItemCheck(o):t?.onItemUncheck(o)),i&&i(d)}},e.createElement(T.Indicator,{asChild:!0,className:"hearth-CheckboxIndicator"},e.createElement(U,null))),e.createElement(x,{direction:"column"},e.createElement(f,{id:m,htmlFor:s,disableUserSelect:!0,className:"hearth-CheckboxLabel"},y,c),b?e.createElement(p,{id:n,disableUserSelect:!0},l):null))});O.displayName=R;export{O as a};
-//# sourceMappingURL=chunk-FHD3M3NL.js.map

package/dist/chunk-H2NP4JQ5.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/hearth/hearth/packages/react/dist/chunk-H2NP4JQ5.cjs","../src/components/SectionHeader/SectionHeader.tsx"],"names":["COMPONENT_NAME","componentClassName","withGlobalPrefix","SectionHeader","className","heading","id","HeadingEl","helperText","link","props","clsx","Heading","HelperText"],"mappings":"AAAA,mfAAwC,wDAAyC,wDAAyC,uECAnG,wEAEN,IAQXA,CAAAA,CAAiB,eAAA,CACjBC,CAAAA,CAAqBC,iCAAAA,CAA+B,CAAA,CAI7CC,CAAAA,aAAsB,CAAA,CAAA,UAAA,CACjC,CAAC,CAAE,SAAA,CAAAC,CAAAA,CAAW,OAAA,CAAAC,CAAAA,CAAS,EAAA,CAAAC,CAAAA,CAAI,cAAA,CAAgBC,CAAAA,CAAY,KAAA,CAAO,UAAA,CAAAC,CAAAA,CAAY,IAAA,CAAAC,CAAAA,CAAM,GAAGC,CAAM,CAAA,CAAA,EAErF,CAAA,CAAA,aAAA,CAAC,KAAA,CAAA,CAAI,SAAA,CAAWC,4BAAAA,CAAKV,CAAoBG,CAAS,CAAA,CAAA,CAChD,CAAA,CAAA,aAAA,CAACQ,mBAAAA,CAAA,CAAQ,OAAA,CAAO,CAAA,CAAA,CAAC,IAAA,CAAK,IAAA,CAAK,EAAA,CAAIN,CAAAA,CAAK,GAAGI,CAAAA,CAAAA,CACrC,CAAA,CAAA,aAAA,CAACH,CAAAA,CAAA,IAAA,CAAWF,CAAQ,CACtB,CAAA,CACCG,CAAAA,CAAa,CAAA,CAAA,aAAA,CAACK,mBAAAA,CAAA,CAAW,iBAAA,CAAiB,CAAA,CAAA,CAAA,CAAEL,CAAW,CAAA,CAAgB,IAAA,CACvEC,CACH,CAGN,CAAA,CAEAN,CAAAA,CAAc,WAAA,CAAcH,CAAAA,CAAAA,cAAAA","file":"/home/runner/work/hearth/hearth/packages/react/dist/chunk-H2NP4JQ5.cjs","sourcesContent":[null,"import * as React from 'react';\n\nimport clsx from 'clsx';\n\nimport type { ElementRef } from 'react';\nimport { withGlobalPrefix } from '../../helpers/with-global-prefix';\nimport { Heading } from '../Heading/Heading';\nimport { HelperText } from '../HelperText/HelperText';\nimport { SectionHeaderProps } from './SectionHeader.props';\n\nconst COMPONENT_NAME = 'SectionHeader';\nconst componentClassName = withGlobalPrefix(COMPONENT_NAME);\n\ntype SectionHeaderElement = ElementRef<'div'>;\n\nexport const SectionHeader = React.forwardRef<SectionHeaderElement, SectionHeaderProps>(\n  ({ className, heading, id, headingElement: HeadingEl = 'div', helperText, link, ...props }) => {\n    return (\n      <div className={clsx(componentClassName, className)}>\n        <Heading asChild size=\"md\" id={id} {...props}>\n          <HeadingEl>{heading}</HeadingEl>\n        </Heading>\n        {helperText ? <HelperText disableUserSelect>{helperText}</HelperText> : null}\n        {link}\n      </div>\n    );\n  }\n);\n\nSectionHeader.displayName = COMPONENT_NAME;\n"]}

package/dist/chunk-IBHJPM4G.js

@@ -1,2 +0,0 @@
-import{c as y}from"./chunk-5OLLJKEO.js";import{c as I}from"./chunk-T64W7Q7K.js";import{a as u}from"./chunk-DE7VJBWP.js";import{a as t}from"./chunk-555MHYMJ.js";import{a as C}from"./chunk-QAR6M5CT.js";import{a as k}from"./chunk-XQ5A24NX.js";import{a as R}from"./chunk-KJ4W3OTX.js";import{a as f}from"./chunk-6H5SMKTE.js";import{b as x}from"./chunk-JTQWB7E2.js";import*as e from"react";import U from"clsx";import{TickSmallIcon as D}from"@utilitywarehouse/hearth-react-icons";import{Checkbox as N}from"radix-ui";var T="Checkbox",M=x(T),O=e.forwardRef((P,E)=>{let{id:g,label:c,helperText:l,className:F,disabled:i,onCheckedChange:s,value:o="on","aria-labelledby":G,image:H,...L}=f(P,k),{id:m,labelId:n,helperTextId:d}=R({providedId:g,prefix:"checkbox"}),r=y(),a=I(),v=a?.value?.includes(o),w=r?.hasGroupHelperText,S=r?r["aria-describedby"]:"",b=!w&&!!l,p=!!c;return e.createElement(t,{className:U(M,F),"data-disabled":i?"":void 0},e.createElement(N.Root,{ref:E,className:"hearth-CheckboxRoot",name:a?.name,checked:v,value:o,...L,id:m,disabled:i,"aria-describedby":b?d:S,"aria-labelledby":G||p?n:void 0,onCheckedChange:h=>{r&&(h?a?.onItemCheck(o):a?.onItemUncheck(o)),s&&s(h)}},e.createElement(N.Indicator,{asChild:!0,className:"hearth-CheckboxIndicator"},e.createElement(D,null))),p?e.createElement(t,{direction:"column",gap:"50"},e.createElement(u,{id:n,htmlFor:m,disableUserSelect:!0,className:"hearth-CheckboxLabel"},H,c),b?e.createElement(C,{id:d,disableUserSelect:!0},l):null):null)});O.displayName=T;export{O as a};
-//# sourceMappingURL=chunk-IBHJPM4G.js.map

package/dist/chunk-KNINBPAI.js

@@ -1,2 +0,0 @@
-import{a as o}from"./chunk-QMOWUPZU.js";import{a as i}from"./chunk-QAR6M5CT.js";import{b as r}from"./chunk-JTQWB7E2.js";import*as e from"react";import p from"clsx";var a="SectionHeader",f=r(a),H=e.forwardRef(({className:m,heading:n,id:d,headingElement:l="div",helperText:t,link:c,...s})=>e.createElement("div",{className:p(f,m)},e.createElement(o,{asChild:!0,size:"md",id:d,...s},e.createElement(l,null,n)),t?e.createElement(i,{disableUserSelect:!0},t):null,c));H.displayName=a;export{H as a};
-//# sourceMappingURL=chunk-KNINBPAI.js.map

package/dist/chunk-TWPORN34.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/hearth/hearth/packages/react/dist/chunk-TWPORN34.cjs","../src/components/CheckboxTile/CheckboxTile.tsx"],"names":["COMPONENT_NAME","componentClassName","withGlobalPrefix","CheckboxTile","className","providedId","disabled","value","onCheckedChange","label","helperText","image","ariaLabelledby","props","ref","id","labelId","helperTextId","useIds","context","useFormGroupBase","checkboxContext","useCheckboxGroup","checked","hasGroupHelperText","ariaDescribedby","showHelperText","showLabel","clsx","RadixCheckbox","TickSmallIcon","Flex","Label","HelperText"],"mappings":"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","file":"/home/runner/work/hearth/hearth/packages/react/dist/chunk-TWPORN34.cjs","sourcesContent":[null,"import * as React from 'react';\n\nimport clsx from 'clsx';\n\nimport { CheckboxTileProps } from './CheckboxTile.props';\nimport { withGlobalPrefix } from '../../helpers/with-global-prefix';\nimport type { ElementRef } from 'react';\nimport { useIds } from '../../hooks/use-ids';\nimport { TickSmallIcon } from '@utilitywarehouse/hearth-react-icons';\nimport { Label } from '../Label/Label';\nimport { HelperText } from '../HelperText/HelperText';\nimport { Flex } from '../Flex/Flex';\nimport { Checkbox as RadixCheckbox } from 'radix-ui';\nimport { useCheckboxGroup } from '../CheckboxGroup/CheckboxGroup.context';\nimport { useFormGroupBase } from '../FormGroupBase/FormGroupBase.context';\n\nconst COMPONENT_NAME = 'CheckboxTile';\nconst componentClassName = withGlobalPrefix(COMPONENT_NAME);\n\ntype CheckboxTileElement = ElementRef<'button'>;\n\nexport const CheckboxTile = React.forwardRef<CheckboxTileElement, CheckboxTileProps>(\n  (\n    {\n      className,\n      id: providedId,\n      disabled,\n      value = 'on',\n      onCheckedChange,\n      label,\n      helperText,\n      image,\n      'aria-labelledby': ariaLabelledby,\n      ...props\n    },\n    ref\n  ) => {\n    const { id, labelId, helperTextId } = useIds({ providedId, prefix: 'radio' });\n    const context = useFormGroupBase();\n    const checkboxContext = useCheckboxGroup();\n    const checked = checkboxContext?.value?.includes(value);\n    const hasGroupHelperText = context?.hasGroupHelperText;\n    const ariaDescribedby = context ? context['aria-describedby'] : '';\n    const showHelperText = !hasGroupHelperText && !!helperText;\n    const showLabel = !!label;\n    return (\n      <label\n        className={clsx(componentClassName, className)}\n        data-disabled={disabled ? '' : undefined}\n      >\n        <RadixCheckbox.Root\n          ref={ref}\n          className=\"hearth-CheckboxRoot\"\n          name={checkboxContext?.name}\n          checked={checked}\n          value={value}\n          {...props}\n          id={id}\n          disabled={disabled}\n          aria-describedby={showHelperText ? helperTextId : ariaDescribedby}\n          aria-labelledby={ariaLabelledby || showLabel ? labelId : undefined}\n          onCheckedChange={(checked: boolean) => {\n            if (context) {\n              if (checked) {\n                checkboxContext?.onItemCheck(value);\n              } else {\n                checkboxContext?.onItemUncheck(value);\n              }\n            }\n            if (onCheckedChange) {\n              onCheckedChange(checked);\n            }\n          }}\n        >\n          <RadixCheckbox.Indicator asChild className=\"hearth-CheckboxIndicator\">\n            <TickSmallIcon />\n          </RadixCheckbox.Indicator>\n        </RadixCheckbox.Root>\n        <Flex direction=\"column\">\n          <Label id={labelId} htmlFor={id} disableUserSelect className=\"hearth-CheckboxLabel\">\n            {image}\n            {label}\n          </Label>\n          {showHelperText ? (\n            <HelperText id={helperTextId} disableUserSelect>\n              {helperText}\n            </HelperText>\n          ) : null}\n        </Flex>\n      </label>\n    );\n  }\n);\n\nCheckboxTile.displayName = COMPONENT_NAME;\n"]}

package/dist/chunk-VX2ETLYB.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/hearth/hearth/packages/react/dist/chunk-VX2ETLYB.cjs","../src/components/Checkbox/Checkbox.tsx"],"names":["COMPONENT_NAME","componentClassName","withGlobalPrefix","Checkbox","props","ref","providedId","label","helperText","className","disabled","onCheckedChange","value","ariaLabelledby","image","checkboxProps","extractProps","marginPropDefs","id","labelId","helperTextId","useIds","context","useFormGroupBase","checkboxContext","useCheckboxGroup","checked","hasGroupHelperText","ariaDescribedby","showHelperText","showLabel","Flex","clsx","RadixCheckbox","TickSmallIcon","Label","HelperText"],"mappings":"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","file":"/home/runner/work/hearth/hearth/packages/react/dist/chunk-VX2ETLYB.cjs","sourcesContent":[null,"import * as React from 'react';\nimport clsx from 'clsx';\nimport type { CheckboxProps } from './Checkbox.props';\nimport { Flex } from '../Flex/Flex';\nimport { Label } from '../Label/Label';\nimport { HelperText } from '../HelperText/HelperText';\nimport type { ElementRef } from 'react';\nimport { TickSmallIcon } from '@utilitywarehouse/hearth-react-icons';\nimport { withGlobalPrefix } from '../../helpers/with-global-prefix';\nimport { useIds } from '../../hooks/use-ids';\nimport { marginPropDefs } from '../../props/margin.props';\nimport { extractProps } from '../../helpers/extract-props';\nimport { Checkbox as RadixCheckbox } from 'radix-ui';\nimport { useCheckboxGroup } from '../CheckboxGroup/CheckboxGroup.context';\nimport { useFormGroupBase } from '../FormGroupBase/FormGroupBase.context';\n\nconst COMPONENT_NAME = 'Checkbox';\nconst componentClassName = withGlobalPrefix(COMPONENT_NAME);\n\nexport type CheckboxElement = ElementRef<'button'>;\n\nexport const Checkbox = React.forwardRef<CheckboxElement, CheckboxProps>((props, ref) => {\n  const {\n    id: providedId,\n    label,\n    helperText,\n    className,\n    disabled,\n    onCheckedChange,\n    value = 'on',\n    'aria-labelledby': ariaLabelledby,\n    image,\n    ...checkboxProps\n  } = extractProps(props, marginPropDefs);\n  const { id, labelId, helperTextId } = useIds({ providedId, prefix: 'checkbox' });\n  const context = useFormGroupBase();\n  const checkboxContext = useCheckboxGroup();\n  const checked = checkboxContext?.value?.includes(value);\n  const hasGroupHelperText = context?.hasGroupHelperText;\n  const ariaDescribedby = context ? context['aria-describedby'] : '';\n  const showHelperText = !hasGroupHelperText && !!helperText;\n  const showLabel = !!label;\n\n  return (\n    <Flex className={clsx(componentClassName, className)} data-disabled={disabled ? '' : undefined}>\n      <RadixCheckbox.Root\n        ref={ref}\n        className=\"hearth-CheckboxRoot\"\n        name={checkboxContext?.name}\n        checked={checked}\n        value={value}\n        {...checkboxProps}\n        id={id}\n        disabled={disabled}\n        aria-describedby={showHelperText ? helperTextId : ariaDescribedby}\n        aria-labelledby={ariaLabelledby || showLabel ? labelId : undefined}\n        onCheckedChange={(checked: boolean) => {\n          if (context) {\n            if (checked) {\n              checkboxContext?.onItemCheck(value);\n            } else {\n              checkboxContext?.onItemUncheck(value);\n            }\n          }\n          if (onCheckedChange) {\n            onCheckedChange(checked);\n          }\n        }}\n      >\n        <RadixCheckbox.Indicator asChild className=\"hearth-CheckboxIndicator\">\n          <TickSmallIcon />\n        </RadixCheckbox.Indicator>\n      </RadixCheckbox.Root>\n      {showLabel ? (\n        <Flex direction=\"column\" gap=\"50\">\n          <Label id={labelId} htmlFor={id} disableUserSelect className=\"hearth-CheckboxLabel\">\n            {image}\n            {label}\n          </Label>\n          {showHelperText ? (\n            <HelperText id={helperTextId} disableUserSelect>\n              {helperText}\n            </HelperText>\n          ) : null}\n        </Flex>\n      ) : null}\n    </Flex>\n  );\n});\n\nCheckbox.displayName = COMPONENT_NAME;\n"]}