@pega/cosmos-react-core 9.0.0-build.25.4 → 9.0.0-build.25.6

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 (33) hide show
  1. package/lib/components/AIRewrite/AIRewrite.d.ts +1 -9
  2. package/lib/components/AIRewrite/AIRewrite.d.ts.map +1 -1
  3. package/lib/components/AIRewrite/AIRewrite.js +16 -29
  4. package/lib/components/AIRewrite/AIRewrite.js.map +1 -1
  5. package/lib/components/AIRewrite/AIRewrite.styles.d.ts +24 -0
  6. package/lib/components/AIRewrite/AIRewrite.styles.d.ts.map +1 -0
  7. package/lib/components/AIRewrite/AIRewrite.styles.js +24 -0
  8. package/lib/components/AIRewrite/AIRewrite.styles.js.map +1 -0
  9. package/lib/components/AIRewrite/AIRewrite.test-ids.d.ts +1 -1
  10. package/lib/components/AIRewrite/AIRewrite.test-ids.d.ts.map +1 -1
  11. package/lib/components/AIRewrite/AIRewrite.test-ids.js +1 -1
  12. package/lib/components/AIRewrite/AIRewrite.test-ids.js.map +1 -1
  13. package/lib/components/AIRewrite/AIRewrite.types.d.ts +12 -11
  14. package/lib/components/AIRewrite/AIRewrite.types.d.ts.map +1 -1
  15. package/lib/components/AIRewrite/AIRewrite.types.js.map +1 -1
  16. package/lib/components/AppShell/AppHeader.js +1 -1
  17. package/lib/components/AppShell/AppHeader.js.map +1 -1
  18. package/lib/components/AppShell/AppHeader.styles.d.ts.map +1 -1
  19. package/lib/components/AppShell/AppHeader.styles.js +5 -1
  20. package/lib/components/AppShell/AppHeader.styles.js.map +1 -1
  21. package/lib/components/FieldGroup/FieldGroup.d.ts +0 -1
  22. package/lib/components/FieldGroup/FieldGroup.d.ts.map +1 -1
  23. package/lib/components/FieldGroup/FieldGroup.js +7 -16
  24. package/lib/components/FieldGroup/FieldGroup.js.map +1 -1
  25. package/lib/hooks/useI18n.d.ts +6 -2
  26. package/lib/hooks/useI18n.d.ts.map +1 -1
  27. package/lib/i18n/default.d.ts +6 -2
  28. package/lib/i18n/default.d.ts.map +1 -1
  29. package/lib/i18n/default.js +10 -5
  30. package/lib/i18n/default.js.map +1 -1
  31. package/lib/i18n/i18n.d.ts +6 -2
  32. package/lib/i18n/i18n.d.ts.map +1 -1
  33. package/package.json +1 -1
@@ -1,12 +1,4 @@
1
1
  import type { AIRewriteProps } from './AIRewrite.types';
2
- /**
3
- * AIRewrite - A popover dialog for AI-powered text rewriting
4
- *
5
- * Renders in three modes:
6
- * 1. Form mode (default) — collects rewrite action + optional instructions
7
- * 2. Loading mode (isLoading=true) — shows progress while the AI processes
8
- * 3. Review mode (rewrittenText is set) — editable text area with Apply / Back
9
- */
10
- declare const AIRewrite: ({ target, testId, onSubmit, onCancel, isLoading, rewrittenText, onApply, onBack }: AIRewriteProps) => import("react/jsx-runtime").JSX.Element;
2
+ declare const AIRewrite: ({ target, testId, onGenerate, onSubmit, onCancel, isGenerating, suggestion, suggestionEditor }: AIRewriteProps) => import("react/jsx-runtime").JSX.Element;
11
3
  export default AIRewrite;
12
4
  //# sourceMappingURL=AIRewrite.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"AIRewrite.d.ts","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,cAAc,EAAY,MAAM,mBAAmB,CAAC;AAGlE;;;;;;;GAOG;AACH,QAAA,MAAM,SAAS,GAAI,mFAShB,cAAc,4CA8GhB,CAAC;AAEF,eAAe,SAAS,CAAC"}
1
+ {"version":3,"file":"AIRewrite.d.ts","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,cAAc,EAAY,MAAM,mBAAmB,CAAC;AAQlE,QAAA,MAAM,SAAS,GAAI,gGAShB,cAAc,4CA+GhB,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1,27 +1,19 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useEffect, useState } from 'react';
3
- import { FormDialog, RadioButtonGroup, RadioButton, TextArea, useI18n, useTestIds, Flex } from '@pega/cosmos-react-core';
2
+ import { useState } from 'react';
3
+ import Button from '../Button';
4
+ import Flex from '../Flex';
5
+ import RadioButton from '../RadioButton';
6
+ import RadioButtonGroup from '../RadioButtonGroup';
7
+ import Text from '../Text';
8
+ import TextArea from '../TextArea';
9
+ import { useI18n, useTestIds } from '../../hooks';
4
10
  import { getAIRewriteTestIds } from './AIRewrite.test-ids';
5
- /**
6
- * AIRewrite - A popover dialog for AI-powered text rewriting
7
- *
8
- * Renders in three modes:
9
- * 1. Form mode (default) — collects rewrite action + optional instructions
10
- * 2. Loading mode (isLoading=true) — shows progress while the AI processes
11
- * 3. Review mode (rewrittenText is set) — editable text area with Apply / Back
12
- */
13
- const AIRewrite = ({ target, testId, onSubmit, onCancel, isLoading, rewrittenText, onApply, onBack }) => {
11
+ import { StyledAIRewriteDialog, StyledFormSection, StyledInstructionsWrapper } from './AIRewrite.styles';
12
+ const AIRewrite = ({ target, testId, onGenerate, onSubmit, onCancel, isGenerating, suggestion, suggestionEditor }) => {
14
13
  const t = useI18n();
15
14
  const testIds = useTestIds(testId, getAIRewriteTestIds);
16
15
  const [selectedAction, setSelectedAction] = useState('improve');
17
16
  const [additionalInstructions, setAdditionalInstructions] = useState('');
18
- const [editableRewrittenText, setEditableRewrittenText] = useState(rewrittenText ?? '');
19
- // Sync editable text whenever a new AI result arrives
20
- useEffect(() => {
21
- if (rewrittenText !== undefined) {
22
- setEditableRewrittenText(rewrittenText);
23
- }
24
- }, [rewrittenText]);
25
17
  const handleActionChange = (e) => {
26
18
  const newAction = e.target.value;
27
19
  if (newAction === 'improve' ||
@@ -31,22 +23,17 @@ const AIRewrite = ({ target, testId, onSubmit, onCancel, isLoading, rewrittenTex
31
23
  setSelectedAction(newAction);
32
24
  }
33
25
  };
34
- const handleSubmit = () => {
35
- onSubmit(selectedAction, additionalInstructions);
26
+ const handleGenerate = () => {
27
+ onGenerate(selectedAction, additionalInstructions);
36
28
  };
37
29
  const handleCancel = () => {
38
30
  target.focus();
39
31
  onCancel();
40
32
  };
41
- // Review mode show the AI result in an editable field
42
- if (rewrittenText !== undefined) {
43
- return (_jsx(FormDialog, { target: target, heading: t('ai_rewrite_title'), onDismiss: handleCancel, onCancel: { text: t('ai_rewrite_back'), handler: () => onBack?.() }, onSubmit: { text: t('ai_rewrite_apply'), handler: () => onApply?.(editableRewrittenText) }, children: _jsx(TextArea, { label: t('ai_rewrite_result_label'), value: editableRewrittenText, onChange: e => setEditableRewrittenText(e.target.value), "data-testid": testIds.reviewTextArea }) }));
44
- }
45
- // Form mode (default or loading)
46
- return (_jsx(FormDialog, { target: target, heading: t('ai_rewrite_title'), progress: isLoading, onCancel: handleCancel, onSubmit: {
47
- disabled: isLoading,
48
- handler: handleSubmit
49
- }, children: _jsxs(Flex, { container: { direction: 'column', rowGap: 2 }, children: [_jsxs(RadioButtonGroup, { name: 'aiAction', label: t('ai_rewrite_label'), required: true, children: [_jsx(RadioButton, { value: 'improve', label: t('ai_rewrite_improve'), checked: selectedAction === 'improve', onChange: handleActionChange, "data-testid": testIds.radioClearer }), _jsx(RadioButton, { value: 'shorter', label: t('ai_rewrite_shorter'), checked: selectedAction === 'shorter', onChange: handleActionChange, "data-testid": testIds.radioShorter }), _jsx(RadioButton, { value: 'professional', label: t('ai_rewrite_professional'), checked: selectedAction === 'professional', onChange: handleActionChange, "data-testid": testIds.radioProfessional }), _jsx(RadioButton, { value: 'friendly', label: t('ai_rewrite_friendly'), checked: selectedAction === 'friendly', onChange: handleActionChange, "data-testid": testIds.radioFriendly })] }), _jsx(TextArea, { label: t('ai_rewrite_instructions_label'), info: t('ai_rewrite_instructions_info'), value: additionalInstructions, onChange: e => setAdditionalInstructions(e.target.value), maxLength: 200, "data-testid": testIds.instructionsInput })] }) }));
33
+ return (_jsx(StyledAIRewriteDialog, { target: target, heading: t('ai_rewrite_title'), onCancel: handleCancel, onSubmit: {
34
+ disabled: !suggestion?.trim() || isGenerating,
35
+ handler: onSubmit
36
+ }, children: _jsxs(Flex, { container: { direction: 'column', rowGap: 2 }, children: [_jsx(StyledFormSection, { children: _jsxs(Flex, { container: { direction: 'column', rowGap: 2 }, children: [_jsxs(RadioButtonGroup, { name: 'aiAction', label: t('ai_rewrite_label'), required: true, inline: true, children: [_jsx(RadioButton, { value: 'improve', label: t('ai_rewrite_improve'), checked: selectedAction === 'improve', onChange: handleActionChange, "data-testid": testIds.radioClearer }), _jsx(RadioButton, { value: 'shorter', label: t('ai_rewrite_shorter'), checked: selectedAction === 'shorter', onChange: handleActionChange, "data-testid": testIds.radioShorter }), _jsx(RadioButton, { value: 'professional', label: t('ai_rewrite_professional'), checked: selectedAction === 'professional', onChange: handleActionChange, "data-testid": testIds.radioProfessional }), _jsx(RadioButton, { value: 'friendly', label: t('ai_rewrite_friendly'), checked: selectedAction === 'friendly', onChange: handleActionChange, "data-testid": testIds.radioFriendly })] }), _jsx(StyledInstructionsWrapper, { children: _jsx(TextArea, { label: t('ai_rewrite_instructions_label'), info: t('ai_rewrite_instructions_info'), value: additionalInstructions, onChange: e => setAdditionalInstructions(e.target.value), maxLength: 200, rows: 1, autoResize: false, "data-testid": testIds.instructionsInput }) }), _jsx("div", { children: _jsx(Button, { type: 'button', onClick: handleGenerate, disabled: isGenerating, "data-testid": testIds.generateButton, children: t('ai_rewrite_generate') }) })] }) }), _jsxs(Flex, { container: { direction: 'column', rowGap: 0.5 }, children: [_jsx(Text, { variant: 'h4', children: t('ai_rewrite_result_label') }), suggestionEditor ?? (_jsx(TextArea, { label: t('ai_rewrite_result_label'), labelHidden: true, value: suggestion ?? '', readOnly: true, disabled: !suggestion }))] })] }) }));
50
37
  };
51
38
  export default AIRewrite;
52
39
  //# sourceMappingURL=AIRewrite.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"AIRewrite.js","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useState } from 'react';\nimport type { ChangeEvent } from 'react';\n\nimport {\n FormDialog,\n RadioButtonGroup,\n RadioButton,\n TextArea,\n useI18n,\n useTestIds,\n Flex\n} from '@pega/cosmos-react-core';\n\nimport type { AIRewriteProps, AIAction } from './AIRewrite.types';\nimport { getAIRewriteTestIds } from './AIRewrite.test-ids';\n\n/**\n * AIRewrite - A popover dialog for AI-powered text rewriting\n *\n * Renders in three modes:\n * 1. Form mode (default) — collects rewrite action + optional instructions\n * 2. Loading mode (isLoading=true) — shows progress while the AI processes\n * 3. Review mode (rewrittenText is set) — editable text area with Apply / Back\n */\nconst AIRewrite = ({\n target,\n testId,\n onSubmit,\n onCancel,\n isLoading,\n rewrittenText,\n onApply,\n onBack\n}: AIRewriteProps) => {\n const t = useI18n();\n const testIds = useTestIds(testId, getAIRewriteTestIds);\n const [selectedAction, setSelectedAction] = useState<AIAction>('improve');\n const [additionalInstructions, setAdditionalInstructions] = useState('');\n const [editableRewrittenText, setEditableRewrittenText] = useState(rewrittenText ?? '');\n\n // Sync editable text whenever a new AI result arrives\n useEffect(() => {\n if (rewrittenText !== undefined) {\n setEditableRewrittenText(rewrittenText);\n }\n }, [rewrittenText]);\n\n const handleActionChange = (e: ChangeEvent<HTMLInputElement>) => {\n const newAction = e.target.value;\n if (\n newAction === 'improve' ||\n newAction === 'shorter' ||\n newAction === 'professional' ||\n newAction === 'friendly'\n ) {\n setSelectedAction(newAction);\n }\n };\n\n const handleSubmit = () => {\n onSubmit(selectedAction, additionalInstructions);\n };\n\n const handleCancel = () => {\n target.focus();\n onCancel();\n };\n\n // Review mode — show the AI result in an editable field\n if (rewrittenText !== undefined) {\n return (\n <FormDialog\n target={target}\n heading={t('ai_rewrite_title')}\n onDismiss={handleCancel}\n onCancel={{ text: t('ai_rewrite_back'), handler: () => onBack?.() }}\n onSubmit={{ text: t('ai_rewrite_apply'), handler: () => onApply?.(editableRewrittenText) }}\n >\n <TextArea\n label={t('ai_rewrite_result_label')}\n value={editableRewrittenText}\n onChange={e => setEditableRewrittenText(e.target.value)}\n data-testid={testIds.reviewTextArea}\n />\n </FormDialog>\n );\n }\n\n // Form mode (default or loading)\n return (\n <FormDialog\n target={target}\n heading={t('ai_rewrite_title')}\n progress={isLoading}\n onCancel={handleCancel}\n onSubmit={{\n disabled: isLoading,\n handler: handleSubmit\n }}\n >\n <Flex container={{ direction: 'column', rowGap: 2 }}>\n <RadioButtonGroup name='aiAction' label={t('ai_rewrite_label')} required>\n <RadioButton\n value='improve'\n label={t('ai_rewrite_improve')}\n checked={selectedAction === 'improve'}\n onChange={handleActionChange}\n data-testid={testIds.radioClearer}\n />\n <RadioButton\n value='shorter'\n label={t('ai_rewrite_shorter')}\n checked={selectedAction === 'shorter'}\n onChange={handleActionChange}\n data-testid={testIds.radioShorter}\n />\n <RadioButton\n value='professional'\n label={t('ai_rewrite_professional')}\n checked={selectedAction === 'professional'}\n onChange={handleActionChange}\n data-testid={testIds.radioProfessional}\n />\n <RadioButton\n value='friendly'\n label={t('ai_rewrite_friendly')}\n checked={selectedAction === 'friendly'}\n onChange={handleActionChange}\n data-testid={testIds.radioFriendly}\n />\n </RadioButtonGroup>\n\n <TextArea\n label={t('ai_rewrite_instructions_label')}\n info={t('ai_rewrite_instructions_info')}\n value={additionalInstructions}\n onChange={e => setAdditionalInstructions(e.target.value)}\n maxLength={200}\n data-testid={testIds.instructionsInput}\n />\n </Flex>\n </FormDialog>\n );\n};\n\nexport default AIRewrite;\n"]}
1
+ {"version":3,"file":"AIRewrite.js","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport type { ChangeEvent } from 'react';\n\nimport Button from '../Button';\nimport Flex from '../Flex';\nimport RadioButton from '../RadioButton';\nimport RadioButtonGroup from '../RadioButtonGroup';\nimport Text from '../Text';\nimport TextArea from '../TextArea';\nimport { useI18n, useTestIds } from '../../hooks';\n\nimport type { AIRewriteProps, AIAction } from './AIRewrite.types';\nimport { getAIRewriteTestIds } from './AIRewrite.test-ids';\nimport {\n StyledAIRewriteDialog,\n StyledFormSection,\n StyledInstructionsWrapper\n} from './AIRewrite.styles';\n\nconst AIRewrite = ({\n target,\n testId,\n onGenerate,\n onSubmit,\n onCancel,\n isGenerating,\n suggestion,\n suggestionEditor\n}: AIRewriteProps) => {\n const t = useI18n();\n const testIds = useTestIds(testId, getAIRewriteTestIds);\n const [selectedAction, setSelectedAction] = useState<AIAction>('improve');\n const [additionalInstructions, setAdditionalInstructions] = useState('');\n\n const handleActionChange = (e: ChangeEvent<HTMLInputElement>) => {\n const newAction = e.target.value;\n if (\n newAction === 'improve' ||\n newAction === 'shorter' ||\n newAction === 'professional' ||\n newAction === 'friendly'\n ) {\n setSelectedAction(newAction);\n }\n };\n\n const handleGenerate = () => {\n onGenerate(selectedAction, additionalInstructions);\n };\n\n const handleCancel = () => {\n target.focus();\n onCancel();\n };\n\n return (\n <StyledAIRewriteDialog\n target={target}\n heading={t('ai_rewrite_title')}\n onCancel={handleCancel}\n onSubmit={{\n disabled: !suggestion?.trim() || isGenerating,\n handler: onSubmit\n }}\n >\n <Flex container={{ direction: 'column', rowGap: 2 }}>\n <StyledFormSection>\n <Flex container={{ direction: 'column', rowGap: 2 }}>\n <RadioButtonGroup name='aiAction' label={t('ai_rewrite_label')} required inline>\n <RadioButton\n value='improve'\n label={t('ai_rewrite_improve')}\n checked={selectedAction === 'improve'}\n onChange={handleActionChange}\n data-testid={testIds.radioClearer}\n />\n <RadioButton\n value='shorter'\n label={t('ai_rewrite_shorter')}\n checked={selectedAction === 'shorter'}\n onChange={handleActionChange}\n data-testid={testIds.radioShorter}\n />\n <RadioButton\n value='professional'\n label={t('ai_rewrite_professional')}\n checked={selectedAction === 'professional'}\n onChange={handleActionChange}\n data-testid={testIds.radioProfessional}\n />\n <RadioButton\n value='friendly'\n label={t('ai_rewrite_friendly')}\n checked={selectedAction === 'friendly'}\n onChange={handleActionChange}\n data-testid={testIds.radioFriendly}\n />\n </RadioButtonGroup>\n\n <StyledInstructionsWrapper>\n <TextArea\n label={t('ai_rewrite_instructions_label')}\n info={t('ai_rewrite_instructions_info')}\n value={additionalInstructions}\n onChange={e => setAdditionalInstructions(e.target.value)}\n maxLength={200}\n rows={1}\n autoResize={false}\n data-testid={testIds.instructionsInput}\n />\n </StyledInstructionsWrapper>\n <div>\n <Button\n type='button'\n onClick={handleGenerate}\n disabled={isGenerating}\n data-testid={testIds.generateButton}\n >\n {t('ai_rewrite_generate')}\n </Button>\n </div>\n </Flex>\n </StyledFormSection>\n\n <Flex container={{ direction: 'column', rowGap: 0.5 }}>\n <Text variant='h4'>{t('ai_rewrite_result_label')}</Text>\n {suggestionEditor ?? (\n <TextArea\n label={t('ai_rewrite_result_label')}\n labelHidden\n value={suggestion ?? ''}\n readOnly\n disabled={!suggestion}\n />\n )}\n </Flex>\n </Flex>\n </StyledAIRewriteDialog>\n );\n};\n\nexport default AIRewrite;\n"]}
@@ -0,0 +1,24 @@
1
+ export declare const StyledAIRewriteDialog: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<(Omit<Omit<import("../Dialog/Dialog.types").BaseDialogProps & {
2
+ onDismiss?: () => void;
3
+ onCancel: import("../Dialog/Dialog.types").FormAction;
4
+ onSubmit: import("../Dialog/Dialog.types").FormAction;
5
+ } & {
6
+ heading: string;
7
+ additionalInfo?: import("../AdditionalInfo").AdditionalInfoProps;
8
+ 'aria-label'?: never;
9
+ } & Omit<import("../..").Attributes<"div">, "aria-label" | "onSubmit" | "onCancel" | "heading" | "onDismiss" | keyof import("../Dialog/Dialog.types").BaseDialogProps | "additionalInfo">, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
10
+ ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
11
+ }) | (Omit<Omit<import("../Dialog/Dialog.types").BaseDialogProps & {
12
+ onDismiss?: () => void;
13
+ onCancel: import("../Dialog/Dialog.types").FormAction;
14
+ onSubmit: import("../Dialog/Dialog.types").FormAction;
15
+ } & {
16
+ heading?: never;
17
+ 'aria-label': string;
18
+ additionalInfo?: never;
19
+ } & Omit<import("../..").Attributes<"div">, "aria-label" | "onSubmit" | "onCancel" | "heading" | "onDismiss" | keyof import("../Dialog/Dialog.types").BaseDialogProps | "additionalInfo">, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
20
+ ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
21
+ }), import("styled-components/dist/types").BaseObject>> & string & Omit<import("react").ForwardRefExoticComponent<import("react").PropsWithoutRef<import("../Dialog").FormDialogProps> & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
22
+ export declare const StyledFormSection: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
23
+ export declare const StyledInstructionsWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
24
+ //# sourceMappingURL=AIRewrite.styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AIRewrite.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;uRAIhC,CAAC;AAIH,eAAO,MAAM,iBAAiB,6NAM5B,CAAC;AAIH,eAAO,MAAM,yBAAyB,6NAIrC,CAAC"}
@@ -0,0 +1,24 @@
1
+ import styled, { css } from 'styled-components';
2
+ import { defaultThemeProp } from '../../theme';
3
+ import FormDialog from '../Dialog/FormDialog';
4
+ export const StyledAIRewriteDialog = styled(FormDialog)(({ theme }) => {
5
+ return css `
6
+ min-width: min(${theme.base['content-width'].xl}, calc(100vw - 2rem));
7
+ `;
8
+ });
9
+ StyledAIRewriteDialog.defaultProps = defaultThemeProp;
10
+ export const StyledFormSection = styled.div(({ theme }) => {
11
+ return css `
12
+ background: ${theme.base.palette['secondary-background']};
13
+ border-radius: ${theme.base['border-radius']};
14
+ padding: calc(2 * ${theme.base.spacing});
15
+ `;
16
+ });
17
+ StyledFormSection.defaultProps = defaultThemeProp;
18
+ export const StyledInstructionsWrapper = styled.div `
19
+ textarea {
20
+ min-height: unset;
21
+ }
22
+ `;
23
+ StyledInstructionsWrapper.defaultProps = defaultThemeProp;
24
+ //# sourceMappingURL=AIRewrite.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AIRewrite.styles.js","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,UAAU,MAAM,sBAAsB,CAAC;AAE9C,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACpE,OAAO,GAAG,CAAA;qBACS,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;GAChD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;kBACM,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,sBAAsB,CAAC;qBACvC,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;wBACxB,KAAK,CAAC,IAAI,CAAC,OAAO;GACvC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAIlD,CAAC;AAEF,yBAAyB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport FormDialog from '../Dialog/FormDialog';\n\nexport const StyledAIRewriteDialog = styled(FormDialog)(({ theme }) => {\n return css`\n min-width: min(${theme.base['content-width'].xl}, calc(100vw - 2rem));\n `;\n});\n\nStyledAIRewriteDialog.defaultProps = defaultThemeProp;\n\nexport const StyledFormSection = styled.div(({ theme }) => {\n return css`\n background: ${theme.base.palette['secondary-background']};\n border-radius: ${theme.base['border-radius']};\n padding: calc(2 * ${theme.base.spacing});\n `;\n});\n\nStyledFormSection.defaultProps = defaultThemeProp;\n\nexport const StyledInstructionsWrapper = styled.div`\n textarea {\n min-height: unset;\n }\n`;\n\nStyledInstructionsWrapper.defaultProps = defaultThemeProp;\n"]}
@@ -1,2 +1,2 @@
1
- export declare const getAIRewriteTestIds: (testIdProp?: import("../..").TestIdProp["testId"]) => import("../..").TestIdsRecord<readonly ["radio-clearer", "radio-shorter", "radio-professional", "radio-friendly", "instructions-input", "review-text-area"]>;
1
+ export declare const getAIRewriteTestIds: (testIdProp?: import("../..").TestIdProp["testId"]) => import("../..").TestIdsRecord<readonly ["radio-clearer", "radio-shorter", "radio-professional", "radio-friendly", "instructions-input", "generate-button"]>;
2
2
  //# sourceMappingURL=AIRewrite.test-ids.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"AIRewrite.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,mBAAmB,qNAOrB,CAAC"}
1
+ {"version":3,"file":"AIRewrite.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.test-ids.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,mBAAmB,oNAOrB,CAAC"}
@@ -5,6 +5,6 @@ export const getAIRewriteTestIds = createTestIds('ai-rewrite-popover', [
5
5
  'radio-professional',
6
6
  'radio-friendly',
7
7
  'instructions-input',
8
- 'review-text-area'
8
+ 'generate-button'
9
9
  ]);
10
10
  //# sourceMappingURL=AIRewrite.test-ids.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"AIRewrite.test-ids.js","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAC,oBAAoB,EAAE;IACrE,eAAe;IACf,eAAe;IACf,oBAAoB;IACpB,gBAAgB;IAChB,oBAAoB;IACpB,kBAAkB;CACV,CAAC,CAAC","sourcesContent":["import { createTestIds } from '../../utils';\n\nexport const getAIRewriteTestIds = createTestIds('ai-rewrite-popover', [\n 'radio-clearer',\n 'radio-shorter',\n 'radio-professional',\n 'radio-friendly',\n 'instructions-input',\n 'review-text-area'\n] as const);\n"]}
1
+ {"version":3,"file":"AIRewrite.test-ids.js","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAC,oBAAoB,EAAE;IACrE,eAAe;IACf,eAAe;IACf,oBAAoB;IACpB,gBAAgB;IAChB,oBAAoB;IACpB,iBAAiB;CACT,CAAC,CAAC","sourcesContent":["import { createTestIds } from '../../utils';\n\nexport const getAIRewriteTestIds = createTestIds('ai-rewrite-popover', [\n 'radio-clearer',\n 'radio-shorter',\n 'radio-professional',\n 'radio-friendly',\n 'instructions-input',\n 'generate-button'\n] as const);\n"]}
@@ -1,20 +1,21 @@
1
+ import type { ReactNode } from 'react';
1
2
  import type { TestIdProp } from '../../types';
2
3
  /** AI rewrite action types */
3
4
  export type AIAction = 'improve' | 'shorter' | 'professional' | 'friendly';
4
5
  export interface AIRewriteProps extends TestIdProp {
5
6
  /** The button element that triggered the popover */
6
7
  target: HTMLElement;
7
- /** Callback when user submits the rewrite form */
8
- onSubmit: (rewriteAction: AIAction, additionalInstructions: string) => void;
9
- /** Callback when user cancels or dismisses the popover */
8
+ /** Called when the user clicks the Generate button to request an AI rewrite */
9
+ onGenerate: (rewriteAction: AIAction, additionalInstructions: string) => void;
10
+ /** Called when the user clicks Submit to apply the suggestion */
11
+ onSubmit: () => void;
12
+ /** Called when the user cancels or dismisses the popover */
10
13
  onCancel: () => void;
11
- /** When true, shows a loading/progress state while the AI is generating a result */
12
- isLoading?: boolean;
13
- /** When set, transitions the popover to a review step showing the AI-generated text in an editable field */
14
- rewrittenText?: string;
15
- /** Called when the user accepts the (optionally edited) rewritten text in the review step */
16
- onApply?: (text: string) => void;
17
- /** Called when the user clicks Back in the review step to return to the form */
18
- onBack?: () => void;
14
+ /** When true, the AI is generating a suggestion. Disables the Generate button. */
15
+ isGenerating?: boolean;
16
+ /** The AI-generated suggestion text. When provided, Submit is enabled. */
17
+ suggestion?: string;
18
+ /** Custom editor to render in the suggestion area. When not provided, the raw suggestion text is shown read-only. */
19
+ suggestionEditor?: ReactNode;
19
20
  }
20
21
  //# sourceMappingURL=AIRewrite.types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"AIRewrite.types.d.ts","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,8BAA8B;AAC9B,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,cAAc,GAAG,UAAU,CAAC;AAE3E,MAAM,WAAW,cAAe,SAAQ,UAAU;IAChD,oDAAoD;IACpD,MAAM,EAAE,WAAW,CAAC;IAEpB,kDAAkD;IAClD,QAAQ,EAAE,CAAC,aAAa,EAAE,QAAQ,EAAE,sBAAsB,EAAE,MAAM,KAAK,IAAI,CAAC;IAE5E,0DAA0D;IAC1D,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,oFAAoF;IACpF,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,4GAA4G;IAC5G,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,6FAA6F;IAC7F,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAEjC,gFAAgF;IAChF,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB"}
1
+ {"version":3,"file":"AIRewrite.types.d.ts","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,8BAA8B;AAC9B,MAAM,MAAM,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,cAAc,GAAG,UAAU,CAAC;AAE3E,MAAM,WAAW,cAAe,SAAQ,UAAU;IAChD,oDAAoD;IACpD,MAAM,EAAE,WAAW,CAAC;IAEpB,+EAA+E;IAC/E,UAAU,EAAE,CAAC,aAAa,EAAE,QAAQ,EAAE,sBAAsB,EAAE,MAAM,KAAK,IAAI,CAAC;IAE9E,iEAAiE;IACjE,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,4DAA4D;IAC5D,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,kFAAkF;IAClF,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,0EAA0E;IAC1E,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,qHAAqH;IACrH,gBAAgB,CAAC,EAAE,SAAS,CAAC;CAC9B"}
@@ -1 +1 @@
1
- {"version":3,"file":"AIRewrite.types.js","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { TestIdProp } from '../../types';\n\n/** AI rewrite action types */\nexport type AIAction = 'improve' | 'shorter' | 'professional' | 'friendly';\n\nexport interface AIRewriteProps extends TestIdProp {\n /** The button element that triggered the popover */\n target: HTMLElement;\n\n /** Callback when user submits the rewrite form */\n onSubmit: (rewriteAction: AIAction, additionalInstructions: string) => void;\n\n /** Callback when user cancels or dismisses the popover */\n onCancel: () => void;\n\n /** When true, shows a loading/progress state while the AI is generating a result */\n isLoading?: boolean;\n\n /** When set, transitions the popover to a review step showing the AI-generated text in an editable field */\n rewrittenText?: string;\n\n /** Called when the user accepts the (optionally edited) rewritten text in the review step */\n onApply?: (text: string) => void;\n\n /** Called when the user clicks Back in the review step to return to the form */\n onBack?: () => void;\n}\n"]}
1
+ {"version":3,"file":"AIRewrite.types.js","sourceRoot":"","sources":["../../../src/components/AIRewrite/AIRewrite.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ReactNode } from 'react';\n\nimport type { TestIdProp } from '../../types';\n\n/** AI rewrite action types */\nexport type AIAction = 'improve' | 'shorter' | 'professional' | 'friendly';\n\nexport interface AIRewriteProps extends TestIdProp {\n /** The button element that triggered the popover */\n target: HTMLElement;\n\n /** Called when the user clicks the Generate button to request an AI rewrite */\n onGenerate: (rewriteAction: AIAction, additionalInstructions: string) => void;\n\n /** Called when the user clicks Submit to apply the suggestion */\n onSubmit: () => void;\n\n /** Called when the user cancels or dismisses the popover */\n onCancel: () => void;\n\n /** When true, the AI is generating a suggestion. Disables the Generate button. */\n isGenerating?: boolean;\n\n /** The AI-generated suggestion text. When provided, Submit is enabled. */\n suggestion?: string;\n\n /** Custom editor to render in the suggestion area. When not provided, the raw suggestion text is shown read-only. */\n suggestionEditor?: ReactNode;\n}\n"]}
@@ -36,7 +36,7 @@ const AppHeader = forwardRef(function AppHeader({ appName, contextSwitcher: { co
36
36
  let appInfoAs = 'div';
37
37
  if (href)
38
38
  appInfoAs = 'a';
39
- return (_jsx(ThemeOverride, { theme: headerTheme, children: _jsxs(Flex, { as: StyledAppHeader, container: { alignItems: 'center', pad: 1 }, hideTitle: !isMediumOrAbove, drawerOpen: drawerOpen, ref: ref, children: [contexts && contexts.length > 1 && onContextClick && (_jsx(ContextSwitcher, { contexts: contexts, onContextClick: onContextClick, label: contextSwitcherLabel })), _jsxs(Flex, { as: StyledAppHeaderInfo, container: { colGap: 0.5 }, centerLogo: !fullImageSrc, children: [_jsx(Flex, { container: { inline: true, alignItems: 'center' }, as: appInfoAs, href: href, onClick: href ? onClick : undefined, target: target, children: _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [(fullImageSrc || imageSrc) && (_jsx(Flex, { container: { alignItems: 'center' }, as: StyledAppHeaderLogo, children: _jsx(Image, { src: fullImageSrc || imageSrc, alt: imageAltText ?? t('application_logo') }) })), _jsxs("div", { children: [_jsx(StyledAppHeaderText, { as: appNameHidden || !isMediumOrAbove ? VisuallyHiddenText : 'span', variant: 'primary', children: appName }), portalName && (_jsx(StyledAppHeaderText, { as: appNameHidden || !isMediumOrAbove ? VisuallyHiddenText : 'span', variant: 'secondary', children: portalName }))] })] }) }), headerUtils?.[0]] }), _jsxs(Flex, { item: { grow: 1 }, container: { justify: 'end' }, children: [searchInput ? (_jsx(StyledAppHeaderSearchForm, { ref: setSearchContainer, role: 'search', "aria-label": searchLabel, onSubmit: e => e.preventDefault(), isMediumOrAbove: isMediumOrAbove, children: !searchPage && _jsx(SearchInput, { ...searchInput }) })) : (_jsx(StyledAppHeaderSpacer, {})), headerUtils?.[1]] }), onThemeModeChange && (_jsx(ThemeSwitcher, { themeMode: themeMode, onThemeModeChange: onThemeModeChange })), helpMenu && (_jsx(MenuButton, { variant: 'simple', icon: 'help', text: t('app_header_help'), iconOnly: true, menu: {
39
+ return (_jsx(ThemeOverride, { theme: headerTheme, children: _jsxs(Flex, { as: StyledAppHeader, container: { alignItems: 'center', pad: 1 }, hideTitle: !isMediumOrAbove, drawerOpen: drawerOpen, ref: ref, children: [contexts && contexts.length > 1 && onContextClick && (_jsx(ContextSwitcher, { contexts: contexts, onContextClick: onContextClick, label: contextSwitcherLabel })), _jsxs(Flex, { as: StyledAppHeaderInfo, container: { colGap: 0.5 }, centerLogo: !fullImageSrc, children: [_jsx(Flex, { container: { inline: true, alignItems: 'center' }, as: appInfoAs, href: href, onClick: href ? onClick : undefined, target: target, children: _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [(fullImageSrc || imageSrc) && (_jsx(Flex, { container: { alignItems: 'center' }, as: StyledAppHeaderLogo, children: _jsx(Image, { src: fullImageSrc || imageSrc, alt: imageAltText ?? t('application_logo') }) })), _jsxs("div", { children: [_jsx(StyledAppHeaderText, { as: appNameHidden || !isMediumOrAbove ? VisuallyHiddenText : 'span', variant: 'primary', children: appName }), portalName && (_jsx(StyledAppHeaderText, { as: !isMediumOrAbove ? VisuallyHiddenText : 'span', variant: 'secondary', children: portalName }))] })] }) }), headerUtils?.[0]] }), _jsxs(Flex, { item: { grow: 1 }, container: { justify: 'end' }, children: [searchInput ? (_jsx(StyledAppHeaderSearchForm, { ref: setSearchContainer, role: 'search', "aria-label": searchLabel, onSubmit: e => e.preventDefault(), isMediumOrAbove: isMediumOrAbove, children: !searchPage && _jsx(SearchInput, { ...searchInput }) })) : (_jsx(StyledAppHeaderSpacer, {})), headerUtils?.[1]] }), onThemeModeChange && (_jsx(ThemeSwitcher, { themeMode: themeMode, onThemeModeChange: onThemeModeChange })), helpMenu && (_jsx(MenuButton, { variant: 'simple', icon: 'help', text: t('app_header_help'), iconOnly: true, menu: {
40
40
  items: helpMenu
41
41
  } })), shareApp && (_jsx(Button, { variant: 'secondary', compact: true, onClick: shareApp.onClick, children: _jsxs(Flex, { container: { gap: 0.5, alignItems: 'center' }, children: [_jsx(Icon, { name: 'share' }), _jsx("span", { children: shareLabel })] }) })), _jsx(AppShellOperator, { as: StyledAppHeaderOperator, actions: operator.actions, popover: { placement: 'bottom-start' }, name: operator.name, children: operator.avatar })] }) }));
42
42
  });
@@ -1 +1 @@
1
- {"version":3,"file":"AppHeader.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAGnE,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,KAAK,MAAM,UAAU,CAAC;AAC7B,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE3E,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,YAAY,MAAM,0BAA0B,CAAC;AACpD,OAAO,UAAU,MAAM,eAAe,CAAC;AAGvC,OAAO,gBAAgB,MAAM,YAAY,CAAC;AAC1C,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAChD,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,yBAAyB,EACzB,qBAAqB,EACrB,mBAAmB,EACnB,uBAAuB,EACvB,mBAAmB,EACpB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,eAAe,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAE5C,MAAM,SAAS,GAAqD,UAAU,CAAC,SAAS,SAAS,CAC/F,EACE,OAAO,EACP,eAAe,EAAE,EAAE,QAAQ,EAAE,cAAc,EAAE,KAAK,EAAE,oBAAoB,EAAE,GAAG,EAAE,EAC/E,YAAY,EACZ,QAAQ,EACR,YAAY,EACZ,IAAI,EACJ,OAAO,EACP,UAAU,EACV,MAAM,EACN,aAAa,EACb,QAAQ,EACR,WAAW,EACX,WAAW,EACX,UAAU,EACV,WAAW,EACX,QAAQ,EACR,QAAQ,EACO,EACjB,GAAiB;IAEjB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,eAAe,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IAC5C,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,UAAU,EAAe,CAAC;IACxE,MAAM,EAAE,UAAU,EAAE,oBAAoB,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IACzE,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAElE,MAAM,UAAU,GAAG,QAAQ,EAAE,KAAK,IAAI,CAAC,CAAC,iBAAiB,CAAC,CAAC;IAE3D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,UAAU,IAAI,eAAe,EAAE,CAAC;YAClC,oBAAoB,CAAC,eAAe,CAAC,CAAC;QACxC,CAAC;aAAM,CAAC;YACN,oBAAoB,CAAC,IAAI,CAAC,CAAC;QAC7B,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,eAAe,EAAE,oBAAoB,CAAC,CAAC,CAAC;IAExD,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAE,GAAG,YAAY,EAAE,CAAC;IAExD,IAAI,SAAS,GAAgB,KAAK,CAAC;IACnC,IAAI,IAAI;QAAE,SAAS,GAAG,GAAG,CAAC;IAC1B,OAAO,CACL,KAAC,aAAa,IAAC,KAAK,EAAE,WAAW,YAC/B,MAAC,IAAI,IACH,EAAE,EAAE,eAAe,EACnB,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAC3C,SAAS,EAAE,CAAC,eAAe,EAC3B,UAAU,EAAE,UAAU,EACtB,GAAG,EAAE,GAAG,aAEP,QAAQ,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,IAAI,cAAc,IAAI,CACpD,KAAC,eAAe,IACd,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,KAAK,EAAE,oBAAoB,GAC3B,CACH,EAED,MAAC,IAAI,IAAC,EAAE,EAAE,mBAAmB,EAAE,SAAS,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,CAAC,YAAY,aAClF,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,EACjD,EAAE,EAAE,SAAS,EACb,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EACnC,MAAM,EAAE,MAAM,YAEd,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC9C,CAAC,YAAY,IAAI,QAAQ,CAAC,IAAI,CAC7B,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,mBAAmB,YAChE,KAAC,KAAK,IACJ,GAAG,EAAE,YAAY,IAAI,QAAQ,EAC7B,GAAG,EAAE,YAAY,IAAI,CAAC,CAAC,kBAAkB,CAAC,GAC1C,GACG,CACR,EACD,0BACE,KAAC,mBAAmB,IAClB,EAAE,EAAE,aAAa,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,EACnE,OAAO,EAAC,SAAS,YAEhB,OAAO,GACY,EACrB,UAAU,IAAI,CACb,KAAC,mBAAmB,IAClB,EAAE,EAAE,aAAa,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,EACnE,OAAO,EAAC,WAAW,YAElB,UAAU,GACS,CACvB,IACG,IACD,GACF,EACN,WAAW,EAAE,CAAC,CAAC,CAAC,IACZ,EAEP,MAAC,IAAI,IAAC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,aACnD,WAAW,CAAC,CAAC,CAAC,CACb,KAAC,yBAAyB,IACxB,GAAG,EAAE,kBAAkB,EACvB,IAAI,EAAC,QAAQ,gBACD,WAAW,EACvB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,EACjC,eAAe,EAAE,eAAe,YAE/B,CAAC,UAAU,IAAI,KAAC,WAAW,OAAK,WAAW,GAAI,GACtB,CAC7B,CAAC,CAAC,CAAC,CACF,KAAC,qBAAqB,KAAG,CAC1B,EACA,WAAW,EAAE,CAAC,CAAC,CAAC,IACZ,EACN,iBAAiB,IAAI,CACpB,KAAC,aAAa,IAAC,SAAS,EAAE,SAAS,EAAE,iBAAiB,EAAE,iBAAiB,GAAI,CAC9E,EACA,QAAQ,IAAI,CACX,KAAC,UAAU,IACT,OAAO,EAAC,QAAQ,EAChB,IAAI,EAAC,MAAM,EACX,IAAI,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAC1B,QAAQ,QACR,IAAI,EAAE;wBACJ,KAAK,EAAE,QAAQ;qBAChB,GACD,CACH,EACA,QAAQ,IAAI,CACX,KAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,OAAO,QAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,YAC3D,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,UAAU,EAAE,QAAQ,EAAE,aACjD,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,EACrB,yBAAO,UAAU,GAAQ,IACpB,GACA,CACV,EACD,KAAC,gBAAgB,IACf,EAAE,EAAE,uBAAuB,EAC3B,OAAO,EAAE,QAAQ,CAAC,OAAO,EACzB,OAAO,EAAE,EAAE,SAAS,EAAE,cAAc,EAAE,EACtC,IAAI,EAAE,QAAQ,CAAC,IAAI,YAElB,QAAQ,CAAC,MAAM,GACC,IACd,GACO,CACjB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,SAAS,CAAC","sourcesContent":["import { forwardRef, useContext, useEffect, useMemo } from 'react';\nimport type { FunctionComponent, Ref, ElementType } from 'react';\n\nimport Flex from '../Flex';\nimport Image from '../Image';\nimport Button from '../Button';\nimport Icon from '../Icon';\nimport SearchInput from '../SearchInput';\nimport { useBreakpoint, useElement, useI18n, useTheme } from '../../hooks';\nimport type { ForwardProps } from '../../types';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { ThemeOverride } from '../Configuration';\nimport useThemeMode from '../../hooks/useThemeMode';\nimport MenuButton from '../MenuButton';\n\nimport type { AppHeaderProps } from './AppShell.types';\nimport AppShellOperator from './Operator';\nimport ContextSwitcher from './ContextSwitcher';\nimport {\n StyledAppHeader,\n StyledAppHeaderInfo,\n StyledAppHeaderSearchForm,\n StyledAppHeaderSpacer,\n StyledAppHeaderText,\n StyledAppHeaderOperator,\n StyledAppHeaderLogo\n} from './AppHeader.styles';\nimport AppShellContext from './AppShellContext';\nimport { getHeaderTheme } from './style-utils';\nimport ThemeSwitcher from './ThemeSwitcher';\n\nconst AppHeader: FunctionComponent<AppHeaderProps & ForwardProps> = forwardRef(function AppHeader(\n {\n appName,\n contextSwitcher: { contexts, onContextClick, label: contextSwitcherLabel } = {},\n fullImageSrc,\n imageSrc,\n imageAltText,\n href,\n onClick,\n portalName,\n target,\n appNameHidden,\n operator,\n searchInput,\n searchLabel,\n searchPage,\n headerUtils,\n helpMenu,\n shareApp\n }: AppHeaderProps,\n ref: Ref<Element>\n) {\n const t = useI18n();\n const isMediumOrAbove = useBreakpoint('md');\n const [searchContainer, setSearchContainer] = useElement<HTMLElement>();\n const { drawerOpen, setSearchContainerEl } = useContext(AppShellContext);\n const theme = useTheme();\n const headerTheme = useMemo(() => getHeaderTheme(theme), [theme]);\n\n const shareLabel = shareApp?.label ?? t('app_shell_share');\n\n useEffect(() => {\n if (searchPage && searchContainer) {\n setSearchContainerEl(searchContainer);\n } else {\n setSearchContainerEl(null);\n }\n }, [searchPage, searchContainer, setSearchContainerEl]);\n\n const { themeMode, onThemeModeChange } = useThemeMode();\n\n let appInfoAs: ElementType = 'div';\n if (href) appInfoAs = 'a';\n return (\n <ThemeOverride theme={headerTheme}>\n <Flex\n as={StyledAppHeader}\n container={{ alignItems: 'center', pad: 1 }}\n hideTitle={!isMediumOrAbove}\n drawerOpen={drawerOpen}\n ref={ref}\n >\n {contexts && contexts.length > 1 && onContextClick && (\n <ContextSwitcher\n contexts={contexts}\n onContextClick={onContextClick}\n label={contextSwitcherLabel}\n />\n )}\n\n <Flex as={StyledAppHeaderInfo} container={{ colGap: 0.5 }} centerLogo={!fullImageSrc}>\n <Flex\n container={{ inline: true, alignItems: 'center' }}\n as={appInfoAs}\n href={href}\n onClick={href ? onClick : undefined}\n target={target}\n >\n <Flex container={{ alignItems: 'center', gap: 1 }}>\n {(fullImageSrc || imageSrc) && (\n <Flex container={{ alignItems: 'center' }} as={StyledAppHeaderLogo}>\n <Image\n src={fullImageSrc || imageSrc}\n alt={imageAltText ?? t('application_logo')}\n />\n </Flex>\n )}\n <div>\n <StyledAppHeaderText\n as={appNameHidden || !isMediumOrAbove ? VisuallyHiddenText : 'span'}\n variant='primary'\n >\n {appName}\n </StyledAppHeaderText>\n {portalName && (\n <StyledAppHeaderText\n as={appNameHidden || !isMediumOrAbove ? VisuallyHiddenText : 'span'}\n variant='secondary'\n >\n {portalName}\n </StyledAppHeaderText>\n )}\n </div>\n </Flex>\n </Flex>\n {headerUtils?.[0]}\n </Flex>\n\n <Flex item={{ grow: 1 }} container={{ justify: 'end' }}>\n {searchInput ? (\n <StyledAppHeaderSearchForm\n ref={setSearchContainer}\n role='search'\n aria-label={searchLabel}\n onSubmit={e => e.preventDefault()}\n isMediumOrAbove={isMediumOrAbove}\n >\n {!searchPage && <SearchInput {...searchInput} />}\n </StyledAppHeaderSearchForm>\n ) : (\n <StyledAppHeaderSpacer />\n )}\n {headerUtils?.[1]}\n </Flex>\n {onThemeModeChange && (\n <ThemeSwitcher themeMode={themeMode} onThemeModeChange={onThemeModeChange} />\n )}\n {helpMenu && (\n <MenuButton\n variant='simple'\n icon='help'\n text={t('app_header_help')}\n iconOnly\n menu={{\n items: helpMenu\n }}\n />\n )}\n {shareApp && (\n <Button variant='secondary' compact onClick={shareApp.onClick}>\n <Flex container={{ gap: 0.5, alignItems: 'center' }}>\n <Icon name='share' />\n <span>{shareLabel}</span>\n </Flex>\n </Button>\n )}\n <AppShellOperator\n as={StyledAppHeaderOperator}\n actions={operator.actions}\n popover={{ placement: 'bottom-start' }}\n name={operator.name}\n >\n {operator.avatar}\n </AppShellOperator>\n </Flex>\n </ThemeOverride>\n );\n});\n\nexport default AppHeader;\n"]}
1
+ {"version":3,"file":"AppHeader.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppHeader.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useContext, useEffect, useMemo } from 'react';\nimport type { FunctionComponent, Ref, ElementType } from 'react';\n\nimport Flex from '../Flex';\nimport Image from '../Image';\nimport Button from '../Button';\nimport Icon from '../Icon';\nimport SearchInput from '../SearchInput';\nimport { useBreakpoint, useElement, useI18n, useTheme } from '../../hooks';\nimport type { ForwardProps } from '../../types';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport { ThemeOverride } from '../Configuration';\nimport useThemeMode from '../../hooks/useThemeMode';\nimport MenuButton from '../MenuButton';\n\nimport type { AppHeaderProps } from './AppShell.types';\nimport AppShellOperator from './Operator';\nimport ContextSwitcher from './ContextSwitcher';\nimport {\n StyledAppHeader,\n StyledAppHeaderInfo,\n StyledAppHeaderSearchForm,\n StyledAppHeaderSpacer,\n StyledAppHeaderText,\n StyledAppHeaderOperator,\n StyledAppHeaderLogo\n} from './AppHeader.styles';\nimport AppShellContext from './AppShellContext';\nimport { getHeaderTheme } from './style-utils';\nimport ThemeSwitcher from './ThemeSwitcher';\n\nconst AppHeader: FunctionComponent<AppHeaderProps & ForwardProps> = forwardRef(function AppHeader(\n {\n appName,\n contextSwitcher: { contexts, onContextClick, label: contextSwitcherLabel } = {},\n fullImageSrc,\n imageSrc,\n imageAltText,\n href,\n onClick,\n portalName,\n target,\n appNameHidden,\n operator,\n searchInput,\n searchLabel,\n searchPage,\n headerUtils,\n helpMenu,\n shareApp\n }: AppHeaderProps,\n ref: Ref<Element>\n) {\n const t = useI18n();\n const isMediumOrAbove = useBreakpoint('md');\n const [searchContainer, setSearchContainer] = useElement<HTMLElement>();\n const { drawerOpen, setSearchContainerEl } = useContext(AppShellContext);\n const theme = useTheme();\n const headerTheme = useMemo(() => getHeaderTheme(theme), [theme]);\n\n const shareLabel = shareApp?.label ?? t('app_shell_share');\n\n useEffect(() => {\n if (searchPage && searchContainer) {\n setSearchContainerEl(searchContainer);\n } else {\n setSearchContainerEl(null);\n }\n }, [searchPage, searchContainer, setSearchContainerEl]);\n\n const { themeMode, onThemeModeChange } = useThemeMode();\n\n let appInfoAs: ElementType = 'div';\n if (href) appInfoAs = 'a';\n return (\n <ThemeOverride theme={headerTheme}>\n <Flex\n as={StyledAppHeader}\n container={{ alignItems: 'center', pad: 1 }}\n hideTitle={!isMediumOrAbove}\n drawerOpen={drawerOpen}\n ref={ref}\n >\n {contexts && contexts.length > 1 && onContextClick && (\n <ContextSwitcher\n contexts={contexts}\n onContextClick={onContextClick}\n label={contextSwitcherLabel}\n />\n )}\n\n <Flex as={StyledAppHeaderInfo} container={{ colGap: 0.5 }} centerLogo={!fullImageSrc}>\n <Flex\n container={{ inline: true, alignItems: 'center' }}\n as={appInfoAs}\n href={href}\n onClick={href ? onClick : undefined}\n target={target}\n >\n <Flex container={{ alignItems: 'center', gap: 1 }}>\n {(fullImageSrc || imageSrc) && (\n <Flex container={{ alignItems: 'center' }} as={StyledAppHeaderLogo}>\n <Image\n src={fullImageSrc || imageSrc}\n alt={imageAltText ?? t('application_logo')}\n />\n </Flex>\n )}\n <div>\n <StyledAppHeaderText\n as={appNameHidden || !isMediumOrAbove ? VisuallyHiddenText : 'span'}\n variant='primary'\n >\n {appName}\n </StyledAppHeaderText>\n {portalName && (\n <StyledAppHeaderText\n as={!isMediumOrAbove ? VisuallyHiddenText : 'span'}\n variant='secondary'\n >\n {portalName}\n </StyledAppHeaderText>\n )}\n </div>\n </Flex>\n </Flex>\n {headerUtils?.[0]}\n </Flex>\n\n <Flex item={{ grow: 1 }} container={{ justify: 'end' }}>\n {searchInput ? (\n <StyledAppHeaderSearchForm\n ref={setSearchContainer}\n role='search'\n aria-label={searchLabel}\n onSubmit={e => e.preventDefault()}\n isMediumOrAbove={isMediumOrAbove}\n >\n {!searchPage && <SearchInput {...searchInput} />}\n </StyledAppHeaderSearchForm>\n ) : (\n <StyledAppHeaderSpacer />\n )}\n {headerUtils?.[1]}\n </Flex>\n {onThemeModeChange && (\n <ThemeSwitcher themeMode={themeMode} onThemeModeChange={onThemeModeChange} />\n )}\n {helpMenu && (\n <MenuButton\n variant='simple'\n icon='help'\n text={t('app_header_help')}\n iconOnly\n menu={{\n items: helpMenu\n }}\n />\n )}\n {shareApp && (\n <Button variant='secondary' compact onClick={shareApp.onClick}>\n <Flex container={{ gap: 0.5, alignItems: 'center' }}>\n <Icon name='share' />\n <span>{shareLabel}</span>\n </Flex>\n </Button>\n )}\n <AppShellOperator\n as={StyledAppHeaderOperator}\n actions={operator.actions}\n popover={{ placement: 'bottom-start' }}\n name={operator.name}\n >\n {operator.avatar}\n </AppShellOperator>\n </Flex>\n </ThemeOverride>\n );\n});\n\nexport default AppHeader;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"AppHeader.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppHeader.styles.ts"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAIzC,eAAO,MAAM,qBAAqB,6NAIhC,CAAC;AAIH,eAAO,MAAM,mBAAmB;gBAA4B,OAAO;YA2BjE,CAAC;AAIH,eAAO,MAAM,yBAAyB;qBAAkC,OAAO;YAuE9E,CAAC;AAIF,eAAO,MAAM,qBAAqB,6NAEjC,CAAC;AAEF,eAAO,MAAM,mBAAmB,6NAI9B,CAAC;AAGH,eAAO,MAAM,mBAAmB;;;aAA2B,SAAS,CAAC,SAAS,CAAC;8HAyC7E,CAAC;AAIH,eAAO,MAAM,uBAAuB,yOAQnC,CAAC;AAIF,eAAO,MAAM,eAAe;eAA8B,OAAO;gBAAc,OAAO;YAkErF,CAAC"}
1
+ {"version":3,"file":"AppHeader.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppHeader.styles.ts"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAKzC,eAAO,MAAM,qBAAqB,6NAIhC,CAAC;AAIH,eAAO,MAAM,mBAAmB;gBAA4B,OAAO;YA2BjE,CAAC;AAIH,eAAO,MAAM,yBAAyB;qBAAkC,OAAO;YAuE9E,CAAC;AAIF,eAAO,MAAM,qBAAqB,6NAEjC,CAAC;AAEF,eAAO,MAAM,mBAAmB,6NAI9B,CAAC;AAGH,eAAO,MAAM,mBAAmB;;;aAA2B,SAAS,CAAC,SAAS,CAAC;8HA4C7E,CAAC;AAIH,eAAO,MAAM,uBAAuB,yOAQnC,CAAC;AAIF,eAAO,MAAM,eAAe;eAA8B,OAAO;gBAAc,OAAO;YAkErF,CAAC"}
@@ -9,6 +9,7 @@ import { StyledPopover } from '../Popover';
9
9
  import { StyledSearchInput } from '../SearchInput';
10
10
  import { StyledSearchButton, StyledSearchFiltersButton, StyledSearchTextInput } from '../SearchInput/SearchInput.styles';
11
11
  import Text from '../Text';
12
+ import { StyledVisuallyHiddenText } from '../VisuallyHiddenText/VisuallyHiddenText';
12
13
  import { headerHeight, navWidth } from './AppShell.styles';
13
14
  export const StyledContextSwitcher = styled.div(({ theme }) => {
14
15
  return css `
@@ -132,9 +133,12 @@ export const StyledAppHeaderText = styled(Text)(({ theme, variant }) => {
132
133
  ${variant === 'secondary' &&
133
134
  css `
134
135
  display: inline;
135
- margin-inline-start: ${theme.base.spacing};
136
136
  font-size: ${fontSize};
137
137
  align-self: flex-end;
138
+
139
+ &:not(${StyledVisuallyHiddenText}) + & {
140
+ margin-inline-start: ${theme.base.spacing};
141
+ }
138
142
  `}
139
143
  `;
140
144
  });
@@ -1 +1 @@
1
- {"version":3,"file":"AppHeader.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppHeader.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { mix, rgba, transparentize } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport {\n calculateFontSize,\n getHoverColors,\n calculateForegroundColor,\n type FontSize\n} from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport { StyledImage } from '../Image';\nimport { StyledMenuListContainer } from '../Menu/Menu.styles';\nimport { StyledPopover } from '../Popover';\nimport { StyledSearchInput } from '../SearchInput';\nimport {\n StyledSearchButton,\n StyledSearchFiltersButton,\n StyledSearchTextInput\n} from '../SearchInput/SearchInput.styles';\nimport Text from '../Text';\nimport type { TextProps } from '../Text';\n\nimport { headerHeight, navWidth } from './AppShell.styles';\n\nexport const StyledContextSwitcher = styled.div(({ theme }) => {\n return css`\n width: calc(${navWidth} - 2 * ${theme.base.spacing});\n `;\n});\n\nStyledContextSwitcher.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderInfo = styled.div<{ centerLogo: boolean }>(({ centerLogo, theme }) => {\n return css`\n & > :first-child {\n vertical-align: top;\n }\n\n & > :is(a, button) {\n cursor: pointer;\n text-decoration: none;\n user-select: none;\n -webkit-user-select: none;\n }\n\n & > :is(a, button):focus {\n box-shadow: ${theme.base.shadow.focus};\n outline: none;\n }\n\n ${StyledImage} {\n height: 1.0725rem;\n\n ${centerLogo &&\n css`\n padding-inline-start: ${theme.base.spacing};\n `}\n }\n `;\n});\n\nStyledAppHeaderInfo.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderSearchForm = styled.form<{ isMediumOrAbove: boolean }>(\n ({\n isMediumOrAbove,\n theme: {\n base: { animation },\n components: {\n 'app-shell': { header }\n }\n }\n }) => {\n const {\n background: headerBg,\n 'search-input': {\n 'background-color': searchInputBg,\n 'foreground-color': searchInputFg,\n 'border-color': searchInputBorder\n }\n } = header;\n\n const searchBg = searchInputBg;\n const searchFg = calculateForegroundColor(headerBg, searchInputFg);\n const searchBorder = calculateForegroundColor(headerBg, searchInputBorder);\n\n return css`\n max-width: 33vw;\n min-width: 10rem;\n width: 100%;\n justify-self: center;\n margin-inline-start: 0;\n margin-inline-end: auto;\n transition: max-width ${animation.speed} ${animation.timing.ease};\n\n ${StyledSearchInput} input::placeholder {\n color: ${transparentize(0.4, searchFg)};\n }\n\n ${!isMediumOrAbove &&\n css`\n max-width: 75%;\n min-width: 2rem;\n margin-inline-start: auto;\n\n &:focus-within {\n min-width: 10rem;\n }\n `}\n &:not([focused]) {\n ${StyledSearchInput} {\n background: ${searchBg};\n border-color: ${searchBorder};\n ${StyledSearchButton} {\n background: ${searchBg};\n color: ${searchFg};\n border-color: ${searchBorder};\n }\n\n ${StyledSearchTextInput} {\n background: ${searchBg};\n color: ${searchFg};\n border-color: ${searchBorder};\n }\n\n ${StyledSearchFiltersButton} {\n background: ${searchBg};\n color: ${searchFg};\n border-color: ${searchBorder};\n }\n }\n }\n `;\n }\n);\n\nStyledAppHeaderSearchForm.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderSpacer = styled.div`\n margin: auto;\n`;\n\nexport const StyledAppHeaderLogo = styled.div(({ theme }) => {\n return css`\n max-width: min(${theme.base['content-width'].sm}, 25vw);\n `;\n});\nStyledAppHeaderLogo.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderText = styled(Text)<{ variant: TextProps['variant'] }>(({\n theme,\n variant\n}) => {\n const headerBg = theme.components['app-shell'].header.background;\n const headerFgColor = theme.components['app-shell'].header['foreground-color'];\n\n const foregroundColor =\n theme.components['app-shell'].header['app-name-color'] === 'auto'\n ? calculateForegroundColor(headerBg, headerFgColor)\n : theme.components['app-shell'].header['app-name-color'];\n\n const secondaryColor = tryCatch(() =>\n rgba(\n foregroundColor ?? theme.base.palette['foreground-color'],\n theme.base.transparency['transparent-2']\n )\n );\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n color: ${variant === 'secondary' ? secondaryColor : foregroundColor};\n font-family: ${theme.components.text['brand-primary']['font-family']};\n\n ${variant === 'primary' &&\n css`\n font-size: ${fontSize[theme.components.text['brand-primary']['font-size'] as FontSize]};\n font-weight: ${theme.components.text['brand-primary']['font-weight']};\n `}\n\n ${variant === 'secondary' &&\n css`\n display: inline;\n margin-inline-start: ${theme.base.spacing};\n font-size: ${fontSize};\n align-self: flex-end;\n `}\n `;\n});\n\nStyledAppHeaderText.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderOperator = styled.button(\n ({ theme }) => css`\n border-radius: 50%;\n\n :focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n `\n);\n\nStyledAppHeaderOperator.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeader = styled.header<{ hideTitle: boolean; drawerOpen: boolean }>(\n ({ hideTitle, drawerOpen, theme }) => {\n const headerBg = theme.components['app-shell'].header.background;\n const headerFgColor = theme.components['app-shell'].header['foreground-color'];\n\n const foregroundColor = calculateForegroundColor(headerBg, headerFgColor);\n\n const hoverColors = getHoverColors(\n tryCatch(\n () => mix(0.01, theme.base.palette.interactive, headerBg),\n () => theme.base.palette.interactive\n )\n );\n\n return css`\n position: sticky;\n z-index: calc(${theme.base['z-index'].backdrop} - 1);\n ${drawerOpen &&\n css`\n z-index: calc(${theme.base['z-index'].backdrop} - 2);\n `}\n top: 0;\n gap: ${theme.base.spacing};\n max-width: 100%;\n height: ${headerHeight};\n background: ${headerBg};\n color: ${foregroundColor};\n border-bottom: solid 0.0625rem ${theme.components['app-shell'].header['border-color']};\n\n ${StyledAppHeaderInfo} {\n justify-self: flex-start;\n min-width: 33vw;\n\n ${hideTitle &&\n css`\n min-width: fit-content;\n `}\n }\n\n ${StyledSearchFiltersButton} {\n color: ${foregroundColor};\n }\n\n > ${StyledAppHeaderOperator} {\n justify-self: flex-end;\n\n + ${StyledPopover} {\n &,\n ${StyledMenuListContainer} {\n background: ${headerBg};\n }\n\n ${StyledMenuListContainer} li {\n color: ${foregroundColor};\n background-color: transparent;\n\n &:hover,\n &[data-current='true'] {\n color: ${hoverColors.foreground};\n background-color: ${hoverColors.background};\n }\n }\n }\n }\n `;\n }\n);\n\nStyledAppHeader.defaultProps = defaultThemeProp;\n"]}
1
+ {"version":3,"file":"AppHeader.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppHeader.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { mix, rgba, transparentize } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport {\n calculateFontSize,\n getHoverColors,\n calculateForegroundColor,\n type FontSize\n} from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport { StyledImage } from '../Image';\nimport { StyledMenuListContainer } from '../Menu/Menu.styles';\nimport { StyledPopover } from '../Popover';\nimport { StyledSearchInput } from '../SearchInput';\nimport {\n StyledSearchButton,\n StyledSearchFiltersButton,\n StyledSearchTextInput\n} from '../SearchInput/SearchInput.styles';\nimport Text from '../Text';\nimport type { TextProps } from '../Text';\nimport { StyledVisuallyHiddenText } from '../VisuallyHiddenText/VisuallyHiddenText';\n\nimport { headerHeight, navWidth } from './AppShell.styles';\n\nexport const StyledContextSwitcher = styled.div(({ theme }) => {\n return css`\n width: calc(${navWidth} - 2 * ${theme.base.spacing});\n `;\n});\n\nStyledContextSwitcher.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderInfo = styled.div<{ centerLogo: boolean }>(({ centerLogo, theme }) => {\n return css`\n & > :first-child {\n vertical-align: top;\n }\n\n & > :is(a, button) {\n cursor: pointer;\n text-decoration: none;\n user-select: none;\n -webkit-user-select: none;\n }\n\n & > :is(a, button):focus {\n box-shadow: ${theme.base.shadow.focus};\n outline: none;\n }\n\n ${StyledImage} {\n height: 1.0725rem;\n\n ${centerLogo &&\n css`\n padding-inline-start: ${theme.base.spacing};\n `}\n }\n `;\n});\n\nStyledAppHeaderInfo.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderSearchForm = styled.form<{ isMediumOrAbove: boolean }>(\n ({\n isMediumOrAbove,\n theme: {\n base: { animation },\n components: {\n 'app-shell': { header }\n }\n }\n }) => {\n const {\n background: headerBg,\n 'search-input': {\n 'background-color': searchInputBg,\n 'foreground-color': searchInputFg,\n 'border-color': searchInputBorder\n }\n } = header;\n\n const searchBg = searchInputBg;\n const searchFg = calculateForegroundColor(headerBg, searchInputFg);\n const searchBorder = calculateForegroundColor(headerBg, searchInputBorder);\n\n return css`\n max-width: 33vw;\n min-width: 10rem;\n width: 100%;\n justify-self: center;\n margin-inline-start: 0;\n margin-inline-end: auto;\n transition: max-width ${animation.speed} ${animation.timing.ease};\n\n ${StyledSearchInput} input::placeholder {\n color: ${transparentize(0.4, searchFg)};\n }\n\n ${!isMediumOrAbove &&\n css`\n max-width: 75%;\n min-width: 2rem;\n margin-inline-start: auto;\n\n &:focus-within {\n min-width: 10rem;\n }\n `}\n &:not([focused]) {\n ${StyledSearchInput} {\n background: ${searchBg};\n border-color: ${searchBorder};\n ${StyledSearchButton} {\n background: ${searchBg};\n color: ${searchFg};\n border-color: ${searchBorder};\n }\n\n ${StyledSearchTextInput} {\n background: ${searchBg};\n color: ${searchFg};\n border-color: ${searchBorder};\n }\n\n ${StyledSearchFiltersButton} {\n background: ${searchBg};\n color: ${searchFg};\n border-color: ${searchBorder};\n }\n }\n }\n `;\n }\n);\n\nStyledAppHeaderSearchForm.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderSpacer = styled.div`\n margin: auto;\n`;\n\nexport const StyledAppHeaderLogo = styled.div(({ theme }) => {\n return css`\n max-width: min(${theme.base['content-width'].sm}, 25vw);\n `;\n});\nStyledAppHeaderLogo.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderText = styled(Text)<{ variant: TextProps['variant'] }>(({\n theme,\n variant\n}) => {\n const headerBg = theme.components['app-shell'].header.background;\n const headerFgColor = theme.components['app-shell'].header['foreground-color'];\n\n const foregroundColor =\n theme.components['app-shell'].header['app-name-color'] === 'auto'\n ? calculateForegroundColor(headerBg, headerFgColor)\n : theme.components['app-shell'].header['app-name-color'];\n\n const secondaryColor = tryCatch(() =>\n rgba(\n foregroundColor ?? theme.base.palette['foreground-color'],\n theme.base.transparency['transparent-2']\n )\n );\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n color: ${variant === 'secondary' ? secondaryColor : foregroundColor};\n font-family: ${theme.components.text['brand-primary']['font-family']};\n\n ${variant === 'primary' &&\n css`\n font-size: ${fontSize[theme.components.text['brand-primary']['font-size'] as FontSize]};\n font-weight: ${theme.components.text['brand-primary']['font-weight']};\n `}\n\n ${variant === 'secondary' &&\n css`\n display: inline;\n font-size: ${fontSize};\n align-self: flex-end;\n\n &:not(${StyledVisuallyHiddenText}) + & {\n margin-inline-start: ${theme.base.spacing};\n }\n `}\n `;\n});\n\nStyledAppHeaderText.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeaderOperator = styled.button(\n ({ theme }) => css`\n border-radius: 50%;\n\n :focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n `\n);\n\nStyledAppHeaderOperator.defaultProps = defaultThemeProp;\n\nexport const StyledAppHeader = styled.header<{ hideTitle: boolean; drawerOpen: boolean }>(\n ({ hideTitle, drawerOpen, theme }) => {\n const headerBg = theme.components['app-shell'].header.background;\n const headerFgColor = theme.components['app-shell'].header['foreground-color'];\n\n const foregroundColor = calculateForegroundColor(headerBg, headerFgColor);\n\n const hoverColors = getHoverColors(\n tryCatch(\n () => mix(0.01, theme.base.palette.interactive, headerBg),\n () => theme.base.palette.interactive\n )\n );\n\n return css`\n position: sticky;\n z-index: calc(${theme.base['z-index'].backdrop} - 1);\n ${drawerOpen &&\n css`\n z-index: calc(${theme.base['z-index'].backdrop} - 2);\n `}\n top: 0;\n gap: ${theme.base.spacing};\n max-width: 100%;\n height: ${headerHeight};\n background: ${headerBg};\n color: ${foregroundColor};\n border-bottom: solid 0.0625rem ${theme.components['app-shell'].header['border-color']};\n\n ${StyledAppHeaderInfo} {\n justify-self: flex-start;\n min-width: 33vw;\n\n ${hideTitle &&\n css`\n min-width: fit-content;\n `}\n }\n\n ${StyledSearchFiltersButton} {\n color: ${foregroundColor};\n }\n\n > ${StyledAppHeaderOperator} {\n justify-self: flex-end;\n\n + ${StyledPopover} {\n &,\n ${StyledMenuListContainer} {\n background: ${headerBg};\n }\n\n ${StyledMenuListContainer} li {\n color: ${foregroundColor};\n background-color: transparent;\n\n &:hover,\n &[data-current='true'] {\n color: ${hoverColors.foreground};\n background-color: ${hoverColors.background};\n }\n }\n }\n }\n `;\n }\n);\n\nStyledAppHeader.defaultProps = defaultThemeProp;\n"]}
@@ -417,7 +417,6 @@ export declare const StyledFieldGroupContent: import("styled-components/dist/typ
417
417
  export declare const StyledFieldGroupLegend: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, Pick<FieldGroupProps, "collapsed">>> & string;
418
418
  export declare const StyledFieldGroup: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, never>> & string;
419
419
  export declare const StyledGroupContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
420
- collapsed?: boolean;
421
420
  border?: boolean;
422
421
  }>> & string;
423
422
  export declare const StyledDescription: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("../HTML").HTMLProps, "ref"> & import("react").RefAttributes<HTMLDivElement> & import("../../types").ForwardProps, "ref"> & {
@@ -1 +1 @@
1
- {"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAW7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAG7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA+B,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAK1F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAK7D,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG;IACxC,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,2CAA2C;IAC3C,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC,GAAG,CACE;IACE,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,gDAAgD;IAChD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wCAAwC;IACxC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,4DAA4D;IAC5D,cAAc,CAAC,EAAE;QACf,OAAO,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;QACzC,OAAO,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;KAC1C,CAAC;IACF,gDAAgD;IAChD,OAAO,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IAChC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAChC,GACD;IACE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,eAAe,CAAC,EAAE,KAAK,CAAC;IACxB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CACJ,CAAC;AAgCJ,eAAO,MAAM,oBAAoB,+NAAgB,CAAC;AAElD,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oLAE7B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oLAAiB,CAAC;AAEtD,eAAO,MAAM,sBAAsB,6QA+BlC,CAAC;AAIF,eAAO,MAAM,gBAAgB,+OAiC5B,CAAC;AAIF,eAAO,MAAM,oBAAoB;gBAA4B,OAAO;aAAW,OAAO;YA+BrF,CAAC;AAiCF,eAAO,MAAM,iBAAiB;;;;iDAI7B,CAAC;AAEF,QAAA,MAAM,UAAU,EAAE,+BAA+B,CAAC,eAAe,CA2F/D,CAAC;AAEH,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAW7D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAG7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,OAAO,KAAK,EAAE,SAAS,EAAE,+BAA+B,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAK1F,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAK7D,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG;IACxC,sCAAsC;IACtC,QAAQ,EAAE,SAAS,CAAC;IACpB,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,2CAA2C;IAC3C,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC,GAAG,CACE;IACE,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,gDAAgD;IAChD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wCAAwC;IACxC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,4DAA4D;IAC5D,cAAc,CAAC,EAAE;QACf,OAAO,CAAC,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;QACzC,OAAO,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;KAC1C,CAAC;IACF,gDAAgD;IAChD,OAAO,CAAC,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC;IAChC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAChC,GACD;IACE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,eAAe,CAAC,EAAE,KAAK,CAAC;IACxB,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC;IACvB,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CACJ,CAAC;AAgCJ,eAAO,MAAM,oBAAoB,+NAAgB,CAAC;AAElD,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oLAE7B,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oLAAiB,CAAC;AAEtD,eAAO,MAAM,sBAAsB,6QA+BlC,CAAC;AAIF,eAAO,MAAM,gBAAgB,+OAiC5B,CAAC;AAIF,eAAO,MAAM,oBAAoB;aAAyB,OAAO;YAkB/D,CAAC;AAiCH,eAAO,MAAM,iBAAiB;;;;iDAI7B,CAAC;AAEF,QAAA,MAAM,UAAU,EAAE,+BAA+B,CAAC,eAAe,CA2F/D,CAAC;AAEH,eAAe,UAAU,CAAC"}
@@ -84,24 +84,15 @@ export const StyledFieldGroup = styled.fieldset(({ theme: { base: { 'font-size':
84
84
  `;
85
85
  });
86
86
  StyledFieldGroup.defaultProps = defaultThemeProp;
87
- export const StyledGroupContainer = styled.div(({ theme, collapsed, border }) => {
88
- const { base: { animation: { speed, timing }, palette: { 'border-line': borderColor }, spacing, 'border-radius': baseBorderRadius }, components: { 'form-control': { 'border-width': borderWidth } } } = theme;
87
+ export const StyledGroupContainer = styled.div(({ theme, border }) => {
88
+ const { base: { palette: { 'border-line': borderColor }, spacing, 'border-radius': baseBorderRadius }, components: { 'form-control': { 'border-width': borderWidth } } } = theme;
89
89
  if (!border)
90
90
  return null;
91
- const showBorder = !collapsed;
92
91
  return css `
93
- padding: ${spacing};
94
- border-radius: calc(${baseBorderRadius} / 2);
95
- border: ${borderWidth} solid transparent;
96
- transition-property: border-color;
97
- transition-duration: ${speed};
98
- transition-timing-function: ${timing.ease};
99
-
100
- ${showBorder &&
101
- css `
102
- border-color: ${borderColor};
103
- `}
104
- `;
92
+ padding: ${spacing};
93
+ border-radius: calc(${baseBorderRadius} / 2);
94
+ border: ${borderWidth} solid ${borderColor};
95
+ `;
105
96
  });
106
97
  StyledGroupContainer.defaultProps = defaultThemeProp;
107
98
  // Components
@@ -117,7 +108,7 @@ const FieldGroup = forwardRef(function FieldGroup({ children, description, banne
117
108
  const t = useI18n();
118
109
  const uid = useUID();
119
110
  const descAndChildren = (_jsxs(StyledFieldGroupContent, { container: { cols: 'minmax(0, 1fr)', gap: 2 }, children: [banner && _jsx(Banner, { ...banner }), description && (_jsx(StyledDescription, { id: `${uid}-description`, forwardedAs: 'p', content: description })), _jsx("div", { children: children })] }));
120
- return (_jsx(StyledGroupContainer, { border: variant === 'form-group', collapsed: collapsed, children: _jsxs(StyledFieldGroup, { "aria-label": contextualLabel || name, "aria-describedby": description ? `${uid}-description` : undefined, as: name ? 'fieldset' : 'div', ...restProps, ref: ref, children: [name && (_jsx(FieldGroupLegend, { collapsed: collapsed, actions: actions, additionalInfo: additionalInfo, name: name, contextualLabel: contextualLabel, children: typeof collapsed === 'boolean' ? (_jsx(StyledExpandButton, { type: 'button', variant: 'text', onClick: () => {
111
+ return (_jsx(StyledGroupContainer, { border: variant === 'form-group', children: _jsxs(StyledFieldGroup, { "aria-label": contextualLabel || name, "aria-describedby": description ? `${uid}-description` : undefined, as: name ? 'fieldset' : 'div', ...restProps, ref: ref, children: [name && (_jsx(FieldGroupLegend, { collapsed: collapsed, actions: actions, additionalInfo: additionalInfo, name: name, contextualLabel: contextualLabel, children: typeof collapsed === 'boolean' ? (_jsx(StyledExpandButton, { type: 'button', variant: 'text', onClick: () => {
121
112
  onToggleCollapsed?.();
122
113
  }, "aria-expanded": !collapsed, "aria-label": t(collapsed ? 'expand_noun' : 'collapse_noun', [
123
114
  contextualLabel || name