@foxford/ui 2.38.0-beta-125a219-20240813 → 2.38.0-beta-ff3ed8d-20240813

package/components/Button/style.js

@@ -0,0 +1 @@
+'use strict';var styled=require('styled-components');var tinycolor=require('../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.js');var responsiveProperty=require('../../mixins/responsive-property.js');var color=require('../../mixins/color.js');var style=require('../../shared/utils/style.js');var focus=require('../../mixins/focus.js');var responsiveSize=require('../../mixins/responsive-size.js');var regexp=require('../../shared/regexp.js');var index=require('../../external/.pnpm/@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.js');const shouldForwardButtonProp=style.createShouldForwardProp((o=>!['fluid','width','display','padding','paddingTop','paddingRight','paddingBottom','paddingLeft','fontSize','height','inline','round','success','loading','black','danger','onColored','clear','base','outline','autoRel','noSpacing','primary','secondary','inverted','rounded','basic'].includes(o)),(o=>!(regexp.responsiveFluidPropKeyRegExp.test(o)||regexp.responsiveWidthPropKeyRegExp.test(o)||regexp.responsivePaddingPropKeyRegExp.test(o)||regexp.responsiveFontSizePropKeyRegExp.test(o)||regexp.responsiveHeightPropKeyRegExp.test(o))));const WIDTHS={xl:320,l:280,m:245,s:180,xs:140};const loadingAnimation=styled.keyframes(["0%{background-position:0 0;}100%{background-position:50px 50px;}"]);const spinAnimation=styled.keyframes(["100%{transform:rotate(360deg);}"]);const defaultLoadingStyles=styled.css(["background-image:linear-gradient( -45deg,rgba(255,255,255,0.2) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.2) 50%,rgba(255,255,255,0.2) 75%,transparent 75%,transparent );background-size:25px 25px;animation:"," 2s linear infinite;cursor:progress;"],loadingAnimation);const getWidth=o=>o==='auto'?'auto':typeof o=='number'||typeof o=='boolean'?o:o&&WIDTHS[o]?WIDTHS[o]:'auto';const fluidStyles=()=>styled.css(["min-width:initial;width:100%;"]);const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  border-color: ${o.borderColor};\n  &::before {\n    box-shadow: inset 0px 4px 0px ${o.shadowColor};\n  }\n  &:hover {\n    color: ${o.colorHover};\n    background-color: ${o.backgroundColorHover};\n    border-color: ${o.borderColorHover};\n  }\n  &:active {\n    color: ${o.colorActive};\n    background-color: ${o.backgroundColorActive};\n    border-color: ${o.borderColorActive};\n  }\n  &:disabled {\n    color: ${o.colorDisabled};\n    background-color: ${o.backgroundColorDisabled};\n    border-color: ${o.borderColorDisabled};\n  }\n`;const COLOR_SCHEMA={onColored:{clear:styled.css(["",""],(o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors.transparent,borderColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.theme.colors['bg-oncontrast-hover'],borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.theme.colors['bg-oncontrast-hover'],borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors.transparent,borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncontrast-hover'],...o.palette}))),base:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-primary'],backgroundColor:o.success?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-oncolor-secondary'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString():tinycolor(o.theme.colors['bg-oncolor-secondary']).darken(4).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString():tinycolor(o.theme.colors['bg-oncolor-secondary']).darken(4).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),outline:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.loading?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColor:o.success||o.loading?o.theme.colors['bg-oncolor-primary']:o.theme.colors.transparent,borderColor:o.success||o.loading?o.theme.colors.transparent:o.theme.colors['border-oncolor-default'],colorHover:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-constant'],backgroundColorHover:o.success?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString():o.theme.colors['bg-oncolor-primary'],borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-constant'],backgroundColorActive:o.success?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString():o.theme.colors['bg-oncolor-primary'],borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-constant'],backgroundColor:o.theme.colors['bg-oncolor-primary'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-constant'],backgroundColorHover:tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-constant'],backgroundColorActive:tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})))},danger:{clear:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.theme.colors['alert-error'],backgroundColor:o.theme.colors.transparent,borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['alert-success']:o.theme.colors['alert-error'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['alert-success']:o.theme.colors['alert-error'],backgroundColorActive:o.theme.colors['bg-oncolor-hover'],borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['alert-error']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),base:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['alert-error'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['bg-onmain-tertiary'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['alert-error'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(2).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['alert-error'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['alert-error']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-onmain-tertiary']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),outline:styled.css(["",""],(o=>template({color:o.success||o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['alert-error'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.loading?o.theme.colors['alert-bg-error-500']:o.theme.colors.transparent,borderColor:o.success||o.loading?o.theme.colors.transparent:o.theme.colors['alert-bg-error-500'],colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():o.theme.colors['alert-bg-error-500'],borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['alert-bg-error-500']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['alert-bg-error-500']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['alert-bg-error-500'],borderColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['alert-bg-error-500']).darken(2).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['alert-bg-error-500']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['alert-bg-error-500']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})))},black:{clear:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-inverse'],backgroundColor:o.theme.colors.transparent,borderColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-inverse'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-inverse'],backgroundColorActive:o.theme.colors['bg-oncolor-hover'],borderColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),base:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-oncolor-inverse'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['bg-onmain-tertiary'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-oncolor-inverse'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(4).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-oncolor-inverse'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(4).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),outline:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['content-oncolor-primary']:o.loading?o.theme.colors['content-onmain-inverse']:o.theme.colors['content-oncolor-inverse'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.loading?o.theme.colors['bg-onmain-inverse']:o.theme.colors.transparent,borderColor:o.success||o.loading?o.theme.colors.transparent:o.theme.colors['border-onmain-contrast'],colorHover:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-inverse'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():o.theme.colors['bg-onmain-inverse'],borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-inverse'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():tinycolor(o.theme.colors['bg-onmain-inverse']).lighten(4).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-inverse'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['bg-onmain-inverse'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-inverse'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():tinycolor(o.theme.colors['bg-onmain-inverse']).lighten(4).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-inverse'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():tinycolor(o.theme.colors['bg-onmain-inverse']).lighten(4).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})))},default:{clear:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.theme.colors['content-brand-primary'],backgroundColor:o.theme.colors.transparent,borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['alert-success']:o.theme.colors['content-brand-primary'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['alert-success']:o.theme.colors['content-brand-primary'],backgroundColorActive:o.theme.colors['bg-oncolor-hover'],borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-brand-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),base:styled.css(["",""],(o=>template({color:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-brand-primary'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['bg-onmain-tertiary'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-brand-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(2).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-brand-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-brand-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-onmain-tertiary']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),outline:styled.css(["",""],(o=>template({color:o.success||o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-brand-primary'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.loading?o.theme.colors['bg-brand-primary-basic']:o.theme.colors.transparent,borderColor:o.success||o.loading?o.theme.colors.transparent:o.theme.colors['border-brand-primary'],colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():o.theme.colors['bg-brand-primary-basic'],borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-brand-primary-basic']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-brand-primary-basic']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),default:styled.css(["",""],(o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['bg-brand-primary-basic'],borderColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-brand-primary-basic']).darken(2).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-brand-primary-basic']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-brand-primary-basic']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})))}};const defaultStyles=styled.css([""," "," "," "," "," ",""],(o=>o.disabled||o.loading?'':`\n      &:active {\n        box-shadow: inset 0 4px 0px 0px rgba(0, 0, 0, 0.14);\n      }\n      &:hover {\n        color: ${o.fontColor};\n        background-color: ${tinycolor(o.theme.colors[o.color]).saturate(-5).lighten(-8).toString()};\n      }\n      ${o.inverted||o.basic||o.outline?`\n              &:not(:hover) {\n                border: 1px solid ${o.theme.colors[o.color]};\n              }\n              &:hover {\n                border: 1px solid ${o.theme.colors[o.color]};\n              }\n            `:''}\n    `),(o=>o.loading?defaultLoadingStyles:''),(o=>{let r='background-color';return(o.inverted||o.basic||o.outline)&&(r='color'),color.color(o.color,r)}),(o=>{let r='color';return(o.inverted||o.basic||o.outline)&&(r='background-color'),color.color(o.fontColor,r)}),(o=>o.disabled?`\n      cursor: not-allowed;\n      background-color: ${o.theme.colors.mercury};\n      color: ${o.theme.colors.silver};\n    `:''),(o=>o.basic||o.outline?'background-color: transparent;':''));const Root=styled.button.withConfig({shouldForwardProp:shouldForwardButtonProp}).attrs((o=>({dynamicSizeDeclaration:(r,e)=>({fontSize:typeof r=='string'?r:`${r}${e}`,height:'2.8em',width:o.round?'2.8em':void 0,paddingRight:o.round?void 0:'1.6em',paddingLeft:o.round?void 0:'1.6em'})}))).withConfig({componentId:"fox-ui__sc-16o31r2-0"})([""," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ",""],(o=>{let r=o.inline?'inline-flex':'flex';o.display&&(r=o.display);let e='0px';o.rounded&&(e=o.preset==='brand'?'48px':'5px'),o.round&&(e='50%');let t='pointer';return o.disabled&&(t='not-allowed'),o.loading&&(t='wait'),`\n      display: ${r};\n      border-radius: ${e};\n      cursor: ${t};\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      justify-content: center;\n      align-items: center;\n      user-select: none;\n      border: none;\n      text-decoration: none;\n      appearance: none;\n      white-space: nowrap;\n      text-align: center;\n      vertical-align: top;\n      ${o.preset==='brand'?"\n            border: 1px solid transparent;\n            transition-property: background-color; \n            transition-duration: 250ms;\n            &::before {\n              transition-property: opacity; \n              transition-duration: 150ms;\n              transition-timing-function: ease-in;\n            }\n            &::before {\n              content: '';\n              position: absolute;\n              top: -1px;\n              left: -1px;\n              width: calc(100% + 2px);\n              height: calc(100% + 2px);\n              border-radius: inherit;\n              opacity: 0;\n            }\n            &:active:not(:disabled)::before {\n              opacity: 1;\n            }":"\n            border: none;\n            overflow: hidden;\n            transition-property: background-color, color;\n            transition-duration: 200ms;"}\n    `}),(o=>{if(o.preset==='default')return defaultStyles;let r=COLOR_SCHEMA.default;return o.black&&(r=COLOR_SCHEMA.black),o.danger&&(r=COLOR_SCHEMA.danger),o.onColored&&(r=COLOR_SCHEMA.onColored),o.clear?r.clear:o.base?r.base:o.outline?r.outline:r.default}),focus.focus,responsiveSize.responsiveSize,(o=>o.padding?responsiveProperty.property(o.padding,'padding'):null),(o=>o.paddingTop?responsiveProperty.property(o.paddingTop,'padding-top'):null),(o=>o.paddingRight?responsiveProperty.property(o.paddingRight,'padding-right'):null),(o=>o.paddingBottom?responsiveProperty.property(o.paddingBottom,'padding-bottom'):null),(o=>o.paddingLeft?responsiveProperty.property(o.paddingLeft,'padding-left'):null),(o=>o.margin?responsiveProperty.property(o.margin,'margin'):null),(o=>o.marginTop?responsiveProperty.property(o.marginTop,'margin-top'):null),(o=>o.marginRight?responsiveProperty.property(o.marginRight,'margin-right'):null),(o=>o.marginBottom?responsiveProperty.property(o.marginBottom,'margin-bottom'):null),(o=>o.marginLeft?responsiveProperty.property(o.marginLeft,'margin-left'):null),(o=>o.fontSize?responsiveProperty.property(o.fontSize,'font-size'):null),(o=>o.height?responsiveProperty.property(o.height,'height'):null),(o=>{const r=o.fluid&&o.width!=='auto'?'max-width':'width';return o.width?responsiveProperty.property(getWidth(o.width),r):null}),(({paddingXS:o,paddingS:r,paddingM:e,paddingL:t,paddingXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{paddingXS:o,paddingS:r,paddingM:e,paddingL:t,paddingXL:n},cssProperty:'padding'})),(({paddingTopXS:o,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{paddingTopXS:o,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:n},cssProperty:'padding-top'})),(({paddingRightXS:o,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{paddingRightXS:o,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:n},cssProperty:'padding-right'})),(({paddingBottomXS:o,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{paddingBottomXS:o,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:n},cssProperty:'padding-bottom'})),(({paddingLeftXS:o,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{paddingLeftXS:o,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:n},cssProperty:'padding-left'})),(({marginXS:o,marginS:r,marginM:e,marginL:t,marginXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{marginXS:o,marginS:r,marginM:e,marginL:t,marginXL:n},cssProperty:'margin'})),(({marginTopXS:o,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{marginTopXS:o,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:n},cssProperty:'margin-top'})),(({marginRightXS:o,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{marginRightXS:o,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:n},cssProperty:'margin-right'})),(({marginBottomXS:o,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{marginBottomXS:o,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:n},cssProperty:'margin-bottom'})),(({marginLeftXS:o,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{marginLeftXS:o,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:n},cssProperty:'margin-left'})),(({fontSizeXS:o,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{fontSizeXS:o,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:n},cssProperty:'font-size'})),(({heightXS:o,heightS:r,heightM:e,heightL:t,heightXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{heightXS:o,heightS:r,heightM:e,heightL:t,heightXL:n},cssProperty:'height'})),(({widthXS:o,widthS:r,widthM:e,widthL:t,widthXL:n,fluid:s,width:c})=>responsiveProperty.responsiveNamedProperty({sizes:{widthXS:o,widthS:r,widthM:e,widthL:t,widthXL:n},cssProperty:s&&c!=='auto'?'max-width':'width',customSizeHandler:getWidth})),(o=>o.fluid?responsiveProperty.property(o.fluid,fluidStyles):null),(({fluidXS:o,fluidS:r,fluidM:e,fluidL:t,fluidXL:n})=>responsiveProperty.responsiveNamedProperty({sizes:{fluidXS:o,fluidS:r,fluidM:e,fluidL:t,fluidXL:n},cssProperty:fluidStyles})));const LoaderIcon=styled(index.LoaderFill).withConfig({componentId:"fox-ui__sc-16o31r2-1"})(["transform-origin:center;animation:"," 1600ms infinite linear;"],spinAnimation);exports.LoaderIcon=LoaderIcon,exports.Root=Root;

package/components/Button/style.mjs

@@ -0,0 +1 @@
+import styled,{keyframes,css}from'styled-components';import tinycolor from'../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.mjs';import{property,responsiveNamedProperty}from'../../mixins/responsive-property.mjs';import{color}from'../../mixins/color.mjs';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{focus}from'../../mixins/focus.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveFluidPropKeyRegExp,responsiveWidthPropKeyRegExp,responsivePaddingPropKeyRegExp,responsiveFontSizePropKeyRegExp,responsiveHeightPropKeyRegExp}from'../../shared/regexp.mjs';import{LoaderFill as LoaderFill_2}from'../../external/.pnpm/@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/icons/LoaderFill/index.mjs';const shouldForwardButtonProp=createShouldForwardProp((o=>!['fluid','width','display','padding','paddingTop','paddingRight','paddingBottom','paddingLeft','fontSize','height','inline','round','success','loading','black','danger','onColored','clear','base','outline','autoRel','noSpacing','primary','secondary','inverted','rounded','basic'].includes(o)),(o=>!(responsiveFluidPropKeyRegExp.test(o)||responsiveWidthPropKeyRegExp.test(o)||responsivePaddingPropKeyRegExp.test(o)||responsiveFontSizePropKeyRegExp.test(o)||responsiveHeightPropKeyRegExp.test(o))));const WIDTHS={xl:320,l:280,m:245,s:180,xs:140};const loadingAnimation=keyframes(["0%{background-position:0 0;}100%{background-position:50px 50px;}"]);const spinAnimation=keyframes(["100%{transform:rotate(360deg);}"]);const defaultLoadingStyles=css(["background-image:linear-gradient( -45deg,rgba(255,255,255,0.2) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.2) 50%,rgba(255,255,255,0.2) 75%,transparent 75%,transparent );background-size:25px 25px;animation:"," 2s linear infinite;cursor:progress;"],loadingAnimation);const getWidth=o=>o==='auto'?'auto':typeof o=='number'||typeof o=='boolean'?o:o&&WIDTHS[o]?WIDTHS[o]:'auto';const fluidStyles=()=>css(["min-width:initial;width:100%;"]);const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  border-color: ${o.borderColor};\n  &::before {\n    box-shadow: inset 0px 4px 0px ${o.shadowColor};\n  }\n  &:hover {\n    color: ${o.colorHover};\n    background-color: ${o.backgroundColorHover};\n    border-color: ${o.borderColorHover};\n  }\n  &:active {\n    color: ${o.colorActive};\n    background-color: ${o.backgroundColorActive};\n    border-color: ${o.borderColorActive};\n  }\n  &:disabled {\n    color: ${o.colorDisabled};\n    background-color: ${o.backgroundColorDisabled};\n    border-color: ${o.borderColorDisabled};\n  }\n`;const COLOR_SCHEMA={onColored:{clear:css(["",""],(o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.theme.colors.transparent,borderColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.theme.colors['bg-oncontrast-hover'],borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.theme.colors['bg-oncontrast-hover'],borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors.transparent,borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncontrast-hover'],...o.palette}))),base:css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-primary'],backgroundColor:o.success?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-oncolor-secondary'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString():tinycolor(o.theme.colors['bg-oncolor-secondary']).darken(4).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString():tinycolor(o.theme.colors['bg-oncolor-secondary']).darken(4).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),outline:css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.loading?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColor:o.success||o.loading?o.theme.colors['bg-oncolor-primary']:o.theme.colors.transparent,borderColor:o.success||o.loading?o.theme.colors.transparent:o.theme.colors['border-oncolor-default'],colorHover:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-constant'],backgroundColorHover:o.success?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString():o.theme.colors['bg-oncolor-primary'],borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-constant'],backgroundColorActive:o.success?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString():o.theme.colors['bg-oncolor-primary'],borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),default:css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-constant'],backgroundColor:o.theme.colors['bg-oncolor-primary'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-constant'],backgroundColorHover:tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-constant'],backgroundColorActive:tinycolor(o.theme.colors['bg-oncolor-primary']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})))},danger:{clear:css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.theme.colors['alert-error'],backgroundColor:o.theme.colors.transparent,borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['alert-success']:o.theme.colors['alert-error'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['alert-success']:o.theme.colors['alert-error'],backgroundColorActive:o.theme.colors['bg-oncolor-hover'],borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['alert-error']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),base:css(["",""],(o=>template({color:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['alert-error'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['bg-onmain-tertiary'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['alert-error'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(2).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['alert-error'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['alert-error']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-onmain-tertiary']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),outline:css(["",""],(o=>template({color:o.success||o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['alert-error'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.loading?o.theme.colors['alert-bg-error-500']:o.theme.colors.transparent,borderColor:o.success||o.loading?o.theme.colors.transparent:o.theme.colors['alert-bg-error-500'],colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():o.theme.colors['alert-bg-error-500'],borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['alert-bg-error-500']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['alert-bg-error-500']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),default:css(["",""],(o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['alert-bg-error-500'],borderColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['alert-bg-error-500']).darken(2).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['alert-bg-error-500']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['alert-bg-error-500']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})))},black:{clear:css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.theme.colors['content-oncolor-inverse'],backgroundColor:o.theme.colors.transparent,borderColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-inverse'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-inverse'],backgroundColorActive:o.theme.colors['bg-oncolor-hover'],borderColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),base:css(["",""],(o=>template({color:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-oncolor-inverse'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['bg-onmain-tertiary'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-oncolor-inverse'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(4).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-oncolor-inverse'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(4).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),outline:css(["",""],(o=>template({color:o.success?o.theme.colors['content-oncolor-primary']:o.loading?o.theme.colors['content-onmain-inverse']:o.theme.colors['content-oncolor-inverse'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.loading?o.theme.colors['bg-onmain-inverse']:o.theme.colors.transparent,borderColor:o.success||o.loading?o.theme.colors.transparent:o.theme.colors['border-onmain-contrast'],colorHover:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-inverse'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():o.theme.colors['bg-onmain-inverse'],borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-inverse'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():tinycolor(o.theme.colors['bg-onmain-inverse']).lighten(4).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),default:css(["",""],(o=>template({color:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-inverse'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['bg-onmain-inverse'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-inverse'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():tinycolor(o.theme.colors['bg-onmain-inverse']).lighten(4).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-inverse'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).lighten(4).toString():tinycolor(o.theme.colors['bg-onmain-inverse']).lighten(4).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})))},default:{clear:css(["",""],(o=>template({color:o.success?o.theme.colors['alert-success']:o.theme.colors['content-brand-primary'],backgroundColor:o.theme.colors.transparent,borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['alert-success']:o.theme.colors['content-brand-primary'],backgroundColorHover:o.theme.colors['bg-oncolor-hover'],borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['alert-success']:o.theme.colors['content-brand-primary'],backgroundColorActive:o.theme.colors['bg-oncolor-hover'],borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-brand-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors.transparent,borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),base:css(["",""],(o=>template({color:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-brand-primary'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['bg-onmain-tertiary'],borderColor:o.theme.colors.transparent,colorHover:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-brand-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(2).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.success?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-brand-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-brand-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-onmain-tertiary']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),outline:css(["",""],(o=>template({color:o.success||o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-brand-primary'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.loading?o.theme.colors['bg-brand-primary-basic']:o.theme.colors.transparent,borderColor:o.success||o.loading?o.theme.colors.transparent:o.theme.colors['border-brand-primary'],colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():o.theme.colors['bg-brand-primary-basic'],borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-brand-primary-basic']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-brand-primary-basic']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette}))),default:css(["",""],(o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.success?o.theme.colors['alert-bg-success-500']:o.theme.colors['bg-brand-primary-basic'],borderColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-brand-primary-basic']).darken(2).toString(),borderColorHover:o.theme.colors.transparent,colorActive:o.theme.colors['content-oncolor-primary'],backgroundColorActive:o.success?tinycolor(o.theme.colors['alert-bg-success-500']).darken(2).toString():tinycolor(o.theme.colors['bg-brand-primary-basic']).darken(2).toString(),borderColorActive:o.theme.colors.transparent,colorDisabled:o.loading?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-disabled'],backgroundColorDisabled:o.loading?o.theme.colors['bg-brand-primary-basic']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,shadowColor:o.theme.colors['bg-oncolor-hover'],...o.palette})))}};const defaultStyles=css([""," "," "," "," "," ",""],(o=>o.disabled||o.loading?'':`\n      &:active {\n        box-shadow: inset 0 4px 0px 0px rgba(0, 0, 0, 0.14);\n      }\n      &:hover {\n        color: ${o.fontColor};\n        background-color: ${tinycolor(o.theme.colors[o.color]).saturate(-5).lighten(-8).toString()};\n      }\n      ${o.inverted||o.basic||o.outline?`\n              &:not(:hover) {\n                border: 1px solid ${o.theme.colors[o.color]};\n              }\n              &:hover {\n                border: 1px solid ${o.theme.colors[o.color]};\n              }\n            `:''}\n    `),(o=>o.loading?defaultLoadingStyles:''),(o=>{let r='background-color';return(o.inverted||o.basic||o.outline)&&(r='color'),color(o.color,r)}),(o=>{let r='color';return(o.inverted||o.basic||o.outline)&&(r='background-color'),color(o.fontColor,r)}),(o=>o.disabled?`\n      cursor: not-allowed;\n      background-color: ${o.theme.colors.mercury};\n      color: ${o.theme.colors.silver};\n    `:''),(o=>o.basic||o.outline?'background-color: transparent;':''));const Root=styled.button.withConfig({shouldForwardProp:shouldForwardButtonProp}).attrs((o=>({dynamicSizeDeclaration:(r,e)=>({fontSize:typeof r=='string'?r:`${r}${e}`,height:'2.8em',width:o.round?'2.8em':void 0,paddingRight:o.round?void 0:'1.6em',paddingLeft:o.round?void 0:'1.6em'})}))).withConfig({componentId:"fox-ui__sc-16o31r2-0"})([""," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ",""],(o=>{let r=o.inline?'inline-flex':'flex';o.display&&(r=o.display);let e='0px';o.rounded&&(e=o.preset==='brand'?'48px':'5px'),o.round&&(e='50%');let t='pointer';return o.disabled&&(t='not-allowed'),o.loading&&(t='wait'),`\n      display: ${r};\n      border-radius: ${e};\n      cursor: ${t};\n      box-sizing: border-box;\n      position: relative;\n      isolation: isolate;\n      justify-content: center;\n      align-items: center;\n      user-select: none;\n      border: none;\n      text-decoration: none;\n      appearance: none;\n      white-space: nowrap;\n      text-align: center;\n      vertical-align: top;\n      ${o.preset==='brand'?"\n            border: 1px solid transparent;\n            transition-property: background-color; \n            transition-duration: 250ms;\n            &::before {\n              transition-property: opacity; \n              transition-duration: 150ms;\n              transition-timing-function: ease-in;\n            }\n            &::before {\n              content: '';\n              position: absolute;\n              top: -1px;\n              left: -1px;\n              width: calc(100% + 2px);\n              height: calc(100% + 2px);\n              border-radius: inherit;\n              opacity: 0;\n            }\n            &:active:not(:disabled)::before {\n              opacity: 1;\n            }":"\n            border: none;\n            overflow: hidden;\n            transition-property: background-color, color;\n            transition-duration: 200ms;"}\n    `}),(o=>{if(o.preset==='default')return defaultStyles;let r=COLOR_SCHEMA.default;return o.black&&(r=COLOR_SCHEMA.black),o.danger&&(r=COLOR_SCHEMA.danger),o.onColored&&(r=COLOR_SCHEMA.onColored),o.clear?r.clear:o.base?r.base:o.outline?r.outline:r.default}),focus,responsiveSize,(o=>o.padding?property(o.padding,'padding'):null),(o=>o.paddingTop?property(o.paddingTop,'padding-top'):null),(o=>o.paddingRight?property(o.paddingRight,'padding-right'):null),(o=>o.paddingBottom?property(o.paddingBottom,'padding-bottom'):null),(o=>o.paddingLeft?property(o.paddingLeft,'padding-left'):null),(o=>o.margin?property(o.margin,'margin'):null),(o=>o.marginTop?property(o.marginTop,'margin-top'):null),(o=>o.marginRight?property(o.marginRight,'margin-right'):null),(o=>o.marginBottom?property(o.marginBottom,'margin-bottom'):null),(o=>o.marginLeft?property(o.marginLeft,'margin-left'):null),(o=>o.fontSize?property(o.fontSize,'font-size'):null),(o=>o.height?property(o.height,'height'):null),(o=>{const r=o.fluid&&o.width!=='auto'?'max-width':'width';return o.width?property(getWidth(o.width),r):null}),(({paddingXS:o,paddingS:r,paddingM:e,paddingL:t,paddingXL:n})=>responsiveNamedProperty({sizes:{paddingXS:o,paddingS:r,paddingM:e,paddingL:t,paddingXL:n},cssProperty:'padding'})),(({paddingTopXS:o,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:n})=>responsiveNamedProperty({sizes:{paddingTopXS:o,paddingTopS:r,paddingTopM:e,paddingTopL:t,paddingTopXL:n},cssProperty:'padding-top'})),(({paddingRightXS:o,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:n})=>responsiveNamedProperty({sizes:{paddingRightXS:o,paddingRightS:r,paddingRightM:e,paddingRightL:t,paddingRightXL:n},cssProperty:'padding-right'})),(({paddingBottomXS:o,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:n})=>responsiveNamedProperty({sizes:{paddingBottomXS:o,paddingBottomS:r,paddingBottomM:e,paddingBottomL:t,paddingBottomXL:n},cssProperty:'padding-bottom'})),(({paddingLeftXS:o,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:n})=>responsiveNamedProperty({sizes:{paddingLeftXS:o,paddingLeftS:r,paddingLeftM:e,paddingLeftL:t,paddingLeftXL:n},cssProperty:'padding-left'})),(({marginXS:o,marginS:r,marginM:e,marginL:t,marginXL:n})=>responsiveNamedProperty({sizes:{marginXS:o,marginS:r,marginM:e,marginL:t,marginXL:n},cssProperty:'margin'})),(({marginTopXS:o,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:n})=>responsiveNamedProperty({sizes:{marginTopXS:o,marginTopS:r,marginTopM:e,marginTopL:t,marginTopXL:n},cssProperty:'margin-top'})),(({marginRightXS:o,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:n})=>responsiveNamedProperty({sizes:{marginRightXS:o,marginRightS:r,marginRightM:e,marginRightL:t,marginRightXL:n},cssProperty:'margin-right'})),(({marginBottomXS:o,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:n})=>responsiveNamedProperty({sizes:{marginBottomXS:o,marginBottomS:r,marginBottomM:e,marginBottomL:t,marginBottomXL:n},cssProperty:'margin-bottom'})),(({marginLeftXS:o,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:n})=>responsiveNamedProperty({sizes:{marginLeftXS:o,marginLeftS:r,marginLeftM:e,marginLeftL:t,marginLeftXL:n},cssProperty:'margin-left'})),(({fontSizeXS:o,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:n})=>responsiveNamedProperty({sizes:{fontSizeXS:o,fontSizeS:r,fontSizeM:e,fontSizeL:t,fontSizeXL:n},cssProperty:'font-size'})),(({heightXS:o,heightS:r,heightM:e,heightL:t,heightXL:n})=>responsiveNamedProperty({sizes:{heightXS:o,heightS:r,heightM:e,heightL:t,heightXL:n},cssProperty:'height'})),(({widthXS:o,widthS:r,widthM:e,widthL:t,widthXL:n,fluid:s,width:c})=>responsiveNamedProperty({sizes:{widthXS:o,widthS:r,widthM:e,widthL:t,widthXL:n},cssProperty:s&&c!=='auto'?'max-width':'width',customSizeHandler:getWidth})),(o=>o.fluid?property(o.fluid,fluidStyles):null),(({fluidXS:o,fluidS:r,fluidM:e,fluidL:t,fluidXL:n})=>responsiveNamedProperty({sizes:{fluidXS:o,fluidS:r,fluidM:e,fluidL:t,fluidXL:n},cssProperty:fluidStyles})));const LoaderIcon=styled(LoaderFill_2).withConfig({componentId:"fox-ui__sc-16o31r2-1"})(["transform-origin:center;animation:"," 1600ms infinite linear;"],spinAnimation);export{LoaderIcon,Root};

package/components/Checkbox/Checkbox.js

@@ -0,0 +1 @@
+'use strict';var React=require('react');var styled=require('styled-components');var cx=require('clsx');var useClassname=require('../../hooks/useClassname.js');var useConfigPriority=require('../../hooks/use-config-priority.js');var Group=require('./Group.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var InputCheckbox=require('../InputCheckbox/InputCheckbox.js');const Checkbox=React.forwardRef(((e,r)=>{const s=styled.useTheme();const o=useClassname.useClassname("Checkbox");const{preset:t,style:c,id:n,name:i,value:u,disabled:a,error:l,success:d,fluid:h,children:C,label:x,checked:k,defaultChecked:b,background:p,onColored:$,size:y="m",inline:q=!0,width:m=s.defaultInputControlsWidth,className:f,onChange:j=()=>{},...v}=useConfigPriority.useConfigPriority(s.components?.Checkbox,e);let g=s.preset==='brand';typeof t=='string'&&(g=t==='brand');const I=cx(o,f,k&&`${o}--checked`);const N=`${o}__label`;return require$$0.jsxs(style.Root,{ref:r,className:I,style:c,fluid:h,disabled:a,htmlFor:n||i,size:y,inline:q,width:m,error:l,success:d,background:p,onColored:$,brandPresetUsed:g,children:[require$$0.jsx(style.Input,{...v,...k===void 0?{defaultChecked:b}:{checked:k},id:n||i,name:i,type:"checkbox",value:u,disabled:a,onChange:j}),g?require$$0.jsxs(require$$0.Fragment,{children:[p&&require$$0.jsx(style.Background,{}),require$$0.jsx(style.BrandMask,{children:require$$0.jsx(style.CheckIcon,{})})]}):require$$0.jsx(style.DefaultMask,{}),(x||C)&&require$$0.jsx(style.Content,{className:N,children:x||C})]})}));Checkbox.Input=InputCheckbox.InputCheckbox,Checkbox.Group=Group.CheckboxGroup,Checkbox.displayName="Checkbox",exports.COMPONENT_NAME="Checkbox",exports.Checkbox=Checkbox;

package/components/Checkbox/Checkbox.mjs

@@ -0,0 +1 @@
+import{forwardRef}from'react';import{useTheme}from'styled-components';import cx from'clsx';import{useClassname}from'../../hooks/useClassname.mjs';import{useConfigPriority}from'../../hooks/use-config-priority.mjs';import{CheckboxGroup}from'./Group.mjs';import{Root,Input,Background,BrandMask,CheckIcon,DefaultMask,Content}from'./style.mjs';import{jsxs,jsx,Fragment}from'react/jsx-runtime';import{InputCheckbox}from'../InputCheckbox/InputCheckbox.mjs';const COMPONENT_NAME='Checkbox';const Checkbox=forwardRef(((e,o)=>{const s=useTheme();const r=useClassname("Checkbox");const{preset:n,style:t,id:c,name:a,value:d,disabled:i,error:m,success:l,fluid:h,children:u,label:k,checked:C,defaultChecked:x,background:p,onColored:b,size:f="m",inline:j=!0,width:g=s.defaultInputControlsWidth,className:y,onChange:I=()=>{},...N}=useConfigPriority(s.components?.Checkbox,e);let M=s.preset==='brand';typeof n=='string'&&(M=n==='brand');const P=cx(r,y,C&&`${r}--checked`);const w=`${r}__label`;return jsxs(Root,{ref:o,className:P,style:t,fluid:h,disabled:i,htmlFor:c||a,size:f,inline:j,width:g,error:m,success:l,background:p,onColored:b,brandPresetUsed:M,children:[jsx(Input,{...N,...C===void 0?{defaultChecked:x}:{checked:C},id:c||a,name:a,type:"checkbox",value:d,disabled:i,onChange:I}),M?jsxs(Fragment,{children:[p&&jsx(Background,{}),jsx(BrandMask,{children:jsx(CheckIcon,{})})]}):jsx(DefaultMask,{}),(k||u)&&jsx(Content,{className:w,children:k||u})]})}));Checkbox.Input=InputCheckbox,Checkbox.Group=CheckboxGroup,Checkbox.displayName="Checkbox";export{COMPONENT_NAME,Checkbox};

package/components/Checkbox/Group.js

@@ -0,0 +1 @@
+'use strict';var style=require('./style.js');var require$$0=require('react/jsx-runtime');exports.CheckboxGroup=({children:e,...r})=>require$$0.jsx(style.Group,{...r,children:e});

package/components/Checkbox/Group.mjs

@@ -0,0 +1 @@
+import{Group}from'./style.mjs';import{jsx}from'react/jsx-runtime';const CheckboxGroup=({children:r,...o})=>jsx(Group,{...o,children:r});export{CheckboxGroup};

package/components/Checkbox/images/check-default.svg.js

@@ -0,0 +1 @@
+'use strict';function _interopNamespaceDefault(e){var t=Object.create(null);return e&&Object.keys(e).forEach((r=>{if(r!=='default'){var a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:()=>e[r]})}})),t.default=e,Object.freeze(t)}var React__namespace=_interopNamespaceDefault(require('react'));var _rect,_g;function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)({}).hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},_extends.apply(null,arguments)}module.exports=e=>React__namespace.createElement("svg",_extends({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20"},e),_rect||(_rect=React__namespace.createElement("rect",{width:19.091,height:19.091,x:.455,y:.455,fill:"#fff",stroke:"#B8B8B8",rx:5})),_g||(_g=React__namespace.createElement("g",{fill:"none"},React__namespace.createElement("rect",{width:20,height:20,fill:"#1A96F6",rx:5}),React__namespace.createElement("path",{stroke:"#fff",strokeWidth:2,d:"M6 9.99 9 13l6-6"}))));

package/components/Checkbox/images/check-default.svg.mjs

@@ -0,0 +1 @@
+import*as React from'react';var _rect,_g;function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)({}).hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},_extends.apply(null,arguments)}const SvgCheckDefault=e=>React.createElement("svg",_extends({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20"},e),_rect||(_rect=React.createElement("rect",{width:19.091,height:19.091,x:.455,y:.455,fill:"#fff",stroke:"#B8B8B8",rx:5})),_g||(_g=React.createElement("g",{fill:"none"},React.createElement("rect",{width:20,height:20,fill:"#1A96F6",rx:5}),React.createElement("path",{stroke:"#fff",strokeWidth:2,d:"M6 9.99 9 13l6-6"}))));export{SvgCheckDefault as default};

package/components/Checkbox/images/check.svg.js

@@ -0,0 +1 @@
+'use strict';function _interopNamespaceDefault(e){var t=Object.create(null);return e&&Object.keys(e).forEach((r=>{if(r!=='default'){var a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:()=>e[r]})}})),t.default=e,Object.freeze(t)}var React__namespace=_interopNamespaceDefault(require('react'));var _path;function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)({}).hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},_extends.apply(null,arguments)}module.exports=e=>React__namespace.createElement("svg",_extends({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 12 9"},e),_path||(_path=React__namespace.createElement("path",{stroke:"currentcolor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M10.5 1.5 4.312 8 1.5 5.045"})));

package/components/Checkbox/images/check.svg.mjs

@@ -0,0 +1 @@
+import*as React from'react';var _path;function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},_extends.apply(null,arguments)}const SvgCheck=e=>React.createElement("svg",_extends({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 12 9"},e),_path||(_path=React.createElement("path",{stroke:"currentcolor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M10.5 1.5 4.312 8 1.5 5.045"})));export{SvgCheck as default};

package/components/Checkbox/style.js

@@ -0,0 +1,10 @@
+'use strict';var styled=require('styled-components');var tinycolor=require('../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.js');var screen=require('../../mixins/screen.js');var responsiveProperty=require('../../mixins/responsive-property.js');var checkDefault=require('./images/check-default.svg.js');var check=require('./images/check.svg.js');const DEFAULT_SIZES={extraSmall:12,xs:12,small:14,s:14,medium:16,m:16,large:18,l:18,extraLarge:20,xl:20};const BRAND_SIZES={extraSmall:16,xs:16,small:20,s:20,medium:24,m:24,large:28,l:28,extraLarge:32,xl:32};const STATIC_SIZES=['extraSmall','xs','small','s','medium','m','large','l','extraLarge','xl'];const baseStyles=styled.css(["",""],(o=>`\n    &,\n    & * {\n      box-sizing: border-box;\n    }\n    position: relative;\n    cursor: pointer;\n    padding: ${o.background?12:0}px;\n    display: ${o.inline?'inline-flex':'flex'};\n    align-items: baseline;\n    isolation: isolate;\n    & + & {\n      margin-left: 15px;\n    }\n  `));const Input=styled.input.withConfig({componentId:"fox-ui__sc-9s6oap-0"})(["position:absolute;opacity:0;z-index:-1;&:focus{outline:none;}"]);const Background=styled.span.withConfig({componentId:"fox-ui__sc-9s6oap-1"})(["border-radius:8px;border:1px solid;border-color:transparent;overflow:hidden;&::before{content:'';opacity:0;}&,&::before{position:absolute;top:0;left:0;width:100%;height:100%;transition-property:border-color,background-color,opacity;transition-duration:150ms;transition-timing-function:ease-in;}"]);const DefaultMask=styled(checkDefault).withConfig({componentId:"fox-ui__sc-9s6oap-2"})(["position:relative;top:2px;width:1em;height:1em;flex-shrink:0;g{opacity:0;transition:opacity 200ms ease;}"]);const BrandMask=styled.div.withConfig({componentId:"fox-ui__sc-9s6oap-3"})(["position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1em;height:1em;border-radius:4px;border:1px solid;border-color:transparent;transition-property:border-color;transition-duration:150ms;transition-timing-function:ease-in;"]);const CheckIcon=styled(check).withConfig({componentId:"fox-ui__sc-9s6oap-4"})(["width:50%;opacity:0;"]);const Content=styled.span.withConfig({componentId:"fox-ui__sc-9s6oap-5"})(["position:relative;margin-left:10px;"]);const template=o=>`\n  & > ${Content} {\n    color: ${o.fontColor};\n  }\n  & > ${BrandMask} {\n    background-color: ${o.bg};\n    color: ${o.color};\n    border-color: ${o.border};\n  }\n  & > ${Input}:checked ~ ${BrandMask} {\n    border-color: transparent;\n    background-color: ${o.bgChecked};\n  }\n  & > ${Input}:checked ~ ${BrandMask} > ${CheckIcon} {\n    opacity: 1;\n  }\n  & > ${Input}:disabled ~ ${Content} {\n    color: ${o.colorDisabled};\n  }\n  &:hover > ${BrandMask} {\n    border-color: ${o.borderHover};\n  }\n  &:focus {\n    outline: none;\n  }\n  & > ${Input}:focus-visible ~ ${BrandMask} {\n    outline: 1px solid ${o.outlineFocus};\n    outline-offset: 2px;\n  }\n`;const templateBackground=o=>`\n  & > ${Background} {\n    background-color: ${o.bg};\n    border-color: ${o.border};\n  }\n  & > ${Input}:checked ~ ${Background} {\n    background-color: ${o.bgChecked};\n    border-color: ${o.borderChecked};\n  }\n  &:hover > ${Background} {\n    background-color: ${o.bgHover};\n    border-color: ${o.borderHover};\n  }\n  &:hover > ${Background}::before {\n    background-color: ${o.beforeBgHover};\n    opacity: 1;\n  }\n`;const PRESET={default:{regular:styled.css([""," ",""],(o=>template({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-basic'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['border-brand-primary'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-100'],borderChecked:o.theme.colors['border-brand-primary'],bgHover:o.theme.colors['bg-oncolor-hover'],borderHover:o.theme.colors['border-onmain-default-large'],beforeBgHover:'transparent'}):null)),error:styled.css([""," ",""],(o=>template({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['alert-bg-error-100'],border:o.theme.colors['alert-error'],bgChecked:o.theme.colors['alert-bg-error-100'],borderChecked:o.theme.colors['alert-error'],bgHover:o.theme.colors['alert-bg-error-100'],borderHover:o.theme.colors['alert-error'],beforeBgHover:'transparent'}):null)),success:styled.css([""," ",""],(o=>template({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['alert-bg-success-100'],border:o.theme.colors['alert-success'],bgChecked:o.theme.colors['alert-bg-success-100'],borderChecked:o.theme.colors['alert-success'],bgHover:o.theme.colors['alert-bg-success-100'],borderHover:o.theme.colors['alert-success'],beforeBgHover:'transparent'}):null)),disabled:styled.css(["cursor:auto;"," ",""],(o=>template({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['bg-disabled-large'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-large'],borderChecked:o.theme.colors['bg-disabled-active'],bgHover:o.theme.colors['bg-disabled-large'],borderHover:o.theme.colors['border-disabled'],beforeBgHover:'transparent'}):null))},onColored:{regular:styled.css([""," ",""],(o=>template(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-basic'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['border-brand-primary'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-brand-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-oncolor-primary'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['content-oncolor-primary'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-onmain-default-large'],bgChecked:o.theme.colors['bg-onmain-primary'],borderChecked:o.theme.colors['border-onmain-default-large'],bgHover:o.theme.colors['bg-onmain-secondary'],borderHover:o.theme.colors['border-onmain-default-large'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),error:styled.css([""," ",""],(o=>template(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['alert-bg-error-100'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-100'],borderChecked:o.theme.colors['alert-error'],bgHover:o.theme.colors['alert-bg-error-100'],borderHover:o.theme.colors['alert-error'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),success:styled.css([""," ",""],(o=>template(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['alert-bg-success-100'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-100'],borderChecked:o.theme.colors['alert-success'],bgHover:o.theme.colors['alert-bg-success-100'],borderHover:o.theme.colors['alert-success'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),disabled:styled.css(["cursor:auto;"," ",""],(o=>template(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-oncolor-disabled'],bgChecked:o.theme.colors['bg-onmain-secondary'],borderChecked:o.theme.colors['border-oncolor-disabled'],bgHover:o.theme.colors['bg-onmain-secondary'],borderHover:o.theme.colors['border-oncolor-disabled'],beforeBgHover:'transparent'}):null))}};const PRESET_DEFAULT={default:styled.css([""," ",""],(o=>o.error?`\n          & > ${DefaultMask} > rect { \n            fill: ${tinycolor(o.theme.colors.pomegranate).setAlpha(.1).toString()};\n            stroke: ${o.theme.colors.pomegranate};\n          }  \n          & > ${DefaultMask} g > rect {\n            fill: ${o.theme.colors.pomegranate};\n          }\n        `:null),(o=>`\n      color: ${o.disabled?o.theme.colors.alto:o.theme.colors.mineShaft};\n      cursor: ${o.disabled?'not-allowed':'pointer'};\n\n      & > ${Input}:checked ~ ${DefaultMask} g {\n        opacity: 1;\n      }\n      & > ${Input}:disabled ~ ${DefaultMask} > rect {\n        fill: ${o.theme.colors.white};\n        stroke: ${o.theme.colors.grey};\n      }\n      & > ${Input}:checked:disabled ~ ${DefaultMask} g > rect {\n        fill: ${o.theme.colors.alto};\n      }\n      &:focus {\n        outline: none;\n      }\n      & > ${Input}:focus-visible ~ ${DefaultMask} {\n        outline: 1px solid ${o.theme.colors.accent};\n        outline-offset: 2px;\n      }\n    `))};const Root=styled.label.withConfig({shouldForwardProp:o=>['children','htmlFor','style'].includes(o)}).withConfig({componentId:"fox-ui__sc-9s6oap-6"})([""," "," "," "," ",""],baseStyles,(o=>o.brandPresetUsed?o.disabled&&!o.onColored?PRESET.default.disabled:o.disabled&&o.onColored?PRESET.onColored.disabled:!o.error||o.success||o.onColored?o.error&&!o.success&&o.onColored?PRESET.onColored.error:!o.success||o.error||o.onColored?o.success&&!o.error&&o.onColored?PRESET.onColored.success:o.onColored?PRESET.onColored.regular:PRESET.default.regular:PRESET.default.success:PRESET.default.error:PRESET_DEFAULT.default),(o=>{const e=o.brandPresetUsed?BRAND_SIZES:DEFAULT_SIZES;return STATIC_SIZES.includes(o.size)?`font-size: ${e[o.size]}px;`:responsiveProperty.responsiveProperty('size','font-size')}),(o=>responsiveProperty.responsiveProperty('width',o.fluid&&o.width!=='auto'&&!Array.isArray(o.width)?'max-width':'width')),(o=>o.fluid?'width: 100%;':null));const Group=styled.div.withConfig({shouldForwardProp:o=>o!=='inline'}).withConfig({componentId:"fox-ui__sc-9s6oap-7"})(["",""],(o=>o.inline?styled.css(["display:flex;flex-direction:row;> ",":first-child{margin-left:0;}> ",":not(:first-child){margin-left:15px;}",""],Root,Root,screen.screenMaxS()`
+            flex-direction: column;
+            > ${Root}:first-child {
+              margin-top: 0;
+            }
+            > ${Root}:not(:first-child) {
+              margin-top: 15px;
+              margin-left: 0;
+            }
+          `):`\n          display: flex;\n          flex-direction: column;\n          > ${Root}:first-child {\n            margin-top: 0;\n            margin-left: 0;\n          }\n          > ${Root}:not(:first-child) {\n            margin-top: 15px;\n            margin-left: 0;\n          }\n      `));exports.Background=Background,exports.BrandMask=BrandMask,exports.CheckIcon=CheckIcon,exports.Content=Content,exports.DefaultMask=DefaultMask,exports.Group=Group,exports.Input=Input,exports.Root=Root;

package/components/Checkbox/style.mjs

@@ -0,0 +1,10 @@
+import styled,{css}from'styled-components';import tinycolor from'../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.mjs';import{screenMaxS}from'../../mixins/screen.mjs';import{responsiveProperty}from'../../mixins/responsive-property.mjs';import SvgCheckDefault from'./images/check-default.svg.mjs';import SvgCheck from'./images/check.svg.mjs';const DEFAULT_SIZES={extraSmall:12,xs:12,small:14,s:14,medium:16,m:16,large:18,l:18,extraLarge:20,xl:20};const BRAND_SIZES={extraSmall:16,xs:16,small:20,s:20,medium:24,m:24,large:28,l:28,extraLarge:32,xl:32};const STATIC_SIZES=['extraSmall','xs','small','s','medium','m','large','l','extraLarge','xl'];const baseStyles=css(["",""],(o=>`\n    &,\n    & * {\n      box-sizing: border-box;\n    }\n    position: relative;\n    cursor: pointer;\n    padding: ${o.background?12:0}px;\n    display: ${o.inline?'inline-flex':'flex'};\n    align-items: baseline;\n    isolation: isolate;\n    & + & {\n      margin-left: 15px;\n    }\n  `));const Input=styled.input.withConfig({componentId:"fox-ui__sc-9s6oap-0"})(["position:absolute;opacity:0;z-index:-1;&:focus{outline:none;}"]);const Background=styled.span.withConfig({componentId:"fox-ui__sc-9s6oap-1"})(["border-radius:8px;border:1px solid;border-color:transparent;overflow:hidden;&::before{content:'';opacity:0;}&,&::before{position:absolute;top:0;left:0;width:100%;height:100%;transition-property:border-color,background-color,opacity;transition-duration:150ms;transition-timing-function:ease-in;}"]);const DefaultMask=styled(SvgCheckDefault).withConfig({componentId:"fox-ui__sc-9s6oap-2"})(["position:relative;top:2px;width:1em;height:1em;flex-shrink:0;g{opacity:0;transition:opacity 200ms ease;}"]);const BrandMask=styled.div.withConfig({componentId:"fox-ui__sc-9s6oap-3"})(["position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1em;height:1em;border-radius:4px;border:1px solid;border-color:transparent;transition-property:border-color;transition-duration:150ms;transition-timing-function:ease-in;"]);const CheckIcon=styled(SvgCheck).withConfig({componentId:"fox-ui__sc-9s6oap-4"})(["width:50%;opacity:0;"]);const Content=styled.span.withConfig({componentId:"fox-ui__sc-9s6oap-5"})(["position:relative;margin-left:10px;"]);const template=o=>`\n  & > ${Content} {\n    color: ${o.fontColor};\n  }\n  & > ${BrandMask} {\n    background-color: ${o.bg};\n    color: ${o.color};\n    border-color: ${o.border};\n  }\n  & > ${Input}:checked ~ ${BrandMask} {\n    border-color: transparent;\n    background-color: ${o.bgChecked};\n  }\n  & > ${Input}:checked ~ ${BrandMask} > ${CheckIcon} {\n    opacity: 1;\n  }\n  & > ${Input}:disabled ~ ${Content} {\n    color: ${o.colorDisabled};\n  }\n  &:hover > ${BrandMask} {\n    border-color: ${o.borderHover};\n  }\n  &:focus {\n    outline: none;\n  }\n  & > ${Input}:focus-visible ~ ${BrandMask} {\n    outline: 1px solid ${o.outlineFocus};\n    outline-offset: 2px;\n  }\n`;const templateBackground=o=>`\n  & > ${Background} {\n    background-color: ${o.bg};\n    border-color: ${o.border};\n  }\n  & > ${Input}:checked ~ ${Background} {\n    background-color: ${o.bgChecked};\n    border-color: ${o.borderChecked};\n  }\n  &:hover > ${Background} {\n    background-color: ${o.bgHover};\n    border-color: ${o.borderHover};\n  }\n  &:hover > ${Background}::before {\n    background-color: ${o.beforeBgHover};\n    opacity: 1;\n  }\n`;const PRESET={default:{regular:css([""," ",""],(o=>template({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-basic'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['border-brand-primary'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-100'],borderChecked:o.theme.colors['border-brand-primary'],bgHover:o.theme.colors['bg-oncolor-hover'],borderHover:o.theme.colors['border-onmain-default-large'],beforeBgHover:'transparent'}):null)),error:css([""," ",""],(o=>template({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['alert-bg-error-100'],border:o.theme.colors['alert-error'],bgChecked:o.theme.colors['alert-bg-error-100'],borderChecked:o.theme.colors['alert-error'],bgHover:o.theme.colors['alert-bg-error-100'],borderHover:o.theme.colors['alert-error'],beforeBgHover:'transparent'}):null)),success:css([""," ",""],(o=>template({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['alert-bg-success-100'],border:o.theme.colors['alert-success'],bgChecked:o.theme.colors['alert-bg-success-100'],borderChecked:o.theme.colors['alert-success'],bgHover:o.theme.colors['alert-bg-success-100'],borderHover:o.theme.colors['alert-success'],beforeBgHover:'transparent'}):null)),disabled:css(["cursor:auto;"," ",""],(o=>template({fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['bg-disabled-large'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-large'],borderChecked:o.theme.colors['bg-disabled-active'],bgHover:o.theme.colors['bg-disabled-large'],borderHover:o.theme.colors['border-disabled'],beforeBgHover:'transparent'}):null))},onColored:{regular:css([""," ",""],(o=>template(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-brand-primary-basic'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['border-brand-primary'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['bg-onmain-primary'],color:o.theme.colors['content-brand-primary'],border:o.theme.colors['border-onmain-default-small'],bgChecked:o.theme.colors['bg-oncolor-primary'],borderHover:o.theme.colors['border-brand-primary'],outlineFocus:o.theme.colors['content-oncolor-primary'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-onmain-default-large'],bgChecked:o.theme.colors['bg-onmain-primary'],borderChecked:o.theme.colors['border-onmain-default-large'],bgHover:o.theme.colors['bg-onmain-secondary'],borderHover:o.theme.colors['border-onmain-default-large'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),error:css([""," ",""],(o=>template(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['alert-bg-error-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-500'],borderHover:o.theme.colors['alert-error'],outlineFocus:o.theme.colors['alert-error'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['alert-bg-error-100'],border:o.theme.colors['alert-bg-error-500'],bgChecked:o.theme.colors['alert-bg-error-100'],borderChecked:o.theme.colors['alert-error'],bgHover:o.theme.colors['alert-bg-error-100'],borderHover:o.theme.colors['alert-error'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),success:css([""," ",""],(o=>template(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-oncolor-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['alert-bg-success-100'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-500'],borderHover:o.theme.colors['alert-success'],outlineFocus:o.theme.colors['alert-success'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['alert-bg-success-100'],border:o.theme.colors['alert-bg-success-500'],bgChecked:o.theme.colors['alert-bg-success-100'],borderChecked:o.theme.colors['alert-success'],bgHover:o.theme.colors['alert-bg-success-100'],borderHover:o.theme.colors['alert-success'],beforeBgHover:o.theme.colors['bg-oncolor-hover']}):null)),disabled:css(["cursor:auto;"," ",""],(o=>template(o.background?{fontColor:o.theme.colors['content-onmain-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-disabled']}:{fontColor:o.theme.colors['content-oncolor-primary'],bg:o.theme.colors['bg-disabled-large'],color:o.theme.colors['content-oncolor-primary'],border:o.theme.colors['border-disabled'],bgChecked:o.theme.colors['bg-disabled-active'],borderHover:o.theme.colors['border-disabled'],outlineFocus:o.theme.colors['border-disabled'],colorDisabled:o.theme.colors['content-oncolor-disabled']})),(o=>o.background?templateBackground({bg:o.theme.colors['bg-onmain-secondary'],border:o.theme.colors['border-oncolor-disabled'],bgChecked:o.theme.colors['bg-onmain-secondary'],borderChecked:o.theme.colors['border-oncolor-disabled'],bgHover:o.theme.colors['bg-onmain-secondary'],borderHover:o.theme.colors['border-oncolor-disabled'],beforeBgHover:'transparent'}):null))}};const PRESET_DEFAULT={default:css([""," ",""],(o=>o.error?`\n          & > ${DefaultMask} > rect { \n            fill: ${tinycolor(o.theme.colors.pomegranate).setAlpha(.1).toString()};\n            stroke: ${o.theme.colors.pomegranate};\n          }  \n          & > ${DefaultMask} g > rect {\n            fill: ${o.theme.colors.pomegranate};\n          }\n        `:null),(o=>`\n      color: ${o.disabled?o.theme.colors.alto:o.theme.colors.mineShaft};\n      cursor: ${o.disabled?'not-allowed':'pointer'};\n\n      & > ${Input}:checked ~ ${DefaultMask} g {\n        opacity: 1;\n      }\n      & > ${Input}:disabled ~ ${DefaultMask} > rect {\n        fill: ${o.theme.colors.white};\n        stroke: ${o.theme.colors.grey};\n      }\n      & > ${Input}:checked:disabled ~ ${DefaultMask} g > rect {\n        fill: ${o.theme.colors.alto};\n      }\n      &:focus {\n        outline: none;\n      }\n      & > ${Input}:focus-visible ~ ${DefaultMask} {\n        outline: 1px solid ${o.theme.colors.accent};\n        outline-offset: 2px;\n      }\n    `))};const Root=styled.label.withConfig({shouldForwardProp:o=>['children','htmlFor','style'].includes(o)}).withConfig({componentId:"fox-ui__sc-9s6oap-6"})([""," "," "," "," ",""],baseStyles,(o=>o.brandPresetUsed?o.disabled&&!o.onColored?PRESET.default.disabled:o.disabled&&o.onColored?PRESET.onColored.disabled:!o.error||o.success||o.onColored?o.error&&!o.success&&o.onColored?PRESET.onColored.error:!o.success||o.error||o.onColored?o.success&&!o.error&&o.onColored?PRESET.onColored.success:o.onColored?PRESET.onColored.regular:PRESET.default.regular:PRESET.default.success:PRESET.default.error:PRESET_DEFAULT.default),(o=>{const e=o.brandPresetUsed?BRAND_SIZES:DEFAULT_SIZES;return STATIC_SIZES.includes(o.size)?`font-size: ${e[o.size]}px;`:responsiveProperty('size','font-size')}),(o=>responsiveProperty('width',o.fluid&&o.width!=='auto'&&!Array.isArray(o.width)?'max-width':'width')),(o=>o.fluid?'width: 100%;':null));const Group=styled.div.withConfig({shouldForwardProp:o=>o!=='inline'}).withConfig({componentId:"fox-ui__sc-9s6oap-7"})(["",""],(o=>o.inline?css(["display:flex;flex-direction:row;> ",":first-child{margin-left:0;}> ",":not(:first-child){margin-left:15px;}",""],Root,Root,screenMaxS()`
+            flex-direction: column;
+            > ${Root}:first-child {
+              margin-top: 0;
+            }
+            > ${Root}:not(:first-child) {
+              margin-top: 15px;
+              margin-left: 0;
+            }
+          `):`\n          display: flex;\n          flex-direction: column;\n          > ${Root}:first-child {\n            margin-top: 0;\n            margin-left: 0;\n          }\n          > ${Root}:not(:first-child) {\n            margin-top: 15px;\n            margin-left: 0;\n          }\n      `));export{Background,BrandMask,CheckIcon,Content,DefaultMask,Group,Input,Root};

package/components/Chip/Chip.js

@@ -0,0 +1 @@
+'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var constants=require('./constants.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Icon=require('../Icon/Icon.js');var Avatar=require('../Avatar/Avatar.js');var Text=require('../Text/Text.js');var Indicator=require('../Indicator/Indicator.js');var IconButton=require('../IconButton/IconButton.js');const Chip=withMergedProps.withMergedProps(React.forwardRef(((e,r)=>{const{size:t="m",textProps:i={},captionProps:s={},iconProps:n={},avatarProps:o={},indicatorProps:a={},discardButtonProps:c={},sizeXXS:p,sizeXS:d,sizeS:u,sizeM:l,sizeL:x,sizeXL:$,children:q,text:v,caption:h,icon:j,...z}=e;let I='div';let y;z.onClick&&(I='button'),c.onClick&&(I='div'),I==='button'&&(y='button'),z.type&&(y=z.type);const P={size:t,sizeXXS:p,sizeXS:d,sizeS:u,sizeM:l,sizeL:x,sizeXL:$};const[g,b]=Array.isArray(j)?j:[j];const f={as:'span',appearance:'body',size:'inherit',color:'inherit',lineHeight:h?1.3:1};const C={as:'span',appearance:'body',size:.75,sizeUnits:'em',color:'inherit',lineHeight:1};const S={icon:'close',square:!0,disabled:z.disabled};return require$$0.jsx(style.Root,{...z,...P,as:I,type:y,ref:r,children:typeof q=='function'?q({textProps:f,captionProps:C,discardButtonProps:S}):require$$0.jsxs(require$$0.Fragment,{children:[g&&require$$0.jsx(Icon.Icon,{preset:"brand",name:typeof g=='string'?g:void 0,icon:typeof g!='string'?g:void 0,...n}),(o.src||o.text)&&require$$0.jsx(Avatar.Avatar,{...P,preset:"brand",...o}),require$$0.jsxs(style.Content,{children:[require$$0.jsx(Text.Text,{...f,...i,children:q??v}),h&&require$$0.jsx(Text.Text,{...C,...s,children:h})]}),(a.children||a.text)&&require$$0.jsx(Indicator.Indicator,{...P,...a}),b&&require$$0.jsx(Icon.Icon,{preset:"brand",name:typeof b=='string'?b:void 0,icon:typeof b!='string'?b:void 0,...n}),c.onClick&&require$$0.jsx(IconButton.IconButton,{...P,...S,...c})]})})})),{displayName:'Chip',sizes:constants.SIZES});exports.Chip=Chip;

package/components/Chip/Chip.mjs

@@ -0,0 +1 @@
+import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES}from'./constants.mjs';import{Root,Content}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{Icon}from'../Icon/Icon.mjs';import{Avatar}from'../Avatar/Avatar.mjs';import{Text}from'../Text/Text.mjs';import{Indicator}from'../Indicator/Indicator.mjs';import{IconButton}from'../IconButton/IconButton.mjs';const Chip=withMergedProps(forwardRef(((t,o)=>{const{size:r="m",textProps:e={},captionProps:s={},iconProps:i={},avatarProps:n={},indicatorProps:c={},discardButtonProps:a={},sizeXXS:p,sizeXS:d,sizeS:m,sizeM:x,sizeL:f,sizeXL:j,children:l,text:h,caption:z,icon:I,...y}=t;let u='div';let P;y.onClick&&(u='button'),a.onClick&&(u='div'),u==='button'&&(P='button'),y.type&&(P=y.type);const g={size:r,sizeXXS:p,sizeXS:d,sizeS:m,sizeM:x,sizeL:f,sizeXL:j};const[v,b]=Array.isArray(I)?I:[I];const S={as:'span',appearance:'body',size:'inherit',color:'inherit',lineHeight:z?1.3:1};const C={as:'span',appearance:'body',size:.75,sizeUnits:'em',color:'inherit',lineHeight:1};const X={icon:'close',square:!0,disabled:y.disabled};return jsx(Root,{...y,...g,as:u,type:P,ref:o,children:typeof l=='function'?l({textProps:S,captionProps:C,discardButtonProps:X}):jsxs(Fragment,{children:[v&&jsx(Icon,{preset:"brand",name:typeof v=='string'?v:void 0,icon:typeof v!='string'?v:void 0,...i}),(n.src||n.text)&&jsx(Avatar,{...g,preset:"brand",...n}),jsxs(Content,{children:[jsx(Text,{...S,...e,children:l??h}),z&&jsx(Text,{...C,...s,children:z})]}),(c.children||c.text)&&jsx(Indicator,{...g,...c}),b&&jsx(Icon,{preset:"brand",name:typeof b=='string'?b:void 0,icon:typeof b!='string'?b:void 0,...i}),a.onClick&&jsx(IconButton,{...g,...X,...a})]})})})),{displayName:'Chip',sizes:SIZES});export{Chip};

package/components/Chip/constants.js

@@ -0,0 +1 @@
+'use strict';exports.SIZES={xxxl:{fontSize:18,minHeight:40,padding:8,borderRadius:8},xxl:{fontSize:18,minHeight:40,padding:8,borderRadius:8},xl:{fontSize:18,minHeight:40,padding:8,borderRadius:8},l:{fontSize:18,minHeight:40,padding:8,borderRadius:8},m:{fontSize:16,minHeight:36,padding:7,borderRadius:8},s:{fontSize:14,minHeight:32,padding:6,borderRadius:7},xs:{fontSize:12,minHeight:20,padding:4,borderRadius:4},xxs:{fontSize:12,minHeight:20,padding:4,borderRadius:4},xxxs:{fontSize:12,minHeight:20,padding:4,borderRadius:4}};

package/components/Chip/constants.mjs

@@ -0,0 +1 @@
+const SIZES={xxxl:{fontSize:18,minHeight:40,padding:8,borderRadius:8},xxl:{fontSize:18,minHeight:40,padding:8,borderRadius:8},xl:{fontSize:18,minHeight:40,padding:8,borderRadius:8},l:{fontSize:18,minHeight:40,padding:8,borderRadius:8},m:{fontSize:16,minHeight:36,padding:7,borderRadius:8},s:{fontSize:14,minHeight:32,padding:6,borderRadius:7},xs:{fontSize:12,minHeight:20,padding:4,borderRadius:4},xxs:{fontSize:12,minHeight:20,padding:4,borderRadius:4},xxxs:{fontSize:12,minHeight:20,padding:4,borderRadius:4}};export{SIZES};

package/components/Chip/style.js

@@ -0,0 +1 @@
+'use strict';var styled=require('styled-components');var tinycolor=require('../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.js');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');var focus=require('../../mixins/focus.js');const shouldForwardChipProp=style.createShouldForwardProp((o=>!['outline','black','active','cursor'].includes(o)));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  border-color: ${o.borderColor};\n  &:hover {\n    color: ${o.colorHover};\n    background-color: ${o.backgroundColorHover};\n    border-color: ${o.borderColorHover};\n  }\n  &:disabled {\n    color: ${o.colorDisabled};\n    background-color: ${o.backgroundColorDisabled};\n    border-color: ${o.borderColorDisabled};\n  }\n`;const COLOR_SCHEMA={default:{primary:{default:styled.css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-brand-primary-500']:o.theme.colors['bg-brand-primary-100'],borderColor:o.theme.colors.transparent,colorHover:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-brand-primary-500']).lighten(5).toString():tinycolor(o.theme.colors['bg-brand-primary-100']).darken(5).toString(),borderColorHover:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-disabled-small']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,...o.palette}))),black:styled.css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-onmain-contrast']:o.theme.colors['bg-onmain-tertiary'],borderColor:o.theme.colors.transparent,colorHover:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-onmain-contrast']).lighten(11).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(11).toString(),borderColorHover:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-disabled-small']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,...o.palette})))},secondary:{default:styled.css(["",""],(o=>template({color:o.active?o.theme.colors['content-brand-primary']:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-brand-primary-100'],borderColor:o.active?o.theme.colors['bg-brand-primary-500']:o.theme.colors['bg-brand-primary-400'],colorHover:o.active?o.theme.colors['content-brand-primary']:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-brand-primary-100']).lighten(2).toString():tinycolor(o.theme.colors['bg-brand-primary-100']).darken(5).toString(),borderColorHover:o.active?o.theme.colors['bg-brand-primary-500']:o.theme.colors['bg-brand-primary-400'],colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors['border-disabled'],...o.palette}))),black:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-onmain-secondary']:o.theme.colors['bg-onmain-tertiary'],borderColor:o.active?o.theme.colors['border-onmain-contrast']:o.theme.colors['border-onmain-default-large'],colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-onmain-secondary']).lighten(11).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(11).toString(),borderColorHover:o.active?o.theme.colors['border-onmain-contrast']:o.theme.colors['border-onmain-default-large'],colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors['border-disabled'],...o.palette})))},outline:{default:styled.css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-brand-primary-500']:o.theme.colors.transparent,borderColor:o.active?o.theme.colors.transparent:o.theme.colors['border-onmain-default-large'],colorHover:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-brand-primary-500']).lighten(5).toString():o.theme.colors['content-oncolor-hover'],borderColorHover:o.active?o.theme.colors.transparent:o.theme.colors['border-onmain-default-large'],colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-disabled-small']:o.theme.colors.transparent,borderColorDisabled:o.active?o.theme.colors.transparent:o.theme.colors['border-disabled'],...o.palette}))),black:styled.css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-onmain-contrast']:o.theme.colors.transparent,borderColor:o.active?o.theme.colors.transparent:o.theme.colors['border-onmain-default-large'],colorHover:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-onmain-contrast']).lighten(11).toString():o.theme.colors['content-oncolor-hover'],borderColorHover:o.active?o.theme.colors.transparent:o.theme.colors['border-onmain-default-large'],colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-disabled-small']:o.theme.colors.transparent,borderColorDisabled:o.active?o.theme.colors.transparent:o.theme.colors['border-disabled'],...o.palette})))}},contrast:{primary:{default:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-brand-primary-100'],borderColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(11).toString():tinycolor(o.theme.colors['bg-brand-primary-100']).darken(5).toString(),borderColorHover:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors.transparent,...o.palette}))),black:styled.css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-oncolor-tertiary'],borderColor:o.theme.colors.transparent,colorHover:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(11).toString():tinycolor(o.theme.colors['bg-oncolor-tertiary']).setAlpha(.3).toString(),borderColorHover:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors.transparent,...o.palette})))},secondary:{default:styled.css(["",""],(o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-secondary']:o.theme.colors['bg-oncolor-tertiary'],borderColor:o.active?o.theme.colors['border-oncolor-default']:o.theme.colors['border-oncolor-default-large'],colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-secondary']).setAlpha(.5).toString():tinycolor(o.theme.colors['bg-oncolor-tertiary']).setAlpha(.3).toString(),borderColorHover:o.active?o.theme.colors['border-oncolor-default']:o.theme.colors['border-oncolor-default-large'],colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors['border-oncolor-disabled'],...o.palette}))),black:styled.css(["",""],(o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-secondary']:o.theme.colors['bg-oncolor-tertiary'],borderColor:o.active?o.theme.colors['border-oncolor-default']:o.theme.colors['border-oncolor-default-large'],colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-secondary']).setAlpha(.5).toString():tinycolor(o.theme.colors['bg-oncolor-tertiary']).setAlpha(.3).toString(),borderColorHover:o.active?o.theme.colors['border-oncolor-default']:o.theme.colors['border-oncolor-default-large'],colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors['border-oncolor-disabled'],...o.palette})))},outline:{default:styled.css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-primary']:o.theme.colors.transparent,borderColor:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-default'],colorHover:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(11).toString():o.theme.colors['content-onmain-hover'],borderColorHover:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-default'],colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-oncolor-disabled']:o.theme.colors.transparent,borderColorDisabled:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-disabled'],...o.palette}))),black:styled.css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-primary']:o.theme.colors.transparent,borderColor:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-default'],colorHover:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(11).toString():o.theme.colors['content-onmain-hover'],borderColorHover:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-default'],colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-oncolor-disabled']:o.theme.colors.transparent,borderColorDisabled:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-disabled'],...o.palette})))}}};const Content=styled.span.withConfig({componentId:"fox-ui__sc-ndhge9-0"})(["box-sizing:border-box;display:flex;flex-direction:column;flex-grow:1;text-align:start;"]);const Root=styled.div.withConfig({shouldForwardProp:shouldForwardChipProp}).attrs({dynamicSizeDeclaration:(o,r)=>({fontSize:typeof o=='string'?o:`${o}${r}`,padding:'0.4em',borderRadius:'0.2em'})}).withConfig({componentId:"fox-ui__sc-ndhge9-1"})([""," "," "," "," ",""],(o=>{let r='default';return o.as==='button'&&(r='pointer'),o.as==='button'&&o.disabled&&(r='not-allowed'),o.cursor&&(r=o.cursor),`\n      box-sizing: border-box;\n      appearance: none;\n      padding: 0;\n      margin: 0;\n      display: inline-flex;\n      align-items: center;\n      border: 1px solid transparent;\n      width: max-content;\n      flex-shrink: 0;\n      cursor: ${r};\n      transition-property: background-color;\n      transition-duration: 250ms;\n\n      & > *:not(:last-child) {\n        margin-right: 6px;\n      }\n\n      & > ${Content}:first-child {\n        margin-left: 0.4em;\n      }\n      & > ${Content}:last-child {\n        margin-right: 0.4em;\n      }\n    `}),(o=>{const r=o.contrast?COLOR_SCHEMA.contrast:COLOR_SCHEMA.default;let e=r.primary;return o.secondary&&(e=r.secondary),o.outline&&(e=r.outline),o.black?e.black:e.default}),focus.focus,responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);exports.Content=Content,exports.Root=Root;

package/components/Chip/style.mjs

@@ -0,0 +1 @@
+import styled,{css}from'styled-components';import tinycolor from'../../external/.pnpm/tinycolor2@1.4.2/node_modules/tinycolor2/tinycolor.mjs';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';import{focus}from'../../mixins/focus.mjs';const shouldForwardChipProp=createShouldForwardProp((o=>!['outline','black','active','cursor'].includes(o)));const template=o=>`\n  color: ${o.color};\n  background-color: ${o.backgroundColor};\n  border-color: ${o.borderColor};\n  &:hover {\n    color: ${o.colorHover};\n    background-color: ${o.backgroundColorHover};\n    border-color: ${o.borderColorHover};\n  }\n  &:disabled {\n    color: ${o.colorDisabled};\n    background-color: ${o.backgroundColorDisabled};\n    border-color: ${o.borderColorDisabled};\n  }\n`;const COLOR_SCHEMA={default:{primary:{default:css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-brand-primary-500']:o.theme.colors['bg-brand-primary-100'],borderColor:o.theme.colors.transparent,colorHover:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-brand-primary-500']).lighten(5).toString():tinycolor(o.theme.colors['bg-brand-primary-100']).darken(5).toString(),borderColorHover:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-disabled-small']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,...o.palette}))),black:css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-onmain-contrast']:o.theme.colors['bg-onmain-tertiary'],borderColor:o.theme.colors.transparent,colorHover:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-onmain-contrast']).lighten(11).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(11).toString(),borderColorHover:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-disabled-small']:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors.transparent,...o.palette})))},secondary:{default:css(["",""],(o=>template({color:o.active?o.theme.colors['content-brand-primary']:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-brand-primary-100'],borderColor:o.active?o.theme.colors['bg-brand-primary-500']:o.theme.colors['bg-brand-primary-400'],colorHover:o.active?o.theme.colors['content-brand-primary']:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-brand-primary-100']).lighten(2).toString():tinycolor(o.theme.colors['bg-brand-primary-100']).darken(5).toString(),borderColorHover:o.active?o.theme.colors['bg-brand-primary-500']:o.theme.colors['bg-brand-primary-400'],colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors['border-disabled'],...o.palette}))),black:css(["",""],(o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-onmain-secondary']:o.theme.colors['bg-onmain-tertiary'],borderColor:o.active?o.theme.colors['border-onmain-contrast']:o.theme.colors['border-onmain-default-large'],colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-onmain-secondary']).lighten(11).toString():tinycolor(o.theme.colors['bg-onmain-tertiary']).darken(11).toString(),borderColorHover:o.active?o.theme.colors['border-onmain-contrast']:o.theme.colors['border-onmain-default-large'],colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.theme.colors['bg-disabled-large'],borderColorDisabled:o.theme.colors['border-disabled'],...o.palette})))},outline:{default:css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-brand-primary-500']:o.theme.colors.transparent,borderColor:o.active?o.theme.colors.transparent:o.theme.colors['border-onmain-default-large'],colorHover:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-brand-primary-500']).lighten(5).toString():o.theme.colors['content-oncolor-hover'],borderColorHover:o.active?o.theme.colors.transparent:o.theme.colors['border-onmain-default-large'],colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-disabled-small']:o.theme.colors.transparent,borderColorDisabled:o.active?o.theme.colors.transparent:o.theme.colors['border-disabled'],...o.palette}))),black:css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-onmain-contrast']:o.theme.colors.transparent,borderColor:o.active?o.theme.colors.transparent:o.theme.colors['border-onmain-default-large'],colorHover:o.active?o.theme.colors['content-oncolor-primary']:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-onmain-contrast']).lighten(11).toString():o.theme.colors['content-oncolor-hover'],borderColorHover:o.active?o.theme.colors.transparent:o.theme.colors['border-onmain-default-large'],colorDisabled:o.theme.colors['content-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-disabled-small']:o.theme.colors.transparent,borderColorDisabled:o.active?o.theme.colors.transparent:o.theme.colors['border-disabled'],...o.palette})))}},contrast:{primary:{default:css(["",""],(o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-brand-primary-100'],borderColor:o.theme.colors.transparent,colorHover:o.theme.colors['content-onmain-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(11).toString():tinycolor(o.theme.colors['bg-brand-primary-100']).darken(5).toString(),borderColorHover:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors.transparent,...o.palette}))),black:css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-primary']:o.theme.colors['bg-oncolor-tertiary'],borderColor:o.theme.colors.transparent,colorHover:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(11).toString():tinycolor(o.theme.colors['bg-oncolor-tertiary']).setAlpha(.3).toString(),borderColorHover:o.theme.colors.transparent,colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors.transparent,...o.palette})))},secondary:{default:css(["",""],(o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-secondary']:o.theme.colors['bg-oncolor-tertiary'],borderColor:o.active?o.theme.colors['border-oncolor-default']:o.theme.colors['border-oncolor-default-large'],colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-secondary']).setAlpha(.5).toString():tinycolor(o.theme.colors['bg-oncolor-tertiary']).setAlpha(.3).toString(),borderColorHover:o.active?o.theme.colors['border-oncolor-default']:o.theme.colors['border-oncolor-default-large'],colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors['border-oncolor-disabled'],...o.palette}))),black:css(["",""],(o=>template({color:o.theme.colors['content-oncolor-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-secondary']:o.theme.colors['bg-oncolor-tertiary'],borderColor:o.active?o.theme.colors['border-oncolor-default']:o.theme.colors['border-oncolor-default-large'],colorHover:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-secondary']).setAlpha(.5).toString():tinycolor(o.theme.colors['bg-oncolor-tertiary']).setAlpha(.3).toString(),borderColorHover:o.active?o.theme.colors['border-oncolor-default']:o.theme.colors['border-oncolor-default-large'],colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.theme.colors['bg-oncolor-disabled'],borderColorDisabled:o.theme.colors['border-oncolor-disabled'],...o.palette})))},outline:{default:css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-primary']:o.theme.colors.transparent,borderColor:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-default'],colorHover:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(11).toString():o.theme.colors['content-onmain-hover'],borderColorHover:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-default'],colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-oncolor-disabled']:o.theme.colors.transparent,borderColorDisabled:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-disabled'],...o.palette}))),black:css(["",""],(o=>template({color:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColor:o.active?o.theme.colors['bg-oncolor-primary']:o.theme.colors.transparent,borderColor:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-default'],colorHover:o.active?o.theme.colors['content-oncolor-constant']:o.theme.colors['content-oncolor-primary'],backgroundColorHover:o.active?tinycolor(o.theme.colors['bg-oncolor-primary']).darken(11).toString():o.theme.colors['content-onmain-hover'],borderColorHover:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-default'],colorDisabled:o.theme.colors['content-oncolor-disabled'],backgroundColorDisabled:o.active?o.theme.colors['bg-oncolor-disabled']:o.theme.colors.transparent,borderColorDisabled:o.active?o.theme.colors.transparent:o.theme.colors['border-oncolor-disabled'],...o.palette})))}}};const Content=styled.span.withConfig({componentId:"fox-ui__sc-ndhge9-0"})(["box-sizing:border-box;display:flex;flex-direction:column;flex-grow:1;text-align:start;"]);const Root=styled.div.withConfig({shouldForwardProp:shouldForwardChipProp}).attrs({dynamicSizeDeclaration:(o,r)=>({fontSize:typeof o=='string'?o:`${o}${r}`,padding:'0.4em',borderRadius:'0.2em'})}).withConfig({componentId:"fox-ui__sc-ndhge9-1"})([""," "," "," "," ",""],(o=>{let r='default';return o.as==='button'&&(r='pointer'),o.as==='button'&&o.disabled&&(r='not-allowed'),o.cursor&&(r=o.cursor),`\n      box-sizing: border-box;\n      appearance: none;\n      padding: 0;\n      margin: 0;\n      display: inline-flex;\n      align-items: center;\n      border: 1px solid transparent;\n      width: max-content;\n      flex-shrink: 0;\n      cursor: ${r};\n      transition-property: background-color;\n      transition-duration: 250ms;\n\n      & > *:not(:last-child) {\n        margin-right: 6px;\n      }\n\n      & > ${Content}:first-child {\n        margin-left: 0.4em;\n      }\n      & > ${Content}:last-child {\n        margin-right: 0.4em;\n      }\n    `}),(o=>{const r=o.contrast?COLOR_SCHEMA.contrast:COLOR_SCHEMA.default;let e=r.primary;return o.secondary&&(e=r.secondary),o.outline&&(e=r.outline),o.black?e.black:e.default}),focus,responsiveSize,responsiveMargin);export{Content,Root};

package/components/Container/Container.js

@@ -0,0 +1 @@
+'use strict';var style=require('./style.js');var require$$0=require('react/jsx-runtime');function Container(e){return require$$0.jsx(style.Root,{...e})}Container.displayName='Container',exports.Container=Container;

package/components/Container/Container.mjs

@@ -0,0 +1 @@
+import{Root}from'./style.mjs';import{jsx}from'react/jsx-runtime';function Container(o){return jsx(Root,{...o})}Container.displayName='Container';export{Container};

package/components/Container/style.js

@@ -0,0 +1,7 @@
+'use strict';var styled=require('styled-components');var display=require('../../mixins/display.js');var color=require('../../mixins/color.js');var screen=require('../../mixins/screen.js');const Root=styled.div.withConfig({shouldForwardProp:e=>['children','className','style'].includes(e)}).withConfig({componentId:"fox-ui__sc-yg4y35-0"})(["display:block;width:100%;max-width:","px;margin:0 auto;padding:0 50px;box-sizing:border-box;"," "," "," "," "," "," ",""],(e=>e.theme.breakpoints.l-100+100),(e=>e.display?display.display(e.display):null),(e=>e.color?color.color(e.color,'background-color'):null),(e=>e.textAlign?styled.css(["text-align:",";"],e.textAlign):null),(e=>e.fluid?styled.css(["max-width:100%;"]):null),screen.screenL()`
+    padding: 0 42px;
+  `,screen.screenM()`
+    padding: 0 28px;
+  `,screen.screenMaxS()`
+    padding: 0 20px;
+  `);exports.Root=Root;

package/components/Container/style.mjs

@@ -0,0 +1,7 @@
+import styled,{css}from'styled-components';import{display}from'../../mixins/display.mjs';import{color}from'../../mixins/color.mjs';import{screenL,screenM,screenMaxS}from'../../mixins/screen.mjs';const Root=styled.div.withConfig({shouldForwardProp:o=>['children','className','style'].includes(o)}).withConfig({componentId:"fox-ui__sc-yg4y35-0"})(["display:block;width:100%;max-width:","px;margin:0 auto;padding:0 50px;box-sizing:border-box;"," "," "," "," "," "," ",""],(o=>o.theme.breakpoints.l-100+100),(o=>o.display?display(o.display):null),(o=>o.color?color(o.color,'background-color'):null),(o=>o.textAlign?css(["text-align:",";"],o.textAlign):null),(o=>o.fluid?css(["max-width:100%;"]):null),screenL()`
+    padding: 0 42px;
+  `,screenM()`
+    padding: 0 28px;
+  `,screenMaxS()`
+    padding: 0 20px;
+  `);export{Root};

package/components/ContextMenu/ContextMenu.js

@@ -0,0 +1 @@
+'use strict';var React=require('react');var Item=require('./Item.js');var style=require('./style.js');var tooltipStyles=require('./tooltip-styles.js');var require$$0=require('react/jsx-runtime');var ContextMenu_Multilevel=require('../ContextMenu.Multilevel/ContextMenu.Multilevel.js');var Tooltip=require('../Tooltip/Tooltip.js');exports.ContextMenu=class ContextMenu extends React.PureComponent{static Item=Item.ContextMenuItem;static MultiLevel=ContextMenu_Multilevel.ContextMenuMultiLevel;static displayName='ContextMenu';static defaultProps={tooltipProps:{event:'click',placement:'left-start',offset:2,showCloseButton:!1,styles:tooltipStyles.tooltipStyles},hideOverlay:!1};constructor(e){super(e),this.state={isOpen:this.props.isOpen||!1}}getOpen=()=>{const{isOpen:e}=this.props;return e!==void 0?e:this.state.isOpen||!1};openMenu=e=>{this.setState({isOpen:!0});const{onOpen:t}=this.props;t&&t(e)};closeMenu=e=>{this.setState({isOpen:!1});const{onClose:t}=this.props;t&&t(e)};toggleMenu=e=>{const{openMenu:t,closeMenu:s}=this;const o=this.getOpen();return e.persist(),e.preventDefault(),e.stopPropagation(),o?s(e):t(e),!1};render(){const{className:e,tooltipProps:t={},trigger:s,children:o,hideOverlay:i}=this.props;const n=this.getOpen();return o&&(t.content=o),require$$0.jsx(style.Root,{className:e,isOpen:n,onClick:this.toggleMenu,hideOverlay:i,children:require$$0.jsx(Tooltip.Tooltip,{...t,open:n,children:require$$0.jsx("div",{onClick:this.closeMenu,children:s&&React.cloneElement(s,{active:n})})})})}};

package/components/ContextMenu/ContextMenu.mjs

@@ -0,0 +1 @@
+import{PureComponent,cloneElement}from'react';import{ContextMenuItem}from'./Item.mjs';import{Root}from'./style.mjs';import{tooltipStyles}from'./tooltip-styles.mjs';import{jsx}from'react/jsx-runtime';import{ContextMenuMultiLevel}from'../ContextMenu.Multilevel/ContextMenu.Multilevel.mjs';import{Tooltip}from'../Tooltip/Tooltip.mjs';class ContextMenu extends PureComponent{static Item=ContextMenuItem;static MultiLevel=ContextMenuMultiLevel;static displayName='ContextMenu';static defaultProps={tooltipProps:{event:'click',placement:'left-start',offset:2,showCloseButton:!1,styles:tooltipStyles},hideOverlay:!1};constructor(t){super(t),this.state={isOpen:this.props.isOpen||!1}}getOpen=()=>{const{isOpen:t}=this.props;return t!==void 0?t:this.state.isOpen||!1};openMenu=t=>{this.setState({isOpen:!0});const{onOpen:e}=this.props;e&&e(t)};closeMenu=t=>{this.setState({isOpen:!1});const{onClose:e}=this.props;e&&e(t)};toggleMenu=t=>{const{openMenu:e,closeMenu:o}=this;const s=this.getOpen();return t.persist(),t.preventDefault(),t.stopPropagation(),s?o(t):e(t),!1};render(){const{className:t,tooltipProps:e={},trigger:o,children:s,hideOverlay:n}=this.props;const i=this.getOpen();return s&&(e.content=s),jsx(Root,{className:t,isOpen:i,onClick:this.toggleMenu,hideOverlay:n,children:jsx(Tooltip,{...e,open:i,children:jsx("div",{onClick:this.closeMenu,children:o&&cloneElement(o,{active:i})})})})}}export{ContextMenu};

package/components/ContextMenu/Item.js

@@ -0,0 +1 @@
+'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Text=require('../Text/Text.js');const disabledHandler=e=>(e.preventDefault(),e.preventDefault(),e.stopPropagation(),!1);function ContextMenuItem({children:e,id:t,content:r,active:s,disabled:i,onClick:n,className:a,style:l}){return require$$0.jsxs(style.RootItem,{style:l,className:a,active:s,disabled:i,onClick:i?disabledHandler:n,"data-id":t,children:[e,require$$0.jsx(Text.Text,{size:"s",lineHeight:"s",color:colors.DefaultColorNames.mineShaft,children:r})]})}ContextMenuItem.displayName='ContextMenu.Item',exports.ContextMenuItem=ContextMenuItem;

package/components/ContextMenu/Item.mjs

@@ -0,0 +1 @@
+import{DefaultColorNames}from'../../theme/colors.mjs';import{RootItem}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Text}from'../Text/Text.mjs';const disabledHandler=e=>(e.preventDefault(),e.preventDefault(),e.stopPropagation(),!1);function ContextMenuItem({children:e,id:t,content:o,active:s,disabled:n,onClick:a,className:l,style:i}){return jsxs(RootItem,{style:i,className:l,active:s,disabled:n,onClick:n?disabledHandler:a,"data-id":t,children:[e,jsx(Text,{size:"s",lineHeight:"s",color:DefaultColorNames.mineShaft,children:o})]})}ContextMenuItem.displayName='ContextMenu.Item';export{ContextMenuItem};

package/components/ContextMenu/style.js

@@ -0,0 +1 @@
+'use strict';var styled=require('styled-components');const isOpen=styled.css(["&:after{cursor:default;user-select:none;content:'';display:block;position:fixed;width:100%;height:100%;z-index:",";left:0;top:0;right:0;bottom:0;}"],(o=>o.theme.zIndex.tooltip));const disabledItem=styled.css(["background-color:",";opacity:0.6;cursor:default;"],(o=>o.theme.colors.alabaster));const notDisabledItem=styled.css(["&:hover{background-color:",";}"],(o=>o.theme.colors.onahau));const Root=styled.div.withConfig({shouldForwardProp:o=>['className','onClick','children','style'].includes(o)}).withConfig({componentId:"fox-ui__sc-b2wdsu-0"})(["display:inline-block;position:relative;[style*='cursor']{cursor:default !important;}& + &{margin-left:16px;}",""],(o=>o.isOpen&&Boolean(o.hideOverlay)===!1?isOpen:null));const RootItem=styled.div.withConfig({shouldForwardProp:o=>['className','onClick','children','data-id'].includes(o)}).withConfig({componentId:"fox-ui__sc-b2wdsu-1"})(["display:block;padding:8px 20px 7px;transition:background-color 0.4s ease-out;cursor:pointer;user-select:none;"," ",""],(o=>o.active?styled.css(["background-color:",";"],o.theme.colors.onahau):null),(o=>o.disabled?disabledItem:notDisabledItem));exports.Root=Root,exports.RootItem=RootItem;

package/components/ContextMenu/style.mjs

@@ -0,0 +1 @@
+import styled,{css}from'styled-components';const isOpen=css(["&:after{cursor:default;user-select:none;content:'';display:block;position:fixed;width:100%;height:100%;z-index:",";left:0;top:0;right:0;bottom:0;}"],(o=>o.theme.zIndex.tooltip));const disabledItem=css(["background-color:",";opacity:0.6;cursor:default;"],(o=>o.theme.colors.alabaster));const notDisabledItem=css(["&:hover{background-color:",";}"],(o=>o.theme.colors.onahau));const Root=styled.div.withConfig({shouldForwardProp:o=>['className','onClick','children','style'].includes(o)}).withConfig({componentId:"fox-ui__sc-b2wdsu-0"})(["display:inline-block;position:relative;[style*='cursor']{cursor:default !important;}& + &{margin-left:16px;}",""],(o=>o.isOpen&&Boolean(o.hideOverlay)===!1?isOpen:null));const RootItem=styled.div.withConfig({shouldForwardProp:o=>['className','onClick','children','data-id'].includes(o)}).withConfig({componentId:"fox-ui__sc-b2wdsu-1"})(["display:block;padding:8px 20px 7px;transition:background-color 0.4s ease-out;cursor:pointer;user-select:none;"," ",""],(o=>o.active?css(["background-color:",";"],o.theme.colors.onahau):null),(o=>o.disabled?disabledItem:notDisabledItem));export{Root,RootItem};

package/components/ContextMenu/tooltip-styles.js

@@ -0,0 +1 @@
+'use strict';exports.tooltipStyles={wrapper:{display:'inline-block',zIndex:100},wrapperPosition:{left:-1e3,position:'absolute',top:-1e3,visibility:'hidden'},floater:{display:'inline-block',filter:'drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.08))',WebkitFilter:'drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.08))',maxWidth:300,minWidth:200,opacity:0,position:'relative',transition:'opacity 0.2s',visibility:'hidden',zIndex:99},floaterOpening:{opacity:1,visibility:'visible'},floaterWithAnimation:{opacity:1,transition:'opacity 0.2s, transform 0.2s',visibility:'visible'},floaterClosing:{opacity:0,visibility:'visible'},floaterCentered:{left:'50%',position:'fixed',top:'50%',transform:'translate(-50%, -50%)'},container:{boxSizing:'border-box',borderRadius:4,border:'1px solid #E9E9E9',color:'#333',backgroundColor:'#fff',minHeight:32,minWidth:180,padding:'0',position:'relative',display:'block',overflow:'hidden'},content:{display:'block'},arrow:{display:'none'}};

package/components/ContextMenu/tooltip-styles.mjs

@@ -0,0 +1 @@
+const tooltipStyles={wrapper:{display:'inline-block',zIndex:100},wrapperPosition:{left:-1e3,position:'absolute',top:-1e3,visibility:'hidden'},floater:{display:'inline-block',filter:'drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.08))',WebkitFilter:'drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.08))',maxWidth:300,minWidth:200,opacity:0,position:'relative',transition:'opacity 0.2s',visibility:'hidden',zIndex:99},floaterOpening:{opacity:1,visibility:'visible'},floaterWithAnimation:{opacity:1,transition:'opacity 0.2s, transform 0.2s',visibility:'visible'},floaterClosing:{opacity:0,visibility:'visible'},floaterCentered:{left:'50%',position:'fixed',top:'50%',transform:'translate(-50%, -50%)'},container:{boxSizing:'border-box',borderRadius:4,border:'1px solid #E9E9E9',color:'#333',backgroundColor:'#fff',minHeight:32,minWidth:180,padding:'0',position:'relative',display:'block',overflow:'hidden'},content:{display:'block'},arrow:{display:'none'}};export{tooltipStyles};

package/components/ContextMenu.Multilevel/ContextMenu.Multilevel.js

@@ -0,0 +1 @@
+'use strict';var React=require('react');var ContextMenu=require('../ContextMenu/ContextMenu.js');var Heading=require('./Heading.js');var SubHeading=require('./SubHeading.js');var Controls=require('./Controls.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Spacer=require('../Spacer/Spacer.js');exports.ContextMenuMultiLevel=class ContextMenuMultiLevel extends React.PureComponent{static displayName='ContextMenu.MultiLevel';static defaultProps={config:{}};constructor(e){super(e),this.state={selectedItems:[]}}componentWillUnmount(){clearTimeout(this.resetTimeout)}onSelectItem=e=>{const{id:t,level:n}=e;const{selectedItems:r}=this.state;const i=[...r.slice(0,n),t];this.setState({selectedItems:i}),typeof this.props.onSelectItem=='function'&&this.props.onSelectItem(e,n)};getCurrentConfig=()=>{const{config:e}=this.props;const{selectedItems:t}=this.state;if(!e)return null;if(!t.length)return e;try{return t.reduce(((e,t)=>e.items&&e.items.find((e=>e.id===t))?.config||{}),e)}catch(e){return null}};reset=()=>{this.resetTimeout=setTimeout((()=>this.setState({selectedItems:[]})),200)};itemOnClickHandler=e=>{const t=this.getCurrentConfig();if(!t)throw new Error('Config not found');const{items:n=[]}=t;const{currentTarget:r}=e;const{id:i=null}=r.dataset;if(i===null)throw new Error('Data-id for item not found');const s=n.find((e=>`${e.id}`===i));if(!s)throw new Error('Item not found');(s.config||s.preventClosing)&&(e.preventDefault(),e.stopPropagation()),s.config&&this.onSelectItem(s),typeof s.onClick=='function'&&s.onClick(s)};render(){const{children:e,className:t,tooltipProps:n,isOpen:r,trigger:i,...s}=this.props;const{selectedItems:o}=this.state;const c=this.getCurrentConfig();const{config:l,onSelectItem:u,...a}=s;return require$$0.jsxs(ContextMenu.ContextMenu,{className:t,tooltipProps:n,isOpen:r,onClose:this.reset,trigger:i,...a,children:[e,require$$0.jsxs(require$$0.Fragment,{children:[require$$0.jsx(Spacer.Spacer,{top:9}),c?.heading?require$$0.jsx(Heading.Heading,{content:c.heading}):null,c?.subheading?require$$0.jsx(SubHeading.SubHeading,{content:c.subheading}):null,c?.items?require$$0.jsx(style.MultilevelItems,{children:c.items.map((e=>require$$0.jsx(ContextMenu.ContextMenu.Item,{id:e.id,content:e.content,active:e.level&&Boolean(o[e.level]===e.id)||e.active,onClick:this.itemOnClickHandler},e.id)))}):null,c?.controls?require$$0.jsx(Controls.Controls,{...c.controls}):require$$0.jsx(Spacer.Spacer,{top:9})]})]})}};

package/components/ContextMenu.Multilevel/ContextMenu.Multilevel.mjs

@@ -0,0 +1 @@
+import{PureComponent}from'react';import{ContextMenu}from'../ContextMenu/ContextMenu.mjs';import{Heading}from'./Heading.mjs';import{SubHeading}from'./SubHeading.mjs';import{Controls}from'./Controls.mjs';import{MultilevelItems}from'./style.mjs';import{jsxs,Fragment,jsx}from'react/jsx-runtime';import{Spacer}from'../Spacer/Spacer.mjs';class ContextMenuMultiLevel extends PureComponent{static displayName='ContextMenu.MultiLevel';static defaultProps={config:{}};constructor(t){super(t),this.state={selectedItems:[]}}componentWillUnmount(){clearTimeout(this.resetTimeout)}onSelectItem=t=>{const{id:e,level:n}=t;const{selectedItems:o}=this.state;const s=[...o.slice(0,n),e];this.setState({selectedItems:s}),typeof this.props.onSelectItem=='function'&&this.props.onSelectItem(t,n)};getCurrentConfig=()=>{const{config:t}=this.props;const{selectedItems:e}=this.state;if(!t)return null;if(!e.length)return t;try{return e.reduce(((t,e)=>t.items&&t.items.find((t=>t.id===e))?.config||{}),t)}catch(t){return null}};reset=()=>{this.resetTimeout=setTimeout((()=>this.setState({selectedItems:[]})),200)};itemOnClickHandler=t=>{const e=this.getCurrentConfig();if(!e)throw new Error('Config not found');const{items:n=[]}=e;const{currentTarget:o}=t;const{id:s=null}=o.dataset;if(s===null)throw new Error('Data-id for item not found');const i=n.find((t=>`${t.id}`===s));if(!i)throw new Error('Item not found');(i.config||i.preventClosing)&&(t.preventDefault(),t.stopPropagation()),i.config&&this.onSelectItem(i),typeof i.onClick=='function'&&i.onClick(i)};render(){const{children:t,className:e,tooltipProps:n,isOpen:o,trigger:s,...i}=this.props;const{selectedItems:r}=this.state;const l=this.getCurrentConfig();const{config:c,onSelectItem:m,...u}=i;return jsxs(ContextMenu,{className:e,tooltipProps:n,isOpen:o,onClose:this.reset,trigger:s,...u,children:[t,jsxs(Fragment,{children:[jsx(Spacer,{top:9}),l?.heading?jsx(Heading,{content:l.heading}):null,l?.subheading?jsx(SubHeading,{content:l.subheading}):null,l?.items?jsx(MultilevelItems,{children:l.items.map((t=>jsx(ContextMenu.Item,{id:t.id,content:t.content,active:t.level&&Boolean(r[t.level]===t.id)||t.active,onClick:this.itemOnClickHandler},t.id)))}):null,l?.controls?jsx(Controls,{...l.controls}):jsx(Spacer,{top:9})]})]})}}export{ContextMenuMultiLevel};

package/components/ContextMenu.Multilevel/Controls.js

@@ -0,0 +1 @@
+'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Text=require('../Text/Text.js');exports.Controls=({cancel:e,confirm:r,className:l,style:o})=>require$$0.jsxs(style.ControlsRoot,{className:l,style:o,children:[e?require$$0.jsx(style.ControlsItem,{className:"cancel",role:"button",onClick:e.onClick,children:require$$0.jsx(Text.Text,{size:"m",lineHeight:"s",color:e.color||colors.DefaultColorNames.silver,children:e.content})}):null,r?require$$0.jsx(style.ControlsItem,{className:"confirm",role:"button",onClick:r.onClick,children:require$$0.jsx(Text.Text,{size:"m",lineHeight:"s",color:r.color||colors.DefaultColorNames.accent,children:r.content})}):null]});

package/components/ContextMenu.Multilevel/Controls.mjs

@@ -0,0 +1 @@
+import{DefaultColorNames}from'../../theme/colors.mjs';import{ControlsRoot,ControlsItem}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Text}from'../Text/Text.mjs';function Controls({cancel:o,confirm:e,className:l,style:t}){return jsxs(ControlsRoot,{className:l,style:t,children:[o?jsx(ControlsItem,{className:"cancel",role:"button",onClick:o.onClick,children:jsx(Text,{size:"m",lineHeight:"s",color:o.color||DefaultColorNames.silver,children:o.content})}):null,e?jsx(ControlsItem,{className:"confirm",role:"button",onClick:e.onClick,children:jsx(Text,{size:"m",lineHeight:"s",color:e.color||DefaultColorNames.accent,children:e.content})}):null]})}export{Controls};

package/components/ContextMenu.Multilevel/Heading.js

@@ -0,0 +1 @@
+'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Text=require('../Text/Text.js');exports.Heading=({children:e,content:r})=>require$$0.jsxs(style.HeadingRoot,{children:[e,require$$0.jsx(Text.Text,{size:"s",lineHeight:"s",weight:"bold",color:colors.DefaultColorNames.mineShaft,children:r})]});

package/components/ContextMenu.Multilevel/Heading.mjs

@@ -0,0 +1 @@
+import{DefaultColorNames}from'../../theme/colors.mjs';import{HeadingRoot}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Text}from'../Text/Text.mjs';function Heading({children:e,content:o}){return jsxs(HeadingRoot,{children:[e,jsx(Text,{size:"s",lineHeight:"s",weight:"bold",color:DefaultColorNames.mineShaft,children:o})]})}export{Heading};

package/components/ContextMenu.Multilevel/SubHeading.js

@@ -0,0 +1 @@
+'use strict';var colors=require('../../theme/colors.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var Text=require('../Text/Text.js');exports.SubHeading=({children:e,content:r})=>require$$0.jsxs(style.SubHeadingRoot,{children:[e,require$$0.jsx(Text.Text,{size:"s",lineHeight:"s",color:colors.DefaultColorNames.mineShaft,children:r})]});

package/components/ContextMenu.Multilevel/SubHeading.mjs

@@ -0,0 +1 @@
+import{DefaultColorNames}from'../../theme/colors.mjs';import{SubHeadingRoot}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';import{Text}from'../Text/Text.mjs';function SubHeading({children:e,content:o}){return jsxs(SubHeadingRoot,{children:[e,jsx(Text,{size:"s",lineHeight:"s",color:DefaultColorNames.mineShaft,children:o})]})}export{SubHeading};

package/components/ContextMenu.Multilevel/style.js

@@ -0,0 +1 @@
+'use strict';var styled=require('styled-components');const HeadingRoot=styled.div.withConfig({componentId:"fox-ui__sc-hu14lk-0"})(["display:block;padding:9px 20px 16px;user-select:none;text-transform:uppercase;"]);const SubHeadingRoot=styled.div.withConfig({componentId:"fox-ui__sc-hu14lk-1"})(["display:block;padding:9px 20px 16px;user-select:none;"]);const ControlsRoot=styled.div.withConfig({componentId:"fox-ui__sc-hu14lk-2"})(["display:flex;justify-content:space-between;border-top:1px solid ",";user-select:none;"],(o=>o.theme.colors.mercury));const ControlsItem=styled.div.withConfig({componentId:"fox-ui__sc-hu14lk-3"})(["padding:12px 20px;cursor:pointer;"]);const MultilevelItems=styled.div.withConfig({componentId:"fox-ui__sc-hu14lk-4"})(["max-height:170px;overflow:auto;-webkit-overflow-scrolling:touch;"]);exports.ControlsItem=ControlsItem,exports.ControlsRoot=ControlsRoot,exports.HeadingRoot=HeadingRoot,exports.MultilevelItems=MultilevelItems,exports.SubHeadingRoot=SubHeadingRoot;

package/components/ContextMenu.Multilevel/style.mjs

@@ -0,0 +1 @@
+import styled from'styled-components';const HeadingRoot=styled.div.withConfig({componentId:"fox-ui__sc-hu14lk-0"})(["display:block;padding:9px 20px 16px;user-select:none;text-transform:uppercase;"]);const SubHeadingRoot=styled.div.withConfig({componentId:"fox-ui__sc-hu14lk-1"})(["display:block;padding:9px 20px 16px;user-select:none;"]);const ControlsRoot=styled.div.withConfig({componentId:"fox-ui__sc-hu14lk-2"})(["display:flex;justify-content:space-between;border-top:1px solid ",";user-select:none;"],(o=>o.theme.colors.mercury));const ControlsItem=styled.div.withConfig({componentId:"fox-ui__sc-hu14lk-3"})(["padding:12px 20px;cursor:pointer;"]);const MultilevelItems=styled.div.withConfig({componentId:"fox-ui__sc-hu14lk-4"})(["max-height:170px;overflow:auto;-webkit-overflow-scrolling:touch;"]);export{ControlsItem,ControlsRoot,HeadingRoot,MultilevelItems,SubHeadingRoot};

package/components/Dropdown/Dropdown.js

@@ -0,0 +1 @@
+'use strict';var React=require('react');var fuse=require('../../external/.pnpm/fuse.js@7.0.0/node_modules/fuse.js/dist/fuse.js');var withMergedProps=require('../../hocs/withMergedProps.js');var dom=require('../../shared/utils/dom.js');var constants$1=require('../../shared/constants.js');var DropdownMenuNoOptions=require('./DropdownMenuNoOptions.js');var constants=require('./constants.js');var utils=require('./utils.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');var FormInputLabel=require('../FormInputLabel/FormInputLabel.js');var Chip=require('../Chip/Chip.js');var MenuComponent=require('../MenuComponent/MenuComponent.js');var MenuList=require('../MenuList/MenuList.js');var ListItem=require('../ListItem/ListItem.js');var InputCheckbox=require('../InputCheckbox/InputCheckbox.js');var MenuDivider=require('../MenuDivider/MenuDivider.js');const Dropdown=withMergedProps.withMergedProps(React.forwardRef(((e,t)=>{const{size:r="m",name:o="fox-dropdown",labelPosition:n="dynamic",optionsMultiToggle:s=!0,loading:a=!1,iconProps:i={},menuProps:l={},closeMenuOnScroll:c,contrast:u,defaultSelectedOption:d,icon:p,inputMode:b,label:g,loadingMessage:v,loadingIcon:m,loadingIconProps:C,maxLength:h,multiple:f,onCloseMenu:k,onOpenMenu:x,onSelectOption:$,options:y,optionsMultiToggleCaption:I,optionsEmptyMessage:D,optionsEmptyIcon:w,optionsEmptyIconProps:M,palette:q,placeholder:j,readOnly:L,required:P,status:R,sizeXXS:S,sizeXS:E,sizeS:z,sizeM:T,sizeL:F,sizeXL:K,sizeUnits:O,form:B,...X}=e;const H={size:r,sizeXXS:S,sizeXS:E,sizeS:z,sizeM:T,sizeL:F,sizeXL:K,sizeUnits:O};const N={size:24,color:X.disabled?'content-disabled':'content-onmain-tertiary'};const U=React.useMemo((()=>{const e=new fuse(y,{threshold:.4,ignoreLocation:!0,keys:[constants.FuseSearchKeys.text,constants.FuseSearchKeys.tags]});return t=>t.length===0?y:e.search(t).map((e=>e.item))}),[y]);const[_,Z]=React.useState((()=>f?'':utils.getDropdownInputText(d)));const[A,V]=React.useState((()=>utils.getDropdownInputValue(d)));const[G,J]=React.useState((()=>utils.getDropdownInputMultipleValue(d)));const[Q,W]=React.useState((()=>U(_)));const[Y,ee]=React.useState(!1);const te=f?utils.groupDropdownOptions(y,G):[[],[]];const re=Y&&!X.disabled;const oe=Q.length===0||a;const ne=Boolean(re||_);const se=f?G.length===0:A.length===0;const ae=te[0].length>0&&te[1].length===0;const ie=te[0].length>0&&te[1].length>0;const le=React.useRef(null);const ce=React.useRef(null);const ue=React.useRef(null);const de=React.useRef(null);const pe=React.useRef(_);const be=React.useRef(re);React.useEffect((()=>(_===pe.current?W(U(_)):(pe.current=_,de.current=setTimeout((()=>{W(U(_))}),150)),()=>{de.current&&clearTimeout(de.current)})),[U,_]),React.useEffect((()=>{re!==be.current&&(re&&x&&x(),!re&&k&&k(),be.current=re)}),[re,k,x]),React.useEffect((()=>{const handleScroll=e=>{le.current?.focus(),ee(!1),e.currentTarget&&e.currentTarget.removeEventListener(e.type,handleScroll)};return c&&re&&document.addEventListener('scroll',handleScroll),()=>{document.removeEventListener('scroll',handleScroll)}}),[c,re]);const syncInputTextWithSelectedOption=()=>{let e='';if(!f){const t=y.find((e=>e.value===A));e=t?t.text:''}Z(e)};return require$$0.jsx(FormInputLabel.FormInputLabel,{...X,...H,ref:t,label:g,labelPosition:n,active:ne,onColored:u,error:R==='error',success:R==='success',icon:[p,require$$0.jsx(style.ChevronIcon,{up:re},'chevron')],iconProps:{...N,...i},palette:{color:X.disabled?q.labelColorDisabled:q.labelColor,colorHover:X.disabled?q.labelColorDisabled:q.labelColorHover,backgroundColor:X.disabled?q.backgroundColorDisabled:q.backgroundColor,backgroundColorHover:X.disabled?q.backgroundColorDisabled:q.backgroundColorHover,borderColor:X.disabled?q.borderColorDisabled:q.borderColor,borderColorHover:X.disabled?q.borderColorDisabled:q.borderColor},onClick:e=>{X.onClick&&X.onClick(e),X.disabled||(le.current?.focus(),re?ce.current&&e.target instanceof Node&&!ce.current.contains(e.target)&&ee(!1):ee(!0))},onKeyUp:e=>{X.onKeyUp&&X.onKeyUp(e),constants$1.keyboardKeys.Esc.validate(e.key)&&(le.current?.focus(),ee(!1))},onPointerDown:e=>{X.onPointerDown&&X.onPointerDown(e),e.target!==le.current&&e.target instanceof Node&&e.currentTarget.contains(e.target)&&e.preventDefault()},onBlur:e=>{X.onBlur&&X.onBlur(e),e.currentTarget.contains(e.relatedTarget)||(syncInputTextWithSelectedOption(),ee(!1))},input:require$$0.jsxs(require$$0.Fragment,{children:[require$$0.jsx(style.Input,{ref:le,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",inputMode:b,maxLength:h,placeholder:j,readOnly:L,required:P&&se,disabled:X.disabled,label:g,labelPosition:n,active:ne,value:_,palette:{color:q.color,colorDisabled:q.colorDisabled,placeholderColor:q.placeholderColor,placeholderColorDisabled:q.placeholderColorDisabled},onClick:e=>{re&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{Z(e.currentTarget.value),ee(!0)},onKeyDown:e=>{constants$1.keyboardKeys.Enter.validate(e.key)&&(syncInputTextWithSelectedOption(),ee(!1)),!constants$1.keyboardKeys.Space.validate(e.key)||re&&e.currentTarget.selectionStart!==0||(e.preventDefault(),ee((e=>!e))),constants$1.keyboardKeys.ArrowDown.validate(e.key)&&ue.current&&(e.preventDefault(),dom.focusFirstFocusable(ue.current))}}),f?G.map((e=>require$$0.jsx("input",{type:"hidden",name:o,value:e,form:B,disabled:X.disabled},e))):A.length>0&&require$$0.jsx("input",{type:"hidden",name:o,value:A,form:B,disabled:X.disabled})]}),addon:f&&G.length>0?require$$0.jsx(Chip.Chip,{size:"xs",active:!0,black:!0,disabled:X.disabled,cursor:X.disabled?'not-allowed':void 0,text:G.length,textProps:{appearance:'caption',size:'xs'},palette:X.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{contrast:!X.disabled,onKeyDown:e=>{constants$1.keyboardKeys.ArrowDown.validate(e.key)&&ue.current&&(e.preventDefault(),dom.focusFirstFocusable(ue.current))},onClick:e=>{e.stopPropagation(),L||(J([]),$&&$([]),le.current?.focus(),ee(!0))}}}):void 0,dropdown:re?require$$0.jsx(MenuComponent.MenuComponent,{...l,ref:ce,sizeUnits:"%",sizes:constants.SIZES_MENU,size:l.size??100,tabIndex:oe?void 0:0,secondary:!u,elevated:u,disableAutoFocus:!0,palette:{backgroundColor:q.menuBackgroundColor,borderColor:q.menuBorderColor},onFocus:e=>{ue.current&&e.target===e.currentTarget&&(ue.current.contains(e.relatedTarget)?le.current?.focus():dom.focusFirstFocusable(ue.current))},onKeyDown:e=>{constants$1.keyboardKeys.Enter.validate(e.key)&&(le.current?.focus(),syncInputTextWithSelectedOption(),ee(!1))},children:oe?require$$0.jsx(DropdownMenuNoOptions.DropdownMenuNoOptions,{loading:a,loadingMessage:v,loadingIcon:m,loadingIconProps:{...N,...C},emptyMessage:D,emptyIcon:w,emptyIconProps:{...N,...M}}):require$$0.jsx(MenuList.MenuList,f?{ref:ue,children:_.length>0?require$$0.jsx(require$$0.Fragment,{children:Q.map((e=>{const t=G.includes(e.value);const r=e.status??R;const n=t&&r==='error';const s=t&&r==='success';return React.createElement(ListItem.ListItem,{...H,key:e.value,text:e.text,danger:n,success:s,disabled:X.disabled,active:t,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:o,value:e.value,checked:t,error:n,success:s,onChange:r=>{if(!L){const o=t?G.filter((t=>t!==e.value)):[...G,r.currentTarget.value];J(o),$&&$(y.filter((e=>o.includes(e.value))))}}})})}))}):require$$0.jsxs(require$$0.Fragment,{children:[s&&require$$0.jsx(ListItem.ListItem,{...H,text:I,disabled:X.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{L&&e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:o,checked:ae,indeterminate:ie,error:(ae||ie)&&R==='error',success:(ae||ie)&&R==='success',onChange:()=>{if(!L){const e=ae||ie?[]:y.map((e=>e.value));J(e),$&&$(e.length===0?[]:y)}}})}),s&&require$$0.jsx(MenuDivider.MenuDivider,{}),te[0].map((e=>{const t=e.status??R;const r=t==='error';const n=t==='success';return React.createElement(ListItem.ListItem,{...H,key:e.value,active:!0,text:e.text,danger:r,success:n,disabled:X.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{L&&e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:o,value:e.value,checked:!0,error:r,success:n,onChange:e=>{if(!L){const t=G.filter((t=>t!==e.currentTarget.value));J(t),$&&$(y.filter((e=>t.includes(e.value))))}}})})})),te[0].length>0&&te[1].length>0&&require$$0.jsx(MenuDivider.MenuDivider,{}),te[1].map((e=>React.createElement(ListItem.ListItem,{...H,key:e.value,text:e.text,disabled:X.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{L&&e.stopPropagation()},control:require$$0.jsx(InputCheckbox.InputCheckbox,{sizes:constants.SIZES_CHECKBOX,form:"none",name:o,value:e.value,checked:!1,onChange:e=>{if(!L){const t=[...G,e.currentTarget.value];J(t),$&&$(y.filter((e=>t.includes(e.value))))}}})})))]})}:{ref:ue,children:Q.map((e=>{const t=A===e.value;return React.createElement(ListItem.ListItem,{...H,key:e.value,text:e.text,active:t,danger:t&&R==='error',success:t&&R==='success',disabled:X.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:r=>{if(r.stopPropagation(),!L){const r=t?{value:'',text:''}:e;Z(r.text),V(r.value),$&&$(r.value?r:null),le.current?.focus(),ee(!r.value)}}})}))})}):void 0})})),{sizes:constants.SIZES,displayName:"Dropdown"});exports.COMPONENT_NAME="Dropdown",exports.Dropdown=Dropdown;

package/components/Dropdown/Dropdown.mjs

@@ -0,0 +1 @@
+import{forwardRef,useMemo,useState,useRef,useEffect,createElement}from'react';import Fuse from'../../external/.pnpm/fuse.js@7.0.0/node_modules/fuse.js/dist/fuse.mjs';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{focusFirstFocusable}from'../../shared/utils/dom.mjs';import{keyboardKeys}from'../../shared/constants.mjs';import{DropdownMenuNoOptions}from'./DropdownMenuNoOptions.mjs';import{SIZES,FuseSearchKeys,SIZES_MENU,SIZES_CHECKBOX}from'./constants.mjs';import{getDropdownInputText,getDropdownInputValue,getDropdownInputMultipleValue,groupDropdownOptions}from'./utils.mjs';import{ChevronIcon,Input}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{FormInputLabel}from'../FormInputLabel/FormInputLabel.mjs';import{Chip}from'../Chip/Chip.mjs';import{MenuComponent}from'../MenuComponent/MenuComponent.mjs';import{MenuList}from'../MenuList/MenuList.mjs';import{ListItem}from'../ListItem/ListItem.mjs';import{InputCheckbox}from'../InputCheckbox/InputCheckbox.mjs';import{MenuDivider}from'../MenuDivider/MenuDivider.mjs';const COMPONENT_NAME='Dropdown';const Dropdown=withMergedProps(forwardRef(((e,o)=>{const{size:t="m",name:r="fox-dropdown",labelPosition:n="dynamic",optionsMultiToggle:s=!0,loading:a=!1,iconProps:l={},menuProps:i={},closeMenuOnScroll:c,contrast:d,defaultSelectedOption:u,icon:p,inputMode:m,label:b,loadingMessage:g,loadingIcon:f,loadingIconProps:C,maxLength:v,multiple:h,onCloseMenu:k,onOpenMenu:x,onSelectOption:y,options:I,optionsMultiToggleCaption:w,optionsEmptyMessage:D,optionsEmptyIcon:M,optionsEmptyIconProps:j,palette:E,placeholder:S,readOnly:P,required:z,status:L,sizeXXS:F,sizeXS:T,sizeS:K,sizeM:O,sizeL:B,sizeXL:N,sizeUnits:R,form:X,...H}=e;const _={size:t,sizeXXS:F,sizeXS:T,sizeS:K,sizeM:O,sizeL:B,sizeXL:N,sizeUnits:R};const Z={size:24,color:H.disabled?'content-disabled':'content-onmain-tertiary'};const U=useMemo((()=>{const e=new Fuse(I,{threshold:.4,ignoreLocation:!0,keys:[FuseSearchKeys.text,FuseSearchKeys.tags]});return o=>o.length===0?I:e.search(o).map((e=>e.item))}),[I]);const[A,V]=useState((()=>h?'':getDropdownInputText(u)));const[q,G]=useState((()=>getDropdownInputValue(u)));const[J,Q]=useState((()=>getDropdownInputMultipleValue(u)));const[W,Y]=useState((()=>U(A)));const[$,ee]=useState(!1);const oe=h?groupDropdownOptions(I,J):[[],[]];const te=$&&!H.disabled;const re=W.length===0||a;const ne=Boolean(te||A);const se=h?J.length===0:q.length===0;const ae=oe[0].length>0&&oe[1].length===0;const le=oe[0].length>0&&oe[1].length>0;const ie=useRef(null);const ce=useRef(null);const de=useRef(null);const ue=useRef(null);const pe=useRef(A);const me=useRef(te);useEffect((()=>(A===pe.current?Y(U(A)):(pe.current=A,ue.current=setTimeout((()=>{Y(U(A))}),150)),()=>{ue.current&&clearTimeout(ue.current)})),[U,A]),useEffect((()=>{te!==me.current&&(te&&x&&x(),!te&&k&&k(),me.current=te)}),[te,k,x]),useEffect((()=>{const handleScroll=e=>{ie.current?.focus(),ee(!1),e.currentTarget&&e.currentTarget.removeEventListener(e.type,handleScroll)};return c&&te&&document.addEventListener('scroll',handleScroll),()=>{document.removeEventListener('scroll',handleScroll)}}),[c,te]);const syncInputTextWithSelectedOption=()=>{let e='';if(!h){const o=I.find((e=>e.value===q));e=o?o.text:''}V(e)};return jsx(FormInputLabel,{...H,..._,ref:o,label:b,labelPosition:n,active:ne,onColored:d,error:L==='error',success:L==='success',icon:[p,jsx(ChevronIcon,{up:te},'chevron')],iconProps:{...Z,...l},palette:{color:H.disabled?E.labelColorDisabled:E.labelColor,colorHover:H.disabled?E.labelColorDisabled:E.labelColorHover,backgroundColor:H.disabled?E.backgroundColorDisabled:E.backgroundColor,backgroundColorHover:H.disabled?E.backgroundColorDisabled:E.backgroundColorHover,borderColor:H.disabled?E.borderColorDisabled:E.borderColor,borderColorHover:H.disabled?E.borderColorDisabled:E.borderColor},onClick:e=>{H.onClick&&H.onClick(e),H.disabled||(ie.current?.focus(),te?ce.current&&e.target instanceof Node&&!ce.current.contains(e.target)&&ee(!1):ee(!0))},onKeyUp:e=>{H.onKeyUp&&H.onKeyUp(e),keyboardKeys.Esc.validate(e.key)&&(ie.current?.focus(),ee(!1))},onPointerDown:e=>{H.onPointerDown&&H.onPointerDown(e),e.target!==ie.current&&e.target instanceof Node&&e.currentTarget.contains(e.target)&&e.preventDefault()},onBlur:e=>{H.onBlur&&H.onBlur(e),e.currentTarget.contains(e.relatedTarget)||(syncInputTextWithSelectedOption(),ee(!1))},input:jsxs(Fragment,{children:[jsx(Input,{ref:ie,type:"text",autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",spellCheck:"false",inputMode:m,maxLength:v,placeholder:S,readOnly:P,required:z&&se,disabled:H.disabled,label:b,labelPosition:n,active:ne,value:A,palette:{color:E.color,colorDisabled:E.colorDisabled,placeholderColor:E.placeholderColor,placeholderColorDisabled:E.placeholderColorDisabled},onClick:e=>{te&&e.currentTarget.selectionStart!==e.currentTarget.selectionEnd&&e.stopPropagation()},onChange:e=>{V(e.currentTarget.value),ee(!0)},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(syncInputTextWithSelectedOption(),ee(!1)),!keyboardKeys.Space.validate(e.key)||te&&e.currentTarget.selectionStart!==0||(e.preventDefault(),ee((e=>!e))),keyboardKeys.ArrowDown.validate(e.key)&&de.current&&(e.preventDefault(),focusFirstFocusable(de.current))}}),h?J.map((e=>jsx("input",{type:"hidden",name:r,value:e,form:X,disabled:H.disabled},e))):q.length>0&&jsx("input",{type:"hidden",name:r,value:q,form:X,disabled:H.disabled})]}),addon:h&&J.length>0?jsx(Chip,{size:"xs",active:!0,black:!0,disabled:H.disabled,cursor:H.disabled?'not-allowed':void 0,text:J.length,textProps:{appearance:'caption',size:'xs'},palette:H.disabled?{color:'content-disabled',colorHover:'content-disabled',backgroundColor:'bg-disabled-small',backgroundColorHover:'bg-disabled-small'}:void 0,onPointerDown:e=>{e.preventDefault()},discardButtonProps:{contrast:!H.disabled,onKeyDown:e=>{keyboardKeys.ArrowDown.validate(e.key)&&de.current&&(e.preventDefault(),focusFirstFocusable(de.current))},onClick:e=>{e.stopPropagation(),P||(Q([]),y&&y([]),ie.current?.focus(),ee(!0))}}}):void 0,dropdown:te?jsx(MenuComponent,{...i,ref:ce,sizeUnits:"%",sizes:SIZES_MENU,size:i.size??100,tabIndex:re?void 0:0,secondary:!d,elevated:d,disableAutoFocus:!0,palette:{backgroundColor:E.menuBackgroundColor,borderColor:E.menuBorderColor},onFocus:e=>{de.current&&e.target===e.currentTarget&&(de.current.contains(e.relatedTarget)?ie.current?.focus():focusFirstFocusable(de.current))},onKeyDown:e=>{keyboardKeys.Enter.validate(e.key)&&(ie.current?.focus(),syncInputTextWithSelectedOption(),ee(!1))},children:re?jsx(DropdownMenuNoOptions,{loading:a,loadingMessage:g,loadingIcon:f,loadingIconProps:{...Z,...C},emptyMessage:D,emptyIcon:M,emptyIconProps:{...Z,...j}}):jsx(MenuList,h?{ref:de,children:A.length>0?jsx(Fragment,{children:W.map((e=>{const o=J.includes(e.value);const t=e.status??L;const n=o&&t==='error';const s=o&&t==='success';return createElement(ListItem,{..._,key:e.value,text:e.text,danger:n,success:s,disabled:H.disabled,active:o,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:o,error:n,success:s,onChange:t=>{if(!P){const r=o?J.filter((o=>o!==e.value)):[...J,t.currentTarget.value];Q(r),y&&y(I.filter((e=>r.includes(e.value))))}}})})}))}):jsxs(Fragment,{children:[s&&jsx(ListItem,{..._,text:w,disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{P&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,checked:ae,indeterminate:le,error:(ae||le)&&L==='error',success:(ae||le)&&L==='success',onChange:()=>{if(!P){const e=ae||le?[]:I.map((e=>e.value));Q(e),y&&y(e.length===0?[]:I)}}})}),s&&jsx(MenuDivider,{}),oe[0].map((e=>{const o=e.status??L;const t=o==='error';const n=o==='success';return createElement(ListItem,{..._,key:e.value,active:!0,text:e.text,danger:t,success:n,disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{P&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!0,error:t,success:n,onChange:e=>{if(!P){const o=J.filter((o=>o!==e.currentTarget.value));Q(o),y&&y(I.filter((e=>o.includes(e.value))))}}})})})),oe[0].length>0&&oe[1].length>0&&jsx(MenuDivider,{}),oe[1].map((e=>createElement(ListItem,{..._,key:e.value,text:e.text,disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:e=>{P&&e.stopPropagation()},control:jsx(InputCheckbox,{sizes:SIZES_CHECKBOX,form:"none",name:r,value:e.value,checked:!1,onChange:e=>{if(!P){const o=[...J,e.currentTarget.value];Q(o),y&&y(I.filter((e=>o.includes(e.value))))}}})})))]})}:{ref:de,children:W.map((e=>{const o=q===e.value;return createElement(ListItem,{..._,key:e.value,text:e.text,active:o,danger:o&&L==='error',success:o&&L==='success',disabled:H.disabled,borderRadius:8,ellipsis:!1,textProps:{wordBreak:'break-word'},onClick:t=>{if(t.stopPropagation(),!P){const t=o?{value:'',text:''}:e;V(t.text),G(t.value),y&&y(t.value?t:null),ie.current?.focus(),ee(!t.value)}}})}))})}):void 0})})),{sizes:SIZES,displayName:"Dropdown"});export{COMPONENT_NAME,Dropdown};