npm - @chayns-components/core - Versions diffs - 5.0.0-beta.669 → 5.0.0-beta.670 - Mend

@chayns-components/core 5.0.0-beta.669 → 5.0.0-beta.670

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (15) hide show

package/lib/cjs/components/button/Button.js CHANGED Viewed

@@ -23,7 +23,8 @@ const Button = ({
   onClick,
   shouldShowWaitCursor,
   shouldStopPropagation,
-  ShouldShowTextAsRobotoMedium = true
+  shouldShowAsSelectButton = false,
+  shouldShowTextAsRobotoMedium = true
 }) => {
   const handleClick = event => {
     if (shouldStopPropagation) {
@@ -41,7 +42,7 @@ const Button = ({
   }, [isSecondary, theme.buttonBackgroundColor, theme.buttonColor, theme.buttonDesign, theme.text]);
   const backgroundColor = (0, _react.useMemo)(() => {
     let color;
-    if (isSecondary) {
+    if (isSecondary || shouldShowAsSelectButton) {
       color = theme['202'];
     } else {
       color = theme.buttonBackgroundColor ?? theme['408'];
@@ -50,17 +51,17 @@ const Button = ({
       color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;
     }
     return color;
-  }, [isSecondary, theme]);
+  }, [isSecondary, shouldShowAsSelectButton, theme]);
   const tapStyles = (0, _react.useMemo)(() => {
     if (theme.buttonDesign === '2') {
       return {
-        backgroundColor: isSecondary ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)` : `${theme.buttonBackgroundColor ?? ''}40`
+        backgroundColor: isSecondary || shouldShowAsSelectButton ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)` : `${theme.buttonBackgroundColor ?? ''}40`
       };
     }
     return {
       opacity: 0.6
     };
-  }, [isSecondary, theme]);
+  }, [isSecondary, shouldShowAsSelectButton, theme]);
   const hoverStyles = (0, _react.useMemo)(() => {
     if (theme.buttonDesign === '2') {
       return {
@@ -72,7 +73,8 @@ const Button = ({
     };
   }, [theme]);
   return /*#__PURE__*/_react.default.createElement(_Button.StyledMotionButton, {
-    $ShouldShowTextAsRobotoMedium: ShouldShowTextAsRobotoMedium,
+    $shouldShowTextAsRobotoMedium: shouldShowTextAsRobotoMedium,
+    $shouldShowAsSelectButton: shouldShowAsSelectButton,
     className: buttonClasses,
     disabled: isDisabled,
     $isDisabled: isDisabled,

package/lib/cjs/components/button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","names":["_clsx","_interopRequireDefault","require","_framerMotion","_react","_interopRequireWildcard","_styledComponents","_Icon","_Button","_WaitCursor","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Button","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","ShouldShowTextAsRobotoMedium","handleClick","event","stopPropagation","buttonClasses","clsx","theme","useTheme","iconColor","useMemo","text","buttonDesign","buttonColor","buttonBackgroundColor","backgroundColor","color","tapStyles","opacity","hoverStyles","createElement","StyledMotionButton","$ShouldShowTextAsRobotoMedium","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","animate","whileTap","whileHover","AnimatePresence","initial","StyledIconWrapper","icons","StyledMotionWaitCursorWrapper","width","exit","key","style","overflow","transition","duration","shouldHideBackground","StyledMotionChildrenWrapper","displayName","_default","exports"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'framer-motion';\nimport React, { FC, MouseEventHandler, ReactNode, useMemo } from 'react';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../icon/Icon';\nimport {\n StyledIconWrapper,\n StyledMotionButton,\n StyledMotionChildrenWrapper,\n StyledMotionWaitCursorWrapper,\n} from './Button.styles';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nexport type ButtonProps = {\n /*\n The label of the button\n /\n children?: ReactNode;\n /\n Additional class names for the button element\n /\n className?: string;\n /\n An icon that is displayed on the left-hand side of the button text\n /\n icon?: string;\n /\n Disables the button so that it cannot be clicked anymore\n /\n isDisabled?: boolean;\n /\n Displays the button in the secondary style\n /\n isSecondary?: boolean;\n /\n Function to be executed when the button is clicked\n /\n onClick: MouseEventHandler<HTMLButtonElement>;\n /\n Whether the text should be 'Roboto Medium'\n /\n ShouldShowTextAsRobotoMedium?: boolean;\n /\n Shows a wait cursor instead of button text\n /\n shouldShowWaitCursor?: boolean;\n /\n Stops event propagation on click\n */\n shouldStopPropagation?: boolean;\n};\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n ShouldShowTextAsRobotoMedium = true,\n}) => {\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n onClick(event);\n };\n\n const buttonClasses = clsx('beta-chayns-button ellipsis', className);\n\n const theme: Theme = useTheme();\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return theme.buttonDesign === '2'\n ? theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'\n : theme.buttonColor ?? 'white';\n }, [\n isSecondary,\n theme.buttonBackgroundColor,\n theme.buttonColor,\n theme.buttonDesign,\n theme.text,\n ]);\n\n const backgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary) {\n color = theme['202'];\n } else {\n color = theme.buttonBackgroundColor ?? theme['408'];\n }\n\n if (theme.buttonDesign === '2') {\n color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;\n }\n\n return color;\n }, [isSecondary, theme]);\n\n const tapStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor: isSecondary\n ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)`\n : `${theme.buttonBackgroundColor ?? ''}40`,\n };\n }\n\n return {\n opacity: 0.6,\n };\n }, [isSecondary, theme]);\n\n const hoverStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)`,\n };\n }\n\n return {\n opacity: 1,\n };\n }, [theme]);\n\n return (\n <StyledMotionButton\n $ShouldShowTextAsRobotoMedium={ShouldShowTextAsRobotoMedium}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n onClick={handleClick}\n animate={{ backgroundColor }}\n whileTap={isDisabled ? {} : { ...tapStyles }}\n whileHover={isDisabled ? {} : { ...hoverStyles }}\n >\n <AnimatePresence initial={false}>\n {icon && (\n <StyledIconWrapper>\n <Icon color={iconColor} icons={[icon]} />\n </StyledIconWrapper>\n )}\n {shouldShowWaitCursor && (\n <StyledMotionWaitCursorWrapper\n animate={{ opacity: 1, width: 40 }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"wait-cursor\"\n style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n <WaitCursor color={iconColor ?? 'white'} shouldHideBackground />\n </StyledMotionWaitCursorWrapper>\n )}\n {!shouldShowWaitCursor && children && (\n <StyledMotionChildrenWrapper\n animate={{ opacity: 1, width: 'auto' }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"children\"\n // style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n {children}\n </StyledMotionChildrenWrapper>\n )}\n </AnimatePresence>\n </StyledMotionButton>\n );\n};\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"mappings":";;;;;;AAAA,IAAAA,KAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAC,uBAAA,CAAAH,OAAA;AACA,IAAAI,iBAAA,GAAAJ,OAAA;AAEA,IAAAK,KAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,OAAA,GAAAN,OAAA;AAMA,IAAAO,WAAA,GAAAR,sBAAA,CAAAC,OAAA;AAAkD,SAAAQ,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAN,wBAAAM,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAAA,SAAAlB,uBAAAU,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAI,UAAA,GAAAJ,CAAA,KAAAK,OAAA,EAAAL,CAAA;AAyClD,MAAMmB,MAAuB,GAAGA,CAAC;EAC7BC,QAAQ;EACRC,SAAS;EACTC,IAAI;EACJC,UAAU;EACVC,WAAW;EACXC,OAAO;EACPC,oBAAoB;EACpBC,qBAAqB;EACrBC,4BAA4B,GAAG;AACnC,CAAC,KAAK;EACF,MAAMC,WAAiD,GAAIC,KAAK,IAAK;IACjE,IAAIH,qBAAqB,EAAE;MACvBG,KAAK,CAACC,eAAe,CAAC,CAAC;IAC3B;IAEAN,OAAO,CAACK,KAAK,CAAC;EAClB,CAAC;EAED,MAAME,aAAa,GAAG,IAAAC,aAAI,EAAC,6BAA6B,EAAEZ,SAAS,CAAC;EAEpE,MAAMa,KAAY,GAAG,IAAAC,0BAAQ,EAAC,CAAC;EAE/B,MAAMC,SAAS,GAAG,IAAAC,cAAO,EAAC,MAAM;IAC5B,IAAIb,WAAW,EAAE;MACb,OAAOU,KAAK,CAACI,IAAI;IACrB;IAEA,OAAOJ,KAAK,CAACK,YAAY,KAAK,GAAG,GAC3BL,KAAK,CAACM,WAAW,IAAIN,KAAK,CAACO,qBAAqB,IAAI,OAAO,GAC3DP,KAAK,CAACM,WAAW,IAAI,OAAO;EACtC,CAAC,EAAE,CACChB,WAAW,EACXU,KAAK,CAACO,qBAAqB,EAC3BP,KAAK,CAACM,WAAW,EACjBN,KAAK,CAACK,YAAY,EAClBL,KAAK,CAACI,IAAI,CACb,CAAC;EAEF,MAAMI,eAAe,GAAG,IAAAL,cAAO,EAAC,MAAM;IAClC,IAAIM,KAAK;IAET,IAAInB,WAAW,EAAE;MACbmB,KAAK,GAAGT,KAAK,CAAC,KAAK,CAAC;IACxB,CAAC,MAAM;MACHS,KAAK,GAAGT,KAAK,CAACO,qBAAqB,IAAIP,KAAK,CAAC,KAAK,CAAC;IACvD;IAEA,IAAIA,KAAK,CAACK,YAAY,KAAK,GAAG,EAAE;MAC5BI,KAAK,GAAG,QAAQT,KAAK,CAAC,SAAS,CAAC,IAAI,EAAE,MAAM;IAChD;IAEA,OAAOS,KAAK;EAChB,CAAC,EAAE,CAACnB,WAAW,EAAEU,KAAK,CAAC,CAAC;EAExB,MAAMU,SAAS,GAAG,IAAAP,cAAO,EAAC,MAAM;IAC5B,IAAIH,KAAK,CAACK,YAAY,KAAK,GAAG,EAAE;MAC5B,OAAO;QACHG,eAAe,EAAElB,WAAW,GACtB,QAAQU,KAAK,CAAC,SAAS,CAAC,IAAI,EAAE,QAAQ,GACtC,GAAGA,KAAK,CAACO,qBAAqB,IAAI,EAAE;MAC9C,CAAC;IACL;IAEA,OAAO;MACHI,OAAO,EAAE;IACb,CAAC;EACL,CAAC,EAAE,CAACrB,WAAW,EAAEU,KAAK,CAAC,CAAC;EAExB,MAAMY,WAAW,GAAG,IAAAT,cAAO,EAAC,MAAM;IAC9B,IAAIH,KAAK,CAACK,YAAY,KAAK,GAAG,EAAE;MAC5B,OAAO;QACHG,eAAe,EAAE,QAAQR,KAAK,CAAC,SAAS,CAAC,IAAI,EAAE;MACnD,CAAC;IACL;IAEA,OAAO;MACHW,OAAO,EAAE;IACb,CAAC;EACL,CAAC,EAAE,CAACX,KAAK,CAAC,CAAC;EAEX,oBACIzC,MAAA,CAAAY,OAAA,CAAA0C,aAAA,CAAClD,OAAA,CAAAmD,kBAAkB;IACfC,6BAA6B,EAAErB,4BAA6B;IAC5DP,SAAS,EAAEW,aAAc;IACzBkB,QAAQ,EAAE3B,UAAW;IACrB4B,WAAW,EAAE5B,UAAW;IACxB6B,YAAY,EAAE,CAAC,CAAChC,QAAS;IACzBiC,QAAQ,EAAE,OAAO/B,IAAI,KAAK,QAAQ,IAAIA,IAAI,KAAK,EAAG;IAClDgC,YAAY,EAAE9B,WAAY;IAC1BC,OAAO,EAAEI,WAAY;IACrB0B,OAAO,EAAE;MAAEb;IAAgB,CAAE;IAC7Bc,QAAQ,EAAEjC,UAAU,GAAG,CAAC,CAAC,GAAG;MAAE,GAAGqB;IAAU,CAAE;IAC7Ca,UAAU,EAAElC,UAAU,GAAG,CAAC,CAAC,GAAG;MAAE,GAAGuB;IAAY;EAAE,gBAEjDrD,MAAA,CAAAY,OAAA,CAAA0C,aAAA,CAACvD,aAAA,CAAAkE,eAAe;IAACC,OAAO,EAAE;EAAM,GAC3BrC,IAAI,iBACD7B,MAAA,CAAAY,OAAA,CAAA0C,aAAA,CAAClD,OAAA,CAAA+D,iBAAiB,qBACdnE,MAAA,CAAAY,OAAA,CAAA0C,aAAA,CAACnD,KAAA,CAAAS,OAAI;IAACsC,KAAK,EAAEP,SAAU;IAACyB,KAAK,EAAE,CAACvC,IAAI;EAAE,CAAE,CACzB,CACtB,EACAI,oBAAoB,iBACjBjC,MAAA,CAAAY,OAAA,CAAA0C,aAAA,CAAClD,OAAA,CAAAiE,6BAA6B;IAC1BP,OAAO,EAAE;MAAEV,OAAO,EAAE,CAAC;MAAEkB,KAAK,EAAE;IAAG,CAAE;IACnCC,IAAI,EAAE;MAAEnB,OAAO,EAAE,CAAC;MAAEkB,KAAK,EAAE;IAAE,CAAE;IAC/BJ,OAAO,EAAE;MAAEd,OAAO,EAAE,CAAC;MAAEkB,KAAK,EAAE;IAAE,CAAE;IAClCE,GAAG,EAAC,aAAa;IACjBC,KAAK,EAAE;MAAEC,QAAQ,EAAE;IAAS,CAAE;IAC9BC,UAAU,EAAE;MAAEC,QAAQ,EAAE;IAAI;EAAE,gBAE9B5E,MAAA,CAAAY,OAAA,CAAA0C,aAAA,CAACjD,WAAA,CAAAO,OAAU;IAACsC,KAAK,EAAEP,SAAS,IAAI,OAAQ;IAACkC,oBAAoB;EAAA,CAAE,CACpC,CAClC,EACA,CAAC5C,oBAAoB,IAAIN,QAAQ,iBAC9B3B,MAAA,CAAAY,OAAA,CAAA0C,aAAA,CAAClD,OAAA,CAAA0E,2BAA2B;IACxBhB,OAAO,EAAE;MAAEV,OAAO,EAAE,CAAC;MAAEkB,KAAK,EAAE;IAAO,CAAE;IACvCC,IAAI,EAAE;MAAEnB,OAAO,EAAE,CAAC;MAAEkB,KAAK,EAAE;IAAE,CAAE;IAC/BJ,OAAO,EAAE;MAAEd,OAAO,EAAE,CAAC;MAAEkB,KAAK,EAAE;IAAE,CAAE;IAClCE,GAAG,EAAC;IACJ;IAAA;IACAG,UAAU,EAAE;MAAEC,QAAQ,EAAE;IAAI;EAAE,GAE7BjD,QACwB,CAEpB,CACD,CAAC;AAE7B,CAAC;AAEDD,MAAM,CAACqD,WAAW,GAAG,QAAQ;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAArE,OAAA,GAEfc,MAAM","ignoreList":[]}
1	+ {"version":3,"file":"Button.js","names":["_clsx","_interopRequireDefault","require","_framerMotion","_react","_interopRequireWildcard","_styledComponents","_Icon","_Button","_WaitCursor","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Button","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","shouldShowAsSelectButton","shouldShowTextAsRobotoMedium","handleClick","event","stopPropagation","buttonClasses","clsx","theme","useTheme","iconColor","useMemo","text","buttonDesign","buttonColor","buttonBackgroundColor","backgroundColor","color","tapStyles","opacity","hoverStyles","createElement","StyledMotionButton","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","animate","whileTap","whileHover","AnimatePresence","initial","StyledIconWrapper","icons","StyledMotionWaitCursorWrapper","width","exit","key","style","overflow","transition","duration","shouldHideBackground","StyledMotionChildrenWrapper","displayName","_default","exports"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'framer-motion';\nimport React, { FC, MouseEventHandler, ReactNode, useMemo } from 'react';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../icon/Icon';\nimport {\n StyledIconWrapper,\n StyledMotionButton,\n StyledMotionChildrenWrapper,\n StyledMotionWaitCursorWrapper,\n} from './Button.styles';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nexport type ButtonProps = {\n /*\n The label of the button\n /\n children?: ReactNode;\n /\n Additional class names for the button element\n /\n className?: string;\n /\n An icon that is displayed on the left-hand side of the button text\n /\n icon?: string;\n /\n Disables the button so that it cannot be clicked anymore\n /\n isDisabled?: boolean;\n /\n Displays the button in the secondary style\n /\n isSecondary?: boolean;\n /\n Function to be executed when the button is clicked\n /\n onClick: MouseEventHandler<HTMLButtonElement>;\n /\n Whether the button should be displayed as a selectButton.\n /\n shouldShowAsSelectButton?: boolean;\n /\n Whether the text should be 'Roboto Medium'\n /\n shouldShowTextAsRobotoMedium?: boolean;\n /\n Shows a wait cursor instead of button text\n /\n shouldShowWaitCursor?: boolean;\n /\n Stops event propagation on click\n */\n shouldStopPropagation?: boolean;\n};\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n shouldShowAsSelectButton = false,\n shouldShowTextAsRobotoMedium = true,\n}) => {\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n onClick(event);\n };\n\n const buttonClasses = clsx('beta-chayns-button ellipsis', className);\n\n const theme: Theme = useTheme();\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return theme.buttonDesign === '2'\n ? theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'\n : theme.buttonColor ?? 'white';\n }, [\n isSecondary,\n theme.buttonBackgroundColor,\n theme.buttonColor,\n theme.buttonDesign,\n theme.text,\n ]);\n\n const backgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary \|\| shouldShowAsSelectButton) {\n color = theme['202'];\n } else {\n color = theme.buttonBackgroundColor ?? theme['408'];\n }\n\n if (theme.buttonDesign === '2') {\n color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;\n }\n\n return color;\n }, [isSecondary, shouldShowAsSelectButton, theme]);\n\n const tapStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor:\n isSecondary \|\| shouldShowAsSelectButton\n ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)`\n : `${theme.buttonBackgroundColor ?? ''}40`,\n };\n }\n\n return {\n opacity: 0.6,\n };\n }, [isSecondary, shouldShowAsSelectButton, theme]);\n\n const hoverStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)`,\n };\n }\n\n return {\n opacity: 1,\n };\n }, [theme]);\n\n return (\n <StyledMotionButton\n $shouldShowTextAsRobotoMedium={shouldShowTextAsRobotoMedium}\n $shouldShowAsSelectButton={shouldShowAsSelectButton}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n onClick={handleClick}\n animate={{ backgroundColor }}\n whileTap={isDisabled ? {} : { ...tapStyles }}\n whileHover={isDisabled ? {} : { ...hoverStyles }}\n >\n <AnimatePresence initial={false}>\n {icon && (\n <StyledIconWrapper>\n <Icon color={iconColor} icons={[icon]} />\n </StyledIconWrapper>\n )}\n {shouldShowWaitCursor && (\n <StyledMotionWaitCursorWrapper\n animate={{ opacity: 1, width: 40 }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"wait-cursor\"\n style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n <WaitCursor color={iconColor ?? 'white'} shouldHideBackground />\n </StyledMotionWaitCursorWrapper>\n )}\n {!shouldShowWaitCursor && children && (\n <StyledMotionChildrenWrapper\n animate={{ opacity: 1, width: 'auto' }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"children\"\n // style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n {children}\n </StyledMotionChildrenWrapper>\n )}\n </AnimatePresence>\n </StyledMotionButton>\n );\n};\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/button/Button.styles.js CHANGED Viewed

@@ -10,8 +10,9 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const StyledMotionButton = exports.StyledMotionButton = (0, _styledComponents.default)(_framerMotion.motion.button)`
     ${({
-  $ShouldShowTextAsRobotoMedium
-}) => $ShouldShowTextAsRobotoMedium && (0, _styledComponents.css)`
+  $shouldShowTextAsRobotoMedium,
+  $shouldShowAsSelectButton
+}) => $shouldShowTextAsRobotoMedium && !$shouldShowAsSelectButton && (0, _styledComponents.css)`
             font-size: 110%;
             font-family: 'Roboto Medium', serif;
         `}
@@ -20,9 +21,10 @@ const StyledMotionButton = exports.StyledMotionButton = (0, _styledComponents.de
     ${({
   $isSecondary,
+  $shouldShowAsSelectButton,
   theme
 }) => {
-  if ($isSecondary) {
+  if ($isSecondary || $shouldShowAsSelectButton) {
     return (0, _styledComponents.css)`
                 color: ${theme.text};
             `;
@@ -34,9 +36,10 @@ const StyledMotionButton = exports.StyledMotionButton = (0, _styledComponents.de
     ${({
   theme,
-  $isSecondary
+  $isSecondary,
+  $shouldShowAsSelectButton
 }) => {
-  if (theme.buttonDesign === '2') {
+  if (theme.buttonDesign === '2' && !$shouldShowAsSelectButton) {
     return (0, _styledComponents.css)`
                 border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};
                 box-shadow: none;

package/lib/cjs/components/button/Button.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledMotionButton","exports","styled","motion","button","$~~ShouldShowTextAsRobotoMedium~~","css","$isSecondary","theme","text","buttonDesign","buttonColor","buttonBackgroundColor","$isDisabled","$hasIcon","$hasChildren","StyledIconWrapper","span","StyledMotionChildrenWrapper","div","StyledMotionWaitCursorWrapper"],"sources":["../../../../src/components/button/Button.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledButtonProps = WithTheme<{\n $hasIcon: boolean;\n $hasChildren: boolean;\n $isDisabled?: boolean;\n $isSecondary?: boolean;\n $~~ShouldShowTextAsRobotoMedium~~: boolean;\n}>;\n\nexport const StyledMotionButton = styled(motion.button)<StyledButtonProps>`\n ${({ $~~ShouldShowTextAsRobotoMedium~~ }) =>\n $~~ShouldShowTextAsRobotoMedium~~ &&\n css`\n font-size: 110%;\n font-family: 'Roboto Medium', serif;\n `}\n\n align-items: center;\n\n ${({ $isSecondary, theme }: StyledButtonProps) => {\n if ($isSecondary) {\n return css`\n color: ${theme.text};\n `;\n }\n\n return css`\n color: ${theme.buttonDesign === '2'\n ? theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'\n : theme.buttonColor ?? 'white'};\n `;\n }}\n\n ${({ theme, $isSecondary }: StyledButtonProps) => {\n if (theme.buttonDesign === '2') {\n return css`\n border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};\n box-shadow: none;\n `;\n }\n\n return css`\n border: none;\n box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);\n `;\n }}\n\n border-radius: 3px;\n cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n display: inline-flex;\n line-height: 1.15;\n min-height: 32px;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n position: relative;\n user-select: none;\n transition: opacity 0.3s ease;\n\n ${({ $hasIcon, $hasChildren }) => {\n if ($hasIcon) {\n if ($hasChildren) {\n return css`\n padding: 7px 12px 7px 42px;\n `;\n }\n return css`\n padding: 7px 12px 7px 18px;\n `;\n }\n return css`\n padding: 7px 12px 7px 12px;\n `;\n }}\n`;\n\nexport const StyledIconWrapper = styled.span`\n align-items: center;\n background-color: rgba(255, 255, 255, 0.2);\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n position: absolute;\n top: 0;\n width: 30px;\n`;\n\nexport const StyledMotionChildrenWrapper = styled(motion.div)<FramerMotionBugFix>``;\n\nexport const StyledMotionWaitCursorWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n justify-content: center;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAAgD,SAAAG,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAF,wBAAAE,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;~~AAWzC~~,MAAMW,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAG,IAAAE,yBAAM,EAACC,oBAAM,CAACC,MAAM,CAAoB;AAC1E,MAAM,CAAC;EAAEC;~~AAA8B~~,CAAC,~~KAChCA~~,6BAA6B,IAC7B,IAAAC,qBAAG;AACX;AACA;AACA,SAAS;AACT;AACA;AACA;AACA,MAAM,CAAC;EAAEC,YAAY;~~EAAEC~~;AAAyB,CAAC,KAAK;~~EAC9C~~,IAAID,YAAY,EAAE;~~IACd~~,OAAO,~~IAAAD~~,qBAAG;AACtB,yBAAyBE,KAAK,CAACC,IAAI;AACnC,aAAa;EACL;EAEA,OAAO,IAAAH,qBAAG;AAClB,qBAAqBE,KAAK,CAACE,YAAY,KAAK,GAAG,GAC7BF,KAAK,CAACG,WAAW,IAAIH,KAAK,CAACI,qBAAqB,IAAI,OAAO,GAC3DJ,KAAK,CAACG,WAAW,IAAI,OAAO;AAC9C,SAAS;AACL,CAAC;AACL;AACA,MAAM,CAAC;EAAEH,KAAK;EAAED;~~AAAgC~~,CAAC,KAAK;~~EAC9C~~,~~IAAIC~~,KAAK,CAACE,YAAY,KAAK,GAAG,EAAE;~~IAC5B~~,OAAO,~~IAAAJ~~,qBAAG;AACtB,oCAAoCC,YAAY,GAAGC,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAACI,qBAAqB;AAC7F;AACA,aAAa;EACL;EAEA,OAAO,IAAAN,qBAAG;AAClB;AACA;AACA,SAAS;AACL,CAAC;AACL;AACA;AACA,cAAc,CAAC;EAAEO;AAAY,CAAC,KAAMA,WAAW,GAAG,SAAS,GAAG,SAAU;AACxE;AACA;AACA;AACA,eAAe,CAAC;EAAEA;AAAY,CAAC,KAAMA,WAAW,GAAG,GAAG,GAAG,CAAE;AAC3D;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC,QAAQ;EAAEC;AAAa,CAAC,KAAK;EAC9B,IAAID,QAAQ,EAAE;IACV,IAAIC,YAAY,EAAE;MACd,OAAO,IAAAT,qBAAG;AAC1B;AACA,iBAAiB;IACL;IACA,OAAO,IAAAA,qBAAG;AACtB;AACA,aAAa;EACL;EACA,OAAO,IAAAA,qBAAG;AAClB;AACA,SAAS;AACL,CAAC;AACL,CAAC;AAEM,MAAMU,iBAAiB,~~GAAAf~~,OAAA,~~CAAAe~~,iBAAA,~~GAAGd~~,yBAAM,~~CAACe~~,IAAI;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMC,2BAA2B,~~GAAAjB~~,OAAA,~~CAAAiB~~,2BAAA,GAAG,~~IAAAhB~~,yBAAM,EAACC,oBAAM,~~CAACgB~~,GAAG,CAAqB,EAAE;AAE5E,MAAMC,6BAA6B,~~GAAAnB~~,OAAA,~~CAAAmB~~,6BAAA,GAAG,~~IAAAlB~~,yBAAM,EAACC,oBAAM,~~CAACgB~~,GAAG,CAAqB;AACnF;AACA;AACA;AACA,CAAC","ignoreList":[]}
1	+ {"version":3,"file":"Button.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledMotionButton","exports","styled","motion","button","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","css","$isSecondary","theme","text","buttonDesign","buttonColor","buttonBackgroundColor","$isDisabled","$hasIcon","$hasChildren","StyledIconWrapper","span","StyledMotionChildrenWrapper","div","StyledMotionWaitCursorWrapper"],"sources":["../../../../src/components/button/Button.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledButtonProps = WithTheme<{\n $hasIcon: boolean;\n $hasChildren: boolean;\n $isDisabled?: boolean;\n $isSecondary?: boolean;\n $shouldShowTextAsRobotoMedium: boolean;\n $shouldShowAsSelectButton: boolean;\n}>;\n\nexport const StyledMotionButton = styled(motion.button)<StyledButtonProps>`\n ${({ $shouldShowTextAsRobotoMedium, $shouldShowAsSelectButton }) =>\n $shouldShowTextAsRobotoMedium &&\n !$shouldShowAsSelectButton &&\n css`\n font-size: 110%;\n font-family: 'Roboto Medium', serif;\n `}\n\n align-items: center;\n\n ${({ $isSecondary, $shouldShowAsSelectButton, theme }: StyledButtonProps) => {\n if ($isSecondary \|\| $shouldShowAsSelectButton) {\n return css`\n color: ${theme.text};\n `;\n }\n\n return css`\n color: ${theme.buttonDesign === '2'\n ? theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'\n : theme.buttonColor ?? 'white'};\n `;\n }}\n\n ${({ theme, $isSecondary, $shouldShowAsSelectButton }: StyledButtonProps) => {\n if (theme.buttonDesign === '2' && !$shouldShowAsSelectButton) {\n return css`\n border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};\n box-shadow: none;\n `;\n }\n\n return css`\n border: none;\n box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);\n `;\n }}\n\n border-radius: 3px;\n cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n display: inline-flex;\n line-height: 1.15;\n min-height: 32px;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n position: relative;\n user-select: none;\n transition: opacity 0.3s ease;\n\n ${({ $hasIcon, $hasChildren }) => {\n if ($hasIcon) {\n if ($hasChildren) {\n return css`\n padding: 7px 12px 7px 42px;\n `;\n }\n return css`\n padding: 7px 12px 7px 18px;\n `;\n }\n return css`\n padding: 7px 12px 7px 12px;\n `;\n }}\n`;\n\nexport const StyledIconWrapper = styled.span`\n align-items: center;\n background-color: rgba(255, 255, 255, 0.2);\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n position: absolute;\n top: 0;\n width: 30px;\n`;\n\nexport const StyledMotionChildrenWrapper = styled(motion.div)<FramerMotionBugFix>``;\n\nexport const StyledMotionWaitCursorWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n justify-content: center;\n`;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/select-button/SelectButton.js CHANGED Viewed

@@ -72,7 +72,7 @@ const SelectButton = ({
     onClick: handleClick,
     isDisabled: isDisabled,
     isSecondary: true,
-    ShouldShowTextAsRobotoMedium: false
+    shouldShowTextAsRobotoMedium: false
   }, selectedItemText ?? buttonText));
 };
 SelectButton.displayName = 'SelectButton';

package/lib/cjs/components/select-button/SelectButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectButton.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_Button","_interopRequireDefault","_SelectButton","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SelectButton","onSelect","selectedItemIds","shouldAllowMultiSelect","buttonText","shouldShowSearch","list","isDisabled","itemList","useMemo","items","forEach","text","id","isSelected","includes","push","name","selectedItemText","length","newText","handleClick","createDialog","type","DialogType","SELECT","multiselect","quickfind","open","then","result","buttonType","map","Number","createElement","StyledSelectButton","onClick","isSecondary","~~ShouldShowTextAsRobotoMedium~~","displayName","_default","exports"],"sources":["../../../../src/components/select-button/SelectButton.tsx"],"sourcesContent":["import { createDialog, DialogType, type DialogSelectListItemType } from 'chayns-api';\nimport React, { useMemo, type FC } from 'react';\nimport type { SelectButtonItem } from '../../types/selectButton';\nimport Button from '../button/Button';\nimport { StyledSelectButton } from './SelectButton.styles';\n\nexport type SelectButtonProps = {\n /*\n The text that should be displayed inside the button.\n /\n buttonText: string;\n /\n Whether the button should be disabled.\n /\n isDisabled?: boolean;\n /\n A list of item that could be selected.\n /\n list: SelectButtonItem[];\n /\n Function to be executed after an item is selected.\n /\n onSelect?: (ids: number[]) => void;\n /\n The id of an item that should be preselected.\n /\n selectedItemIds?: number[];\n /\n Whether more than one item should be selectable.\n /\n shouldAllowMultiSelect?: boolean;\n /\n Whether the search should be displayed inside the dialog.\n */\n shouldShowSearch?: boolean;\n};\n\nconst SelectButton: FC<SelectButtonProps> = ({\n onSelect,\n selectedItemIds,\n shouldAllowMultiSelect,\n buttonText,\n shouldShowSearch,\n list,\n isDisabled,\n}) => {\n const itemList = useMemo(() => {\n const items: DialogSelectListItemType[] = [];\n\n list.forEach(({ text, id }) => {\n const isSelected = selectedItemIds ? selectedItemIds.includes(id) : false;\n\n items.push({\n name: text,\n id,\n isSelected,\n });\n });\n\n return items;\n }, [list, selectedItemIds]);\n\n const selectedItemText = useMemo(() => {\n if (!selectedItemIds \|\| selectedItemIds.length === 0) {\n return null;\n }\n\n let newText = '';\n\n list.forEach(({ text, id }) => {\n if (selectedItemIds?.includes(id)) {\n newText += newText.length === 0 ? `${text}` : `, ${text}`;\n }\n });\n\n return newText;\n }, [list, selectedItemIds]);\n\n const handleClick = () => {\n void createDialog({\n type: DialogType.SELECT,\n list: itemList,\n multiselect: shouldAllowMultiSelect,\n quickfind: shouldShowSearch,\n })\n .open()\n .then((result) => {\n // Ignore because there is no type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n if (result && result.buttonType === 1 && typeof onSelect === 'function') {\n // Ignore because there is no type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n onSelect((result.result as string[]).map(Number));\n }\n });\n };\n\n return (\n <StyledSelectButton>\n <Button\n onClick={handleClick}\n isDisabled={isDisabled}\n isSecondary\n ~~ShouldShowTextAsRobotoMedium~~={false}\n >\n {selectedItemText ?? buttonText}\n </Button>\n </StyledSelectButton>\n );\n};\n\nSelectButton.displayName = 'SelectButton';\n\nexport default SelectButton;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"SelectButton.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_Button","_interopRequireDefault","_SelectButton","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SelectButton","onSelect","selectedItemIds","shouldAllowMultiSelect","buttonText","shouldShowSearch","list","isDisabled","itemList","useMemo","items","forEach","text","id","isSelected","includes","push","name","selectedItemText","length","newText","handleClick","createDialog","type","DialogType","SELECT","multiselect","quickfind","open","then","result","buttonType","map","Number","createElement","StyledSelectButton","onClick","isSecondary","shouldShowTextAsRobotoMedium","displayName","_default","exports"],"sources":["../../../../src/components/select-button/SelectButton.tsx"],"sourcesContent":["import { createDialog, DialogType, type DialogSelectListItemType } from 'chayns-api';\nimport React, { useMemo, type FC } from 'react';\nimport type { SelectButtonItem } from '../../types/selectButton';\nimport Button from '../button/Button';\nimport { StyledSelectButton } from './SelectButton.styles';\n\nexport type SelectButtonProps = {\n /*\n The text that should be displayed inside the button.\n /\n buttonText: string;\n /\n Whether the button should be disabled.\n /\n isDisabled?: boolean;\n /\n A list of item that could be selected.\n /\n list: SelectButtonItem[];\n /\n Function to be executed after an item is selected.\n /\n onSelect?: (ids: number[]) => void;\n /\n The id of an item that should be preselected.\n /\n selectedItemIds?: number[];\n /\n Whether more than one item should be selectable.\n /\n shouldAllowMultiSelect?: boolean;\n /\n Whether the search should be displayed inside the dialog.\n */\n shouldShowSearch?: boolean;\n};\n\nconst SelectButton: FC<SelectButtonProps> = ({\n onSelect,\n selectedItemIds,\n shouldAllowMultiSelect,\n buttonText,\n shouldShowSearch,\n list,\n isDisabled,\n}) => {\n const itemList = useMemo(() => {\n const items: DialogSelectListItemType[] = [];\n\n list.forEach(({ text, id }) => {\n const isSelected = selectedItemIds ? selectedItemIds.includes(id) : false;\n\n items.push({\n name: text,\n id,\n isSelected,\n });\n });\n\n return items;\n }, [list, selectedItemIds]);\n\n const selectedItemText = useMemo(() => {\n if (!selectedItemIds \|\| selectedItemIds.length === 0) {\n return null;\n }\n\n let newText = '';\n\n list.forEach(({ text, id }) => {\n if (selectedItemIds?.includes(id)) {\n newText += newText.length === 0 ? `${text}` : `, ${text}`;\n }\n });\n\n return newText;\n }, [list, selectedItemIds]);\n\n const handleClick = () => {\n void createDialog({\n type: DialogType.SELECT,\n list: itemList,\n multiselect: shouldAllowMultiSelect,\n quickfind: shouldShowSearch,\n })\n .open()\n .then((result) => {\n // Ignore because there is no type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n if (result && result.buttonType === 1 && typeof onSelect === 'function') {\n // Ignore because there is no type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n onSelect((result.result as string[]).map(Number));\n }\n });\n };\n\n return (\n <StyledSelectButton>\n <Button\n onClick={handleClick}\n isDisabled={isDisabled}\n isSecondary\n shouldShowTextAsRobotoMedium={false}\n >\n {selectedItemText ?? buttonText}\n </Button>\n </StyledSelectButton>\n );\n};\n\nSelectButton.displayName = 'SelectButton';\n\nexport default SelectButton;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/button/Button.js CHANGED Viewed

@@ -15,7 +15,8 @@ const Button = _ref => {
     onClick,
     shouldShowWaitCursor,
     shouldStopPropagation,
-    ShouldShowTextAsRobotoMedium = true
+    shouldShowAsSelectButton = false,
+    shouldShowTextAsRobotoMedium = true
   } = _ref;
   const handleClick = event => {
     if (shouldStopPropagation) {
@@ -33,7 +34,7 @@ const Button = _ref => {
   }, [isSecondary, theme.buttonBackgroundColor, theme.buttonColor, theme.buttonDesign, theme.text]);
   const backgroundColor = useMemo(() => {
     let color;
-    if (isSecondary) {
+    if (isSecondary || shouldShowAsSelectButton) {
       color = theme['202'];
     } else {
       color = theme.buttonBackgroundColor ?? theme['408'];
@@ -42,17 +43,17 @@ const Button = _ref => {
       color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;
     }
     return color;
-  }, [isSecondary, theme]);
+  }, [isSecondary, shouldShowAsSelectButton, theme]);
   const tapStyles = useMemo(() => {
     if (theme.buttonDesign === '2') {
       return {
-        backgroundColor: isSecondary ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)` : `${theme.buttonBackgroundColor ?? ''}40`
+        backgroundColor: isSecondary || shouldShowAsSelectButton ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)` : `${theme.buttonBackgroundColor ?? ''}40`
       };
     }
     return {
       opacity: 0.6
     };
-  }, [isSecondary, theme]);
+  }, [isSecondary, shouldShowAsSelectButton, theme]);
   const hoverStyles = useMemo(() => {
     if (theme.buttonDesign === '2') {
       return {
@@ -64,7 +65,8 @@ const Button = _ref => {
     };
   }, [theme]);
   return /*#__PURE__*/React.createElement(StyledMotionButton, {
-    $ShouldShowTextAsRobotoMedium: ShouldShowTextAsRobotoMedium,
+    $shouldShowTextAsRobotoMedium: shouldShowTextAsRobotoMedium,
+    $shouldShowAsSelectButton: shouldShowAsSelectButton,
     className: buttonClasses,
     disabled: isDisabled,
     $isDisabled: isDisabled,

package/lib/esm/components/button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","names":["clsx","AnimatePresence","React","useMemo","useTheme","Icon","StyledIconWrapper","StyledMotionButton","StyledMotionChildrenWrapper","StyledMotionWaitCursorWrapper","WaitCursor","Button","_ref","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","ShouldShowTextAsRobotoMedium","handleClick","event","stopPropagation","buttonClasses","theme","iconColor","text","buttonDesign","buttonColor","buttonBackgroundColor","backgroundColor","color","tapStyles","opacity","hoverStyles","createElement","$ShouldShowTextAsRobotoMedium","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","animate","whileTap","whileHover","initial","icons","width","exit","key","style","overflow","transition","duration","shouldHideBackground","displayName"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'framer-motion';\nimport React, { FC, MouseEventHandler, ReactNode, useMemo } from 'react';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../icon/Icon';\nimport {\n StyledIconWrapper,\n StyledMotionButton,\n StyledMotionChildrenWrapper,\n StyledMotionWaitCursorWrapper,\n} from './Button.styles';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nexport type ButtonProps = {\n /*\n The label of the button\n /\n children?: ReactNode;\n /\n Additional class names for the button element\n /\n className?: string;\n /\n An icon that is displayed on the left-hand side of the button text\n /\n icon?: string;\n /\n Disables the button so that it cannot be clicked anymore\n /\n isDisabled?: boolean;\n /\n Displays the button in the secondary style\n /\n isSecondary?: boolean;\n /\n Function to be executed when the button is clicked\n /\n onClick: MouseEventHandler<HTMLButtonElement>;\n /\n Whether the text should be 'Roboto Medium'\n /\n ShouldShowTextAsRobotoMedium?: boolean;\n /\n Shows a wait cursor instead of button text\n /\n shouldShowWaitCursor?: boolean;\n /\n Stops event propagation on click\n */\n shouldStopPropagation?: boolean;\n};\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n ShouldShowTextAsRobotoMedium = true,\n}) => {\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n onClick(event);\n };\n\n const buttonClasses = clsx('beta-chayns-button ellipsis', className);\n\n const theme: Theme = useTheme();\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return theme.buttonDesign === '2'\n ? theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'\n : theme.buttonColor ?? 'white';\n }, [\n isSecondary,\n theme.buttonBackgroundColor,\n theme.buttonColor,\n theme.buttonDesign,\n theme.text,\n ]);\n\n const backgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary) {\n color = theme['202'];\n } else {\n color = theme.buttonBackgroundColor ?? theme['408'];\n }\n\n if (theme.buttonDesign === '2') {\n color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;\n }\n\n return color;\n }, [isSecondary, theme]);\n\n const tapStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor: isSecondary\n ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)`\n : `${theme.buttonBackgroundColor ?? ''}40`,\n };\n }\n\n return {\n opacity: 0.6,\n };\n }, [isSecondary, theme]);\n\n const hoverStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)`,\n };\n }\n\n return {\n opacity: 1,\n };\n }, [theme]);\n\n return (\n <StyledMotionButton\n $ShouldShowTextAsRobotoMedium={ShouldShowTextAsRobotoMedium}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n onClick={handleClick}\n animate={{ backgroundColor }}\n whileTap={isDisabled ? {} : { ...tapStyles }}\n whileHover={isDisabled ? {} : { ...hoverStyles }}\n >\n <AnimatePresence initial={false}>\n {icon && (\n <StyledIconWrapper>\n <Icon color={iconColor} icons={[icon]} />\n </StyledIconWrapper>\n )}\n {shouldShowWaitCursor && (\n <StyledMotionWaitCursorWrapper\n animate={{ opacity: 1, width: 40 }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"wait-cursor\"\n style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n <WaitCursor color={iconColor ?? 'white'} shouldHideBackground />\n </StyledMotionWaitCursorWrapper>\n )}\n {!shouldShowWaitCursor && children && (\n <StyledMotionChildrenWrapper\n animate={{ opacity: 1, width: 'auto' }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"children\"\n // style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n {children}\n </StyledMotionChildrenWrapper>\n )}\n </AnimatePresence>\n </StyledMotionButton>\n );\n};\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"Button.js","names":["clsx","AnimatePresence","React","useMemo","useTheme","Icon","StyledIconWrapper","StyledMotionButton","StyledMotionChildrenWrapper","StyledMotionWaitCursorWrapper","WaitCursor","Button","_ref","children","className","icon","isDisabled","isSecondary","onClick","shouldShowWaitCursor","shouldStopPropagation","shouldShowAsSelectButton","shouldShowTextAsRobotoMedium","handleClick","event","stopPropagation","buttonClasses","theme","iconColor","text","buttonDesign","buttonColor","buttonBackgroundColor","backgroundColor","color","tapStyles","opacity","hoverStyles","createElement","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","disabled","$isDisabled","$hasChildren","$hasIcon","$isSecondary","animate","whileTap","whileHover","initial","icons","width","exit","key","style","overflow","transition","duration","shouldHideBackground","displayName"],"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { AnimatePresence } from 'framer-motion';\nimport React, { FC, MouseEventHandler, ReactNode, useMemo } from 'react';\nimport { useTheme } from 'styled-components';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport Icon from '../icon/Icon';\nimport {\n StyledIconWrapper,\n StyledMotionButton,\n StyledMotionChildrenWrapper,\n StyledMotionWaitCursorWrapper,\n} from './Button.styles';\nimport WaitCursor from './wait-cursor/WaitCursor';\n\nexport type ButtonProps = {\n /*\n The label of the button\n /\n children?: ReactNode;\n /\n Additional class names for the button element\n /\n className?: string;\n /\n An icon that is displayed on the left-hand side of the button text\n /\n icon?: string;\n /\n Disables the button so that it cannot be clicked anymore\n /\n isDisabled?: boolean;\n /\n Displays the button in the secondary style\n /\n isSecondary?: boolean;\n /\n Function to be executed when the button is clicked\n /\n onClick: MouseEventHandler<HTMLButtonElement>;\n /\n Whether the button should be displayed as a selectButton.\n /\n shouldShowAsSelectButton?: boolean;\n /\n Whether the text should be 'Roboto Medium'\n /\n shouldShowTextAsRobotoMedium?: boolean;\n /\n Shows a wait cursor instead of button text\n /\n shouldShowWaitCursor?: boolean;\n /\n Stops event propagation on click\n */\n shouldStopPropagation?: boolean;\n};\n\nconst Button: FC<ButtonProps> = ({\n children,\n className,\n icon,\n isDisabled,\n isSecondary,\n onClick,\n shouldShowWaitCursor,\n shouldStopPropagation,\n shouldShowAsSelectButton = false,\n shouldShowTextAsRobotoMedium = true,\n}) => {\n const handleClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n if (shouldStopPropagation) {\n event.stopPropagation();\n }\n\n onClick(event);\n };\n\n const buttonClasses = clsx('beta-chayns-button ellipsis', className);\n\n const theme: Theme = useTheme();\n\n const iconColor = useMemo(() => {\n if (isSecondary) {\n return theme.text;\n }\n\n return theme.buttonDesign === '2'\n ? theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'\n : theme.buttonColor ?? 'white';\n }, [\n isSecondary,\n theme.buttonBackgroundColor,\n theme.buttonColor,\n theme.buttonDesign,\n theme.text,\n ]);\n\n const backgroundColor = useMemo(() => {\n let color;\n\n if (isSecondary \|\| shouldShowAsSelectButton) {\n color = theme['202'];\n } else {\n color = theme.buttonBackgroundColor ?? theme['408'];\n }\n\n if (theme.buttonDesign === '2') {\n color = `rgba(${theme['102-rgb'] ?? ''}, 0)`;\n }\n\n return color;\n }, [isSecondary, shouldShowAsSelectButton, theme]);\n\n const tapStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor:\n isSecondary \|\| shouldShowAsSelectButton\n ? `rgba(${theme['202-rgb'] ?? ''}, 0.7)`\n : `${theme.buttonBackgroundColor ?? ''}40`,\n };\n }\n\n return {\n opacity: 0.6,\n };\n }, [isSecondary, shouldShowAsSelectButton, theme]);\n\n const hoverStyles = useMemo(() => {\n if (theme.buttonDesign === '2') {\n return {\n backgroundColor: `rgba(${theme['102-rgb'] ?? ''}, 0.5)`,\n };\n }\n\n return {\n opacity: 1,\n };\n }, [theme]);\n\n return (\n <StyledMotionButton\n $shouldShowTextAsRobotoMedium={shouldShowTextAsRobotoMedium}\n $shouldShowAsSelectButton={shouldShowAsSelectButton}\n className={buttonClasses}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $hasChildren={!!children}\n $hasIcon={typeof icon === 'string' && icon !== ''}\n $isSecondary={isSecondary}\n onClick={handleClick}\n animate={{ backgroundColor }}\n whileTap={isDisabled ? {} : { ...tapStyles }}\n whileHover={isDisabled ? {} : { ...hoverStyles }}\n >\n <AnimatePresence initial={false}>\n {icon && (\n <StyledIconWrapper>\n <Icon color={iconColor} icons={[icon]} />\n </StyledIconWrapper>\n )}\n {shouldShowWaitCursor && (\n <StyledMotionWaitCursorWrapper\n animate={{ opacity: 1, width: 40 }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"wait-cursor\"\n style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n <WaitCursor color={iconColor ?? 'white'} shouldHideBackground />\n </StyledMotionWaitCursorWrapper>\n )}\n {!shouldShowWaitCursor && children && (\n <StyledMotionChildrenWrapper\n animate={{ opacity: 1, width: 'auto' }}\n exit={{ opacity: 0, width: 0 }}\n initial={{ opacity: 0, width: 0 }}\n key=\"children\"\n // style={{ overflow: 'hidden' }}\n transition={{ duration: 0.2 }}\n >\n {children}\n </StyledMotionChildrenWrapper>\n )}\n </AnimatePresence>\n </StyledMotionButton>\n );\n};\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/button/Button.styles.js CHANGED Viewed

@@ -3,9 +3,10 @@ import styled, { css } from 'styled-components';
 export const StyledMotionButton = styled(motion.button)`
     ${_ref => {
   let {
-    $ShouldShowTextAsRobotoMedium
+    $shouldShowTextAsRobotoMedium,
+    $shouldShowAsSelectButton
   } = _ref;
-  return $ShouldShowTextAsRobotoMedium && css`
+  return $shouldShowTextAsRobotoMedium && !$shouldShowAsSelectButton && css`
             font-size: 110%;
             font-family: 'Roboto Medium', serif;
         `;
@@ -16,9 +17,10 @@ export const StyledMotionButton = styled(motion.button)`
     ${_ref2 => {
   let {
     $isSecondary,
+    $shouldShowAsSelectButton,
     theme
   } = _ref2;
-  if ($isSecondary) {
+  if ($isSecondary || $shouldShowAsSelectButton) {
     return css`
                 color: ${theme.text};
             `;
@@ -31,9 +33,10 @@ export const StyledMotionButton = styled(motion.button)`
     ${_ref3 => {
   let {
     theme,
-    $isSecondary
+    $isSecondary,
+    $shouldShowAsSelectButton
   } = _ref3;
-  if (theme.buttonDesign === '2') {
+  if (theme.buttonDesign === '2' && !$shouldShowAsSelectButton) {
     return css`
                 border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};
                 box-shadow: none;

package/lib/esm/components/button/Button.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.styles.js","names":["motion","styled","css","StyledMotionButton","button","_ref","$~~ShouldShowTextAsRobotoMedium~~","_ref2","$isSecondary","theme","text","buttonDesign","buttonColor","buttonBackgroundColor","_ref3","_ref4","$isDisabled","_ref5","_ref6","$hasIcon","$hasChildren","StyledIconWrapper","span","StyledMotionChildrenWrapper","div","StyledMotionWaitCursorWrapper"],"sources":["../../../../src/components/button/Button.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledButtonProps = WithTheme<{\n $hasIcon: boolean;\n $hasChildren: boolean;\n $isDisabled?: boolean;\n $isSecondary?: boolean;\n $~~ShouldShowTextAsRobotoMedium~~: boolean;\n}>;\n\nexport const StyledMotionButton = styled(motion.button)<StyledButtonProps>`\n ${({ $~~ShouldShowTextAsRobotoMedium~~ }) =>\n $~~ShouldShowTextAsRobotoMedium~~ &&\n css`\n font-size: 110%;\n font-family: 'Roboto Medium', serif;\n `}\n\n align-items: center;\n\n ${({ $isSecondary, theme }: StyledButtonProps) => {\n if ($isSecondary) {\n return css`\n color: ${theme.text};\n `;\n }\n\n return css`\n color: ${theme.buttonDesign === '2'\n ? theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'\n : theme.buttonColor ?? 'white'};\n `;\n }}\n\n ${({ theme, $isSecondary }: StyledButtonProps) => {\n if (theme.buttonDesign === '2') {\n return css`\n border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};\n box-shadow: none;\n `;\n }\n\n return css`\n border: none;\n box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);\n `;\n }}\n\n border-radius: 3px;\n cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n display: inline-flex;\n line-height: 1.15;\n min-height: 32px;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n position: relative;\n user-select: none;\n transition: opacity 0.3s ease;\n\n ${({ $hasIcon, $hasChildren }) => {\n if ($hasIcon) {\n if ($hasChildren) {\n return css`\n padding: 7px 12px 7px 42px;\n `;\n }\n return css`\n padding: 7px 12px 7px 18px;\n `;\n }\n return css`\n padding: 7px 12px 7px 12px;\n `;\n }}\n`;\n\nexport const StyledIconWrapper = styled.span`\n align-items: center;\n background-color: rgba(255, 255, 255, 0.2);\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n position: absolute;\n top: 0;\n width: 30px;\n`;\n\nexport const StyledMotionChildrenWrapper = styled(motion.div)<FramerMotionBugFix>``;\n\nexport const StyledMotionWaitCursorWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n justify-content: center;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;~~AAW~~/C,OAAO,MAAMC,kBAAkB,GAAGF,MAAM,CAACD,MAAM,CAACI,MAAM,CAAoB;AAC1E,MAAMC,IAAA;EAAA,IAAC;IAAEC;~~EAA8B~~,CAAC,~~GAAAD~~,IAAA;EAAA,~~OAChCC~~,6BAA6B,~~IAC7BJ~~,GAAG;AACX;AACA;AACA,SAAS;AAAA;AACT;AACA;AACA;AACA,~~MAAMK~~,KAAA,~~IAAgD~~;EAAA,~~IAA/C~~;IAAEC,YAAY;~~IAAEC~~;EAAyB,CAAC,GAAAF,KAAA;~~EACzC~~,IAAIC,YAAY,EAAE;~~IACd~~,~~OAAON~~,GAAG;AACtB,~~yBAAyBO~~,KAAK,CAACC,IAAI;AACnC,aAAa;EACL;EAEA,~~OAAOR~~,GAAG;AAClB,~~qBAAqBO~~,KAAK,CAACE,YAAY,KAAK,GAAG,GAC7BF,KAAK,CAACG,WAAW,IAAIH,KAAK,CAACI,qBAAqB,IAAI,OAAO,GAC3DJ,KAAK,CAACG,WAAW,IAAI,OAAO;AAC9C,SAAS;AACL,CAAC;AACL;AACA,MAAME,KAAA,~~IAAgD~~;EAAA,~~IAA/C~~;IAAEL,KAAK;IAAED;~~EAAgC~~,CAAC,~~GAAAM~~,KAAA;~~EACzC~~,IAAIL,KAAK,CAACE,YAAY,KAAK,GAAG,EAAE;~~IAC5B~~,~~OAAOT~~,GAAG;AACtB,~~oCAAoCM~~,YAAY,GAAGC,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAACI,qBAAqB;AAC7F;AACA,aAAa;EACL;EAEA,~~OAAOX~~,GAAG;AAClB;AACA;AACA,SAAS;AACL,CAAC;AACL;AACA;AACA,~~cAAca~~,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OAAMC,WAAW,GAAG,SAAS,GAAG,SAAS;AAAA,CAAC;AACxE;AACA;AACA;AACA,eAAeC,KAAA;EAAA,IAAC;IAAED;EAAY,CAAC,GAAAC,KAAA;EAAA,OAAMD,WAAW,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AAC3D;AACA;AACA;AACA;AACA,MAAME,KAAA,IAAgC;EAAA,IAA/B;IAAEC,QAAQ;IAAEC;EAAa,CAAC,GAAAF,KAAA;EACzB,IAAIC,QAAQ,EAAE;IACV,IAAIC,YAAY,EAAE;MACd,~~OAAOlB~~,GAAG;AAC1B;AACA,iBAAiB;IACL;IACA,OAAOA,GAAG;AACtB;AACA,aAAa;EACL;EACA,OAAOA,GAAG;AAClB;AACA,SAAS;AACL,CAAC;AACL,CAAC;AAED,OAAO,~~MAAMmB~~,iBAAiB,~~GAAGpB~~,MAAM,~~CAACqB~~,IAAI;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,2BAA2B,~~GAAGtB~~,MAAM,CAACD,MAAM,~~CAACwB~~,GAAG,CAAqB,EAAE;AAEnF,OAAO,MAAMC,6BAA6B,~~GAAGxB~~,MAAM,CAACD,MAAM,~~CAACwB~~,GAAG,CAAqB;AACnF;AACA;AACA;AACA,CAAC","ignoreList":[]}
1	+ {"version":3,"file":"Button.styles.js","names":["motion","styled","css","StyledMotionButton","button","_ref","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","_ref2","$isSecondary","theme","text","buttonDesign","buttonColor","buttonBackgroundColor","_ref3","_ref4","$isDisabled","_ref5","_ref6","$hasIcon","$hasChildren","StyledIconWrapper","span","StyledMotionChildrenWrapper","div","StyledMotionWaitCursorWrapper"],"sources":["../../../../src/components/button/Button.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledButtonProps = WithTheme<{\n $hasIcon: boolean;\n $hasChildren: boolean;\n $isDisabled?: boolean;\n $isSecondary?: boolean;\n $shouldShowTextAsRobotoMedium: boolean;\n $shouldShowAsSelectButton: boolean;\n}>;\n\nexport const StyledMotionButton = styled(motion.button)<StyledButtonProps>`\n ${({ $shouldShowTextAsRobotoMedium, $shouldShowAsSelectButton }) =>\n $shouldShowTextAsRobotoMedium &&\n !$shouldShowAsSelectButton &&\n css`\n font-size: 110%;\n font-family: 'Roboto Medium', serif;\n `}\n\n align-items: center;\n\n ${({ $isSecondary, $shouldShowAsSelectButton, theme }: StyledButtonProps) => {\n if ($isSecondary \|\| $shouldShowAsSelectButton) {\n return css`\n color: ${theme.text};\n `;\n }\n\n return css`\n color: ${theme.buttonDesign === '2'\n ? theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white'\n : theme.buttonColor ?? 'white'};\n `;\n }}\n\n ${({ theme, $isSecondary, $shouldShowAsSelectButton }: StyledButtonProps) => {\n if (theme.buttonDesign === '2' && !$shouldShowAsSelectButton) {\n return css`\n border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};\n box-shadow: none;\n `;\n }\n\n return css`\n border: none;\n box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);\n `;\n }}\n\n border-radius: 3px;\n cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n display: inline-flex;\n line-height: 1.15;\n min-height: 32px;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n position: relative;\n user-select: none;\n transition: opacity 0.3s ease;\n\n ${({ $hasIcon, $hasChildren }) => {\n if ($hasIcon) {\n if ($hasChildren) {\n return css`\n padding: 7px 12px 7px 42px;\n `;\n }\n return css`\n padding: 7px 12px 7px 18px;\n `;\n }\n return css`\n padding: 7px 12px 7px 12px;\n `;\n }}\n`;\n\nexport const StyledIconWrapper = styled.span`\n align-items: center;\n background-color: rgba(255, 255, 255, 0.2);\n bottom: 0;\n display: flex;\n justify-content: center;\n left: 0;\n position: absolute;\n top: 0;\n width: 30px;\n`;\n\nexport const StyledMotionChildrenWrapper = styled(motion.div)<FramerMotionBugFix>``;\n\nexport const StyledMotionWaitCursorWrapper = styled(motion.div)<FramerMotionBugFix>`\n align-items: center;\n display: flex;\n justify-content: center;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAY/C,OAAO,MAAMC,kBAAkB,GAAGF,MAAM,CAACD,MAAM,CAACI,MAAM,CAAoB;AAC1E,MAAMC,IAAA;EAAA,IAAC;IAAEC,6BAA6B;IAAEC;EAA0B,CAAC,GAAAF,IAAA;EAAA,OAC3DC,6BAA6B,IAC7B,CAACC,yBAAyB,IAC1BL,GAAG;AACX;AACA;AACA,SAAS;AAAA;AACT;AACA;AACA;AACA,MAAMM,KAAA,IAA2E;EAAA,IAA1E;IAAEC,YAAY;IAAEF,yBAAyB;IAAEG;EAAyB,CAAC,GAAAF,KAAA;EACpE,IAAIC,YAAY,IAAIF,yBAAyB,EAAE;IAC3C,OAAOL,GAAG;AACtB,yBAAyBQ,KAAK,CAACC,IAAI;AACnC,aAAa;EACL;EAEA,OAAOT,GAAG;AAClB,qBAAqBQ,KAAK,CAACE,YAAY,KAAK,GAAG,GAC7BF,KAAK,CAACG,WAAW,IAAIH,KAAK,CAACI,qBAAqB,IAAI,OAAO,GAC3DJ,KAAK,CAACG,WAAW,IAAI,OAAO;AAC9C,SAAS;AACL,CAAC;AACL;AACA,MAAME,KAAA,IAA2E;EAAA,IAA1E;IAAEL,KAAK;IAAED,YAAY;IAAEF;EAA6C,CAAC,GAAAQ,KAAA;EACpE,IAAIL,KAAK,CAACE,YAAY,KAAK,GAAG,IAAI,CAACL,yBAAyB,EAAE;IAC1D,OAAOL,GAAG;AACtB,oCAAoCO,YAAY,GAAGC,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAACI,qBAAqB;AAC7F;AACA,aAAa;EACL;EAEA,OAAOZ,GAAG;AAClB;AACA;AACA,SAAS;AACL,CAAC;AACL;AACA;AACA,cAAcc,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OAAMC,WAAW,GAAG,SAAS,GAAG,SAAS;AAAA,CAAC;AACxE;AACA;AACA;AACA,eAAeC,KAAA;EAAA,IAAC;IAAED;EAAY,CAAC,GAAAC,KAAA;EAAA,OAAMD,WAAW,GAAG,GAAG,GAAG,CAAC;AAAA,CAAC;AAC3D;AACA;AACA;AACA;AACA,MAAME,KAAA,IAAgC;EAAA,IAA/B;IAAEC,QAAQ;IAAEC;EAAa,CAAC,GAAAF,KAAA;EACzB,IAAIC,QAAQ,EAAE;IACV,IAAIC,YAAY,EAAE;MACd,OAAOnB,GAAG;AAC1B;AACA,iBAAiB;IACL;IACA,OAAOA,GAAG;AACtB;AACA,aAAa;EACL;EACA,OAAOA,GAAG;AAClB;AACA,SAAS;AACL,CAAC;AACL,CAAC;AAED,OAAO,MAAMoB,iBAAiB,GAAGrB,MAAM,CAACsB,IAAI;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,2BAA2B,GAAGvB,MAAM,CAACD,MAAM,CAACyB,GAAG,CAAqB,EAAE;AAEnF,OAAO,MAAMC,6BAA6B,GAAGzB,MAAM,CAACD,MAAM,CAACyB,GAAG,CAAqB;AACnF;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/esm/components/select-button/SelectButton.js CHANGED Viewed

@@ -66,7 +66,7 @@ const SelectButton = _ref => {
     onClick: handleClick,
     isDisabled: isDisabled,
     isSecondary: true,
-    ShouldShowTextAsRobotoMedium: false
+    shouldShowTextAsRobotoMedium: false
   }, selectedItemText ?? buttonText));
 };
 SelectButton.displayName = 'SelectButton';

package/lib/esm/components/select-button/SelectButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectButton.js","names":["createDialog","DialogType","React","useMemo","Button","StyledSelectButton","SelectButton","_ref","onSelect","selectedItemIds","shouldAllowMultiSelect","buttonText","shouldShowSearch","list","isDisabled","itemList","items","forEach","_ref2","text","id","isSelected","includes","push","name","selectedItemText","length","newText","_ref3","handleClick","type","SELECT","multiselect","quickfind","open","then","result","buttonType","map","Number","createElement","onClick","isSecondary","~~ShouldShowTextAsRobotoMedium~~","displayName"],"sources":["../../../../src/components/select-button/SelectButton.tsx"],"sourcesContent":["import { createDialog, DialogType, type DialogSelectListItemType } from 'chayns-api';\nimport React, { useMemo, type FC } from 'react';\nimport type { SelectButtonItem } from '../../types/selectButton';\nimport Button from '../button/Button';\nimport { StyledSelectButton } from './SelectButton.styles';\n\nexport type SelectButtonProps = {\n /*\n The text that should be displayed inside the button.\n /\n buttonText: string;\n /\n Whether the button should be disabled.\n /\n isDisabled?: boolean;\n /\n A list of item that could be selected.\n /\n list: SelectButtonItem[];\n /\n Function to be executed after an item is selected.\n /\n onSelect?: (ids: number[]) => void;\n /\n The id of an item that should be preselected.\n /\n selectedItemIds?: number[];\n /\n Whether more than one item should be selectable.\n /\n shouldAllowMultiSelect?: boolean;\n /\n Whether the search should be displayed inside the dialog.\n */\n shouldShowSearch?: boolean;\n};\n\nconst SelectButton: FC<SelectButtonProps> = ({\n onSelect,\n selectedItemIds,\n shouldAllowMultiSelect,\n buttonText,\n shouldShowSearch,\n list,\n isDisabled,\n}) => {\n const itemList = useMemo(() => {\n const items: DialogSelectListItemType[] = [];\n\n list.forEach(({ text, id }) => {\n const isSelected = selectedItemIds ? selectedItemIds.includes(id) : false;\n\n items.push({\n name: text,\n id,\n isSelected,\n });\n });\n\n return items;\n }, [list, selectedItemIds]);\n\n const selectedItemText = useMemo(() => {\n if (!selectedItemIds \|\| selectedItemIds.length === 0) {\n return null;\n }\n\n let newText = '';\n\n list.forEach(({ text, id }) => {\n if (selectedItemIds?.includes(id)) {\n newText += newText.length === 0 ? `${text}` : `, ${text}`;\n }\n });\n\n return newText;\n }, [list, selectedItemIds]);\n\n const handleClick = () => {\n void createDialog({\n type: DialogType.SELECT,\n list: itemList,\n multiselect: shouldAllowMultiSelect,\n quickfind: shouldShowSearch,\n })\n .open()\n .then((result) => {\n // Ignore because there is no type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n if (result && result.buttonType === 1 && typeof onSelect === 'function') {\n // Ignore because there is no type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n onSelect((result.result as string[]).map(Number));\n }\n });\n };\n\n return (\n <StyledSelectButton>\n <Button\n onClick={handleClick}\n isDisabled={isDisabled}\n isSecondary\n ~~ShouldShowTextAsRobotoMedium~~={false}\n >\n {selectedItemText ?? buttonText}\n </Button>\n </StyledSelectButton>\n );\n};\n\nSelectButton.displayName = 'SelectButton';\n\nexport default SelectButton;\n"],"mappings":"AAAA,SAASA,YAAY,EAAEC,UAAU,QAAuC,YAAY;AACpF,OAAOC,KAAK,IAAIC,OAAO,QAAiB,OAAO;AAE/C,OAAOC,MAAM,MAAM,kBAAkB;AACrC,SAASC,kBAAkB,QAAQ,uBAAuB;AAiC1D,MAAMC,YAAmC,GAAGC,IAAA,IAQtC;EAAA,IARuC;IACzCC,QAAQ;IACRC,eAAe;IACfC,sBAAsB;IACtBC,UAAU;IACVC,gBAAgB;IAChBC,IAAI;IACJC;EACJ,CAAC,GAAAP,IAAA;EACG,MAAMQ,QAAQ,GAAGZ,OAAO,CAAC,MAAM;IAC3B,MAAMa,KAAiC,GAAG,EAAE;IAE5CH,IAAI,CAACI,OAAO,CAACC,KAAA,IAAkB;MAAA,IAAjB;QAAEC,IAAI;QAAEC;MAAG,CAAC,GAAAF,KAAA;MACtB,MAAMG,UAAU,GAAGZ,eAAe,GAAGA,eAAe,CAACa,QAAQ,CAACF,EAAE,CAAC,GAAG,KAAK;MAEzEJ,KAAK,CAACO,IAAI,CAAC;QACPC,IAAI,EAAEL,IAAI;QACVC,EAAE;QACFC;MACJ,CAAC,CAAC;IACN,CAAC,CAAC;IAEF,OAAOL,KAAK;EAChB,CAAC,EAAE,CAACH,IAAI,EAAEJ,eAAe,CAAC,CAAC;EAE3B,MAAMgB,gBAAgB,GAAGtB,OAAO,CAAC,MAAM;IACnC,IAAI,CAACM,eAAe,IAAIA,eAAe,CAACiB,MAAM,KAAK,CAAC,EAAE;MAClD,OAAO,IAAI;IACf;IAEA,IAAIC,OAAO,GAAG,EAAE;IAEhBd,IAAI,CAACI,OAAO,CAACW,KAAA,IAAkB;MAAA,IAAjB;QAAET,IAAI;QAAEC;MAAG,CAAC,GAAAQ,KAAA;MACtB,IAAInB,eAAe,EAAEa,QAAQ,CAACF,EAAE,CAAC,EAAE;QAC/BO,OAAO,IAAIA,OAAO,CAACD,MAAM,KAAK,CAAC,GAAG,GAAGP,IAAI,EAAE,GAAG,KAAKA,IAAI,EAAE;MAC7D;IACJ,CAAC,CAAC;IAEF,OAAOQ,OAAO;EAClB,CAAC,EAAE,CAACd,IAAI,EAAEJ,eAAe,CAAC,CAAC;EAE3B,MAAMoB,WAAW,GAAGA,CAAA,KAAM;IACtB,KAAK7B,YAAY,CAAC;MACd8B,IAAI,EAAE7B,UAAU,CAAC8B,MAAM;MACvBlB,IAAI,EAAEE,QAAQ;MACdiB,WAAW,EAAEtB,sBAAsB;MACnCuB,SAAS,EAAErB;IACf,CAAC,CAAC,CACGsB,IAAI,CAAC,CAAC,CACNC,IAAI,CAAEC,MAAM,IAAK;MACd;MACA;MACA;MACA,IAAIA,MAAM,IAAIA,MAAM,CAACC,UAAU,KAAK,CAAC,IAAI,OAAO7B,QAAQ,KAAK,UAAU,EAAE;QACrE;QACA;QACA;QACAA,QAAQ,CAAE4B,MAAM,CAACA,MAAM,CAAcE,GAAG,CAACC,MAAM,CAAC,CAAC;MACrD;IACJ,CAAC,CAAC;EACV,CAAC;EAED,oBACIrC,KAAA,CAAAsC,aAAA,CAACnC,kBAAkB,qBACfH,KAAA,CAAAsC,aAAA,CAACpC,MAAM;IACHqC,OAAO,EAAEZ,WAAY;IACrBf,UAAU,EAAEA,UAAW;IACvB4B,WAAW;IACXC,4BAA4B,EAAE;EAAM,GAEnClB,gBAAgB,IAAId,UACjB,CACQ,CAAC;AAE7B,CAAC;AAEDL,YAAY,CAACsC,WAAW,GAAG,cAAc;AAEzC,eAAetC,YAAY","ignoreList":[]}
1	+ {"version":3,"file":"SelectButton.js","names":["createDialog","DialogType","React","useMemo","Button","StyledSelectButton","SelectButton","_ref","onSelect","selectedItemIds","shouldAllowMultiSelect","buttonText","shouldShowSearch","list","isDisabled","itemList","items","forEach","_ref2","text","id","isSelected","includes","push","name","selectedItemText","length","newText","_ref3","handleClick","type","SELECT","multiselect","quickfind","open","then","result","buttonType","map","Number","createElement","onClick","isSecondary","shouldShowTextAsRobotoMedium","displayName"],"sources":["../../../../src/components/select-button/SelectButton.tsx"],"sourcesContent":["import { createDialog, DialogType, type DialogSelectListItemType } from 'chayns-api';\nimport React, { useMemo, type FC } from 'react';\nimport type { SelectButtonItem } from '../../types/selectButton';\nimport Button from '../button/Button';\nimport { StyledSelectButton } from './SelectButton.styles';\n\nexport type SelectButtonProps = {\n /*\n The text that should be displayed inside the button.\n /\n buttonText: string;\n /\n Whether the button should be disabled.\n /\n isDisabled?: boolean;\n /\n A list of item that could be selected.\n /\n list: SelectButtonItem[];\n /\n Function to be executed after an item is selected.\n /\n onSelect?: (ids: number[]) => void;\n /\n The id of an item that should be preselected.\n /\n selectedItemIds?: number[];\n /\n Whether more than one item should be selectable.\n /\n shouldAllowMultiSelect?: boolean;\n /\n Whether the search should be displayed inside the dialog.\n */\n shouldShowSearch?: boolean;\n};\n\nconst SelectButton: FC<SelectButtonProps> = ({\n onSelect,\n selectedItemIds,\n shouldAllowMultiSelect,\n buttonText,\n shouldShowSearch,\n list,\n isDisabled,\n}) => {\n const itemList = useMemo(() => {\n const items: DialogSelectListItemType[] = [];\n\n list.forEach(({ text, id }) => {\n const isSelected = selectedItemIds ? selectedItemIds.includes(id) : false;\n\n items.push({\n name: text,\n id,\n isSelected,\n });\n });\n\n return items;\n }, [list, selectedItemIds]);\n\n const selectedItemText = useMemo(() => {\n if (!selectedItemIds \|\| selectedItemIds.length === 0) {\n return null;\n }\n\n let newText = '';\n\n list.forEach(({ text, id }) => {\n if (selectedItemIds?.includes(id)) {\n newText += newText.length === 0 ? `${text}` : `, ${text}`;\n }\n });\n\n return newText;\n }, [list, selectedItemIds]);\n\n const handleClick = () => {\n void createDialog({\n type: DialogType.SELECT,\n list: itemList,\n multiselect: shouldAllowMultiSelect,\n quickfind: shouldShowSearch,\n })\n .open()\n .then((result) => {\n // Ignore because there is no type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n if (result && result.buttonType === 1 && typeof onSelect === 'function') {\n // Ignore because there is no type\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n onSelect((result.result as string[]).map(Number));\n }\n });\n };\n\n return (\n <StyledSelectButton>\n <Button\n onClick={handleClick}\n isDisabled={isDisabled}\n isSecondary\n shouldShowTextAsRobotoMedium={false}\n >\n {selectedItemText ?? buttonText}\n </Button>\n </StyledSelectButton>\n );\n};\n\nSelectButton.displayName = 'SelectButton';\n\nexport default SelectButton;\n"],"mappings":"AAAA,SAASA,YAAY,EAAEC,UAAU,QAAuC,YAAY;AACpF,OAAOC,KAAK,IAAIC,OAAO,QAAiB,OAAO;AAE/C,OAAOC,MAAM,MAAM,kBAAkB;AACrC,SAASC,kBAAkB,QAAQ,uBAAuB;AAiC1D,MAAMC,YAAmC,GAAGC,IAAA,IAQtC;EAAA,IARuC;IACzCC,QAAQ;IACRC,eAAe;IACfC,sBAAsB;IACtBC,UAAU;IACVC,gBAAgB;IAChBC,IAAI;IACJC;EACJ,CAAC,GAAAP,IAAA;EACG,MAAMQ,QAAQ,GAAGZ,OAAO,CAAC,MAAM;IAC3B,MAAMa,KAAiC,GAAG,EAAE;IAE5CH,IAAI,CAACI,OAAO,CAACC,KAAA,IAAkB;MAAA,IAAjB;QAAEC,IAAI;QAAEC;MAAG,CAAC,GAAAF,KAAA;MACtB,MAAMG,UAAU,GAAGZ,eAAe,GAAGA,eAAe,CAACa,QAAQ,CAACF,EAAE,CAAC,GAAG,KAAK;MAEzEJ,KAAK,CAACO,IAAI,CAAC;QACPC,IAAI,EAAEL,IAAI;QACVC,EAAE;QACFC;MACJ,CAAC,CAAC;IACN,CAAC,CAAC;IAEF,OAAOL,KAAK;EAChB,CAAC,EAAE,CAACH,IAAI,EAAEJ,eAAe,CAAC,CAAC;EAE3B,MAAMgB,gBAAgB,GAAGtB,OAAO,CAAC,MAAM;IACnC,IAAI,CAACM,eAAe,IAAIA,eAAe,CAACiB,MAAM,KAAK,CAAC,EAAE;MAClD,OAAO,IAAI;IACf;IAEA,IAAIC,OAAO,GAAG,EAAE;IAEhBd,IAAI,CAACI,OAAO,CAACW,KAAA,IAAkB;MAAA,IAAjB;QAAET,IAAI;QAAEC;MAAG,CAAC,GAAAQ,KAAA;MACtB,IAAInB,eAAe,EAAEa,QAAQ,CAACF,EAAE,CAAC,EAAE;QAC/BO,OAAO,IAAIA,OAAO,CAACD,MAAM,KAAK,CAAC,GAAG,GAAGP,IAAI,EAAE,GAAG,KAAKA,IAAI,EAAE;MAC7D;IACJ,CAAC,CAAC;IAEF,OAAOQ,OAAO;EAClB,CAAC,EAAE,CAACd,IAAI,EAAEJ,eAAe,CAAC,CAAC;EAE3B,MAAMoB,WAAW,GAAGA,CAAA,KAAM;IACtB,KAAK7B,YAAY,CAAC;MACd8B,IAAI,EAAE7B,UAAU,CAAC8B,MAAM;MACvBlB,IAAI,EAAEE,QAAQ;MACdiB,WAAW,EAAEtB,sBAAsB;MACnCuB,SAAS,EAAErB;IACf,CAAC,CAAC,CACGsB,IAAI,CAAC,CAAC,CACNC,IAAI,CAAEC,MAAM,IAAK;MACd;MACA;MACA;MACA,IAAIA,MAAM,IAAIA,MAAM,CAACC,UAAU,KAAK,CAAC,IAAI,OAAO7B,QAAQ,KAAK,UAAU,EAAE;QACrE;QACA;QACA;QACAA,QAAQ,CAAE4B,MAAM,CAACA,MAAM,CAAcE,GAAG,CAACC,MAAM,CAAC,CAAC;MACrD;IACJ,CAAC,CAAC;EACV,CAAC;EAED,oBACIrC,KAAA,CAAAsC,aAAA,CAACnC,kBAAkB,qBACfH,KAAA,CAAAsC,aAAA,CAACpC,MAAM;IACHqC,OAAO,EAAEZ,WAAY;IACrBf,UAAU,EAAEA,UAAW;IACvB4B,WAAW;IACXC,4BAA4B,EAAE;EAAM,GAEnClB,gBAAgB,IAAId,UACjB,CACQ,CAAC;AAE7B,CAAC;AAEDL,YAAY,CAACsC,WAAW,GAAG,cAAc;AAEzC,eAAetC,YAAY","ignoreList":[]}

package/lib/types/components/button/Button.d.ts CHANGED Viewed

@@ -24,10 +24,14 @@ export type ButtonProps = {
      * Function to be executed when the button is clicked
      */
     onClick: MouseEventHandler<HTMLButtonElement>;
+    /**
+     * Whether the button should be displayed as a selectButton.
+     */
+    shouldShowAsSelectButton?: boolean;
     /**
      * Whether the text should be 'Roboto Medium'
      */
-    ShouldShowTextAsRobotoMedium?: boolean;
+    shouldShowTextAsRobotoMedium?: boolean;
     /**
      * Shows a wait cursor instead of button text
      */

package/lib/types/components/button/Button.styles.d.ts CHANGED Viewed

@@ -6,7 +6,8 @@ type StyledButtonProps = WithTheme<{
     $hasChildren: boolean;
     $isDisabled?: boolean;
     $isSecondary?: boolean;
-    $ShouldShowTextAsRobotoMedium: boolean;
+    $shouldShowTextAsRobotoMedium: boolean;
+    $shouldShowAsSelectButton: boolean;
 }>;
 export declare const StyledMotionButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<{
     form?: string | undefined;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@chayns-components/core",
-    "version": "5.0.0-beta.669",
+    "version": "5.0.0-beta.670",
     "description": "A set of beautiful React components for developing your own applications with chayns.",
     "sideEffects": false,
     "browserslist": [
@@ -85,5 +85,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "4df6c64109152115a9ed04b2b957506557587c50"
+    "gitHead": "0be66bf9f4db571cbb155b1d8ad058e7d957037c"
 }