@pega/cosmos-react-core 7.0.0-build.5.0 → 7.0.0-build.6.1

package/lib/components/File/FileInput.d.ts

@@ -14,6 +14,11 @@ export interface FileInputProps extends BaseProps, NoChildrenProp, TestIdProp {
     multiple?: boolean;
     /** An array of files that have been uploaded. */
     files?: FileItemProps[];
+    /**
+     * Specify allowed file types.
+     * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept}
+     */
+    accept?: string | string[];
     /**
      * Sets DOM id for the control and associates label element via 'for' attribute.
      * If an id is not pass, a random id will be generated for any render.

package/lib/components/File/FileInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileInput.d.ts","sourceRoot":"","sources":["../../../src/components/File/FileInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,GAAG,EAA2C,MAAM,OAAO,CAAC;AAI7F,OAAO,KAAK,EACV,SAAS,EACT,YAAY,EACZ,cAAc,EAEd,UAAU,EACX,MAAM,aAAa,CAAC;AAUrB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAWvD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAOhD,MAAM,WAAW,cAAe,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IAC3E,qEAAqE;IACrE,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACvC;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iDAAiD;IACjD,KAAK,CAAC,EAAE,aAAa,EAAE,CAAC;IACxB;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,sEAAsE;IACtE,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,eAAO,MAAM,cAAc;cAAmC,OAAO;SAYnE,CAAC;AAEH,eAAO,MAAM,eAAe,wMAkB3B,CAAC;;;;AAsJF,wBAA2D"}
+{"version":3,"file":"FileInput.d.ts","sourceRoot":"","sources":["../../../src/components/File/FileInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,GAAG,EAA2C,MAAM,OAAO,CAAC;AAI7F,OAAO,KAAK,EACV,SAAS,EACT,YAAY,EACZ,cAAc,EAEd,UAAU,EACX,MAAM,aAAa,CAAC;AAUrB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAWvD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAOhD,MAAM,WAAW,cAAe,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IAC3E,qEAAqE;IACrE,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IACvC;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iDAAiD;IACjD,KAAK,CAAC,EAAE,aAAa,EAAE,CAAC;IACxB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC3B;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,sEAAsE;IACtE,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,eAAO,MAAM,cAAc;cAAmC,OAAO;SAYnE,CAAC;AAEH,eAAO,MAAM,eAAe,wMAkB3B,CAAC;;;;AAwJF,wBAA2D"}

package/lib/components/File/FileInput.js

@@ -55,7 +55,7 @@ const StyledInteractiveText = styled.span(({ theme }) => {
 StyledInteractiveText.defaultProps = defaultThemeProp;
 const FileInput = forwardRef(function FileInput(props, ref) {
     const uid = useUID();
-    const { testId, id = uid, label, labelHidden, info, required = false, disabled = false, files, onFilesAdded, multiple = false, status, additionalInfo, ...restProps } = props;
+    const { testId, id = uid, label, labelHidden, info, required = false, disabled = false, files, onFilesAdded, multiple = false, status, additionalInfo, accept, ...restProps } = props;
     const { base: { 'content-width': { md } } } = useTheme();
     const testIds = useTestIds(testId, getFileInputTestIds);
     const icon = _jsx(Icon, { name: 'paper-clip' });
@@ -78,7 +78,7 @@ const FileInput = forwardRef(function FileInput(props, ref) {
     const t = useI18n();
     const [dragOver, setDragOver] = useState(false);
     const { ltr, rtl } = useDirection();
-    const fileInput = (_jsxs(StyledFileInput, { children: [_jsx("input", { "data-testid": testIds.control, ...restProps, ref: inputRef, type: 'file', id: id, disabled: disabled, onChange: onChange, multiple: multiple }), _jsxs(Flex, { container: { alignItems: 'center', justify: 'center' }, item: { grow: 1 }, as: StyledDropZone, dragOver: dragOver, onClick: () => {
+    const fileInput = (_jsxs(StyledFileInput, { children: [_jsx("input", { "data-testid": testIds.control, ...restProps, ref: inputRef, type: 'file', id: id, disabled: disabled, onChange: onChange, multiple: multiple, accept: Array.isArray(accept) ? accept.join(',') : accept }), _jsxs(Flex, { container: { alignItems: 'center', justify: 'center' }, item: { grow: 1 }, as: StyledDropZone, dragOver: dragOver, onClick: () => {
                     inputRef.current?.focus();
                     inputRef.current?.click();
                 }, onDragOver: (e) => {

package/lib/components/File/FileInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileInput.js","sourceRoot":"","sources":["../../../src/components/File/FileInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useState } from 'react';\nimport type { FunctionComponent, Ref, ChangeEvent, PropsWithoutRef, DragEvent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { hideVisually } from 'polished';\n\nimport type {\n  BaseProps,\n  ForwardProps,\n  NoChildrenProp,\n  PropsWithDefaults,\n  TestIdProp\n} from '../../types';\nimport {\n  useConsolidatedRef,\n  useI18n,\n  useUID,\n  useDirection,\n  useTestIds,\n  useTheme\n} from '../../hooks';\nimport FormControl from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport Icon, { registerIcon } from '../Icon';\nimport * as paperClipIcon from '../Icon/icons/paper-clip.icon';\nimport FormField from '../FormField';\nimport Grid from '../Grid';\nimport { withTestIds } from '../../utils';\n\nimport FileItem from './FileItem';\nimport type { FileItemProps } from './FileItem';\nimport { getFileInputTestIds } from './File.test-ids';\n\nregisterIcon(paperClipIcon);\n\ntype FileInputPropsWithDefaults = PropsWithDefaults<FileInputProps>;\n\nexport interface FileInputProps extends BaseProps, NoChildrenProp, TestIdProp {\n  /** Called when files are added either via the input or drop zone. */\n  onFilesAdded?: (files: File[]) => void;\n  /**\n   * Allow multiple files to be selected from the OS specific file browser.\n   * NOTE: This does not restrict multiple files from being added via drag and drop.\n   * Restrict multi file drag and drop via onFilesAdded and custom info message.\n   * @default false\n   */\n  multiple?: boolean;\n  /** An array of files that have been uploaded. */\n  files?: FileItemProps[];\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /** Visually hides the label region. */\n  labelHidden?: FormControlProps['labelHidden'];\n  /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n  info?: FormControlProps['info'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Pass a heading and content to show additional information on the field. */\n  additionalInfo?: FormControlProps['additionalInfo'];\n  /** Ref for the input element within the component's dom structure. */\n  ref?: Ref<HTMLInputElement>;\n}\n\nexport const StyledDropZone = styled(FormControl)<{ dragOver: boolean }>(({ dragOver, theme }) => {\n  return css`\n    padding: calc(2 * ${theme.base.spacing});\n    min-height: 4rem;\n    border-style: dashed;\n    cursor: pointer;\n\n    ${dragOver &&\n    css`\n      border-style: solid;\n    `}\n  `;\n});\n\nexport const StyledFileInput = styled.div<FileInputPropsWithDefaults & ForwardProps>(\n  ({ theme }) => {\n    return css`\n      position: relative;\n\n      input {\n        ${hideVisually}\n      }\n\n      input:enabled:focus + ${StyledDropZone} {\n        box-shadow: ${theme.components['form-control'][':focus']['box-shadow']};\n      }\n\n      input[hidden] + ${StyledDropZone} {\n        display: none;\n      }\n    `;\n  }\n);\n\nStyledFileInput.defaultProps = defaultThemeProp;\n\nconst StyledInteractiveText = styled.span(({ theme }) => {\n  return css`\n    color: ${theme.base.palette.interactive};\n  `;\n});\n\nStyledInteractiveText.defaultProps = defaultThemeProp;\n\nconst FileInput: FunctionComponent<FileInputProps & ForwardProps> = forwardRef(function FileInput(\n  props: PropsWithoutRef<FileInputProps>,\n  ref: FileInputProps['ref']\n) {\n  const uid = useUID();\n  const {\n    testId,\n    id = uid,\n    label,\n    labelHidden,\n    info,\n    required = false,\n    disabled = false,\n    files,\n    onFilesAdded,\n    multiple = false,\n    status,\n    additionalInfo,\n    ...restProps\n  } = props;\n\n  const {\n    base: {\n      'content-width': { md }\n    }\n  } = useTheme();\n\n  const testIds = useTestIds(testId, getFileInputTestIds);\n\n  const icon = <Icon name='paper-clip' />;\n  const inputRef = useConsolidatedRef(ref);\n\n  const onChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement>) => {\n      if (e.target.files) {\n        onFilesAdded?.(Array.from(e.target.files));\n      }\n      /**\n       * WHY are we doing this?\n       * We are not working with the \"value\" prop of the input but rather the File instances that are created.\n       * The consumer of this component should manage an array or File(s) and allow for a user to remove a selected file.\n       * Since we can not modify the input value of files for browser security reasons,\n       * and since setting the files property is less than ideal, we reset/toggle the input to a fresh state after a render.\n       * This enables onChange to fire even if the user had just previously selected a file, removed it, and selected it again.\n       */\n      if (inputRef.current) inputRef.current.value = '';\n    },\n    [onFilesAdded]\n  );\n\n  const t = useI18n();\n  const [dragOver, setDragOver] = useState(false);\n  const { ltr, rtl } = useDirection();\n\n  const fileInput = (\n    <StyledFileInput>\n      <input\n        data-testid={testIds.control}\n        {...restProps}\n        ref={inputRef}\n        type='file'\n        id={id}\n        disabled={disabled}\n        onChange={onChange}\n        multiple={multiple}\n      />\n      <Flex\n        container={{ alignItems: 'center', justify: 'center' }}\n        item={{ grow: 1 }}\n        as={StyledDropZone}\n        dragOver={dragOver}\n        onClick={() => {\n          inputRef.current?.focus();\n          inputRef.current?.click();\n        }}\n        onDragOver={(e: DragEvent<HTMLDivElement>) => {\n          e.preventDefault();\n        }}\n        onDragEnter={() => setDragOver(true)}\n        onDragLeave={() => setDragOver(false)}\n        onDrop={(e: DragEvent<HTMLDivElement>) => {\n          e.preventDefault();\n          setDragOver(false);\n          onFilesAdded?.(Array.from(e.dataTransfer.files));\n        }}\n      >\n        {ltr && icon}\n        <Text variant='primary'>\n          &nbsp;\n          {t('file_upload_text_main', [\n            <StyledInteractiveText>\n              {t(multiple ? 'file_upload_text_multiple' : 'file_upload_text_one')}\n            </StyledInteractiveText>\n          ])}\n          &nbsp;\n        </Text>\n        {rtl && icon}\n      </Flex>\n    </StyledFileInput>\n  );\n\n  return (\n    <Grid container={{ rowGap: 1 }}>\n      {label ? (\n        <FormField\n          testId={testIds}\n          label={label}\n          labelHidden={labelHidden}\n          id={id}\n          info={info}\n          required={required}\n          disabled={disabled}\n          status={status}\n          additionalInfo={additionalInfo}\n        >\n          {fileInput}\n        </FormField>\n      ) : (\n        fileInput\n      )}\n      {!!files?.length && (\n        <Grid\n          data-testid={testIds.files}\n          container={{\n            gap: 1,\n            cols: `repeat(auto-fill, minmax(min(${md}, 100%), 1fr));`\n          }}\n          as='ul'\n        >\n          {files.map(file => {\n            return <FileItem {...file} key={file.id} />;\n          })}\n        </Grid>\n      )}\n    </Grid>\n  );\n});\n\nexport default withTestIds(FileInput, getFileInputTestIds);\n"]}
+{"version":3,"file":"FileInput.js","sourceRoot":"","sources":["../../../src/components/File/FileInput.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE1D,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AASxC,OAAO,EACL,kBAAkB,EAClB,OAAO,EACP,MAAM,EACN,YAAY,EACZ,UAAU,EACV,QAAQ,EACT,MAAM,aAAa,CAAC;AACrB,OAAO,WAAW,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,aAAa,MAAM,+BAA+B,CAAC;AAC/D,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAEtD,YAAY,CAAC,aAAa,CAAC,CAAC;AA8C5B,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,WAAW,CAAC,CAAwB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE;IAC/F,OAAO,GAAG,CAAA;wBACY,KAAK,CAAC,IAAI,CAAC,OAAO;;;;;MAKpC,QAAQ;QACV,GAAG,CAAA;;KAEF;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CACvC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACZ,OAAO,GAAG,CAAA;;;;UAIJ,YAAY;;;8BAGQ,cAAc;sBACtB,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC;;;wBAGtD,cAAc;;;KAGjC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhD,MAAM,qBAAqB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACtD,OAAO,GAAG,CAAA;aACC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW;GACxC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,SAAS,GAAqD,UAAU,CAAC,SAAS,SAAS,CAC/F,KAAsC,EACtC,GAA0B;IAE1B,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,EACJ,MAAM,EACN,EAAE,GAAG,GAAG,EACR,KAAK,EACL,WAAW,EACX,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,KAAK,EACL,YAAY,EACZ,QAAQ,GAAG,KAAK,EAChB,MAAM,EACN,cAAc,EACd,MAAM,EACN,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,EACJ,IAAI,EAAE,EACJ,eAAe,EAAE,EAAE,EAAE,EAAE,EACxB,EACF,GAAG,QAAQ,EAAE,CAAC;IAEf,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,mBAAmB,CAAC,CAAC;IAExD,MAAM,IAAI,GAAG,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,CAAC;IACxC,MAAM,QAAQ,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAEzC,MAAM,QAAQ,GAAG,WAAW,CAC1B,CAAC,CAAgC,EAAE,EAAE;QACnC,IAAI,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE;YAClB,YAAY,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;SAC5C;QACD;;;;;;;WAOG;QACH,IAAI,QAAQ,CAAC,OAAO;YAAE,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,EAAE,CAAC;IACpD,CAAC,EACD,CAAC,YAAY,CAAC,CACf,CAAC;IAEF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAChD,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAEpC,MAAM,SAAS,GAAG,CAChB,MAAC,eAAe,eACd,+BACe,OAAO,CAAC,OAAO,KACxB,SAAS,EACb,GAAG,EAAE,QAAQ,EACb,IAAI,EAAC,MAAM,EACX,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,GACzD,EACF,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,EACtD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EACjB,EAAE,EAAE,cAAc,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;oBAC1B,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;gBAC5B,CAAC,EACD,UAAU,EAAE,CAAC,CAA4B,EAAE,EAAE;oBAC3C,CAAC,CAAC,cAAc,EAAE,CAAC;gBACrB,CAAC,EACD,WAAW,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,EACpC,WAAW,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EACrC,MAAM,EAAE,CAAC,CAA4B,EAAE,EAAE;oBACvC,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,WAAW,CAAC,KAAK,CAAC,CAAC;oBACnB,YAAY,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC;gBACnD,CAAC,aAEA,GAAG,IAAI,IAAI,EACZ,MAAC,IAAI,IAAC,OAAO,EAAC,SAAS,uBAEpB,CAAC,CAAC,uBAAuB,EAAE;gCAC1B,KAAC,qBAAqB,cACnB,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,sBAAsB,CAAC,GAC7C;6BACzB,CAAC,cAEG,EACN,GAAG,IAAI,IAAI,IACP,IACS,CACnB,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,aAC3B,KAAK,CAAC,CAAC,CAAC,CACP,KAAC,SAAS,IACR,MAAM,EAAE,OAAO,EACf,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,cAAc,YAE7B,SAAS,GACA,CACb,CAAC,CAAC,CAAC,CACF,SAAS,CACV,EACA,CAAC,CAAC,KAAK,EAAE,MAAM,IAAI,CAClB,KAAC,IAAI,mBACU,OAAO,CAAC,KAAK,EAC1B,SAAS,EAAE;oBACT,GAAG,EAAE,CAAC;oBACN,IAAI,EAAE,gCAAgC,EAAE,iBAAiB;iBAC1D,EACD,EAAE,EAAC,IAAI,YAEN,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;oBAChB,OAAO,eAAC,QAAQ,OAAK,IAAI,EAAE,GAAG,EAAE,IAAI,CAAC,EAAE,GAAI,CAAC;gBAC9C,CAAC,CAAC,GACG,CACR,IACI,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC,SAAS,EAAE,mBAAmB,CAAC,CAAC","sourcesContent":["import { forwardRef, useCallback, useState } from 'react';\nimport type { FunctionComponent, Ref, ChangeEvent, PropsWithoutRef, DragEvent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { hideVisually } from 'polished';\n\nimport type {\n  BaseProps,\n  ForwardProps,\n  NoChildrenProp,\n  PropsWithDefaults,\n  TestIdProp\n} from '../../types';\nimport {\n  useConsolidatedRef,\n  useI18n,\n  useUID,\n  useDirection,\n  useTestIds,\n  useTheme\n} from '../../hooks';\nimport FormControl from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport { defaultThemeProp } from '../../theme';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport Icon, { registerIcon } from '../Icon';\nimport * as paperClipIcon from '../Icon/icons/paper-clip.icon';\nimport FormField from '../FormField';\nimport Grid from '../Grid';\nimport { withTestIds } from '../../utils';\n\nimport FileItem from './FileItem';\nimport type { FileItemProps } from './FileItem';\nimport { getFileInputTestIds } from './File.test-ids';\n\nregisterIcon(paperClipIcon);\n\ntype FileInputPropsWithDefaults = PropsWithDefaults<FileInputProps>;\n\nexport interface FileInputProps extends BaseProps, NoChildrenProp, TestIdProp {\n  /** Called when files are added either via the input or drop zone. */\n  onFilesAdded?: (files: File[]) => void;\n  /**\n   * Allow multiple files to be selected from the OS specific file browser.\n   * NOTE: This does not restrict multiple files from being added via drag and drop.\n   * Restrict multi file drag and drop via onFilesAdded and custom info message.\n   * @default false\n   */\n  multiple?: boolean;\n  /** An array of files that have been uploaded. */\n  files?: FileItemProps[];\n  /**\n   * Specify allowed file types.\n   * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept}\n   */\n  accept?: string | string[];\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /** Visually hides the label region. */\n  labelHidden?: FormControlProps['labelHidden'];\n  /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n  info?: FormControlProps['info'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Pass a heading and content to show additional information on the field. */\n  additionalInfo?: FormControlProps['additionalInfo'];\n  /** Ref for the input element within the component's dom structure. */\n  ref?: Ref<HTMLInputElement>;\n}\n\nexport const StyledDropZone = styled(FormControl)<{ dragOver: boolean }>(({ dragOver, theme }) => {\n  return css`\n    padding: calc(2 * ${theme.base.spacing});\n    min-height: 4rem;\n    border-style: dashed;\n    cursor: pointer;\n\n    ${dragOver &&\n    css`\n      border-style: solid;\n    `}\n  `;\n});\n\nexport const StyledFileInput = styled.div<FileInputPropsWithDefaults & ForwardProps>(\n  ({ theme }) => {\n    return css`\n      position: relative;\n\n      input {\n        ${hideVisually}\n      }\n\n      input:enabled:focus + ${StyledDropZone} {\n        box-shadow: ${theme.components['form-control'][':focus']['box-shadow']};\n      }\n\n      input[hidden] + ${StyledDropZone} {\n        display: none;\n      }\n    `;\n  }\n);\n\nStyledFileInput.defaultProps = defaultThemeProp;\n\nconst StyledInteractiveText = styled.span(({ theme }) => {\n  return css`\n    color: ${theme.base.palette.interactive};\n  `;\n});\n\nStyledInteractiveText.defaultProps = defaultThemeProp;\n\nconst FileInput: FunctionComponent<FileInputProps & ForwardProps> = forwardRef(function FileInput(\n  props: PropsWithoutRef<FileInputProps>,\n  ref: FileInputProps['ref']\n) {\n  const uid = useUID();\n  const {\n    testId,\n    id = uid,\n    label,\n    labelHidden,\n    info,\n    required = false,\n    disabled = false,\n    files,\n    onFilesAdded,\n    multiple = false,\n    status,\n    additionalInfo,\n    accept,\n    ...restProps\n  } = props;\n\n  const {\n    base: {\n      'content-width': { md }\n    }\n  } = useTheme();\n\n  const testIds = useTestIds(testId, getFileInputTestIds);\n\n  const icon = <Icon name='paper-clip' />;\n  const inputRef = useConsolidatedRef(ref);\n\n  const onChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement>) => {\n      if (e.target.files) {\n        onFilesAdded?.(Array.from(e.target.files));\n      }\n      /**\n       * WHY are we doing this?\n       * We are not working with the \"value\" prop of the input but rather the File instances that are created.\n       * The consumer of this component should manage an array or File(s) and allow for a user to remove a selected file.\n       * Since we can not modify the input value of files for browser security reasons,\n       * and since setting the files property is less than ideal, we reset/toggle the input to a fresh state after a render.\n       * This enables onChange to fire even if the user had just previously selected a file, removed it, and selected it again.\n       */\n      if (inputRef.current) inputRef.current.value = '';\n    },\n    [onFilesAdded]\n  );\n\n  const t = useI18n();\n  const [dragOver, setDragOver] = useState(false);\n  const { ltr, rtl } = useDirection();\n\n  const fileInput = (\n    <StyledFileInput>\n      <input\n        data-testid={testIds.control}\n        {...restProps}\n        ref={inputRef}\n        type='file'\n        id={id}\n        disabled={disabled}\n        onChange={onChange}\n        multiple={multiple}\n        accept={Array.isArray(accept) ? accept.join(',') : accept}\n      />\n      <Flex\n        container={{ alignItems: 'center', justify: 'center' }}\n        item={{ grow: 1 }}\n        as={StyledDropZone}\n        dragOver={dragOver}\n        onClick={() => {\n          inputRef.current?.focus();\n          inputRef.current?.click();\n        }}\n        onDragOver={(e: DragEvent<HTMLDivElement>) => {\n          e.preventDefault();\n        }}\n        onDragEnter={() => setDragOver(true)}\n        onDragLeave={() => setDragOver(false)}\n        onDrop={(e: DragEvent<HTMLDivElement>) => {\n          e.preventDefault();\n          setDragOver(false);\n          onFilesAdded?.(Array.from(e.dataTransfer.files));\n        }}\n      >\n        {ltr && icon}\n        <Text variant='primary'>\n          &nbsp;\n          {t('file_upload_text_main', [\n            <StyledInteractiveText>\n              {t(multiple ? 'file_upload_text_multiple' : 'file_upload_text_one')}\n            </StyledInteractiveText>\n          ])}\n          &nbsp;\n        </Text>\n        {rtl && icon}\n      </Flex>\n    </StyledFileInput>\n  );\n\n  return (\n    <Grid container={{ rowGap: 1 }}>\n      {label ? (\n        <FormField\n          testId={testIds}\n          label={label}\n          labelHidden={labelHidden}\n          id={id}\n          info={info}\n          required={required}\n          disabled={disabled}\n          status={status}\n          additionalInfo={additionalInfo}\n        >\n          {fileInput}\n        </FormField>\n      ) : (\n        fileInput\n      )}\n      {!!files?.length && (\n        <Grid\n          data-testid={testIds.files}\n          container={{\n            gap: 1,\n            cols: `repeat(auto-fill, minmax(min(${md}, 100%), 1fr));`\n          }}\n          as='ul'\n        >\n          {files.map(file => {\n            return <FileItem {...file} key={file.id} />;\n          })}\n        </Grid>\n      )}\n    </Grid>\n  );\n});\n\nexport default withTestIds(FileInput, getFileInputTestIds);\n"]}

package/lib/components/File/FileItem.js

@@ -82,7 +82,7 @@ const FileItem = forwardRef(function FileItem(props, ref) {
     const [metaTarget, setMetaTarget] = useElement();
     const { locale } = useConfiguration();
     const t = useI18n();
-    const uploading = progress && progress < 100;
+    const uploading = typeof progress === 'number' && progress < 100;
     const text = name || url;
     let metaMessage;
     if (uploading) {

package/lib/components/File/FileItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileItem.js","sourceRoot":"","sources":["../../../src/components/File/FileItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE7C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,IAAI,EAAE,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,OAAO,MAAM,YAAY,CAAC;AAEjC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AACpE,OAAO,OAAO,MAAM,YAAY,CAAC;AACjC,OAAO,QAAQ,MAAM,aAAa,CAAC;AACnC,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE/C,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AACnE,OAAO,UAAU,EAAE,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAgC5D,MAAM,eAAe,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACjD,OAAO,GAAG,CAAA;aACC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM;sCACA,KAAK,CAAC,IAAI,CAAC,OAAO;GACrD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhD,MAAM,kBAAkB,GAAG,GAAG,CAAA;;;;;CAK7B,CAAC;AAEF,MAAM,kBAAkB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA;IACrC,kBAAkB;CACrB,CAAC;AAEF,MAAM,eAAe,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;IAChC,kBAAkB;CACrB,CAAC;AAEF,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC,CAAqB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7E,OAAO,GAAG,CAAA;;;;MAIN,kBAAkB;MAClB,KAAK;QACP,GAAG,CAAA;eACQ,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM;KACnC;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAoB,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;IACtE,OAAO,GAAG,CAAA;2BACe,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;GAC/C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAC/B,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EACP,eAAe,EAAE,YAAY,EAC7B,OAAO,EACP,UAAU,EAAE,EAAE,OAAO,EAAE,EACxB,EACD,UAAU,EACX,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;kCACoB,YAAY;gCACd,OAAO,CAAC,aAAa,CAAC;0BAC5B,OAAO,CAAC,oBAAoB,CAAC;gBACvC,UAAU,CAAC,KAAK,CAAC,MAAM;wBACf,UAAU,CAAC,KAAK,CAAC,MAAM,mBAAmB,OAAO,MAAM,OAAO;UAC5E,kBAAkB;0CACc,OAAO;;;UAGvC,gBAAgB,OAAO,eAAe;;;;;iBAK/B,UAAU,CAAC,KAAK,CAAC,MAAM;;;KAGnC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,QAAQ,GAAqC,UAAU,CAAC,SAAS,QAAQ,CAC7E,KAAqC,EACrC,GAAyB;IAEzB,MAAM,EACJ,EAAE,EACF,IAAI,EACJ,GAAG,EACH,SAAS,EACT,MAAM,EACN,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,UAAU,EACV,QAAQ,EACR,QAAQ,EACR,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,UAAU,EAAE,CAAC;IACjD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,UAAU,EAAE,CAAC;IACjD,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACtC,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,SAAS,GAAG,QAAQ,IAAI,QAAQ,GAAG,GAAG,CAAC;IAE7C,MAAM,IAAI,GAAG,IAAI,IAAI,GAAG,CAAC;IAEzB,IAAI,WAAW,CAAC;IAEhB,IAAI,SAAS,EAAE;QACb,WAAW,GAAG,YAAY,CAAC,QAAQ,EAAE;YACnC,MAAM;YACN,OAAO,EAAE;gBACP,KAAK,EAAE,MAAM;gBACb,IAAI,EAAE,SAAS;gBACf,qBAAqB,EAAE,CAAC;aACzB;SACF,CAAC,CAAC;KACJ;SAAM,IAAI,KAAK,EAAE;QAChB,WAAW,GAAG,KAAK,CAAC;KACrB;IAED,MAAM,cAAc,GAAa;QAC/B,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE;QACpD,EAAE,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC,UAAU,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE;QAC9D,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE;KACxD;SACE,MAAM,CAAC,MAAM,CAAC,EAAE;QACf,OAAO,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;IAC1B,CAAC,CAAC;SACD,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAAC;QAC7C,EAAE,EAAE,UAAU;QACd,IAAI,EAAE,UAAU;QAChB,IAAI;QACJ,OAAO,EAAE,GAAG,EAAE;YACZ,IAAI,OAAO;gBAAE,OAAO,CAAC,EAAE,CAAC,CAAC;QAC3B,CAAC;KACF,CAAC,CAAC,CAAC;IAEN,IAAI,MAAM,CAAC;IAEX,IAAI,SAAS,EAAE;QACb,MAAM,GAAG,KAAC,QAAQ,IAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAC,QAAQ,EAAC,KAAK,EAAE,QAAQ,GAAI,CAAC;KAC1E;SAAM,IAAI,KAAK,EAAE;QAChB,MAAM,GAAG,KAAC,eAAe,IAAC,IAAI,EAAC,YAAY,GAAG,CAAC;KAChD;SAAM;QACL,MAAM,GAAG,MAAM,IAAI,CACjB,KAAC,UAAU,IACT,IAAI,EAAE,MAAM,KAAK,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,mBAAmB,CAAC,mBAAmB,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,EACxF,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACjD,gBAAgB,EAAE,GAAG,EAAE;gBACrB,iBAAiB,CAAC,IAAI,CAAC,CAAC;YAC1B,CAAC,GACD,CACH,CAAC;KACH;IAED,OAAO,CACL,MAAC,IAAI,IACH,EAAE,EAAE,cAAc,EAClB,SAAS,EAAE;YACT,GAAG,EAAE,CAAC,SAAS,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,CAAC;YAC3C,UAAU,EAAE,QAAQ;YACpB,OAAO,EAAE,OAAO;YAChB,GAAG,EAAE,CAAC;SACP,EACD,GAAG,EAAE,GAAG,aAEP,MAAM,EAEN,SAAS,IAAI,CAAC,CAAC,KAAK,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,CACpC,MAAC,MAAM,OACD,SAAS,EACb,EAAE,EAAE,kBAAkB,EACtB,OAAO,EAAC,MAAM,EACd,GAAG,EAAE,aAAa,EAClB,OAAO,EAAE,GAAG,EAAE;oBACZ,SAAS,CAAC,EAAE,CAAC,CAAC;gBAChB,CAAC,gBACW,CAAC,CAAC,cAAc,EAAE,CAAC,IAAI,CAAC,CAAC,aAEpC,IAAI,EACJ,MAAM,KAAK,KAAK,IAAI,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,IAClC,CACV,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,OAAK,SAAS,EAAE,EAAE,EAAE,eAAe,EAAE,GAAG,EAAE,aAAa,YACzD,IAAI,GACA,CACR,EACA,WAAW,IAAI,CACd,8BACE,KAAC,IAAI,IAAC,EAAE,EAAE,UAAU,EAAE,OAAO,EAAC,WAAW,EAAC,KAAK,EAAE,KAAK,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE,aAAa,YACrF,WAAW,GACP,EAEN,UAAU,IAAI,CACb,KAAC,OAAO,IAAC,MAAM,EAAE,UAAU,EAAE,cAAc,EAAE,KAAK,EAAE,KAAK,kBACtD,WAAW,GACJ,CACX,IACA,CACJ,EAEA,CAAC,KAAK,IAAI,SAAS,CAAC,IAAI,QAAQ,IAAI,CACnC,KAAC,oBAAoB,IAAC,IAAI,EAAE,CAAC,CAAC,WAAW,YACvC,KAAC,MAAM,IACL,KAAK,EAAE,CAAC,CAAC,QAAQ,CAAC,gBACN,GAAG,CAAC,CAAC,QAAQ,CAAC,MAAM,IAAI,EAAE,EACtC,OAAO,EAAC,QAAQ,EAChB,OAAO,QACP,IAAI,QACJ,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,YAE3B,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,GACY,CACxB,EAEA,CAAC,CAAC,KAAK,IAAI,SAAS,CAAC,IAAI,CAAC,CAAC,cAAc,CAAC,MAAM,IAAI,CACnD,KAAC,oBAAoB,IAAC,IAAI,EAAE,CAAC,CAAC,WAAW,YACvC,KAAC,OAAO,IAAC,KAAK,EAAE,cAAc,EAAE,OAAO,QAAC,QAAQ,QAAC,eAAe,EAAE,IAAI,GAAI,GACrD,CACxB,EAEA,UAAU,IAAI,CACb,KAAC,OAAO,IAAC,MAAM,EAAE,UAAU,EAAE,KAAK,QAAC,cAAc,EAAE,KAAK,YACrD,IAAI,GACG,CACX,IACI,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC","sourcesContent":["import { forwardRef, useState } from 'react';\nimport type { PropsWithoutRef, FC, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Text, { StyledText } from '../Text';\nimport Icon from '../Icon';\nimport Tooltip from '../Tooltip';\nimport type { ForwardProps, BaseProps, Action } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Button from '../Button';\nimport { useI18n, useElement, useConfiguration } from '../../hooks';\nimport Actions from '../Actions';\nimport Progress from '../Progress';\nimport { StyledProgressRing } from '../Progress/Progress.styles';\nimport { formatNumber } from '../Number';\nimport Flex from '../Flex';\nimport { StyledIconShape } from '../Icon/Icon';\n\nimport { getKindFromMimeType, getMimeTypeFromFile } from './utils';\nimport FileVisual, { StyledFileVisual } from './FileVisual';\nimport type { FileVisualProps } from './FileVisual';\n\nexport interface FileItemProps extends BaseProps {\n  /** Unique id for item. */\n  id: string;\n  /** Name of the file. */\n  name: string;\n  /** Url of the file. */\n  url: string;\n  /** A string to be used as an image src for a attachment thumbnail. Falls back to a provided icon or the default attachment icon. */\n  thumbnail?: FileVisualProps['thumbnail'];\n  /** File extension. Use 'url' for link */\n  format?: string;\n  /** When passed, will render a single icon button for yet to be or in progress uploads. Use this action to trigger xhr request termination. */\n  onCancel?: (id: FileItemProps['id']) => void;\n  /** When passed, will render a single icon button or within a MenuButton if other actions are defined. */\n  onEdit?: (id: FileItemProps['id']) => void;\n  /** When passed, will be called on click of the name. Passes file url as the parameter. */\n  onPreview?: (id: FileItemProps['id']) => void;\n  /** When passed, will render a single icon button or within a MenuButton if other actions are defined. Passes file url as the parameter. */\n  onDownload?: (id: FileItemProps['id']) => void;\n  /** When passed, will render a single icon button or within a MenuButton if other actions are defined. */\n  onDelete?: (id: FileItemProps['id']) => void;\n  /** If the attachment is in an upload state, pass progress as a number between 0-100 representing the percentage of progress. */\n  progress?: number;\n  /** Set if there is an error uploading the file. Applies error styling to the meta string passed. */\n  error?: string;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledErrorIcon = styled(Icon)(({ theme }) => {\n  return css`\n    color: ${theme.base.palette.urgent};\n    margin-inline-start: calc(0.5 * ${theme.base.spacing});\n  `;\n});\n\nStyledErrorIcon.defaultProps = defaultThemeProp;\n\nconst titleEllipsisStyle = css`\n  flex-shrink: 1;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n`;\n\nconst StyledPreviewTitle = styled(Button)`\n  ${titleEllipsisStyle}\n`;\n\nconst StyledTextTitle = styled(Text)`\n  ${titleEllipsisStyle}\n`;\n\nconst StyledMeta = styled(StyledText)<{ error: boolean }>(({ theme, error }) => {\n  return css`\n    /* min width to show percentage in full */\n    min-width: 4ch;\n    margin-inline-start: auto;\n    ${titleEllipsisStyle}\n    ${error &&\n    css`\n      color: ${theme.base.palette.urgent};\n    `}\n  `;\n});\n\nStyledMeta.defaultProps = defaultThemeProp;\n\nconst StyledActionsWrapper = styled.div<{ meta: boolean }>(({ meta }) => {\n  return css`\n    margin-inline-start: ${meta ? 'unset' : 'auto'};\n  `;\n});\n\nStyledActionsWrapper.defaultProps = defaultThemeProp;\n\nconst StyledFileItem = styled.div(\n  ({\n    theme: {\n      base: {\n        palette,\n        'border-radius': borderRadius,\n        spacing,\n        'hit-area': { compact }\n      },\n      components\n    }\n  }) => {\n    return css`\n      border-radius: calc(0.5 * ${borderRadius});\n      border: 0.0625rem solid ${palette['border-line']};\n      background-color: ${palette['primary-background']};\n      height: ${components.input.height};\n      min-width: calc(${components.input.height} + 12ch + 1.5 * ${spacing} + ${compact});\n      > ${StyledProgressRing} {\n        margin-inline-start: calc(0.5 * ${spacing});\n      }\n\n      > ${StyledFileVisual}, > ${StyledIconShape} {\n        border-start-start-radius: inherit;\n        border-end-start-radius: inherit;\n        border-start-end-radius: 0;\n        border-end-end-radius: 0;\n        width: ${components.input.height};\n        flex-shrink: 0;\n      }\n    `;\n  }\n);\n\nStyledFileItem.defaultProps = defaultThemeProp;\n\nconst FileItem: FC<FileItemProps & ForwardProps> = forwardRef(function FileItem(\n  props: PropsWithoutRef<FileItemProps>,\n  ref: FileItemProps['ref']\n) {\n  const {\n    id,\n    name,\n    url,\n    thumbnail,\n    format,\n    error,\n    onCancel,\n    onEdit,\n    onPreview,\n    onDownload,\n    onDelete,\n    progress,\n    ...restProps\n  } = props;\n\n  const [thumbnailError, setThumbnailError] = useState(false);\n  const [textTarget, setTextTarget] = useElement();\n  const [metaTarget, setMetaTarget] = useElement();\n  const { locale } = useConfiguration();\n  const t = useI18n();\n\n  const uploading = progress && progress < 100;\n\n  const text = name || url;\n\n  let metaMessage;\n\n  if (uploading) {\n    metaMessage = formatNumber(progress, {\n      locale,\n      options: {\n        style: 'unit',\n        unit: 'percent',\n        maximumFractionDigits: 0\n      }\n    });\n  } else if (error) {\n    metaMessage = error;\n  }\n\n  const definedActions: Action[] = [\n    { onClick: onEdit, text: t('edit'), icon: 'pencil' },\n    { onClick: onDownload, text: t('download'), icon: 'download' },\n    { onClick: onDelete, text: t('delete'), icon: 'trash' }\n  ]\n    .filter(action => {\n      return !!action.onClick;\n    })\n    .map(({ text: actiontext, icon, onClick }) => ({\n      id: actiontext,\n      text: actiontext,\n      icon,\n      onClick: () => {\n        if (onClick) onClick(id);\n      }\n    }));\n\n  let visual;\n\n  if (uploading) {\n    visual = <Progress variant='ring' placement='inline' value={progress} />;\n  } else if (error) {\n    visual = <StyledErrorIcon name='warn-solid' />;\n  } else {\n    visual = format && (\n      <FileVisual\n        type={format === 'url' ? 'link' : getKindFromMimeType(getMimeTypeFromFile(format) ?? '')}\n        thumbnail={thumbnailError ? undefined : thumbnail}\n        onThumbnailError={() => {\n          setThumbnailError(true);\n        }}\n      />\n    );\n  }\n\n  return (\n    <Flex\n      as={StyledFileItem}\n      container={{\n        pad: [undefined, 0.5, undefined, undefined],\n        alignItems: 'center',\n        justify: 'start',\n        gap: 1\n      }}\n      ref={ref}\n    >\n      {visual}\n\n      {onPreview && !(error || uploading) ? (\n        <Button\n          {...restProps}\n          as={StyledPreviewTitle}\n          variant='link'\n          ref={setTextTarget}\n          onClick={() => {\n            onPreview(id);\n          }}\n          aria-label={t('preview_file', [text])}\n        >\n          {text}\n          {format === 'url' && <Icon name='open' />}\n        </Button>\n      ) : (\n        <Text {...restProps} as={StyledTextTitle} ref={setTextTarget}>\n          {text}\n        </Text>\n      )}\n      {metaMessage && (\n        <>\n          <Text as={StyledMeta} variant='secondary' error={error && !uploading} ref={setMetaTarget}>\n            {metaMessage}\n          </Text>\n\n          {metaTarget && (\n            <Tooltip target={metaTarget} describeTarget={false} smart>\n              {metaMessage}\n            </Tooltip>\n          )}\n        </>\n      )}\n\n      {(error || uploading) && onCancel && (\n        <StyledActionsWrapper meta={!!metaMessage}>\n          <Button\n            label={t('cancel')}\n            aria-label={`${t('cancel')} - ${text}`}\n            variant='simple'\n            compact\n            icon\n            onClick={() => onCancel(id)}\n          >\n            <Icon name='times' />\n          </Button>\n        </StyledActionsWrapper>\n      )}\n\n      {!(error || uploading) && !!definedActions.length && (\n        <StyledActionsWrapper meta={!!metaMessage}>\n          <Actions items={definedActions} compact iconOnly contextualLabel={name} />\n        </StyledActionsWrapper>\n      )}\n\n      {textTarget && (\n        <Tooltip target={textTarget} smart describeTarget={false}>\n          {text}\n        </Tooltip>\n      )}\n    </Flex>\n  );\n});\n\nexport default FileItem;\n"]}
+{"version":3,"file":"FileItem.js","sourceRoot":"","sources":["../../../src/components/File/FileItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState } from 'react';\nimport type { PropsWithoutRef, FC, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport Text, { StyledText } from '../Text';\nimport Icon from '../Icon';\nimport Tooltip from '../Tooltip';\nimport type { ForwardProps, BaseProps, Action } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Button from '../Button';\nimport { useI18n, useElement, useConfiguration } from '../../hooks';\nimport Actions from '../Actions';\nimport Progress from '../Progress';\nimport { StyledProgressRing } from '../Progress/Progress.styles';\nimport { formatNumber } from '../Number';\nimport Flex from '../Flex';\nimport { StyledIconShape } from '../Icon/Icon';\n\nimport { getKindFromMimeType, getMimeTypeFromFile } from './utils';\nimport FileVisual, { StyledFileVisual } from './FileVisual';\nimport type { FileVisualProps } from './FileVisual';\n\nexport interface FileItemProps extends BaseProps {\n  /** Unique id for item. */\n  id: string;\n  /** Name of the file. */\n  name: string;\n  /** Url of the file. */\n  url: string;\n  /** A string to be used as an image src for a attachment thumbnail. Falls back to a provided icon or the default attachment icon. */\n  thumbnail?: FileVisualProps['thumbnail'];\n  /** File extension. Use 'url' for link */\n  format?: string;\n  /** When passed, will render a single icon button for yet to be or in progress uploads. Use this action to trigger xhr request termination. */\n  onCancel?: (id: FileItemProps['id']) => void;\n  /** When passed, will render a single icon button or within a MenuButton if other actions are defined. */\n  onEdit?: (id: FileItemProps['id']) => void;\n  /** When passed, will be called on click of the name. Passes file url as the parameter. */\n  onPreview?: (id: FileItemProps['id']) => void;\n  /** When passed, will render a single icon button or within a MenuButton if other actions are defined. Passes file url as the parameter. */\n  onDownload?: (id: FileItemProps['id']) => void;\n  /** When passed, will render a single icon button or within a MenuButton if other actions are defined. */\n  onDelete?: (id: FileItemProps['id']) => void;\n  /** If the attachment is in an upload state, pass progress as a number between 0-100 representing the percentage of progress. */\n  progress?: number;\n  /** Set if there is an error uploading the file. Applies error styling to the meta string passed. */\n  error?: string;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledErrorIcon = styled(Icon)(({ theme }) => {\n  return css`\n    color: ${theme.base.palette.urgent};\n    margin-inline-start: calc(0.5 * ${theme.base.spacing});\n  `;\n});\n\nStyledErrorIcon.defaultProps = defaultThemeProp;\n\nconst titleEllipsisStyle = css`\n  flex-shrink: 1;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n`;\n\nconst StyledPreviewTitle = styled(Button)`\n  ${titleEllipsisStyle}\n`;\n\nconst StyledTextTitle = styled(Text)`\n  ${titleEllipsisStyle}\n`;\n\nconst StyledMeta = styled(StyledText)<{ error: boolean }>(({ theme, error }) => {\n  return css`\n    /* min width to show percentage in full */\n    min-width: 4ch;\n    margin-inline-start: auto;\n    ${titleEllipsisStyle}\n    ${error &&\n    css`\n      color: ${theme.base.palette.urgent};\n    `}\n  `;\n});\n\nStyledMeta.defaultProps = defaultThemeProp;\n\nconst StyledActionsWrapper = styled.div<{ meta: boolean }>(({ meta }) => {\n  return css`\n    margin-inline-start: ${meta ? 'unset' : 'auto'};\n  `;\n});\n\nStyledActionsWrapper.defaultProps = defaultThemeProp;\n\nconst StyledFileItem = styled.div(\n  ({\n    theme: {\n      base: {\n        palette,\n        'border-radius': borderRadius,\n        spacing,\n        'hit-area': { compact }\n      },\n      components\n    }\n  }) => {\n    return css`\n      border-radius: calc(0.5 * ${borderRadius});\n      border: 0.0625rem solid ${palette['border-line']};\n      background-color: ${palette['primary-background']};\n      height: ${components.input.height};\n      min-width: calc(${components.input.height} + 12ch + 1.5 * ${spacing} + ${compact});\n      > ${StyledProgressRing} {\n        margin-inline-start: calc(0.5 * ${spacing});\n      }\n\n      > ${StyledFileVisual}, > ${StyledIconShape} {\n        border-start-start-radius: inherit;\n        border-end-start-radius: inherit;\n        border-start-end-radius: 0;\n        border-end-end-radius: 0;\n        width: ${components.input.height};\n        flex-shrink: 0;\n      }\n    `;\n  }\n);\n\nStyledFileItem.defaultProps = defaultThemeProp;\n\nconst FileItem: FC<FileItemProps & ForwardProps> = forwardRef(function FileItem(\n  props: PropsWithoutRef<FileItemProps>,\n  ref: FileItemProps['ref']\n) {\n  const {\n    id,\n    name,\n    url,\n    thumbnail,\n    format,\n    error,\n    onCancel,\n    onEdit,\n    onPreview,\n    onDownload,\n    onDelete,\n    progress,\n    ...restProps\n  } = props;\n\n  const [thumbnailError, setThumbnailError] = useState(false);\n  const [textTarget, setTextTarget] = useElement();\n  const [metaTarget, setMetaTarget] = useElement();\n  const { locale } = useConfiguration();\n  const t = useI18n();\n\n  const uploading = typeof progress === 'number' && progress < 100;\n\n  const text = name || url;\n\n  let metaMessage;\n\n  if (uploading) {\n    metaMessage = formatNumber(progress, {\n      locale,\n      options: {\n        style: 'unit',\n        unit: 'percent',\n        maximumFractionDigits: 0\n      }\n    });\n  } else if (error) {\n    metaMessage = error;\n  }\n\n  const definedActions: Action[] = [\n    { onClick: onEdit, text: t('edit'), icon: 'pencil' },\n    { onClick: onDownload, text: t('download'), icon: 'download' },\n    { onClick: onDelete, text: t('delete'), icon: 'trash' }\n  ]\n    .filter(action => {\n      return !!action.onClick;\n    })\n    .map(({ text: actiontext, icon, onClick }) => ({\n      id: actiontext,\n      text: actiontext,\n      icon,\n      onClick: () => {\n        if (onClick) onClick(id);\n      }\n    }));\n\n  let visual;\n\n  if (uploading) {\n    visual = <Progress variant='ring' placement='inline' value={progress} />;\n  } else if (error) {\n    visual = <StyledErrorIcon name='warn-solid' />;\n  } else {\n    visual = format && (\n      <FileVisual\n        type={format === 'url' ? 'link' : getKindFromMimeType(getMimeTypeFromFile(format) ?? '')}\n        thumbnail={thumbnailError ? undefined : thumbnail}\n        onThumbnailError={() => {\n          setThumbnailError(true);\n        }}\n      />\n    );\n  }\n\n  return (\n    <Flex\n      as={StyledFileItem}\n      container={{\n        pad: [undefined, 0.5, undefined, undefined],\n        alignItems: 'center',\n        justify: 'start',\n        gap: 1\n      }}\n      ref={ref}\n    >\n      {visual}\n\n      {onPreview && !(error || uploading) ? (\n        <Button\n          {...restProps}\n          as={StyledPreviewTitle}\n          variant='link'\n          ref={setTextTarget}\n          onClick={() => {\n            onPreview(id);\n          }}\n          aria-label={t('preview_file', [text])}\n        >\n          {text}\n          {format === 'url' && <Icon name='open' />}\n        </Button>\n      ) : (\n        <Text {...restProps} as={StyledTextTitle} ref={setTextTarget}>\n          {text}\n        </Text>\n      )}\n      {metaMessage && (\n        <>\n          <Text as={StyledMeta} variant='secondary' error={error && !uploading} ref={setMetaTarget}>\n            {metaMessage}\n          </Text>\n\n          {metaTarget && (\n            <Tooltip target={metaTarget} describeTarget={false} smart>\n              {metaMessage}\n            </Tooltip>\n          )}\n        </>\n      )}\n\n      {(error || uploading) && onCancel && (\n        <StyledActionsWrapper meta={!!metaMessage}>\n          <Button\n            label={t('cancel')}\n            aria-label={`${t('cancel')} - ${text}`}\n            variant='simple'\n            compact\n            icon\n            onClick={() => onCancel(id)}\n          >\n            <Icon name='times' />\n          </Button>\n        </StyledActionsWrapper>\n      )}\n\n      {!(error || uploading) && !!definedActions.length && (\n        <StyledActionsWrapper meta={!!metaMessage}>\n          <Actions items={definedActions} compact iconOnly contextualLabel={name} />\n        </StyledActionsWrapper>\n      )}\n\n      {textTarget && (\n        <Tooltip target={textTarget} smart describeTarget={false}>\n          {text}\n        </Tooltip>\n      )}\n    </Flex>\n  );\n});\n\nexport default FileItem;\n"]}

package/lib/components/File/FileList.d.ts

@@ -0,0 +1,14 @@
+import type { PropsWithoutRef } from 'react';
+import type { WithAttributes } from '../../types';
+import type { FileDisplayProps } from './FileDisplay';
+import type { FileItemProps } from './FileItem';
+export type FileListProps = WithAttributes<'div', {
+    type: 'display';
+    items: FileDisplayProps[];
+} | {
+    type: 'item';
+    items: FileItemProps[];
+}>;
+declare const FileList: import("react").ForwardRefExoticComponent<PropsWithoutRef<FileListProps> & import("react").RefAttributes<HTMLDivElement>>;
+export default FileList;
+//# sourceMappingURL=FileList.d.ts.map

package/lib/components/File/FileList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileList.d.ts","sourceRoot":"","sources":["../../../src/components/File/FileList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAG7C,OAAO,KAAK,EAAc,cAAc,EAAE,MAAM,aAAa,CAAC;AAK9D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAIhD,MAAM,MAAM,aAAa,GAAG,cAAc,CACxC,KAAK,EACH;IACE,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,gBAAgB,EAAE,CAAC;CAC3B,GACD;IACE,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,aAAa,EAAE,CAAC;CACxB,CACJ,CAAC;AAQF,QAAA,MAAM,QAAQ,2HAiBb,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/lib/components/File/FileList.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import styled from 'styled-components';
+import { useBreakpoint, useConsolidatedRef } from '../../hooks';
+import Grid from '../Grid';
+import { StyledLink } from '../Link';
+import FileDisplay from './FileDisplay';
+import FileItem from './FileItem';
+const StyledFileList = styled(Grid) `
+  ${StyledLink} + ${StyledLink} {
+    margin-inline-start: unset;
+  }
+`;
+const FileList = forwardRef(function FileList({ type, items }, ref) {
+    const listRef = useConsolidatedRef(ref);
+    const isSmallOrAbove = useBreakpoint('sm', { breakpointRef: listRef });
+    return (_jsx(Grid, { ref: listRef, container: { gap: 0.5, cols: isSmallOrAbove ? 'repeat(2, 1fr)' : '1fr' }, as: StyledFileList, children: type === 'display'
+            ? items.map(item => _jsx(FileDisplay, { ...item }, item.id))
+            : items.map(item => _jsx(FileItem, { ...item }, item.id)) }));
+});
+export default FileList;
+//# sourceMappingURL=FileList.js.map

package/lib/components/File/FileList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileList.js","sourceRoot":"","sources":["../../../src/components/File/FileList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAGvC,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAChE,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAIrC,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAclC,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;IAC/B,UAAU,MAAM,UAAU;;;CAG7B,CAAC;AAEF,MAAM,QAAQ,GAAG,UAAU,CACzB,SAAS,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,GAAG;IACpC,MAAM,OAAO,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IACxC,MAAM,cAAc,GAAG,aAAa,CAAC,IAAI,EAAE,EAAE,aAAa,EAAE,OAAO,EAAE,CAAC,CAAC;IAEvE,OAAO,CACL,KAAC,IAAI,IACH,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,cAAc,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,KAAK,EAAE,EACxE,EAAE,EAAE,cAAc,YAEjB,IAAI,KAAK,SAAS;YACjB,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,KAAC,WAAW,OAAmB,IAAI,IAAjB,IAAI,CAAC,EAAE,CAAc,CAAC;YAC5D,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,KAAC,QAAQ,OAAmB,IAAI,IAAjB,IAAI,CAAC,EAAE,CAAc,CAAC,GACtD,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef } from 'react';\nimport styled from 'styled-components';\n\nimport type { RefElement, WithAttributes } from '../../types';\nimport { useBreakpoint, useConsolidatedRef } from '../../hooks';\nimport Grid from '../Grid';\nimport { StyledLink } from '../Link';\n\nimport type { FileDisplayProps } from './FileDisplay';\nimport type { FileItemProps } from './FileItem';\nimport FileDisplay from './FileDisplay';\nimport FileItem from './FileItem';\n\nexport type FileListProps = WithAttributes<\n  'div',\n  | {\n      type: 'display';\n      items: FileDisplayProps[];\n    }\n  | {\n      type: 'item';\n      items: FileItemProps[];\n    }\n>;\n\nconst StyledFileList = styled(Grid)`\n  ${StyledLink} + ${StyledLink} {\n    margin-inline-start: unset;\n  }\n`;\n\nconst FileList = forwardRef<RefElement<FileListProps>, PropsWithoutRef<FileListProps>>(\n  function FileList({ type, items }, ref) {\n    const listRef = useConsolidatedRef(ref);\n    const isSmallOrAbove = useBreakpoint('sm', { breakpointRef: listRef });\n\n    return (\n      <Grid\n        ref={listRef}\n        container={{ gap: 0.5, cols: isSmallOrAbove ? 'repeat(2, 1fr)' : '1fr' }}\n        as={StyledFileList}\n      >\n        {type === 'display'\n          ? items.map(item => <FileDisplay key={item.id} {...item} />)\n          : items.map(item => <FileItem key={item.id} {...item} />)}\n      </Grid>\n    );\n  }\n);\n\nexport default FileList;\n"]}

package/lib/components/File/index.d.ts

@@ -8,5 +8,9 @@ export { default as FileDisplay } from './FileDisplay';
 export type { FileDisplayProps } from './FileDisplay';
 export { default as FileVisual } from './FileVisual';
 export type { FileVisualProps } from './FileVisual';
+export { default as FileList } from './FileList';
+export type { FileListProps } from './FileList';
+export { default as FileDisplayList } from './FileDisplayList';
+export type { FileDisplayListProps } from './FileDisplayList';
 export { getKindFromMimeType, getMimeTypeFromFile } from './utils';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/File/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/File/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/File/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,YAAY,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,YAAY,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,YAAY,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC"}

package/lib/components/File/index.js

@@ -3,5 +3,7 @@ export { default as FileItem } from './FileItem';
 export { default as FileUploadItem } from './FileUploadItem';
 export { default as FileDisplay } from './FileDisplay';
 export { default as FileVisual } from './FileVisual';
+export { default as FileList } from './FileList';
+export { default as FileDisplayList } from './FileDisplayList';
 export { getKindFromMimeType, getMimeTypeFromFile } from './utils';
 //# sourceMappingURL=index.js.map

package/lib/components/File/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/File/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AAEnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEjD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AAEvD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AAErD,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC","sourcesContent":["export { default as FileInput } from './FileInput';\nexport type { FileInputProps } from './FileInput';\nexport { default as FileItem } from './FileItem';\nexport type { FileItemProps } from './FileItem';\nexport { default as FileUploadItem } from './FileUploadItem';\nexport type { FileUploadItemProps } from './FileUploadItem';\nexport { default as FileDisplay } from './FileDisplay';\nexport type { FileDisplayProps } from './FileDisplay';\nexport { default as FileVisual } from './FileVisual';\nexport type { FileVisualProps } from './FileVisual';\nexport { getKindFromMimeType, getMimeTypeFromFile } from './utils';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/File/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AAEnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEjD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AAEvD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AAErD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEjD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAE/D,OAAO,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC","sourcesContent":["export { default as FileInput } from './FileInput';\nexport type { FileInputProps } from './FileInput';\nexport { default as FileItem } from './FileItem';\nexport type { FileItemProps } from './FileItem';\nexport { default as FileUploadItem } from './FileUploadItem';\nexport type { FileUploadItemProps } from './FileUploadItem';\nexport { default as FileDisplay } from './FileDisplay';\nexport type { FileDisplayProps } from './FileDisplay';\nexport { default as FileVisual } from './FileVisual';\nexport type { FileVisualProps } from './FileVisual';\nexport { default as FileList } from './FileList';\nexport type { FileListProps } from './FileList';\nexport { default as FileDisplayList } from './FileDisplayList';\nexport type { FileDisplayListProps } from './FileDisplayList';\nexport { getKindFromMimeType, getMimeTypeFromFile } from './utils';\n"]}

package/lib/components/Link/Link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,GAAG,EAAkC,MAAM,OAAO,CAAC;AAK/F,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAI7C,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAwBvE,MAAM,WAAW,SAAU,SAAQ,SAAS,EAAE,UAAU;IACtD,oCAAoC;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,oCAAoC;IACpC,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACjC;;;OAGG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,mFAAmF;IACnF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iFAAiF;IACjF,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1C,6CAA6C;IAC7C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B;AAED,eAAO,MAAM,iBAAiB;aAAyB,OAAO;SAU7D,CAAC;AAIF,eAAO,MAAM,oBAAoB,oLAyC/B,CAAC;AAIH,eAAO,MAAM,2BAA2B,oLA+BtC,CAAC;AAIH,eAAO,MAAM,UAAU,iJAAmB,CAAC;;;;AAoM3C,wBAAiD"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,GAAG,EAAkC,MAAM,OAAO,CAAC;AAK/F,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAI7C,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAwBvE,MAAM,WAAW,SAAU,SAAQ,SAAS,EAAE,UAAU;IACtD,oCAAoC;IACpC,QAAQ,EAAE,SAAS,CAAC;IACpB,oCAAoC;IACpC,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACjC;;;OAGG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,mFAAmF;IACnF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iFAAiF;IACjF,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1C,6CAA6C;IAC7C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B;AAED,eAAO,MAAM,iBAAiB;aAAyB,OAAO;SAU7D,CAAC;AAIF,eAAO,MAAM,oBAAoB,oLAyC/B,CAAC;AAIH,eAAO,MAAM,2BAA2B,oLA+BtC,CAAC;AAIH,eAAO,MAAM,UAAU,iJAQtB,CAAC;;;;AAoMF,wBAAiD"}

package/lib/components/Link/Link.js

@@ -14,7 +14,7 @@ import { Keyboard } from '../Badges';
 import Text, { StyledText } from '../Text';
 import { StyledKeyboard } from '../Badges/Keyboard';
 import Flex from '../Flex';
-import Icon, { registerIcon } from '../Icon';
+import Icon, { StyledIcon, registerIcon } from '../Icon';
 import * as openIcon from '../Icon/icons/open.icon';
 import VisuallyHiddenText from '../VisuallyHiddenText';
 import { getLinkTestIds } from './Link.test-ids';
@@ -103,7 +103,15 @@ export const StyledLinkPreviewPopoverBtn = styled(StyledLinkPopoverBtn)(({ theme
   `;
 });
 StyledLinkPreviewPopoverBtn.defaultProps = defaultThemeProp;
-export const StyledLink = styled(Button) ``;
+export const StyledLink = styled(Button) `
+  &:has(> img) {
+    display: inline-block;
+
+    ${StyledIcon} {
+      vertical-align: top;
+    }
+  }
+`;
 StyledLink.defaultProps = defaultThemeProp;
 registerIcon(openIcon);
 const Link = forwardRef(function Link({ testId, href, variant = 'link', icon = false, previewable, onPreview, target: targetProp, children, ...restProps }, ref) {

package/lib/components/Link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useRef, useContext, useEffect } from 'react';\nimport type { ReactNode, FunctionComponent, Ref, PropsWithoutRef, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport Button from '../Button';\nimport type { ButtonProps } from '../Button';\nimport Popover from '../Popover';\nimport type { PopoverProps } from '../Popover';\nimport BareButton from '../Button/BareButton';\nimport type { BaseProps, ForwardProps, TestIdProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport {\n  useBreakpoint,\n  useConsolidatedRef,\n  useI18n,\n  useUID,\n  useModalContext,\n  useOS,\n  useTestIds\n} from '../../hooks';\nimport { documentIsAvailable, tryCatch, withTestIds } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport AppShellContext from '../AppShell/AppShellContext';\nimport { Keyboard } from '../Badges';\nimport Text, { StyledText } from '../Text';\nimport { StyledKeyboard } from '../Badges/Keyboard';\nimport Flex from '../Flex';\nimport Icon, { registerIcon } from '../Icon';\nimport * as openIcon from '../Icon/icons/open.icon';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport { getLinkTestIds } from './Link.test-ids';\n\nexport interface LinkProps extends BaseProps, TestIdProp {\n  /** Text or content for the Link. */\n  children: ReactNode;\n  /** URL or DOM id to navigate to. */\n  href: string;\n  /**\n   * Controls the styling of the Link.\n   * @default 'link'\n   */\n  variant?: ButtonProps['variant'];\n  /**\n   * Set the Icon prop to `true` if you're using just an Icon in your Link. Make sure to pass an Icon as children if `true`.\n   * @default false\n   */\n  icon?: ButtonProps['icon'];\n  /** Determines if the Link should render a popover when focused or hovered over. */\n  previewable?: boolean;\n  /** Callback function that is run when the preview popover is interacted with. */\n  onPreview?: (e: { href: string }) => void;\n  /** Specifies where to open the link href. */\n  target?: string;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLAnchorElement>;\n}\n\nexport const StyledLinkPopover = styled.div<{ preview: boolean }>(\n  ({ theme, preview }) => css`\n    background-color: ${theme.components.tooltip['background-color']};\n    z-index: ${theme.base['z-index'].tooltip};\n\n    ${preview &&\n    css`\n      padding: ${theme.base.spacing};\n    `}\n  `\n);\n\nStyledLinkPopover.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPopoverBtn = styled(BareButton)(({ theme }) => {\n  const contrastColor = tryCatch(() => readableColor(theme.components.tooltip['background-color']));\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n  return css`\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    z-index: 1;\n    padding: 0 ${theme.base.spacing};\n    min-height: 1.5rem;\n    line-height: 1;\n    color: ${contrastColor};\n    font-size: ${fontSize.xs};\n    text-decoration: none;\n\n    /* FIXME: Button selector specificity... */\n    & + & {\n      margin: 0;\n    }\n\n    & + &::before {\n      content: '';\n      position: absolute;\n      inset-inline-start: 0;\n      inset-block: 0;\n      width: 1px; /* stylelint-disable-line unit-allowed-list */\n      background-color: ${contrastColor};\n      opacity: ${theme.base.transparency['transparent-3']};\n    }\n\n    &:hover,\n    &:active {\n      text-decoration: underline;\n    }\n\n    &:focus {\n      box-shadow: inset 0 0 0 0.0625rem ${theme.base.palette.light},\n        0 0 0.125rem 0.0625rem ${theme.base.palette.interactive};\n    }\n  `;\n});\n\nStyledLinkPopoverBtn.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPreviewPopoverBtn = styled(StyledLinkPopoverBtn)(({ theme }) => {\n  return css`\n    width: 100%;\n    padding: unset;\n\n    &:hover,\n    &:active {\n      text-decoration: none;\n      ${StyledText} span {\n        text-decoration: underline;\n      }\n    }\n\n    ${StyledText} {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      width: 100%;\n    }\n\n    ${StyledKeyboard} {\n      color: ${theme.base.palette.light};\n      background-color: ${theme.base.colors.gray.dark};\n      border-color: ${theme.base.colors.gray.medium};\n      inset-block-start: unset;\n\n      &:first-of-type {\n        margin-inline: ${theme.base.spacing};\n      }\n    }\n  `;\n});\n\nStyledLinkPreviewPopoverBtn.defaultProps = defaultThemeProp;\n\nexport const StyledLink = styled(Button)``;\n\nStyledLink.defaultProps = defaultThemeProp;\n\nregisterIcon(openIcon);\n\nconst Link: FunctionComponent<LinkProps & ForwardProps> = forwardRef(function Link(\n  {\n    testId,\n    href,\n    variant = 'link',\n    icon = false,\n    previewable,\n    onPreview,\n    target: targetProp,\n    children,\n    ...restProps\n  }: PropsWithoutRef<LinkProps>,\n  ref: LinkProps['ref']\n) {\n  const { initialized: inModal } = useModalContext();\n  const { previewTriggerRef } = useContext(AppShellContext);\n  const uid = useUID();\n  const linkRef = useConsolidatedRef(ref);\n  const [popover, setPopover] = useState(false);\n  const [popoverHideDelay, setPopoverHideDelay] = useState<PopoverProps['hideDelay']>('short');\n  const [previewPopover, setPreviewPopover] = useState(false);\n  const previewBtnRef = useRef<HTMLButtonElement>(null);\n  const isSmallOrAbove = useBreakpoint('sm');\n  const t = useI18n();\n  const { macintosh } = useOS();\n  const contextMenuOpened = useRef(false);\n  const testIds = useTestIds(testId, getLinkTestIds);\n\n  const url = new URL(href, document.location.href);\n  const crossOrigin = documentIsAvailable\n    ? /^https?:$/.test(url.protocol) && document.location.origin !== url.origin\n    : false;\n  const target = crossOrigin ? '_blank' : targetProp;\n\n  const showPopover = () => {\n    if (isSmallOrAbove && !previewPopover) {\n      setPopover(true);\n    }\n  };\n\n  const showPreviewPopover = () => {\n    if (isSmallOrAbove && !popover && !contextMenuOpened.current) setPreviewPopover(true);\n  };\n\n  const hidePopover = () => {\n    setPopover(false);\n  };\n\n  const hidePreviewPopover = () => {\n    setPreviewPopover(false);\n  };\n\n  const onEnterLink = () => {\n    if (previewable) showPopover();\n  };\n\n  const onFocusLink = () => {\n    if (previewable) showPreviewPopover();\n  };\n\n  const onBlurLink = () => {\n    contextMenuOpened.current = false;\n    hidePreviewPopover();\n  };\n\n  const onPreviewClick = () => {\n    previewTriggerRef.current = linkRef.current;\n    onPreview?.({ href });\n  };\n\n  const onKeyUp = (e: KeyboardEvent) => {\n    if (e.getModifierState('Alt') && e.code === 'KeyP') {\n      onPreviewClick();\n    }\n  };\n\n  useEffect(() => {\n    if (popoverHideDelay === 'none' && !popover && !previewPopover) {\n      setPopoverHideDelay('short');\n    }\n  }, [popoverHideDelay, popover, previewPopover]);\n\n  return (\n    <>\n      <StyledLink\n        data-testid={testIds.root}\n        href={href}\n        variant={variant}\n        ref={linkRef as any}\n        target={target}\n        {...restProps}\n        onMouseEnter={onEnterLink}\n        onMouseLeave={hidePopover}\n        onFocus={onFocusLink}\n        onBlur={onBlurLink}\n        onKeyUp={onKeyUp}\n        onContextMenu={() => {\n          contextMenuOpened.current = true;\n\n          setPopoverHideDelay('none');\n          setPreviewPopover(false);\n          setPopover(false);\n        }}\n      >\n        {children}\n        {target === '_blank' && <VisuallyHiddenText>{t('opens_in_a_new_tab')}</VisuallyHiddenText>}\n        {!icon && target === '_blank' && <Icon name='open' />}\n      </StyledLink>\n\n      {!inModal && (\n        <Popover\n          data-testid={testIds.previewPopover}\n          show={previewPopover}\n          groupId='link_preview'\n          showDelay='short'\n          hideDelay={popoverHideDelay}\n          placement='bottom'\n          target={linkRef.current}\n          as={StyledLinkPopover}\n          arrow\n          preview\n          portal\n          onHide={hidePreviewPopover}\n        >\n          <StyledLinkPreviewPopoverBtn\n            data-testid={testIds.preview}\n            preview\n            type='button'\n            ref={previewBtnRef}\n            onClick={onPreviewClick}\n            tabIndex='-1'\n          >\n            <Text>\n              <span>{t('preview')}</span>\n              <Flex container={{ inline: true, justify: 'end' }}>\n                <Keyboard keyName='Alt' />\n                <Keyboard keyName='P' />\n              </Flex>\n            </Text>\n          </StyledLinkPreviewPopoverBtn>\n        </Popover>\n      )}\n\n      <Popover\n        data-testid={testIds.previewPopover}\n        show={popover}\n        groupId='link_preview'\n        showDelay='short'\n        hideDelay={popoverHideDelay}\n        placement='bottom'\n        target={linkRef.current}\n        onMouseEnter={showPopover}\n        onMouseLeave={hidePopover}\n        as={StyledLinkPopover}\n        arrow\n        portal\n      >\n        {!inModal && (\n          <StyledLinkPopoverBtn\n            data-testid={testIds.preview}\n            preview\n            type='button'\n            ref={previewBtnRef}\n            onClick={onPreviewClick}\n            tabIndex='-1'\n          >\n            {t('preview')}\n          </StyledLinkPopoverBtn>\n        )}\n        <StyledLinkPopoverBtn\n          data-testid={testIds.newTab}\n          forwardedAs='a'\n          href={href}\n          target='_blank'\n          rel='noreferrer'\n          tabIndex='-1'\n        >\n          {t('link_open_in_tab_text')}\n        </StyledLinkPopoverBtn>\n      </Popover>\n\n      {previewable && (\n        <span id={`${uid}-preview-instructions`} hidden>\n          {t('preview_link_instruction', [macintosh ? 'option' : 'alt'])}\n        </span>\n      )}\n    </>\n  );\n});\n\nexport default withTestIds(Link, getLinkTestIds);\n"]}
+{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useRef, useContext, useEffect } from 'react';\nimport type { ReactNode, FunctionComponent, Ref, PropsWithoutRef, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport Button from '../Button';\nimport type { ButtonProps } from '../Button';\nimport Popover from '../Popover';\nimport type { PopoverProps } from '../Popover';\nimport BareButton from '../Button/BareButton';\nimport type { BaseProps, ForwardProps, TestIdProp } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport {\n  useBreakpoint,\n  useConsolidatedRef,\n  useI18n,\n  useUID,\n  useModalContext,\n  useOS,\n  useTestIds\n} from '../../hooks';\nimport { documentIsAvailable, tryCatch, withTestIds } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport AppShellContext from '../AppShell/AppShellContext';\nimport { Keyboard } from '../Badges';\nimport Text, { StyledText } from '../Text';\nimport { StyledKeyboard } from '../Badges/Keyboard';\nimport Flex from '../Flex';\nimport Icon, { StyledIcon, registerIcon } from '../Icon';\nimport * as openIcon from '../Icon/icons/open.icon';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport { getLinkTestIds } from './Link.test-ids';\n\nexport interface LinkProps extends BaseProps, TestIdProp {\n  /** Text or content for the Link. */\n  children: ReactNode;\n  /** URL or DOM id to navigate to. */\n  href: string;\n  /**\n   * Controls the styling of the Link.\n   * @default 'link'\n   */\n  variant?: ButtonProps['variant'];\n  /**\n   * Set the Icon prop to `true` if you're using just an Icon in your Link. Make sure to pass an Icon as children if `true`.\n   * @default false\n   */\n  icon?: ButtonProps['icon'];\n  /** Determines if the Link should render a popover when focused or hovered over. */\n  previewable?: boolean;\n  /** Callback function that is run when the preview popover is interacted with. */\n  onPreview?: (e: { href: string }) => void;\n  /** Specifies where to open the link href. */\n  target?: string;\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLAnchorElement>;\n}\n\nexport const StyledLinkPopover = styled.div<{ preview: boolean }>(\n  ({ theme, preview }) => css`\n    background-color: ${theme.components.tooltip['background-color']};\n    z-index: ${theme.base['z-index'].tooltip};\n\n    ${preview &&\n    css`\n      padding: ${theme.base.spacing};\n    `}\n  `\n);\n\nStyledLinkPopover.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPopoverBtn = styled(BareButton)(({ theme }) => {\n  const contrastColor = tryCatch(() => readableColor(theme.components.tooltip['background-color']));\n  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n  return css`\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    z-index: 1;\n    padding: 0 ${theme.base.spacing};\n    min-height: 1.5rem;\n    line-height: 1;\n    color: ${contrastColor};\n    font-size: ${fontSize.xs};\n    text-decoration: none;\n\n    /* FIXME: Button selector specificity... */\n    & + & {\n      margin: 0;\n    }\n\n    & + &::before {\n      content: '';\n      position: absolute;\n      inset-inline-start: 0;\n      inset-block: 0;\n      width: 1px; /* stylelint-disable-line unit-allowed-list */\n      background-color: ${contrastColor};\n      opacity: ${theme.base.transparency['transparent-3']};\n    }\n\n    &:hover,\n    &:active {\n      text-decoration: underline;\n    }\n\n    &:focus {\n      box-shadow: inset 0 0 0 0.0625rem ${theme.base.palette.light},\n        0 0 0.125rem 0.0625rem ${theme.base.palette.interactive};\n    }\n  `;\n});\n\nStyledLinkPopoverBtn.defaultProps = defaultThemeProp;\n\nexport const StyledLinkPreviewPopoverBtn = styled(StyledLinkPopoverBtn)(({ theme }) => {\n  return css`\n    width: 100%;\n    padding: unset;\n\n    &:hover,\n    &:active {\n      text-decoration: none;\n      ${StyledText} span {\n        text-decoration: underline;\n      }\n    }\n\n    ${StyledText} {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      width: 100%;\n    }\n\n    ${StyledKeyboard} {\n      color: ${theme.base.palette.light};\n      background-color: ${theme.base.colors.gray.dark};\n      border-color: ${theme.base.colors.gray.medium};\n      inset-block-start: unset;\n\n      &:first-of-type {\n        margin-inline: ${theme.base.spacing};\n      }\n    }\n  `;\n});\n\nStyledLinkPreviewPopoverBtn.defaultProps = defaultThemeProp;\n\nexport const StyledLink = styled(Button)`\n  &:has(> img) {\n    display: inline-block;\n\n    ${StyledIcon} {\n      vertical-align: top;\n    }\n  }\n`;\n\nStyledLink.defaultProps = defaultThemeProp;\n\nregisterIcon(openIcon);\n\nconst Link: FunctionComponent<LinkProps & ForwardProps> = forwardRef(function Link(\n  {\n    testId,\n    href,\n    variant = 'link',\n    icon = false,\n    previewable,\n    onPreview,\n    target: targetProp,\n    children,\n    ...restProps\n  }: PropsWithoutRef<LinkProps>,\n  ref: LinkProps['ref']\n) {\n  const { initialized: inModal } = useModalContext();\n  const { previewTriggerRef } = useContext(AppShellContext);\n  const uid = useUID();\n  const linkRef = useConsolidatedRef(ref);\n  const [popover, setPopover] = useState(false);\n  const [popoverHideDelay, setPopoverHideDelay] = useState<PopoverProps['hideDelay']>('short');\n  const [previewPopover, setPreviewPopover] = useState(false);\n  const previewBtnRef = useRef<HTMLButtonElement>(null);\n  const isSmallOrAbove = useBreakpoint('sm');\n  const t = useI18n();\n  const { macintosh } = useOS();\n  const contextMenuOpened = useRef(false);\n  const testIds = useTestIds(testId, getLinkTestIds);\n\n  const url = new URL(href, document.location.href);\n  const crossOrigin = documentIsAvailable\n    ? /^https?:$/.test(url.protocol) && document.location.origin !== url.origin\n    : false;\n  const target = crossOrigin ? '_blank' : targetProp;\n\n  const showPopover = () => {\n    if (isSmallOrAbove && !previewPopover) {\n      setPopover(true);\n    }\n  };\n\n  const showPreviewPopover = () => {\n    if (isSmallOrAbove && !popover && !contextMenuOpened.current) setPreviewPopover(true);\n  };\n\n  const hidePopover = () => {\n    setPopover(false);\n  };\n\n  const hidePreviewPopover = () => {\n    setPreviewPopover(false);\n  };\n\n  const onEnterLink = () => {\n    if (previewable) showPopover();\n  };\n\n  const onFocusLink = () => {\n    if (previewable) showPreviewPopover();\n  };\n\n  const onBlurLink = () => {\n    contextMenuOpened.current = false;\n    hidePreviewPopover();\n  };\n\n  const onPreviewClick = () => {\n    previewTriggerRef.current = linkRef.current;\n    onPreview?.({ href });\n  };\n\n  const onKeyUp = (e: KeyboardEvent) => {\n    if (e.getModifierState('Alt') && e.code === 'KeyP') {\n      onPreviewClick();\n    }\n  };\n\n  useEffect(() => {\n    if (popoverHideDelay === 'none' && !popover && !previewPopover) {\n      setPopoverHideDelay('short');\n    }\n  }, [popoverHideDelay, popover, previewPopover]);\n\n  return (\n    <>\n      <StyledLink\n        data-testid={testIds.root}\n        href={href}\n        variant={variant}\n        ref={linkRef as any}\n        target={target}\n        {...restProps}\n        onMouseEnter={onEnterLink}\n        onMouseLeave={hidePopover}\n        onFocus={onFocusLink}\n        onBlur={onBlurLink}\n        onKeyUp={onKeyUp}\n        onContextMenu={() => {\n          contextMenuOpened.current = true;\n\n          setPopoverHideDelay('none');\n          setPreviewPopover(false);\n          setPopover(false);\n        }}\n      >\n        {children}\n        {target === '_blank' && <VisuallyHiddenText>{t('opens_in_a_new_tab')}</VisuallyHiddenText>}\n        {!icon && target === '_blank' && <Icon name='open' />}\n      </StyledLink>\n\n      {!inModal && (\n        <Popover\n          data-testid={testIds.previewPopover}\n          show={previewPopover}\n          groupId='link_preview'\n          showDelay='short'\n          hideDelay={popoverHideDelay}\n          placement='bottom'\n          target={linkRef.current}\n          as={StyledLinkPopover}\n          arrow\n          preview\n          portal\n          onHide={hidePreviewPopover}\n        >\n          <StyledLinkPreviewPopoverBtn\n            data-testid={testIds.preview}\n            preview\n            type='button'\n            ref={previewBtnRef}\n            onClick={onPreviewClick}\n            tabIndex='-1'\n          >\n            <Text>\n              <span>{t('preview')}</span>\n              <Flex container={{ inline: true, justify: 'end' }}>\n                <Keyboard keyName='Alt' />\n                <Keyboard keyName='P' />\n              </Flex>\n            </Text>\n          </StyledLinkPreviewPopoverBtn>\n        </Popover>\n      )}\n\n      <Popover\n        data-testid={testIds.previewPopover}\n        show={popover}\n        groupId='link_preview'\n        showDelay='short'\n        hideDelay={popoverHideDelay}\n        placement='bottom'\n        target={linkRef.current}\n        onMouseEnter={showPopover}\n        onMouseLeave={hidePopover}\n        as={StyledLinkPopover}\n        arrow\n        portal\n      >\n        {!inModal && (\n          <StyledLinkPopoverBtn\n            data-testid={testIds.preview}\n            preview\n            type='button'\n            ref={previewBtnRef}\n            onClick={onPreviewClick}\n            tabIndex='-1'\n          >\n            {t('preview')}\n          </StyledLinkPopoverBtn>\n        )}\n        <StyledLinkPopoverBtn\n          data-testid={testIds.newTab}\n          forwardedAs='a'\n          href={href}\n          target='_blank'\n          rel='noreferrer'\n          tabIndex='-1'\n        >\n          {t('link_open_in_tab_text')}\n        </StyledLinkPopoverBtn>\n      </Popover>\n\n      {previewable && (\n        <span id={`${uid}-preview-instructions`} hidden>\n          {t('preview_link_instruction', [macintosh ? 'option' : 'alt'])}\n        </span>\n      )}\n    </>\n  );\n});\n\nexport default withTestIds(Link, getLinkTestIds);\n"]}

package/lib/hooks/useI18n.d.ts

@@ -24,6 +24,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
     new: string;
     info: string;
     shortcuts: string;
+    label: string;
     remove: string;
     follow: string;
     unfollow: string;

package/lib/hooks/useI18n.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/lib/i18n/default.d.ts

@@ -20,6 +20,7 @@ declare const _default: {
     new: string;
     info: string;
     shortcuts: string;
+    label: string;
     remove: string;
     follow: string;
     unfollow: string;

package/lib/i18n/default.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"default.d.ts","sourceRoot":"","sources":["../../src/i18n/default.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wBAiqCE"}
+{"version":3,"file":"default.d.ts","sourceRoot":"","sources":["../../src/i18n/default.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,wBAkqCE"}

package/lib/i18n/default.js

@@ -24,6 +24,7 @@ export default {
     new: 'New',
     info: 'info',
     shortcuts: 'Shortcuts',
+    label: 'Label',
     /* Verbs */
     remove: 'Remove',
     follow: 'Follow',