npm - @chayns-components/core - Versions diffs - 5.5.29 → 5.5.31-alpha.0 - Mend

@chayns-components/core 5.5.29 → 5.5.31-alpha.0

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 (259) hide show

package/lib/cjs/components/context-menu/ContextMenu.styles.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.StyledContextMenu = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _keyboardFocusHighlighting = require("../../utils/keyboardFocusHighlighting.styles");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const StyledContextMenu = exports.StyledContextMenu = _styledComponents.default.span`
     align-items: center;
@@ -42,39 +41,12 @@ const StyledContextMenu = exports.StyledContextMenu = _styledComponents.default.
         `}
     ${({
-  $shouldShowWrapperKeyboardHighlighting,
-  $shouldUseDefaultTriggerStyles
-}) => $shouldShowWrapperKeyboardHighlighting && ($shouldUseDefaultTriggerStyles ? (0, _styledComponents.css)`
-                  &:focus-visible {
-                      outline: none;
-                      box-shadow: none;
-                  }
-                  &:focus-visible > .beta-chayns-icon {
-                      position: relative;
-                      color: inherit;
-                  }
-                  &:focus-visible > .beta-chayns-icon::after {
-                      ${_keyboardFocusHighlighting.keyboardFocusHighlightingCircleRingCss};
-                      content: '';
-                      position: absolute;
-                      top: 50%;
-                      left: 50%;
-                      width: calc(100% + 8px);
-                      height: calc(100% + 8px);
-                      transform: translate(-50%, -50%);
-                      pointer-events: none;
-                  }
-              ` : (0, _styledComponents.css)`
-                  &:focus-visible {
-                      outline: none;
-                      box-shadow: none;
-                  }
-                  &:focus-visible > * {
-                      ${_keyboardFocusHighlighting.keyboardFocusHighlightingRingCss}
-                  }
-              `)}
+  $shouldShowWrapperKeyboardHighlighting
+}) => $shouldShowWrapperKeyboardHighlighting && (0, _styledComponents.css)`
+            &:focus-visible {
+                outline: none;
+                box-shadow: none;
+            }
+        `}
 `;
 //# sourceMappingURL=ContextMenu.styles.js.map

package/lib/cjs/components/context-menu/ContextMenu.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ContextMenu.styles.js","names":["_styledComponents","_interopRequireWildcard","require","~~_keyboardFocusHighlighting","~~e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledContextMenu","exports","styled","span","$isActive","$shouldUseDefaultTriggerStyles","theme","css","$shouldAddHoverEffect","$shouldShowWrapperKeyboardHighlighting"~~,"keyboardFocusHighlightingCircleRingCss","keyboardFocusHighlightingRingCss"~~],"sources":["../../../../src/components/context-menu/ContextMenu.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\~~nimport {\~~n ~~keyboardFocusHighlightingCircleRingCss,\n keyboardFocusHighlightingRingCss,\n} from '../../utils/keyboardFocusHighlighting.styles';\n~~\ntype StyledContextMenuProps = WithTheme<{\n $isActive: boolean;\n $shouldAddHoverEffect: boolean;\n $shouldShowWrapperKeyboardHighlighting: boolean;\n $shouldUseDefaultTriggerStyles: boolean;\n}>;\n\nexport const StyledContextMenu = styled.span<StyledContextMenuProps>`\n align-items: center;\n cursor: pointer;\n display: flex;\n position: relative;\n\n ${({ $isActive, $shouldUseDefaultTriggerStyles, theme }: StyledContextMenuProps) =>\n $shouldUseDefaultTriggerStyles\n ? css`\n background-color: ${$isActive ? theme['201'] : 'transparent'};\n border-radius: 3px;\n padding: 6px;\n transition: background-color 0.3s ease;\n `\n : css`\n background-color: transparent;\n border-radius: inherit;\n padding: 0;\n\n > * {\n width: 100%;\n }\n `}\n\n ${({ $shouldAddHoverEffect, theme }: StyledContextMenuProps) =>\n $shouldAddHoverEffect &&\n css`\n &:hover {\n background-color: ${theme['201']};\n }\n `}\n\n ${({\n $shouldShowWrapperKeyboardHighlighting~~,\n $shouldUseDefaultTriggerStyles,\n~~ }: StyledContextMenuProps) =>\n $shouldShowWrapperKeyboardHighlighting &&\n ~~($shouldUseDefaultTriggerStyles\n ?~~ css`\n &:focus-visible {\n outline: none;\n box-shadow: none;\n }\n\n &:focus-visible > .beta-chayns-icon {\n position: relative;\n color: inherit;\n }\n\n &:focus-visible > .beta-chayns-icon::after {\n ${keyboardFocusHighlightingCircleRingCss};\n content: '';\n position: absolute;\n top: 50%;\n left: 50%;\n width: calc(100% + 8px);\n height: calc(100% + 8px);\n transform: translate(-50%, -50%);\n pointer-events: none;\n }\n `\n ~~: css`\n &:focus-visible {\n outline: none;\n box-shadow: none;\n~~ }\n~~\n &:focus-visible > * {\n ${keyboardFocusHighlightingRingCss}\n }\n~~ `)}\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;~~AAEA~~,~~IAAAC,0BAAA,GAAAD,OAAA;AAGsD,~~SAAAD,~~wBAAAG~~,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,~~YAAAL~~,uBAAA,YAAAA,~~CAAAG~~,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;~~AAS/C~~,MAAMkB,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAGE,yBAAM,CAACC,IAA4B;AACpE;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC,SAAS;EAAEC,8BAA8B;EAAEC;AAA8B,CAAC,KAC3ED,8BAA8B,GACxB,IAAAE,qBAAG;AACjB,sCAAsCH,SAAS,GAAGE,KAAK,CAAC,KAAK,CAAC,GAAG,aAAa;AAC9E;AACA;AACA;AACA,eAAe,GACD,IAAAC,qBAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe;AACf;AACA,MAAM,CAAC;EAAEC,qBAAqB;EAAEF;AAA8B,CAAC,KACvDE,qBAAqB,IACrB,IAAAD,qBAAG;AACX;AACA,oCAAoCD,KAAK,CAAC,KAAK,CAAC;AAChD;AACA,SAAS;AACT;AACA,MAAM,CAAC;~~EACCG,sCAAsC~~;~~EACtCJ;AACoB~~,CAAC,~~KACrBI~~,sCAAsC,~~KACrCJ~~,~~8BAA8B~~,~~GACzB,IAAAE,~~qBAAG;~~AACjB~~;AACA;AACA;AACA;AACA~~;AACA;AACA;AACA;AACA;AACA;AACA;AACA~~,~~wBAAwBG,iEAAsC~~;~~AAC9D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA~~,~~eAAe,GACD,IAAAH,qBAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwBI,2DAAgC;AACxD;AACA,eAAe,~~CAAC~~;AAChB,CAAC~~","ignoreList":[]}
1	+ {"version":3,"file":"ContextMenu.styles.js","names":["_styledComponents","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledContextMenu","exports","styled","span","$isActive","$shouldUseDefaultTriggerStyles","theme","css","$shouldAddHoverEffect","$shouldShowWrapperKeyboardHighlighting"],"sources":["../../../../src/components/context-menu/ContextMenu.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledContextMenuProps = WithTheme<{\n $isActive: boolean;\n $shouldAddHoverEffect: boolean;\n $shouldShowWrapperKeyboardHighlighting: boolean;\n $shouldUseDefaultTriggerStyles: boolean;\n}>;\n\nexport const StyledContextMenu = styled.span<StyledContextMenuProps>`\n align-items: center;\n cursor: pointer;\n display: flex;\n position: relative;\n\n ${({ $isActive, $shouldUseDefaultTriggerStyles, theme }: StyledContextMenuProps) =>\n $shouldUseDefaultTriggerStyles\n ? css`\n background-color: ${$isActive ? theme['201'] : 'transparent'};\n border-radius: 3px;\n padding: 6px;\n transition: background-color 0.3s ease;\n `\n : css`\n background-color: transparent;\n border-radius: inherit;\n padding: 0;\n\n > * {\n width: 100%;\n }\n `}\n\n ${({ $shouldAddHoverEffect, theme }: StyledContextMenuProps) =>\n $shouldAddHoverEffect &&\n css`\n &:hover {\n background-color: ${theme['201']};\n }\n `}\n\n ${({ $shouldShowWrapperKeyboardHighlighting }: StyledContextMenuProps) =>\n $shouldShowWrapperKeyboardHighlighting &&\n css`\n &:focus-visible {\n outline: none;\n box-shadow: none;\n }\n `}\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAD,wBAAAE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAJ,uBAAA,YAAAA,CAAAE,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAUzC,MAAMkB,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAGE,yBAAM,CAACC,IAA4B;AACpE;AACA;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC,SAAS;EAAEC,8BAA8B;EAAEC;AAA8B,CAAC,KAC3ED,8BAA8B,GACxB,IAAAE,qBAAG;AACjB,sCAAsCH,SAAS,GAAGE,KAAK,CAAC,KAAK,CAAC,GAAG,aAAa;AAC9E;AACA;AACA;AACA,eAAe,GACD,IAAAC,qBAAG;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe;AACf;AACA,MAAM,CAAC;EAAEC,qBAAqB;EAAEF;AAA8B,CAAC,KACvDE,qBAAqB,IACrB,IAAAD,qBAAG;AACX;AACA,oCAAoCD,KAAK,CAAC,KAAK,CAAC;AAChD;AACA,SAAS;AACT;AACA,MAAM,CAAC;EAAEG;AAA+D,CAAC,KACjEA,sCAAsC,IACtC,IAAAF,qBAAG;AACX;AACA;AACA;AACA;AACA,SAAS;AACT,CAAC","ignoreList":[]}

package/lib/cjs/components/copyable-content/CopyableContent.js CHANGED Viewed

@@ -32,6 +32,7 @@ const CopyableContent = ({
   children,
   copyFailedMessage,
   collapsedHeight,
+  isDisabled = false,
   transformClipboardHtml
 }) => {
   const rootRef = (0, _react.useRef)(null);
@@ -62,6 +63,9 @@ const CopyableContent = ({
     }, COPY_FEEDBACK_DURATION);
   }, []);
   const handleCopy = (0, _react.useCallback)(async () => {
+    if (isDisabled) {
+      return;
+    }
     try {
       await (0, _copyableContentClipboard.copyableContentToClipboard)(content, transformClipboardHtml);
       showCopyFeedback();
@@ -73,7 +77,7 @@ const CopyableContent = ({
         type: _chaynsApi.DialogType.TOAST
       }).open();
     }
-  }, [content, defaultCopyFailedMessage, copyFailedMessage, showCopyFeedback, transformClipboardHtml]);
+  }, [content, defaultCopyFailedMessage, isDisabled, copyFailedMessage, showCopyFeedback, transformClipboardHtml]);
   return /*#__PURE__*/_react.default.createElement(_CopyableContent.StyledCopyableContent, {
     $appearance: appearance,
     $colorMode: colorMode,
@@ -85,6 +89,7 @@ const CopyableContent = ({
     $colorMode: colorMode,
     $isSticky: isActionGroupSticky,
     "aria-label": defaultCopyButtonText,
+    disabled: isDisabled,
     onClick: () => {
       void handleCopy();
     },
@@ -93,6 +98,7 @@ const CopyableContent = ({
     icons: hasCopied ? ['fa fa-check'] : ['fa-light fa-copy']
   })), /*#__PURE__*/_react.default.createElement(_SharingContextMenu.default, {
     link: content,
+    shouldDisableClick: isDisabled,
     shouldShowCallingCodeAction: false,
     shouldShowCopyAction: false,
     shouldUseDefaultTriggerStyles: false
@@ -100,6 +106,7 @@ const CopyableContent = ({
     $colorMode: colorMode,
     $isSticky: isActionGroupSticky,
     "aria-label": shareText,
+    disabled: isDisabled,
     type: "button"
   }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
     icons: ['fa fa-share-nodes']

package/lib/cjs/components/copyable-content/CopyableContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CopyableContent.js","names":["_format","require","_textstring","_chaynsApi","_react","_interopRequireWildcard","_textStrings","_interopRequireDefault","_useStickyActionState","_ColorSchemeProvider","_SharingContextMenu","_Icon","_Truncation","_CopyableContent","_CopyableContent2","_copyableContentClipboard","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","COPY_FEEDBACK_DURATION","CopyableContent","appearance","CopyableContentAppearance","Default","content","children","copyFailedMessage","collapsedHeight","transformClipboardHtml","rootRef","useRef","actionGroupRef","copyFeedbackTimeoutRef","isActionGroupSticky","useStickyActionState","hasCopied","setHasCopied","useState","colorScheme","useColorScheme","colorMode","theme","CopyableContentColorMode","Dark","Light","defaultCopyButtonText","useTextstringValue","textstring","ttsToITextString","textStrings","components","copyableContent","copy","defaultCopyFailedMessage","copyFailed","shareText","share","html","useMemo","formatStringToHtml","useEffect","window","clearTimeout","current","showCopyFeedback","useCallback","setTimeout","handleCopy","copyableContentToClipboard","createDialog","showCloseIcon","text","toastType","ToastType","ERROR","type","DialogType","TOAST","open","createElement","StyledCopyableContent","$appearance","$colorMode","className","ref","StyledCopyableContentActions","StyledCopyableContentActionGroup","StyledCopyableContentButton","$isSticky","onClick","icons","link","shouldShowCallingCodeAction","shouldShowCopyAction","shouldUseDefaultTriggerStyles","StyledCopyableContentTruncation","StyledCopyableContentBody","$shouldShowPadding","dangerouslySetInnerHTML","__html","displayName","_default","exports"],"sources":["../../../../src/components/copyable-content/CopyableContent.tsx"],"sourcesContent":["import { formatStringToHtml } from '@chayns-components/format';\nimport { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';\nimport { createDialog, DialogType, ToastType } from 'chayns-api';\nimport React, { FC, ReactNode, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport textStrings from '../../constants/textStrings';\nimport { useStickyActionState } from '../../hooks/useStickyActionState';\nimport { useColorScheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport SharingContextMenu from '../sharing-context-menu/SharingContextMenu';\nimport Icon from '../icon/Icon';\nimport Truncation from '../truncation/Truncation';\nimport {\n CopyableContentColorMode,\n StyledCopyableContent,\n StyledCopyableContentActionGroup,\n StyledCopyableContentActions,\n StyledCopyableContentBody,\n StyledCopyableContentButton,\n StyledCopyableContentTruncation,\n} from './CopyableContent.styles';\nimport { CopyableContentAppearance } from './CopyableContent.types';\nimport { copyableContentToClipboard } from './copyableContentClipboard';\n\nconst COPY_FEEDBACK_DURATION = 1500;\n\nexport type CopyableContentProps = {\n /*\n Controls the visual surface of the content block.\n /\n appearance?: CopyableContentAppearance;\n /\n Markdown source used for rendering and clipboard data.\n /\n content: string;\n /\n Replaces only the visible rendered content and never the copied source.\n /\n children?: ReactNode;\n /\n Replaces the localized error message shown when copying fails.\n /\n copyFailedMessage?: string;\n /\n The height of the content in its collapsed state.\n /\n collapsedHeight?: number;\n /\n Transforms the generated HTML before it is written to the clipboard.\n */\n transformClipboardHtml?: (html: string) => string;\n};\n\nconst CopyableContent: FC<CopyableContentProps> = ({\n appearance = CopyableContentAppearance.Default,\n content,\n children,\n copyFailedMessage,\n collapsedHeight,\n transformClipboardHtml,\n}) => {\n const rootRef = useRef<HTMLElement>(null);\n const actionGroupRef = useRef<HTMLDivElement>(null);\n const copyFeedbackTimeoutRef = useRef<number>();\n const isActionGroupSticky = useStickyActionState(rootRef, actionGroupRef);\n const [hasCopied, setHasCopied] = useState(false);\n\n const colorScheme = useColorScheme();\n const colorMode =\n colorScheme?.theme.colorMode === 'dark'\n ? CopyableContentColorMode.Dark\n : CopyableContentColorMode.Light;\n\n const defaultCopyButtonText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.copyableContent.copy),\n });\n const defaultCopyFailedMessage = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.copyableContent.copyFailed),\n });\n const shareText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.copyableContent.share),\n });\n\n const html = useMemo(() => formatStringToHtml(content).html, [content]);\n\n useEffect(\n () => () => {\n window.clearTimeout(copyFeedbackTimeoutRef.current);\n },\n [],\n );\n\n const showCopyFeedback = useCallback(() => {\n window.clearTimeout(copyFeedbackTimeoutRef.current);\n setHasCopied(true);\n\n copyFeedbackTimeoutRef.current = window.setTimeout(() => {\n setHasCopied(false);\n }, COPY_FEEDBACK_DURATION);\n }, []);\n\n const handleCopy = useCallback(async () => {\n try {\n await copyableContentToClipboard(content, transformClipboardHtml);\n showCopyFeedback();\n } catch {\n void createDialog({\n showCloseIcon: true,\n text: copyFailedMessage ?? defaultCopyFailedMessage,\n toastType: ToastType.ERROR,\n type: DialogType.TOAST,\n }).open();\n }\n }, [\n content,\n defaultCopyFailedMessage,\n copyFailedMessage,\n showCopyFeedback,\n transformClipboardHtml,\n ]);\n\n return (\n <StyledCopyableContent\n $appearance={appearance}\n $colorMode={colorMode}\n className=\"copyable-content\"\n ref={rootRef}\n >\n <StyledCopyableContentActions ref={actionGroupRef}>\n <StyledCopyableContentActionGroup>\n <StyledCopyableContentButton\n $colorMode={colorMode}\n $isSticky={isActionGroupSticky}\n aria-label={defaultCopyButtonText}\n onClick={() => {\n void handleCopy();\n }}\n type=\"button\"\n >\n <Icon icons={hasCopied ? ['fa fa-check'] : ['fa-light fa-copy']} />\n </StyledCopyableContentButton>\n <SharingContextMenu\n link={content}\n shouldShowCallingCodeAction={false}\n shouldShowCopyAction={false}\n shouldUseDefaultTriggerStyles={false}\n >\n <StyledCopyableContentButton\n $colorMode={colorMode}\n $isSticky={isActionGroupSticky}\n aria-label={shareText}\n type=\"button\"\n >\n <Icon icons={['fa fa-share-nodes']} />\n </StyledCopyableContentButton>\n </SharingContextMenu>\n </StyledCopyableContentActionGroup>\n </StyledCopyableContentActions>\n {typeof collapsedHeight === 'number' ? (\n <StyledCopyableContentTruncation>\n <Truncation collapsedHeight={collapsedHeight}>\n <StyledCopyableContentBody\n $colorMode={colorMode}\n $shouldShowPadding={false}\n >\n {children ?? <div dangerouslySetInnerHTML={{ __html: html }} />}\n </StyledCopyableContentBody>\n </Truncation>\n </StyledCopyableContentTruncation>\n ) : (\n <StyledCopyableContentBody $colorMode={colorMode}>\n {children ?? <div dangerouslySetInnerHTML={{ __html: html }} />}\n </StyledCopyableContentBody>\n )}\n </StyledCopyableContent>\n );\n};\n\nCopyableContent.displayName = 'CopyableContent';\n\nexport default CopyableContent;\n\nexport { CopyableContentAppearance } from './CopyableContent.types';\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"CopyableContent.js","names":["_format","require","_textstring","_chaynsApi","_react","_interopRequireWildcard","_textStrings","_interopRequireDefault","_useStickyActionState","_ColorSchemeProvider","_SharingContextMenu","_Icon","_Truncation","_CopyableContent","_CopyableContent2","_copyableContentClipboard","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","COPY_FEEDBACK_DURATION","CopyableContent","appearance","CopyableContentAppearance","Default","content","children","copyFailedMessage","collapsedHeight","isDisabled","transformClipboardHtml","rootRef","useRef","actionGroupRef","copyFeedbackTimeoutRef","isActionGroupSticky","useStickyActionState","hasCopied","setHasCopied","useState","colorScheme","useColorScheme","colorMode","theme","CopyableContentColorMode","Dark","Light","defaultCopyButtonText","useTextstringValue","textstring","ttsToITextString","textStrings","components","copyableContent","copy","defaultCopyFailedMessage","copyFailed","shareText","share","html","useMemo","formatStringToHtml","useEffect","window","clearTimeout","current","showCopyFeedback","useCallback","setTimeout","handleCopy","copyableContentToClipboard","createDialog","showCloseIcon","text","toastType","ToastType","ERROR","type","DialogType","TOAST","open","createElement","StyledCopyableContent","$appearance","$colorMode","className","ref","StyledCopyableContentActions","StyledCopyableContentActionGroup","StyledCopyableContentButton","$isSticky","disabled","onClick","icons","link","shouldDisableClick","shouldShowCallingCodeAction","shouldShowCopyAction","shouldUseDefaultTriggerStyles","StyledCopyableContentTruncation","StyledCopyableContentBody","$shouldShowPadding","dangerouslySetInnerHTML","__html","displayName","_default","exports"],"sources":["../../../../src/components/copyable-content/CopyableContent.tsx"],"sourcesContent":["import { formatStringToHtml } from '@chayns-components/format';\nimport { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';\nimport { createDialog, DialogType, ToastType } from 'chayns-api';\nimport React, { FC, ReactNode, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport textStrings from '../../constants/textStrings';\nimport { useStickyActionState } from '../../hooks/useStickyActionState';\nimport { useColorScheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport SharingContextMenu from '../sharing-context-menu/SharingContextMenu';\nimport Icon from '../icon/Icon';\nimport Truncation from '../truncation/Truncation';\nimport {\n CopyableContentColorMode,\n StyledCopyableContent,\n StyledCopyableContentActionGroup,\n StyledCopyableContentActions,\n StyledCopyableContentBody,\n StyledCopyableContentButton,\n StyledCopyableContentTruncation,\n} from './CopyableContent.styles';\nimport { CopyableContentAppearance } from './CopyableContent.types';\nimport { copyableContentToClipboard } from './copyableContentClipboard';\n\nconst COPY_FEEDBACK_DURATION = 1500;\n\nexport type CopyableContentProps = {\n /*\n Controls the visual surface of the content block.\n /\n appearance?: CopyableContentAppearance;\n /\n Markdown source used for rendering and clipboard data.\n /\n content: string;\n /\n Disables the copy and share actions.\n /\n isDisabled?: boolean;\n /\n Replaces only the visible rendered content and never the copied source.\n /\n children?: ReactNode;\n /\n Replaces the localized error message shown when copying fails.\n /\n copyFailedMessage?: string;\n /\n The height of the content in its collapsed state.\n /\n collapsedHeight?: number;\n /\n Transforms the generated HTML before it is written to the clipboard.\n */\n transformClipboardHtml?: (html: string) => string;\n};\n\nconst CopyableContent: FC<CopyableContentProps> = ({\n appearance = CopyableContentAppearance.Default,\n content,\n children,\n copyFailedMessage,\n collapsedHeight,\n isDisabled = false,\n transformClipboardHtml,\n}) => {\n const rootRef = useRef<HTMLElement>(null);\n const actionGroupRef = useRef<HTMLDivElement>(null);\n const copyFeedbackTimeoutRef = useRef<number>();\n const isActionGroupSticky = useStickyActionState(rootRef, actionGroupRef);\n const [hasCopied, setHasCopied] = useState(false);\n\n const colorScheme = useColorScheme();\n const colorMode =\n colorScheme?.theme.colorMode === 'dark'\n ? CopyableContentColorMode.Dark\n : CopyableContentColorMode.Light;\n\n const defaultCopyButtonText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.copyableContent.copy),\n });\n const defaultCopyFailedMessage = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.copyableContent.copyFailed),\n });\n const shareText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.copyableContent.share),\n });\n\n const html = useMemo(() => formatStringToHtml(content).html, [content]);\n\n useEffect(\n () => () => {\n window.clearTimeout(copyFeedbackTimeoutRef.current);\n },\n [],\n );\n\n const showCopyFeedback = useCallback(() => {\n window.clearTimeout(copyFeedbackTimeoutRef.current);\n setHasCopied(true);\n\n copyFeedbackTimeoutRef.current = window.setTimeout(() => {\n setHasCopied(false);\n }, COPY_FEEDBACK_DURATION);\n }, []);\n\n const handleCopy = useCallback(async () => {\n if (isDisabled) {\n return;\n }\n\n try {\n await copyableContentToClipboard(content, transformClipboardHtml);\n showCopyFeedback();\n } catch {\n void createDialog({\n showCloseIcon: true,\n text: copyFailedMessage ?? defaultCopyFailedMessage,\n toastType: ToastType.ERROR,\n type: DialogType.TOAST,\n }).open();\n }\n }, [\n content,\n defaultCopyFailedMessage,\n isDisabled,\n copyFailedMessage,\n showCopyFeedback,\n transformClipboardHtml,\n ]);\n\n return (\n <StyledCopyableContent\n $appearance={appearance}\n $colorMode={colorMode}\n className=\"copyable-content\"\n ref={rootRef}\n >\n <StyledCopyableContentActions ref={actionGroupRef}>\n <StyledCopyableContentActionGroup>\n <StyledCopyableContentButton\n $colorMode={colorMode}\n $isSticky={isActionGroupSticky}\n aria-label={defaultCopyButtonText}\n disabled={isDisabled}\n onClick={() => {\n void handleCopy();\n }}\n type=\"button\"\n >\n <Icon icons={hasCopied ? ['fa fa-check'] : ['fa-light fa-copy']} />\n </StyledCopyableContentButton>\n <SharingContextMenu\n link={content}\n shouldDisableClick={isDisabled}\n shouldShowCallingCodeAction={false}\n shouldShowCopyAction={false}\n shouldUseDefaultTriggerStyles={false}\n >\n <StyledCopyableContentButton\n $colorMode={colorMode}\n $isSticky={isActionGroupSticky}\n aria-label={shareText}\n disabled={isDisabled}\n type=\"button\"\n >\n <Icon icons={['fa fa-share-nodes']} />\n </StyledCopyableContentButton>\n </SharingContextMenu>\n </StyledCopyableContentActionGroup>\n </StyledCopyableContentActions>\n {typeof collapsedHeight === 'number' ? (\n <StyledCopyableContentTruncation>\n <Truncation collapsedHeight={collapsedHeight}>\n <StyledCopyableContentBody\n $colorMode={colorMode}\n $shouldShowPadding={false}\n >\n {children ?? <div dangerouslySetInnerHTML={{ __html: html }} />}\n </StyledCopyableContentBody>\n </Truncation>\n </StyledCopyableContentTruncation>\n ) : (\n <StyledCopyableContentBody $colorMode={colorMode}>\n {children ?? <div dangerouslySetInnerHTML={{ __html: html }} />}\n </StyledCopyableContentBody>\n )}\n </StyledCopyableContent>\n );\n};\n\nCopyableContent.displayName = 'CopyableContent';\n\nexport default CopyableContent;\n\nexport { CopyableContentAppearance } from './CopyableContent.types';\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/copyable-content/CopyableContent.styles.js CHANGED Viewed

@@ -106,17 +106,22 @@ const StyledCopyableContentButton = exports.StyledCopyableContentButton = _style
         box-shadow 0.15s ease,
         transform 0.15s ease;
-    &:hover {
+    &:enabled:hover {
         border-color: ${getButtonHoverBorder};
         background-color: ${getButtonHoverBackground};
         box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
     }
-    &:active {
+    &:enabled:active {
         background-color: ${getButtonActiveBackground};
         transform: scale(0.94);
     }
+    &:disabled {
+        cursor: not-allowed;
+        opacity: 0.45;
+    }
     &:focus-visible {
         outline: 2px solid currentColor;
         outline-offset: 2px;

package/lib/cjs/components/copyable-content/CopyableContent.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CopyableContent.styles.js","names":["_styledComponents","_interopRequireDefault","require","_CopyableContent","e","__esModule","default","CopyableContentColorMode","exports","getBackgroundColor","$appearance","$colorMode","CopyableContentAppearance","Chat","Dark","getTextColor","StyledCopyableContent","styled","section","getActionGroupBorder","$isSticky","getActionGroupBackground","getButtonHoverBackground","getButtonActiveBackground","getButtonHoverBorder","getButtonColor","StyledCopyableContentActions","div","StyledCopyableContentActionGroup","StyledCopyableContentButton","button","StyledCopyableContentTruncation","getHeadlineColor","getBlockquoteBorderColor","getLinkColor","StyledCopyableContentBody","$shouldShowPadding"],"sources":["../../../../src/components/copyable-content/CopyableContent.styles.ts"],"sourcesContent":["import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport styled from 'styled-components';\nimport { CopyableContentAppearance } from './CopyableContent.types';\n\nexport enum CopyableContentColorMode {\n Dark = 'dark',\n Light = 'light',\n}\n\ntype StyledCopyableContentProps = WithTheme<{\n $appearance: CopyableContentAppearance;\n $colorMode: CopyableContentColorMode;\n}>;\n\nconst getBackgroundColor = ({ $appearance, $colorMode }: StyledCopyableContentProps) => {\n if ($appearance === CopyableContentAppearance.Chat) {\n return 'rgba(0, 0, 0, 0.12)';\n }\n\n return $colorMode === CopyableContentColorMode.Dark ? '#282c34' : '#fafafa';\n};\n\nconst getTextColor = ({ $colorMode }: StyledCopyableContentProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#f4f6f8' : '#333333';\n\nexport const StyledCopyableContent = styled.section<StyledCopyableContentProps>`\n --copyable-content-action-size: 32px;\n --copyable-content-action-inset: 8px;\n\n margin: 4px 0;\n min-width: 0;\n max-width: 100%;\n overflow-wrap: anywhere;\n padding-top: calc(\n var(--copyable-content-action-size) + var(--copyable-content-action-inset) * 2\n );\n border-radius: 8px;\n background-color: ${getBackgroundColor};\n color: ${getTextColor};\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);\n`;\n\ntype StyledCopyableContentButtonProps = WithTheme<{\n $colorMode: CopyableContentColorMode;\n $isSticky: boolean;\n}>;\n\nconst getActionGroupBorder = ({ $colorMode, $isSticky }: StyledCopyableContentButtonProps) => {\n if (!$isSticky) {\n return 'transparent';\n }\n\n return $colorMode === CopyableContentColorMode.Dark ? '#5a6474' : '#d4d4d4';\n};\n\nconst getActionGroupBackground = ({ $colorMode, $isSticky }: StyledCopyableContentButtonProps) => {\n if (!$isSticky) {\n return 'transparent';\n }\n\n return $colorMode === CopyableContentColorMode.Dark ? '#343a46' : '#fafafa';\n};\n\nconst getButtonHoverBackground = ({ $colorMode }: StyledCopyableContentButtonProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#454c59' : 'rgba(128, 128, 128, 0.2)';\n\nconst getButtonActiveBackground = ({ $colorMode }: StyledCopyableContentButtonProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#545d6d' : 'rgba(128, 128, 128, 0.3)';\n\nconst getButtonHoverBorder = ({ $colorMode }: StyledCopyableContentButtonProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#6a7485' : '#c2c2c2';\n\nconst getButtonColor = ({ $colorMode }: StyledCopyableContentButtonProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#f4f6f8' : '#999999';\n\nexport const StyledCopyableContentActions = styled.div`\n position: sticky;\n top: var(--copyable-content-action-inset);\n z-index: 1;\n display: flex;\n justify-content: flex-end;\n height: calc(var(--copyable-content-action-size) + var(--copyable-content-action-inset));\n margin-top: calc(\n (var(--copyable-content-action-size) + var(--copyable-content-action-inset)) * -1\n );\n padding-right: var(--copyable-content-action-inset);\n`;\n\nexport const StyledCopyableContentActionGroup = styled.div`\n display: flex;\n gap: 4px;\n height: var(--copyable-content-action-size);\n`;\n\nexport const StyledCopyableContentButton = styled.button<StyledCopyableContentButtonProps>`\n box-sizing: border-box;\n border: 1px solid ${getActionGroupBorder};\n border-radius: 4px;\n width: var(--copyable-content-action-size);\n height: var(--copyable-content-action-size);\n padding: 0;\n cursor: pointer;\n background-color: ${getActionGroupBackground};\n color: ${getButtonColor};\n box-shadow: ${({ $isSticky }) => ($isSticky ? '0 2px 8px rgba(0, 0, 0, 0.28)' : 'none')};\n transition:\n background-color 0.15s ease,\n border-color 0.15s ease,\n box-shadow 0.15s ease,\n transform 0.15s ease;\n\n &:hover {\n border-color: ${getButtonHoverBorder};\n background-color: ${getButtonHoverBackground};\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);\n }\n\n &:active {\n background-color: ${getButtonActiveBackground};\n transform: scale(0.94);\n }\n\n &:focus-visible {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n }\n`;\n\nexport const StyledCopyableContentTruncation = styled.div`\n padding: 0 12px 12px;\n`;\n\ntype StyledCopyableContentBodyProps = WithTheme<{\n $colorMode: CopyableContentColorMode;\n $shouldShowPadding?: boolean;\n}>;\n\nconst getHeadlineColor = ({ $colorMode }: StyledCopyableContentBodyProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#e5e5e5' : '#333333';\n\nconst getBlockquoteBorderColor = ({ $colorMode }: StyledCopyableContentBodyProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#5a6474' : '#d4d4d4';\n\nconst getLinkColor = ({ $colorMode }: StyledCopyableContentBodyProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#7cb3ff' : '#0066cc';\n\nexport const StyledCopyableContentBody = styled.div<StyledCopyableContentBodyProps>`\n min-width: 0;\n max-width: 100%;\n overflow-x: clip;\n overflow-wrap: anywhere;\n padding: ${({ $shouldShowPadding = true }) => ($shouldShowPadding ? '0 12px 12px' : '0')};\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p,\n ul,\n ol,\n blockquote {\n margin: 0 0 12px;\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n color: ${getHeadlineColor};\n }\n\n ul,\n ol {\n padding-left: 24px;\n }\n\n blockquote {\n padding-left: 12px;\n border-left: 3px solid ${getBlockquoteBorderColor};\n }\n\n a {\n color: ${getLinkColor};\n overflow-wrap: anywhere;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n`;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"CopyableContent.styles.js","names":["_styledComponents","_interopRequireDefault","require","_CopyableContent","e","__esModule","default","CopyableContentColorMode","exports","getBackgroundColor","$appearance","$colorMode","CopyableContentAppearance","Chat","Dark","getTextColor","StyledCopyableContent","styled","section","getActionGroupBorder","$isSticky","getActionGroupBackground","getButtonHoverBackground","getButtonActiveBackground","getButtonHoverBorder","getButtonColor","StyledCopyableContentActions","div","StyledCopyableContentActionGroup","StyledCopyableContentButton","button","StyledCopyableContentTruncation","getHeadlineColor","getBlockquoteBorderColor","getLinkColor","StyledCopyableContentBody","$shouldShowPadding"],"sources":["../../../../src/components/copyable-content/CopyableContent.styles.ts"],"sourcesContent":["import type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport styled from 'styled-components';\nimport { CopyableContentAppearance } from './CopyableContent.types';\n\nexport enum CopyableContentColorMode {\n Dark = 'dark',\n Light = 'light',\n}\n\ntype StyledCopyableContentProps = WithTheme<{\n $appearance: CopyableContentAppearance;\n $colorMode: CopyableContentColorMode;\n}>;\n\nconst getBackgroundColor = ({ $appearance, $colorMode }: StyledCopyableContentProps) => {\n if ($appearance === CopyableContentAppearance.Chat) {\n return 'rgba(0, 0, 0, 0.12)';\n }\n\n return $colorMode === CopyableContentColorMode.Dark ? '#282c34' : '#fafafa';\n};\n\nconst getTextColor = ({ $colorMode }: StyledCopyableContentProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#f4f6f8' : '#333333';\n\nexport const StyledCopyableContent = styled.section<StyledCopyableContentProps>`\n --copyable-content-action-size: 32px;\n --copyable-content-action-inset: 8px;\n\n margin: 4px 0;\n min-width: 0;\n max-width: 100%;\n overflow-wrap: anywhere;\n padding-top: calc(\n var(--copyable-content-action-size) + var(--copyable-content-action-inset) * 2\n );\n border-radius: 8px;\n background-color: ${getBackgroundColor};\n color: ${getTextColor};\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.16);\n`;\n\ntype StyledCopyableContentButtonProps = WithTheme<{\n $colorMode: CopyableContentColorMode;\n $isSticky: boolean;\n}>;\n\nconst getActionGroupBorder = ({ $colorMode, $isSticky }: StyledCopyableContentButtonProps) => {\n if (!$isSticky) {\n return 'transparent';\n }\n\n return $colorMode === CopyableContentColorMode.Dark ? '#5a6474' : '#d4d4d4';\n};\n\nconst getActionGroupBackground = ({ $colorMode, $isSticky }: StyledCopyableContentButtonProps) => {\n if (!$isSticky) {\n return 'transparent';\n }\n\n return $colorMode === CopyableContentColorMode.Dark ? '#343a46' : '#fafafa';\n};\n\nconst getButtonHoverBackground = ({ $colorMode }: StyledCopyableContentButtonProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#454c59' : 'rgba(128, 128, 128, 0.2)';\n\nconst getButtonActiveBackground = ({ $colorMode }: StyledCopyableContentButtonProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#545d6d' : 'rgba(128, 128, 128, 0.3)';\n\nconst getButtonHoverBorder = ({ $colorMode }: StyledCopyableContentButtonProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#6a7485' : '#c2c2c2';\n\nconst getButtonColor = ({ $colorMode }: StyledCopyableContentButtonProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#f4f6f8' : '#999999';\n\nexport const StyledCopyableContentActions = styled.div`\n position: sticky;\n top: var(--copyable-content-action-inset);\n z-index: 1;\n display: flex;\n justify-content: flex-end;\n height: calc(var(--copyable-content-action-size) + var(--copyable-content-action-inset));\n margin-top: calc(\n (var(--copyable-content-action-size) + var(--copyable-content-action-inset)) * -1\n );\n padding-right: var(--copyable-content-action-inset);\n`;\n\nexport const StyledCopyableContentActionGroup = styled.div`\n display: flex;\n gap: 4px;\n height: var(--copyable-content-action-size);\n`;\n\nexport const StyledCopyableContentButton = styled.button<StyledCopyableContentButtonProps>`\n box-sizing: border-box;\n border: 1px solid ${getActionGroupBorder};\n border-radius: 4px;\n width: var(--copyable-content-action-size);\n height: var(--copyable-content-action-size);\n padding: 0;\n cursor: pointer;\n background-color: ${getActionGroupBackground};\n color: ${getButtonColor};\n box-shadow: ${({ $isSticky }) => ($isSticky ? '0 2px 8px rgba(0, 0, 0, 0.28)' : 'none')};\n transition:\n background-color 0.15s ease,\n border-color 0.15s ease,\n box-shadow 0.15s ease,\n transform 0.15s ease;\n\n &:enabled:hover {\n border-color: ${getButtonHoverBorder};\n background-color: ${getButtonHoverBackground};\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);\n }\n\n &:enabled:active {\n background-color: ${getButtonActiveBackground};\n transform: scale(0.94);\n }\n\n &:disabled {\n cursor: not-allowed;\n opacity: 0.45;\n }\n\n &:focus-visible {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n }\n`;\n\nexport const StyledCopyableContentTruncation = styled.div`\n padding: 0 12px 12px;\n`;\n\ntype StyledCopyableContentBodyProps = WithTheme<{\n $colorMode: CopyableContentColorMode;\n $shouldShowPadding?: boolean;\n}>;\n\nconst getHeadlineColor = ({ $colorMode }: StyledCopyableContentBodyProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#e5e5e5' : '#333333';\n\nconst getBlockquoteBorderColor = ({ $colorMode }: StyledCopyableContentBodyProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#5a6474' : '#d4d4d4';\n\nconst getLinkColor = ({ $colorMode }: StyledCopyableContentBodyProps) =>\n $colorMode === CopyableContentColorMode.Dark ? '#7cb3ff' : '#0066cc';\n\nexport const StyledCopyableContentBody = styled.div<StyledCopyableContentBodyProps>`\n min-width: 0;\n max-width: 100%;\n overflow-x: clip;\n overflow-wrap: anywhere;\n padding: ${({ $shouldShowPadding = true }) => ($shouldShowPadding ? '0 12px 12px' : '0')};\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n p,\n ul,\n ol,\n blockquote {\n margin: 0 0 12px;\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n color: ${getHeadlineColor};\n }\n\n ul,\n ol {\n padding-left: 24px;\n }\n\n blockquote {\n padding-left: 12px;\n border-left: 3px solid ${getBlockquoteBorderColor};\n }\n\n a {\n color: ${getLinkColor};\n overflow-wrap: anywhere;\n }\n\n > :last-child {\n margin-bottom: 0;\n }\n`;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/file-list/file-item/FileItem.js CHANGED Viewed

@@ -12,6 +12,7 @@ var _ListItem = _interopRequireDefault(require("../../list/list-item/ListItem"))
 var _FileItem = require("./FileItem.styles");
 var _textstring = require("@chayns-components/textstring");
 var _textStrings = _interopRequireDefault(require("../../../constants/textStrings"));
+var _useFocusRingPortal = require("../../../hooks/useFocusRingPortal");
 var _useKeyboardFocusHighlighting = require("../../../hooks/useKeyboardFocusHighlighting");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
@@ -26,7 +27,12 @@ const FileItem = ({
 }) => {
   const canDownload = shouldAllowDownload && !!source;
   const canRemove = typeof onRemove === 'function';
+  const actionIconRef = (0, _react.useRef)(null);
   const shouldShowKeyboardHighlighting = (0, _useKeyboardFocusHighlighting.useKeyboardFocusHighlighting)(canRemove || !!canDownload);
+  (0, _useFocusRingPortal.useFocusRingPortal)(actionIconRef, {
+    isEnabled: shouldShowKeyboardHighlighting,
+    shape: 'circle'
+  });
   const handleRemove = (0, _react.useCallback)(() => {
     if (canRemove) {
       onRemove(id);
@@ -126,6 +132,7 @@ const FileItem = ({
     const handleKeyDown = canRemove ? handleRemoveKeyDown : undefined;
     const fileIcon = canRemove ? 'ts-wrong' : 'fa fa-download';
     return /*#__PURE__*/_react.default.createElement(_FileItem.StyledFileItemIcon, {
+      ref: actionIconRef,
       onClick: handleClick,
       onKeyDown: handleKeyDown,
       role: "button",

package/lib/cjs/components/file-list/file-item/FileItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileItem.js","names":["_react","_interopRequireWildcard","require","_file","_Icon","_interopRequireDefault","_ContextMenu","_ListItem","_FileItem","_textstring","_textStrings","_useKeyboardFocusHighlighting","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FileItem","mimeType","onRemove","size","name","id","source","shouldAllowDownload","canDownload","canRemove","shouldShowKeyboardHighlighting","useKeyboardFocusHighlighting","handleRemove","useCallback","handleItemKeyDown","event","key","preventDefault","handleRemoveKeyDown","stopPropagation","humanFileSize","useMemo","getHumanSize","undefined","icon","getIconByMimeType","handleDownload","File","url","URL","createObjectURL","a","document","createElement","href","download","body","appendChild","click","removeChild","revokeObjectURL","fetch","then","res","ok","Error","blob","catch","rel","target","downloadText","useTextstringValue","textstring","ttsToITextString","textStrings","components","fileItem","removeText","remove","rightElement","items","icons","onClick","text","handleClick","handleKeyDown","fileIcon","StyledFileItemIcon","onKeyDown","role","tabIndex","StyledFileItem","StyledFileItemKeyboardWrapper","title","subtitle","rightElements","shouldEnableKeyboardHighlighting","displayName","_default","exports"],"sources":["../../../../../src/components/file-list/file-item/FileItem.tsx"],"sourcesContent":["import React, { FC, KeyboardEventHandler, useCallback, useMemo } from 'react';\nimport { getHumanSize, getIconByMimeType } from '../../../utils/file';\nimport Icon from '../../icon/Icon';\nimport ContextMenu from '../../context-menu/ContextMenu';\nimport type { ContextMenuItem } from '../../context-menu/ContextMenu.types';\nimport ListItem from '../../list/list-item/ListItem';\nimport type { IFileItem } from '../FileList';\nimport {\n StyledFileItem,\n StyledFileItemActions,\n StyledFileItemKeyboardWrapper,\n StyledFileItemRemoveButton,\n StyledFileItemIcon,\n} from './FileItem.styles';\nimport { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';\nimport textStrings from '../../../constants/textStrings';\nimport { useKeyboardFocusHighlighting } from '../../../hooks/useKeyboardFocusHighlighting';\n\nexport type FileItemProps = IFileItem & {\n onRemove?: (name: string) => void;\n shouldAllowDownload?: boolean;\n};\n\nconst FileItem: FC<FileItemProps> = ({\n mimeType,\n onRemove,\n size,\n name,\n id,\n source,\n shouldAllowDownload,\n}) => {\n const canDownload = shouldAllowDownload && !!source;\n const canRemove = typeof onRemove === 'function';\n\n const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(canRemove \|\| !!canDownload);\n\n const handleRemove = useCallback(() => {\n if (canRemove) {\n onRemove(id);\n }\n }, [id, onRemove]);\n\n const handleItemKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n if (event.key === 'Delete') {\n event.preventDefault();\n handleRemove();\n }\n },\n [handleRemove],\n );\n\n const handleRemoveKeyDown = useCallback<KeyboardEventHandler<HTMLSpanElement>>(\n (event) => {\n if (canRemove && (event.key === 'Enter' \|\| event.key === ' ')) {\n event.preventDefault();\n event.stopPropagation();\n handleRemove();\n }\n },\n [handleRemove],\n );\n\n const humanFileSize = useMemo(() => {\n if (typeof size === 'number') {\n return getHumanSize(size);\n }\n\n return undefined;\n }, [size]);\n\n const icon = useMemo(() => getIconByMimeType(mimeType), [mimeType]);\n\n const handleDownload = useCallback(() => {\n if (!source) return;\n\n if (source instanceof File) {\n const url = URL.createObjectURL(source);\n const a = document.createElement('a');\n a.href = url;\n a.download = name;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n URL.revokeObjectURL(url);\n } else {\n // Try fetching as blob to force download. If CORS blocks it,\n // fall back to opening the URL directly.\n fetch(source)\n .then((res) => {\n if (!res.ok) throw new Error('fetch failed');\n return res.blob();\n })\n .then((blob) => {\n const url = URL.createObjectURL(blob);\n const a = document.createElement('a');\n a.href = url;\n a.download = name;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n URL.revokeObjectURL(url);\n })\n .catch(() => {\n // CORS or network error: fall back to direct link\n const a = document.createElement('a');\n a.href = source;\n a.download = name;\n a.rel = 'noopener noreferrer';\n a.target = '_blank';\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n });\n }\n }, [name, source]);\n\n const downloadText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.fileItem.download),\n });\n const removeText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.fileItem.remove),\n });\n\n const rightElement = useMemo(() => {\n if (!canDownload && !canRemove) return undefined;\n // Both actions available → show as ContextMenu\n if (canDownload && canRemove) {\n const items: ContextMenuItem[] = [\n {\n icons: ['fa fa-download'],\n key: 'download',\n onClick: handleDownload,\n text: downloadText,\n },\n {\n icons: ['fa fa-trash'],\n key: 'remove',\n onClick: () => onRemove(id),\n text: removeText,\n },\n ];\n\n return <ContextMenu items={items} />;\n }\n\n const handleClick = () => {\n if (canRemove) {\n onRemove(id);\n return;\n }\n\n handleDownload();\n };\n\n const handleKeyDown = canRemove ? handleRemoveKeyDown : undefined;\n\n const fileIcon = canRemove ? 'ts-wrong' : 'fa fa-download';\n\n return (\n <StyledFileItemIcon\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n role=\"button\"\n tabIndex={0}\n >\n <Icon icons={[fileIcon]} />\n </StyledFileItemIcon>\n );\n }, [\n canDownload,\n canRemove,\n downloadText,\n handleDownload,\n handleRemoveKeyDown,\n id,\n onRemove,\n removeText,\n ]);\n\n return useMemo(\n () => (\n <StyledFileItem>\n <StyledFileItemKeyboardWrapper onKeyDown={handleItemKeyDown} tabIndex={-1}>\n <ListItem\n title={name}\n subtitle={humanFileSize}\n icons={[icon]}\n rightElements={rightElement}\n shouldEnableKeyboardHighlighting={shouldShowKeyboardHighlighting}\n />\n </StyledFileItemKeyboardWrapper>\n </StyledFileItem>\n ),\n [\n handleItemKeyDown,\n humanFileSize,\n icon,\n name,\n rightElement,\n shouldShowKeyboardHighlighting,\n ],\n );\n};\n\nFileItem.displayName = 'FileList';\n\nexport default FileItem;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"FileItem.js","names":["_react","_interopRequireWildcard","require","_file","_Icon","_interopRequireDefault","_ContextMenu","_ListItem","_FileItem","_textstring","_textStrings","_useFocusRingPortal","_useKeyboardFocusHighlighting","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FileItem","mimeType","onRemove","size","name","id","source","shouldAllowDownload","canDownload","canRemove","actionIconRef","useRef","shouldShowKeyboardHighlighting","useKeyboardFocusHighlighting","useFocusRingPortal","isEnabled","shape","handleRemove","useCallback","handleItemKeyDown","event","key","preventDefault","handleRemoveKeyDown","stopPropagation","humanFileSize","useMemo","getHumanSize","undefined","icon","getIconByMimeType","handleDownload","File","url","URL","createObjectURL","a","document","createElement","href","download","body","appendChild","click","removeChild","revokeObjectURL","fetch","then","res","ok","Error","blob","catch","rel","target","downloadText","useTextstringValue","textstring","ttsToITextString","textStrings","components","fileItem","removeText","remove","rightElement","items","icons","onClick","text","handleClick","handleKeyDown","fileIcon","StyledFileItemIcon","ref","onKeyDown","role","tabIndex","StyledFileItem","StyledFileItemKeyboardWrapper","title","subtitle","rightElements","shouldEnableKeyboardHighlighting","displayName","_default","exports"],"sources":["../../../../../src/components/file-list/file-item/FileItem.tsx"],"sourcesContent":["import React, { FC, KeyboardEventHandler, useCallback, useMemo, useRef } from 'react';\nimport { getHumanSize, getIconByMimeType } from '../../../utils/file';\nimport Icon from '../../icon/Icon';\nimport ContextMenu from '../../context-menu/ContextMenu';\nimport type { ContextMenuItem } from '../../context-menu/ContextMenu.types';\nimport ListItem from '../../list/list-item/ListItem';\nimport type { IFileItem } from '../FileList';\nimport {\n StyledFileItem,\n StyledFileItemActions,\n StyledFileItemKeyboardWrapper,\n StyledFileItemRemoveButton,\n StyledFileItemIcon,\n} from './FileItem.styles';\nimport { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';\nimport textStrings from '../../../constants/textStrings';\nimport { useFocusRingPortal } from '../../../hooks/useFocusRingPortal';\nimport { useKeyboardFocusHighlighting } from '../../../hooks/useKeyboardFocusHighlighting';\n\nexport type FileItemProps = IFileItem & {\n onRemove?: (name: string) => void;\n shouldAllowDownload?: boolean;\n};\n\nconst FileItem: FC<FileItemProps> = ({\n mimeType,\n onRemove,\n size,\n name,\n id,\n source,\n shouldAllowDownload,\n}) => {\n const canDownload = shouldAllowDownload && !!source;\n const canRemove = typeof onRemove === 'function';\n const actionIconRef = useRef<HTMLDivElement>(null);\n\n const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(canRemove \|\| !!canDownload);\n useFocusRingPortal(actionIconRef, {\n isEnabled: shouldShowKeyboardHighlighting,\n shape: 'circle',\n });\n\n const handleRemove = useCallback(() => {\n if (canRemove) {\n onRemove(id);\n }\n }, [id, onRemove]);\n\n const handleItemKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n if (event.key === 'Delete') {\n event.preventDefault();\n handleRemove();\n }\n },\n [handleRemove],\n );\n\n const handleRemoveKeyDown = useCallback<KeyboardEventHandler<HTMLSpanElement>>(\n (event) => {\n if (canRemove && (event.key === 'Enter' \|\| event.key === ' ')) {\n event.preventDefault();\n event.stopPropagation();\n handleRemove();\n }\n },\n [handleRemove],\n );\n\n const humanFileSize = useMemo(() => {\n if (typeof size === 'number') {\n return getHumanSize(size);\n }\n\n return undefined;\n }, [size]);\n\n const icon = useMemo(() => getIconByMimeType(mimeType), [mimeType]);\n\n const handleDownload = useCallback(() => {\n if (!source) return;\n\n if (source instanceof File) {\n const url = URL.createObjectURL(source);\n const a = document.createElement('a');\n a.href = url;\n a.download = name;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n URL.revokeObjectURL(url);\n } else {\n // Try fetching as blob to force download. If CORS blocks it,\n // fall back to opening the URL directly.\n fetch(source)\n .then((res) => {\n if (!res.ok) throw new Error('fetch failed');\n return res.blob();\n })\n .then((blob) => {\n const url = URL.createObjectURL(blob);\n const a = document.createElement('a');\n a.href = url;\n a.download = name;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n URL.revokeObjectURL(url);\n })\n .catch(() => {\n // CORS or network error: fall back to direct link\n const a = document.createElement('a');\n a.href = source;\n a.download = name;\n a.rel = 'noopener noreferrer';\n a.target = '_blank';\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n });\n }\n }, [name, source]);\n\n const downloadText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.fileItem.download),\n });\n const removeText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.fileItem.remove),\n });\n\n const rightElement = useMemo(() => {\n if (!canDownload && !canRemove) return undefined;\n // Both actions available → show as ContextMenu\n if (canDownload && canRemove) {\n const items: ContextMenuItem[] = [\n {\n icons: ['fa fa-download'],\n key: 'download',\n onClick: handleDownload,\n text: downloadText,\n },\n {\n icons: ['fa fa-trash'],\n key: 'remove',\n onClick: () => onRemove(id),\n text: removeText,\n },\n ];\n\n return <ContextMenu items={items} />;\n }\n\n const handleClick = () => {\n if (canRemove) {\n onRemove(id);\n return;\n }\n\n handleDownload();\n };\n\n const handleKeyDown = canRemove ? handleRemoveKeyDown : undefined;\n\n const fileIcon = canRemove ? 'ts-wrong' : 'fa fa-download';\n\n return (\n <StyledFileItemIcon\n ref={actionIconRef}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n role=\"button\"\n tabIndex={0}\n >\n <Icon icons={[fileIcon]} />\n </StyledFileItemIcon>\n );\n }, [\n canDownload,\n canRemove,\n downloadText,\n handleDownload,\n handleRemoveKeyDown,\n id,\n onRemove,\n removeText,\n ]);\n\n return useMemo(\n () => (\n <StyledFileItem>\n <StyledFileItemKeyboardWrapper onKeyDown={handleItemKeyDown} tabIndex={-1}>\n <ListItem\n title={name}\n subtitle={humanFileSize}\n icons={[icon]}\n rightElements={rightElement}\n shouldEnableKeyboardHighlighting={shouldShowKeyboardHighlighting}\n />\n </StyledFileItemKeyboardWrapper>\n </StyledFileItem>\n ),\n [\n handleItemKeyDown,\n humanFileSize,\n icon,\n name,\n rightElement,\n shouldShowKeyboardHighlighting,\n ],\n );\n};\n\nFileItem.displayName = 'FileList';\n\nexport default FileItem;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/file-list/file-item/FileItem.styles.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.StyledFileItemRemoveButton = exports.StyledFileItemKeyboardWrapper = exports.StyledFileItemIcon = exports.StyledFileItemActions = exports.StyledFileItem = void 0;
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _keyboardFocusHighlighting = require("../../../utils/keyboardFocusHighlighting.styles");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const StyledFileItem = exports.StyledFileItem = _styledComponents.default.div``;
 const StyledFileItemIcon = exports.StyledFileItemIcon = _styledComponents.default.div`
@@ -20,14 +19,9 @@ const StyledFileItemIcon = exports.StyledFileItemIcon = _styledComponents.defaul
     &:focus-visible {
         outline: none;
         color: inherit;
-        ${_keyboardFocusHighlighting.keyboardFocusHighlightingCircleRingCss};
-    }
-`;
-const StyledFileItemKeyboardWrapper = exports.StyledFileItemKeyboardWrapper = _styledComponents.default.div`
-    &:focus-visible {
-        ${_keyboardFocusHighlighting.keyboardFocusHighlightingRingCss}
     }
 `;
+const StyledFileItemKeyboardWrapper = exports.StyledFileItemKeyboardWrapper = _styledComponents.default.div``;
 const StyledFileItemActions = exports.StyledFileItemActions = _styledComponents.default.span`
     display: flex;
     gap: 8px;
@@ -35,9 +29,5 @@ const StyledFileItemActions = exports.StyledFileItemActions = _styledComponents.
 `;
 const StyledFileItemRemoveButton = exports.StyledFileItemRemoveButton = _styledComponents.default.span`
     display: inline-flex;
-    &:focus-visible {
-        ${_keyboardFocusHighlighting.keyboardFocusHighlightingRingCss}
-    }
 `;
 //# sourceMappingURL=FileItem.styles.js.map

package/lib/cjs/components/file-list/file-item/FileItem.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileItem.styles.js","names":["_styledComponents","_interopRequireDefault","require","~~_keyboardFocusHighlighting","~~e","__esModule","default","StyledFileItem","exports","styled","div","StyledFileItemIcon","~~keyboardFocusHighlightingCircleRingCss","~~StyledFileItemKeyboardWrapper","~~keyboardFocusHighlightingRingCss","~~StyledFileItemActions","span","StyledFileItemRemoveButton"],"sources":["../../../../../src/components/file-list/file-item/FileItem.styles.ts"],"sourcesContent":["import styled from 'styled-components';\~~nimport {\~~n ~~keyboardFocusHighlightingCircleRingCss,\n keyboardFocusHighlightingRingCss,\n} from '../../../utils/keyboardFocusHighlighting.styles';\n~~\nexport const StyledFileItem = styled.div``;\nexport const StyledFileItemIcon = styled.div`\n align-items: center;\n cursor: pointer;\n display: flex;\n background-color: transparent;\n border-radius: 3px;\n padding: 6px;\n transition: background-color 0.3s ease;\n\n &:focus-visible {\n outline: none;\n color: inherit;\n ~~${keyboardFocusHighlightingCircleRingCss};\n~~ }\n`;\n\nexport const StyledFileItemKeyboardWrapper = styled.div`\n ~~&:focus-visible {~~\~~n ${keyboardFocusHighlightingRingCss}\n }\n`;\n\~~nexport const StyledFileItemActions = styled.span`\n display: flex;\n gap: 8px;\n align-items: center;\n`;\n\nexport const StyledFileItemRemoveButton = styled.span`\n display: inline-flex;\n~~\n &:focus-visible {\n ${keyboardFocusHighlightingRingCss}\n }\n~~`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;~~AACA~~,~~IAAAC,0BAAA,GAAAD,OAAA;AAGyD,~~SAAAD,~~uBAAAG~~,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;~~AAElD~~,MAAMG,cAAc,GAAAC,OAAA,CAAAD,cAAA,GAAGE,yBAAM,CAACC,GAAG,EAAE;AACnC,MAAMC,kBAAkB,GAAAH,OAAA,CAAAG,kBAAA,GAAGF,yBAAM,CAACC,GAAG;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA~~,UAAUE,iEAAsC~~;~~AAChD;~~AACA,CAAC;AAEM,~~MAAMC~~,6BAA6B,~~GAAAL~~,OAAA,~~CAAAK~~,6BAAA,~~GAAGJ~~,yBAAM,CAACC,GAAG~~;AACvD;AACA~~,~~UAAUI,2DAAgC~~;~~AAC1C;AACA~~,~~CAAC;AAEM~~,~~MAAMC,~~qBAAqB,~~GAAAP~~,OAAA,~~CAAAO~~,qBAAA,~~GAAGN~~,yBAAM,~~CAACO~~,IAAI;AAChD;AACA;AACA;AACA,CAAC;AAEM,MAAMC,0BAA0B,~~GAAAT~~,OAAA,~~CAAAS~~,0BAAA,~~GAAGR~~,yBAAM,~~CAACO~~,IAAI;AACrD;AACA~~;AACA;AACA~~,~~UAAUF,2DAAgC;AAC1C;AACA,~~CAAC","ignoreList":[]}
1	+ {"version":3,"file":"FileItem.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledFileItem","exports","styled","div","StyledFileItemIcon","StyledFileItemKeyboardWrapper","StyledFileItemActions","span","StyledFileItemRemoveButton"],"sources":["../../../../../src/components/file-list/file-item/FileItem.styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledFileItem = styled.div``;\nexport const StyledFileItemIcon = styled.div`\n align-items: center;\n cursor: pointer;\n display: flex;\n background-color: transparent;\n border-radius: 3px;\n padding: 6px;\n transition: background-color 0.3s ease;\n\n &:focus-visible {\n outline: none;\n color: inherit;\n }\n`;\n\nexport const StyledFileItemKeyboardWrapper = styled.div``;\n\nexport const StyledFileItemActions = styled.span`\n display: flex;\n gap: 8px;\n align-items: center;\n`;\n\nexport const StyledFileItemRemoveButton = styled.span`\n display: inline-flex;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEhC,MAAMG,cAAc,GAAAC,OAAA,CAAAD,cAAA,GAAGE,yBAAM,CAACC,GAAG,EAAE;AACnC,MAAMC,kBAAkB,GAAAH,OAAA,CAAAG,kBAAA,GAAGF,yBAAM,CAACC,GAAG;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAME,6BAA6B,GAAAJ,OAAA,CAAAI,6BAAA,GAAGH,yBAAM,CAACC,GAAG,EAAE;AAElD,MAAMG,qBAAqB,GAAAL,OAAA,CAAAK,qBAAA,GAAGJ,yBAAM,CAACK,IAAI;AAChD;AACA;AACA;AACA,CAAC;AAEM,MAAMC,0BAA0B,GAAAP,OAAA,CAAAO,0BAAA,GAAGN,yBAAM,CAACK,IAAI;AACrD;AACA,CAAC","ignoreList":[]}

package/lib/cjs/components/file-select/FileSelect.js CHANGED Viewed

@@ -8,6 +8,7 @@ var _chaynsApi = require("chayns-api");
 var _react = _interopRequireWildcard(require("react"));
 var _file = require("../../utils/file");
 var _fileDialog = require("../../utils/fileDialog");
+var _useFocusRingPortal = require("../../hooks/useFocusRingPortal");
 var _useKeyboardFocusHighlighting = require("../../hooks/useKeyboardFocusHighlighting");
 var _Icon = _interopRequireDefault(require("../icon/Icon"));
 var _FileSelect = require("./FileSelect.styles");
@@ -30,7 +31,15 @@ const FileSelect = ({
   shouldPreventImageUpload = false,
   shouldEnableKeyboardHighlighting
 }) => {
+  const fileSelectionRef = (0, _react.useRef)(null);
+  const imageSelectionRef = (0, _react.useRef)(null);
   const shouldShowKeyboardHighlighting = (0, _useKeyboardFocusHighlighting.useKeyboardFocusHighlighting)(shouldEnableKeyboardHighlighting && !isDisabled);
+  (0, _useFocusRingPortal.useFocusRingPortal)(fileSelectionRef, {
+    isEnabled: shouldShowKeyboardHighlighting
+  });
+  (0, _useFocusRingPortal.useFocusRingPortal)(imageSelectionRef, {
+    isEnabled: shouldShowKeyboardHighlighting && Boolean(imageSelectPlaceholder)
+  });
   const handleAddImages = (0, _react.useCallback)(images => {
     if (typeof onAdd === 'function') {
       onAdd(images);
@@ -132,7 +141,7 @@ const FileSelect = ({
   return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_FileSelect.StyledFileSelect, null, /*#__PURE__*/_react.default.createElement(_FileSelect.StyledFileSelectWrapper, {
     $isDisabled: isDisabled
   }, /*#__PURE__*/_react.default.createElement(_FileSelect.StyledFileSelectContainer, {
-    $shouldShowKeyboardHighlighting: shouldShowKeyboardHighlighting,
+    ref: fileSelectionRef,
     onClick: () => void handleFileSelectionClick(),
     onKeyDown: handleFileSelectionKeyDown,
     onDragOver: e => e.preventDefault(),
@@ -142,15 +151,15 @@ const FileSelect = ({
   }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
     icons: fileSelectionIcons
   }), /*#__PURE__*/_react.default.createElement(_FileSelect.StyledFileSelectText, null, fileSelectionPlaceholder)), imageSelectPlaceholder && /*#__PURE__*/_react.default.createElement(_FileSelect.StyledFileSelectContainer, {
+    ref: imageSelectionRef,
     $isImageSelection: true,
-    $shouldShowKeyboardHighlighting: shouldShowKeyboardHighlighting,
     onClick: () => void handleImageSelectionClick(),
     onKeyDown: handleImageSelectionKeyDown,
     role: "button",
     tabIndex: isDisabled ? -1 : 0
   }, /*#__PURE__*/_react.default.createElement(_Icon.default, {
     icons: imageSelectIcons
-  }), /*#__PURE__*/_react.default.createElement(_FileSelect.StyledFileSelectText, null, imageSelectPlaceholder)))), [isDisabled, fileSelectionIcons, fileSelectionPlaceholder, imageSelectPlaceholder, imageSelectIcons, shouldShowKeyboardHighlighting, handleFileSelectionClick, handleDrop, handleFileSelectionKeyDown, handleImageSelectionClick, handleImageSelectionKeyDown]);
+  }), /*#__PURE__*/_react.default.createElement(_FileSelect.StyledFileSelectText, null, imageSelectPlaceholder)))), [isDisabled, fileSelectionIcons, fileSelectionPlaceholder, imageSelectPlaceholder, imageSelectIcons, handleFileSelectionClick, handleDrop, handleFileSelectionKeyDown, handleImageSelectionClick, handleImageSelectionKeyDown]);
 };
 FileSelect.displayName = 'FileSelect';
 var _default = exports.default = FileSelect;

package/lib/cjs/components/file-select/FileSelect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileSelect.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_file","_fileDialog","_useKeyboardFocusHighlighting","_Icon","_interopRequireDefault","_FileSelect","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DialogView","FileSelect","fileSelectionIcons","imageSelectIcons","fileTypes","isDisabled","maxFileSizeInMB","onAdd","fileSelectionPlaceholder","imageSelectPlaceholder","shouldPreventImageUpload","shouldEnableKeyboardHighlighting","shouldShowKeyboardHighlighting","useKeyboardFocusHighlighting","handleAddImages","useCallback","images","handleAddFiles","newFiles","handleOpenEditor","file","buttonType","result","createDialog","dialogInput","upload","initialView","EDITOR","imageArrayBuffer","type","DialogType","MODULE","system","url","scope","module","buttons","open","size","name","handleImageSelectionClick","PIXABAY","handleFileSelectionClick","selectFiles","multiple","length","startsWith","handleDrop","preventDefault","draggedFiles","Array","from","dataTransfer","files","filter","isValidFileType","types","handleFileSelectionKeyDown","event","key","handleImageSelectionKeyDown","useMemo","createElement","StyledFileSelect","StyledFileSelectWrapper","$isDisabled","StyledFileSelectContainer","$shouldShowKeyboardHighlighting","onClick","onKeyDown","onDragOver","onDrop","role","tabIndex","icons","StyledFileSelectText","$isImageSelection","displayName","_default","exports"],"sources":["../../../../src/components/file-select/FileSelect.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport React, { DragEvent, FC, KeyboardEventHandler, useCallback, useMemo } from 'react';\nimport type { ImageDialogResult } from '../../types/fileInput';\nimport { isValidFileType } from '../../utils/file';\nimport { selectFiles } from '../../utils/fileDialog';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\nimport Icon from '../icon/Icon';\nimport {\n StyledFileSelect,\n StyledFileSelectContainer,\n StyledFileSelectText,\n StyledFileSelectWrapper,\n} from './FileSelect.styles';\n\nenum DialogView {\n PIXABAY = 'pixabay',\n EDITOR = 'editor',\n}\n\ntype DialogInput = {\n upload: boolean;\n initialView: DialogView;\n imageArrayBuffer?: File;\n};\n\nexport interface UploadedFile {\n url: string;\n size?: number;\n name?: string;\n}\n\nexport type FileSelectProps = {\n /*\n An array of icons that should be displayed inside the FileInput\n /\n fileSelectionIcons?: string[];\n /\n The text that should be displayed inside the FileInput.\n /\n fileSelectionPlaceholder?: string;\n /\n The filetypes that could be selected. Example for multiple types: 'image/, video/'.\n /\n fileTypes?: string;\n /\n The icon of the image selection.\n /\n imageSelectIcons?: string[];\n /\n If set, pictures can be select via Pixabay.\n /\n imageSelectPlaceholder?: string;\n /\n Whether the FileInput is disabled.\n /\n isDisabled?: boolean;\n /\n The maximum amount of Files that can be uploaded.\n /\n maxFiles?: number;\n /\n The maximum size of a file in MB.\n /\n maxFileSizeInMB?: number;\n /\n A function to be executed when files are added.\n /\n onAdd?: (files: File[] \| UploadedFile[]) => void;\n /\n Whether the image upload should be prevented.\n /\n shouldPreventImageUpload?: boolean;\n /\n Enables keyboard-only focus highlighting for selection triggers.\n /\n shouldEnableKeyboardHighlighting?: boolean;\n};\n\nconst FileSelect: FC<FileSelectProps> = ({\n fileSelectionIcons = ['fa fa-upload'],\n imageSelectIcons = ['ts-image'],\n fileTypes,\n isDisabled,\n maxFileSizeInMB,\n onAdd,\n fileSelectionPlaceholder = 'Dateien hochladen',\n imageSelectPlaceholder,\n shouldPreventImageUpload = false,\n shouldEnableKeyboardHighlighting,\n}) => {\n const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n shouldEnableKeyboardHighlighting && !isDisabled,\n );\n\n const handleAddImages = useCallback(\n (images: UploadedFile[]) => {\n if (typeof onAdd === 'function') {\n onAdd(images);\n }\n },\n [onAdd],\n );\n\n const handleAddFiles = useCallback(\n (newFiles: File[]) => {\n if (typeof onAdd === 'function') {\n onAdd(newFiles);\n }\n },\n [onAdd],\n );\n\n const handleOpenEditor = useCallback(\n async (file: File) => {\n const { buttonType, result } = (await createDialog<DialogInput>({\n dialogInput: {\n upload: true,\n initialView: DialogView.EDITOR,\n imageArrayBuffer: file,\n },\n type: DialogType.MODULE,\n system: {\n url: 'https://tapp.chayns-static.space/api/dialog-image-editor/v1/remoteEntry.js',\n scope: 'dialog_image_editor',\n module: './ImageEditorEntry',\n },\n buttons: [],\n }).open()) as ImageDialogResult;\n\n if (buttonType === 1 && result?.url)\n handleAddImages([\n {\n url: result.url,\n size: file.size,\n name: file.name,\n },\n ]);\n },\n [handleAddImages],\n );\n\n const handleImageSelectionClick = useCallback(async () => {\n if (isDisabled) return;\n\n const { buttonType, result } = (await createDialog<DialogInput>({\n dialogInput: { upload: true, initialView: DialogView.PIXABAY },\n type: DialogType.MODULE,\n system: {\n url: 'https://tapp.chayns-static.space/api/dialog-image-editor/v1/remoteEntry.js',\n scope: 'dialog_image_editor',\n module: './ImageEditorEntry',\n },\n buttons: [],\n }).open()) as ImageDialogResult;\n\n if (buttonType === 1 && result?.url) handleAddImages([{ url: result.url }]);\n }, [handleAddImages, isDisabled]);\n\n const handleFileSelectionClick = useCallback(async () => {\n if (isDisabled) return;\n\n const newFiles = await selectFiles({ multiple: true, type: fileTypes, maxFileSizeInMB });\n\n if (\n newFiles.length === 1 &&\n newFiles[0] &&\n newFiles[0].type.startsWith('image') &&\n !shouldPreventImageUpload\n ) {\n void handleOpenEditor(newFiles[0]);\n\n return;\n }\n\n handleAddFiles(newFiles);\n }, [\n fileTypes,\n handleAddFiles,\n handleOpenEditor,\n isDisabled,\n maxFileSizeInMB,\n shouldPreventImageUpload,\n ]);\n\n const handleDrop = useCallback(\n (e: DragEvent<HTMLDivElement>) => {\n e.preventDefault();\n\n const draggedFiles = Array.from(e.dataTransfer.files).filter((file) => {\n if (fileTypes && !isValidFileType({ file, types: fileTypes })) {\n return false;\n }\n\n return !(maxFileSizeInMB && file.size > maxFileSizeInMB 1024 * 1024);\n });\n\n if (\n draggedFiles.length === 1 &&\n draggedFiles[0] &&\n draggedFiles[0].type.startsWith('image') &&\n !shouldPreventImageUpload\n ) {\n void handleOpenEditor(draggedFiles[0]);\n\n return;\n }\n\n handleAddFiles(draggedFiles);\n },\n [shouldPreventImageUpload, handleAddFiles, fileTypes, maxFileSizeInMB, handleOpenEditor],\n );\n\n const handleFileSelectionKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n void handleFileSelectionClick();\n }\n },\n [handleFileSelectionClick],\n );\n\n const handleImageSelectionKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n void handleImageSelectionClick();\n }\n },\n [handleImageSelectionClick],\n );\n\n return useMemo(\n () => (\n <StyledFileSelect>\n <StyledFileSelectWrapper $isDisabled={isDisabled}>\n <StyledFileSelectContainer\n $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n onClick={() => void handleFileSelectionClick()}\n onKeyDown={handleFileSelectionKeyDown}\n onDragOver={(e) => e.preventDefault()}\n onDrop={handleDrop}\n role=\"button\"\n tabIndex={isDisabled ? -1 : 0}\n >\n <Icon icons={fileSelectionIcons} />\n <StyledFileSelectText>{fileSelectionPlaceholder}</StyledFileSelectText>\n </StyledFileSelectContainer>\n {imageSelectPlaceholder && (\n <StyledFileSelectContainer\n $isImageSelection\n $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n onClick={() => void handleImageSelectionClick()}\n onKeyDown={handleImageSelectionKeyDown}\n role=\"button\"\n tabIndex={isDisabled ? -1 : 0}\n >\n <Icon icons={imageSelectIcons} />\n <StyledFileSelectText>{imageSelectPlaceholder}</StyledFileSelectText>\n </StyledFileSelectContainer>\n )}\n </StyledFileSelectWrapper>\n </StyledFileSelect>\n ),\n [\n isDisabled,\n fileSelectionIcons,\n fileSelectionPlaceholder,\n imageSelectPlaceholder,\n imageSelectIcons,\n shouldShowKeyboardHighlighting,\n handleFileSelectionClick,\n handleDrop,\n handleFileSelectionKeyDown,\n handleImageSelectionClick,\n handleImageSelectionKeyDown,\n ],\n );\n};\n\nFileSelect.displayName = 'FileSelect';\n\nexport default FileSelect;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"FileSelect.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_file","_fileDialog","_useFocusRingPortal","_useKeyboardFocusHighlighting","_Icon","_interopRequireDefault","_FileSelect","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DialogView","FileSelect","fileSelectionIcons","imageSelectIcons","fileTypes","isDisabled","maxFileSizeInMB","onAdd","fileSelectionPlaceholder","imageSelectPlaceholder","shouldPreventImageUpload","shouldEnableKeyboardHighlighting","fileSelectionRef","useRef","imageSelectionRef","shouldShowKeyboardHighlighting","useKeyboardFocusHighlighting","useFocusRingPortal","isEnabled","Boolean","handleAddImages","useCallback","images","handleAddFiles","newFiles","handleOpenEditor","file","buttonType","result","createDialog","dialogInput","upload","initialView","EDITOR","imageArrayBuffer","type","DialogType","MODULE","system","url","scope","module","buttons","open","size","name","handleImageSelectionClick","PIXABAY","handleFileSelectionClick","selectFiles","multiple","length","startsWith","handleDrop","preventDefault","draggedFiles","Array","from","dataTransfer","files","filter","isValidFileType","types","handleFileSelectionKeyDown","event","key","handleImageSelectionKeyDown","useMemo","createElement","StyledFileSelect","StyledFileSelectWrapper","$isDisabled","StyledFileSelectContainer","ref","onClick","onKeyDown","onDragOver","onDrop","role","tabIndex","icons","StyledFileSelectText","$isImageSelection","displayName","_default","exports"],"sources":["../../../../src/components/file-select/FileSelect.tsx"],"sourcesContent":["import { createDialog, DialogType } from 'chayns-api';\nimport React, { DragEvent, FC, KeyboardEventHandler, useCallback, useMemo, useRef } from 'react';\nimport type { ImageDialogResult } from '../../types/fileInput';\nimport { isValidFileType } from '../../utils/file';\nimport { selectFiles } from '../../utils/fileDialog';\nimport { useFocusRingPortal } from '../../hooks/useFocusRingPortal';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\nimport Icon from '../icon/Icon';\nimport {\n StyledFileSelect,\n StyledFileSelectContainer,\n StyledFileSelectText,\n StyledFileSelectWrapper,\n} from './FileSelect.styles';\n\nenum DialogView {\n PIXABAY = 'pixabay',\n EDITOR = 'editor',\n}\n\ntype DialogInput = {\n upload: boolean;\n initialView: DialogView;\n imageArrayBuffer?: File;\n};\n\nexport interface UploadedFile {\n url: string;\n size?: number;\n name?: string;\n}\n\nexport type FileSelectProps = {\n /*\n An array of icons that should be displayed inside the FileInput\n /\n fileSelectionIcons?: string[];\n /\n The text that should be displayed inside the FileInput.\n /\n fileSelectionPlaceholder?: string;\n /\n The filetypes that could be selected. Example for multiple types: 'image/, video/'.\n /\n fileTypes?: string;\n /\n The icon of the image selection.\n /\n imageSelectIcons?: string[];\n /\n If set, pictures can be select via Pixabay.\n /\n imageSelectPlaceholder?: string;\n /\n Whether the FileInput is disabled.\n /\n isDisabled?: boolean;\n /\n The maximum amount of Files that can be uploaded.\n /\n maxFiles?: number;\n /\n The maximum size of a file in MB.\n /\n maxFileSizeInMB?: number;\n /\n A function to be executed when files are added.\n /\n onAdd?: (files: File[] \| UploadedFile[]) => void;\n /\n Whether the image upload should be prevented.\n /\n shouldPreventImageUpload?: boolean;\n /\n Enables keyboard-only focus highlighting for selection triggers.\n /\n shouldEnableKeyboardHighlighting?: boolean;\n};\n\nconst FileSelect: FC<FileSelectProps> = ({\n fileSelectionIcons = ['fa fa-upload'],\n imageSelectIcons = ['ts-image'],\n fileTypes,\n isDisabled,\n maxFileSizeInMB,\n onAdd,\n fileSelectionPlaceholder = 'Dateien hochladen',\n imageSelectPlaceholder,\n shouldPreventImageUpload = false,\n shouldEnableKeyboardHighlighting,\n}) => {\n const fileSelectionRef = useRef<HTMLDivElement>(null);\n const imageSelectionRef = useRef<HTMLDivElement>(null);\n\n const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n shouldEnableKeyboardHighlighting && !isDisabled,\n );\n useFocusRingPortal(fileSelectionRef, { isEnabled: shouldShowKeyboardHighlighting });\n useFocusRingPortal(imageSelectionRef, {\n isEnabled: shouldShowKeyboardHighlighting && Boolean(imageSelectPlaceholder),\n });\n\n const handleAddImages = useCallback(\n (images: UploadedFile[]) => {\n if (typeof onAdd === 'function') {\n onAdd(images);\n }\n },\n [onAdd],\n );\n\n const handleAddFiles = useCallback(\n (newFiles: File[]) => {\n if (typeof onAdd === 'function') {\n onAdd(newFiles);\n }\n },\n [onAdd],\n );\n\n const handleOpenEditor = useCallback(\n async (file: File) => {\n const { buttonType, result } = (await createDialog<DialogInput>({\n dialogInput: {\n upload: true,\n initialView: DialogView.EDITOR,\n imageArrayBuffer: file,\n },\n type: DialogType.MODULE,\n system: {\n url: 'https://tapp.chayns-static.space/api/dialog-image-editor/v1/remoteEntry.js',\n scope: 'dialog_image_editor',\n module: './ImageEditorEntry',\n },\n buttons: [],\n }).open()) as ImageDialogResult;\n\n if (buttonType === 1 && result?.url)\n handleAddImages([\n {\n url: result.url,\n size: file.size,\n name: file.name,\n },\n ]);\n },\n [handleAddImages],\n );\n\n const handleImageSelectionClick = useCallback(async () => {\n if (isDisabled) return;\n\n const { buttonType, result } = (await createDialog<DialogInput>({\n dialogInput: { upload: true, initialView: DialogView.PIXABAY },\n type: DialogType.MODULE,\n system: {\n url: 'https://tapp.chayns-static.space/api/dialog-image-editor/v1/remoteEntry.js',\n scope: 'dialog_image_editor',\n module: './ImageEditorEntry',\n },\n buttons: [],\n }).open()) as ImageDialogResult;\n\n if (buttonType === 1 && result?.url) handleAddImages([{ url: result.url }]);\n }, [handleAddImages, isDisabled]);\n\n const handleFileSelectionClick = useCallback(async () => {\n if (isDisabled) return;\n\n const newFiles = await selectFiles({ multiple: true, type: fileTypes, maxFileSizeInMB });\n\n if (\n newFiles.length === 1 &&\n newFiles[0] &&\n newFiles[0].type.startsWith('image') &&\n !shouldPreventImageUpload\n ) {\n void handleOpenEditor(newFiles[0]);\n\n return;\n }\n\n handleAddFiles(newFiles);\n }, [\n fileTypes,\n handleAddFiles,\n handleOpenEditor,\n isDisabled,\n maxFileSizeInMB,\n shouldPreventImageUpload,\n ]);\n\n const handleDrop = useCallback(\n (e: DragEvent<HTMLDivElement>) => {\n e.preventDefault();\n\n const draggedFiles = Array.from(e.dataTransfer.files).filter((file) => {\n if (fileTypes && !isValidFileType({ file, types: fileTypes })) {\n return false;\n }\n\n return !(maxFileSizeInMB && file.size > maxFileSizeInMB 1024 * 1024);\n });\n\n if (\n draggedFiles.length === 1 &&\n draggedFiles[0] &&\n draggedFiles[0].type.startsWith('image') &&\n !shouldPreventImageUpload\n ) {\n void handleOpenEditor(draggedFiles[0]);\n\n return;\n }\n\n handleAddFiles(draggedFiles);\n },\n [shouldPreventImageUpload, handleAddFiles, fileTypes, maxFileSizeInMB, handleOpenEditor],\n );\n\n const handleFileSelectionKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n void handleFileSelectionClick();\n }\n },\n [handleFileSelectionClick],\n );\n\n const handleImageSelectionKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n void handleImageSelectionClick();\n }\n },\n [handleImageSelectionClick],\n );\n\n return useMemo(\n () => (\n <StyledFileSelect>\n <StyledFileSelectWrapper $isDisabled={isDisabled}>\n <StyledFileSelectContainer\n ref={fileSelectionRef}\n onClick={() => void handleFileSelectionClick()}\n onKeyDown={handleFileSelectionKeyDown}\n onDragOver={(e) => e.preventDefault()}\n onDrop={handleDrop}\n role=\"button\"\n tabIndex={isDisabled ? -1 : 0}\n >\n <Icon icons={fileSelectionIcons} />\n <StyledFileSelectText>{fileSelectionPlaceholder}</StyledFileSelectText>\n </StyledFileSelectContainer>\n {imageSelectPlaceholder && (\n <StyledFileSelectContainer\n ref={imageSelectionRef}\n $isImageSelection\n onClick={() => void handleImageSelectionClick()}\n onKeyDown={handleImageSelectionKeyDown}\n role=\"button\"\n tabIndex={isDisabled ? -1 : 0}\n >\n <Icon icons={imageSelectIcons} />\n <StyledFileSelectText>{imageSelectPlaceholder}</StyledFileSelectText>\n </StyledFileSelectContainer>\n )}\n </StyledFileSelectWrapper>\n </StyledFileSelect>\n ),\n [\n isDisabled,\n fileSelectionIcons,\n fileSelectionPlaceholder,\n imageSelectPlaceholder,\n imageSelectIcons,\n handleFileSelectionClick,\n handleDrop,\n handleFileSelectionKeyDown,\n handleImageSelectionClick,\n handleImageSelectionKeyDown,\n ],\n );\n};\n\nFileSelect.displayName = 'FileSelect';\n\nexport default FileSelect;\n"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AAEA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,WAAA,GAAAJ,OAAA;AACA,IAAAK,mBAAA,GAAAL,OAAA;AACA,IAAAM,6BAAA,GAAAN,OAAA;AACA,IAAAO,KAAA,GAAAC,sBAAA,CAAAR,OAAA;AACA,IAAAS,WAAA,GAAAT,OAAA;AAK6B,SAAAQ,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAR,wBAAAQ,CAAA,EAAAG,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAZ,uBAAA,YAAAA,CAAAQ,CAAA,EAAAG,CAAA,SAAAA,CAAA,IAAAH,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,MAAAO,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAR,OAAA,EAAAF,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAS,CAAA,MAAAF,CAAA,GAAAJ,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAE,CAAA,CAAAI,GAAA,CAAAX,CAAA,UAAAO,CAAA,CAAAK,GAAA,CAAAZ,CAAA,GAAAO,CAAA,CAAAM,GAAA,CAAAb,CAAA,EAAAS,CAAA,gBAAAN,CAAA,IAAAH,CAAA,gBAAAG,CAAA,OAAAW,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAG,CAAA,OAAAK,CAAA,IAAAD,CAAA,GAAAS,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAG,CAAA,OAAAK,CAAA,CAAAI,GAAA,IAAAJ,CAAA,CAAAK,GAAA,IAAAN,CAAA,CAAAE,CAAA,EAAAN,CAAA,EAAAK,CAAA,IAAAC,CAAA,CAAAN,CAAA,IAAAH,CAAA,CAAAG,CAAA,WAAAM,CAAA,KAAAT,CAAA,EAAAG,CAAA;AAAA,IAExBgB,UAAU,0BAAVA,UAAU;EAAVA,UAAU;EAAVA,UAAU;EAAA,OAAVA,UAAU;AAAA,EAAVA,UAAU;AAgEf,MAAMC,UAA+B,GAAGA,CAAC;EACrCC,kBAAkB,GAAG,CAAC,cAAc,CAAC;EACrCC,gBAAgB,GAAG,CAAC,UAAU,CAAC;EAC/BC,SAAS;EACTC,UAAU;EACVC,eAAe;EACfC,KAAK;EACLC,wBAAwB,GAAG,mBAAmB;EAC9CC,sBAAsB;EACtBC,wBAAwB,GAAG,KAAK;EAChCC;AACJ,CAAC,KAAK;EACF,MAAMC,gBAAgB,GAAG,IAAAC,aAAM,EAAiB,IAAI,CAAC;EACrD,MAAMC,iBAAiB,GAAG,IAAAD,aAAM,EAAiB,IAAI,CAAC;EAEtD,MAAME,8BAA8B,GAAG,IAAAC,0DAA4B,EAC/DL,gCAAgC,IAAI,CAACN,UACzC,CAAC;EACD,IAAAY,sCAAkB,EAACL,gBAAgB,EAAE;IAAEM,SAAS,EAAEH;EAA+B,CAAC,CAAC;EACnF,IAAAE,sCAAkB,EAACH,iBAAiB,EAAE;IAClCI,SAAS,EAAEH,8BAA8B,IAAII,OAAO,CAACV,sBAAsB;EAC/E,CAAC,CAAC;EAEF,MAAMW,eAAe,GAAG,IAAAC,kBAAW,EAC9BC,MAAsB,IAAK;IACxB,IAAI,OAAOf,KAAK,KAAK,UAAU,EAAE;MAC7BA,KAAK,CAACe,MAAM,CAAC;IACjB;EACJ,CAAC,EACD,CAACf,KAAK,CACV,CAAC;EAED,MAAMgB,cAAc,GAAG,IAAAF,kBAAW,EAC7BG,QAAgB,IAAK;IAClB,IAAI,OAAOjB,KAAK,KAAK,UAAU,EAAE;MAC7BA,KAAK,CAACiB,QAAQ,CAAC;IACnB;EACJ,CAAC,EACD,CAACjB,KAAK,CACV,CAAC;EAED,MAAMkB,gBAAgB,GAAG,IAAAJ,kBAAW,EAChC,MAAOK,IAAU,IAAK;IAClB,MAAM;MAAEC,UAAU;MAAEC;IAAO,CAAC,GAAI,MAAM,IAAAC,uBAAY,EAAc;MAC5DC,WAAW,EAAE;QACTC,MAAM,EAAE,IAAI;QACZC,WAAW,EAAEhC,UAAU,CAACiC,MAAM;QAC9BC,gBAAgB,EAAER;MACtB,CAAC;MACDS,IAAI,EAAEC,qBAAU,CAACC,MAAM;MACvBC,MAAM,EAAE;QACJC,GAAG,EAAE,4EAA4E;QACjFC,KAAK,EAAE,qBAAqB;QAC5BC,MAAM,EAAE;MACZ,CAAC;MACDC,OAAO,EAAE;IACb,CAAC,CAAC,CAACC,IAAI,CAAC,CAAuB;IAE/B,IAAIhB,UAAU,KAAK,CAAC,IAAIC,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEW,GAAG,EAC/BnB,eAAe,CAAC,CACZ;MACImB,GAAG,EAAEX,MAAM,CAACW,GAAG;MACfK,IAAI,EAAElB,IAAI,CAACkB,IAAI;MACfC,IAAI,EAAEnB,IAAI,CAACmB;IACf,CAAC,CACJ,CAAC;EACV,CAAC,EACD,CAACzB,eAAe,CACpB,CAAC;EAED,MAAM0B,yBAAyB,GAAG,IAAAzB,kBAAW,EAAC,YAAY;IACtD,IAAIhB,UAAU,EAAE;IAEhB,MAAM;MAAEsB,UAAU;MAAEC;IAAO,CAAC,GAAI,MAAM,IAAAC,uBAAY,EAAc;MAC5DC,WAAW,EAAE;QAAEC,MAAM,EAAE,IAAI;QAAEC,WAAW,EAAEhC,UAAU,CAAC+C;MAAQ,CAAC;MAC9DZ,IAAI,EAAEC,qBAAU,CAACC,MAAM;MACvBC,MAAM,EAAE;QACJC,GAAG,EAAE,4EAA4E;QACjFC,KAAK,EAAE,qBAAqB;QAC5BC,MAAM,EAAE;MACZ,CAAC;MACDC,OAAO,EAAE;IACb,CAAC,CAAC,CAACC,IAAI,CAAC,CAAuB;IAE/B,IAAIhB,UAAU,KAAK,CAAC,IAAIC,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEW,GAAG,EAAEnB,eAAe,CAAC,CAAC;MAAEmB,GAAG,EAAEX,MAAM,CAACW;IAAI,CAAC,CAAC,CAAC;EAC/E,CAAC,EAAE,CAACnB,eAAe,EAAEf,UAAU,CAAC,CAAC;EAEjC,MAAM2C,wBAAwB,GAAG,IAAA3B,kBAAW,EAAC,YAAY;IACrD,IAAIhB,UAAU,EAAE;IAEhB,MAAMmB,QAAQ,GAAG,MAAM,IAAAyB,uBAAW,EAAC;MAAEC,QAAQ,EAAE,IAAI;MAAEf,IAAI,EAAE/B,SAAS;MAAEE;IAAgB,CAAC,CAAC;IAExF,IACIkB,QAAQ,CAAC2B,MAAM,KAAK,CAAC,IACrB3B,QAAQ,CAAC,CAAC,CAAC,IACXA,QAAQ,CAAC,CAAC,CAAC,CAACW,IAAI,CAACiB,UAAU,CAAC,OAAO,CAAC,IACpC,CAAC1C,wBAAwB,EAC3B;MACE,KAAKe,gBAAgB,CAACD,QAAQ,CAAC,CAAC,CAAC,CAAC;MAElC;IACJ;IAEAD,cAAc,CAACC,QAAQ,CAAC;EAC5B,CAAC,EAAE,CACCpB,SAAS,EACTmB,cAAc,EACdE,gBAAgB,EAChBpB,UAAU,EACVC,eAAe,EACfI,wBAAwB,CAC3B,CAAC;EAEF,MAAM2C,UAAU,GAAG,IAAAhC,kBAAW,EACzBxC,CAA4B,IAAK;IAC9BA,CAAC,CAACyE,cAAc,CAAC,CAAC;IAElB,MAAMC,YAAY,GAAGC,KAAK,CAACC,IAAI,CAAC5E,CAAC,CAAC6E,YAAY,CAACC,KAAK,CAAC,CAACC,MAAM,CAAElC,IAAI,IAAK;MACnE,IAAItB,SAAS,IAAI,CAAC,IAAAyD,qBAAe,EAAC;QAAEnC,IAAI;QAAEoC,KAAK,EAAE1D;MAAU,CAAC,CAAC,EAAE;QAC3D,OAAO,KAAK;MAChB;MAEA,OAAO,EAAEE,eAAe,IAAIoB,IAAI,CAACkB,IAAI,GAAGtC,eAAe,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1E,CAAC,CAAC;IAEF,IACIiD,YAAY,CAACJ,MAAM,KAAK,CAAC,IACzBI,YAAY,CAAC,CAAC,CAAC,IACfA,YAAY,CAAC,CAAC,CAAC,CAACpB,IAAI,CAACiB,UAAU,CAAC,OAAO,CAAC,IACxC,CAAC1C,wBAAwB,EAC3B;MACE,KAAKe,gBAAgB,CAAC8B,YAAY,CAAC,CAAC,CAAC,CAAC;MAEtC;IACJ;IAEAhC,cAAc,CAACgC,YAAY,CAAC;EAChC,CAAC,EACD,CAAC7C,wBAAwB,EAAEa,cAAc,EAAEnB,SAAS,EAAEE,eAAe,EAAEmB,gBAAgB,CAC3F,CAAC;EAED,MAAMsC,0BAA0B,GAAG,IAAA1C,kBAAW,EACzC2C,KAAK,IAAK;IACP,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,IAAID,KAAK,CAACC,GAAG,KAAK,GAAG,EAAE;MAC5CD,KAAK,CAACV,cAAc,CAAC,CAAC;MACtB,KAAKN,wBAAwB,CAAC,CAAC;IACnC;EACJ,CAAC,EACD,CAACA,wBAAwB,CAC7B,CAAC;EAED,MAAMkB,2BAA2B,GAAG,IAAA7C,kBAAW,EAC1C2C,KAAK,IAAK;IACP,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,IAAID,KAAK,CAACC,GAAG,KAAK,GAAG,EAAE;MAC5CD,KAAK,CAACV,cAAc,CAAC,CAAC;MACtB,KAAKR,yBAAyB,CAAC,CAAC;IACpC;EACJ,CAAC,EACD,CAACA,yBAAyB,CAC9B,CAAC;EAED,OAAO,IAAAqB,cAAO,EACV,mBACI/F,MAAA,CAAAW,OAAA,CAAAqF,aAAA,CAACxF,WAAA,CAAAyF,gBAAgB,qBACbjG,MAAA,CAAAW,OAAA,CAAAqF,aAAA,CAACxF,WAAA,CAAA0F,uBAAuB;IAACC,WAAW,EAAElE;EAAW,gBAC7CjC,MAAA,CAAAW,OAAA,CAAAqF,aAAA,CAACxF,WAAA,CAAA4F,yBAAyB;IACtBC,GAAG,EAAE7D,gBAAiB;IACtB8D,OAAO,EAAEA,CAAA,KAAM,KAAK1B,wBAAwB,CAAC,CAAE;IAC/C2B,SAAS,EAAEZ,0BAA2B;IACtCa,UAAU,EAAG/F,CAAC,IAAKA,CAAC,CAACyE,cAAc,CAAC,CAAE;IACtCuB,MAAM,EAAExB,UAAW;IACnByB,IAAI,EAAC,QAAQ;IACbC,QAAQ,EAAE1E,UAAU,GAAG,CAAC,CAAC,GAAG;EAAE,gBAE9BjC,MAAA,CAAAW,OAAA,CAAAqF,aAAA,CAAC1F,KAAA,CAAAK,OAAI;IAACiG,KAAK,EAAE9E;EAAmB,CAAE,CAAC,eACnC9B,MAAA,CAAAW,OAAA,CAAAqF,aAAA,CAACxF,WAAA,CAAAqG,oBAAoB,QAAEzE,wBAA+C,CAC/C,CAAC,EAC3BC,sBAAsB,iBACnBrC,MAAA,CAAAW,OAAA,CAAAqF,aAAA,CAACxF,WAAA,CAAA4F,yBAAyB;IACtBC,GAAG,EAAE3D,iBAAkB;IACvBoE,iBAAiB;IACjBR,OAAO,EAAEA,CAAA,KAAM,KAAK5B,yBAAyB,CAAC,CAAE;IAChD6B,SAAS,EAAET,2BAA4B;IACvCY,IAAI,EAAC,QAAQ;IACbC,QAAQ,EAAE1E,UAAU,GAAG,CAAC,CAAC,GAAG;EAAE,gBAE9BjC,MAAA,CAAAW,OAAA,CAAAqF,aAAA,CAAC1F,KAAA,CAAAK,OAAI;IAACiG,KAAK,EAAE7E;EAAiB,CAAE,CAAC,eACjC/B,MAAA,CAAAW,OAAA,CAAAqF,aAAA,CAACxF,WAAA,CAAAqG,oBAAoB,QAAExE,sBAA6C,CAC7C,CAEV,CACX,CACrB,EACD,CACIJ,UAAU,EACVH,kBAAkB,EAClBM,wBAAwB,EACxBC,sBAAsB,EACtBN,gBAAgB,EAChB6C,wBAAwB,EACxBK,UAAU,EACVU,0BAA0B,EAC1BjB,yBAAyB,EACzBoB,2BAA2B,CAEnC,CAAC;AACL,CAAC;AAEDjE,UAAU,CAACkF,WAAW,GAAG,YAAY;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAtG,OAAA,GAEvBkB,UAAU","ignoreList":[]}