@atlaskit/ads-mcp 0.20.4 → 0.21.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +17 -0
- package/a11y-fixes/package.json +14 -0
- package/a11y-guidelines/package.json +14 -0
- package/dist/cjs/entry-points/a11y-fixes.js +12 -0
- package/dist/cjs/entry-points/a11y-guidelines.js +12 -0
- package/dist/cjs/entry-points/i18n-conversion-guide.js +12 -0
- package/dist/cjs/entry-points/migration-registry.js +12 -0
- package/dist/cjs/helpers/analytics.js +1 -0
- package/dist/cjs/tools/get-all-components/components.codegen.js +3 -3
- package/dist/cjs/tools/get-atlaskit-components/atlaskit-components.codegen.js +633 -629
- package/dist/es2019/entry-points/a11y-fixes.js +1 -0
- package/dist/es2019/entry-points/a11y-guidelines.js +1 -0
- package/dist/es2019/entry-points/i18n-conversion-guide.js +1 -0
- package/dist/es2019/entry-points/migration-registry.js +1 -0
- package/dist/es2019/helpers/analytics.js +1 -0
- package/dist/es2019/tools/get-all-components/components.codegen.js +3 -3
- package/dist/es2019/tools/get-atlaskit-components/atlaskit-components.codegen.js +633 -629
- package/dist/esm/entry-points/a11y-fixes.js +1 -0
- package/dist/esm/entry-points/a11y-guidelines.js +1 -0
- package/dist/esm/entry-points/i18n-conversion-guide.js +1 -0
- package/dist/esm/entry-points/migration-registry.js +1 -0
- package/dist/esm/helpers/analytics.js +1 -0
- package/dist/esm/tools/get-all-components/components.codegen.js +3 -3
- package/dist/esm/tools/get-atlaskit-components/atlaskit-components.codegen.js +633 -629
- package/dist/types/entry-points/a11y-fixes.d.ts +1 -0
- package/dist/types/entry-points/a11y-guidelines.d.ts +1 -0
- package/dist/types/entry-points/i18n-conversion-guide.d.ts +1 -0
- package/dist/types/entry-points/migration-registry.d.ts +1 -0
- package/dist/types/tools/get-all-components/components.codegen.d.ts +2 -2
- package/dist/types/tools/get-atlaskit-components/atlaskit-components.codegen.d.ts +2 -2
- package/dist/types-ts4.5/entry-points/a11y-fixes.d.ts +1 -0
- package/dist/types-ts4.5/entry-points/a11y-guidelines.d.ts +1 -0
- package/dist/types-ts4.5/entry-points/i18n-conversion-guide.d.ts +1 -0
- package/dist/types-ts4.5/entry-points/migration-registry.d.ts +1 -0
- package/dist/types-ts4.5/tools/get-all-components/components.codegen.d.ts +2 -2
- package/dist/types-ts4.5/tools/get-atlaskit-components/atlaskit-components.codegen.d.ts +2 -2
- package/i18n-conversion-guide/package.json +14 -0
- package/migration-registry/package.json +14 -0
- package/package.json +3 -3
- package/dist/cjs/tools/migration-guides/registry.js +0 -38
- package/dist/es2019/tools/migration-guides/registry.js +0 -25
- package/dist/esm/tools/migration-guides/registry.js +0 -27
- package/dist/types/tools/migration-guides/registry.d.ts +0 -18
- package/dist/types-ts4.5/tools/migration-guides/registry.d.ts +0 -18
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
*
|
|
4
4
|
* Structured content components from design-system *.docs.tsx files
|
|
5
5
|
*
|
|
6
|
-
* @codegen <<SignedSource::
|
|
7
|
-
* @codegenCommand yarn workspace @af/ads-ai-tooling codegen:
|
|
6
|
+
* @codegen <<SignedSource::bd5b86ae65b6b9e48b637d6a463db4f9>>
|
|
7
|
+
* @codegenCommand yarn workspace @af/ads-ai-tooling codegen:atlaskit-components
|
|
8
8
|
*/
|
|
9
9
|
/* eslint-disable @repo/internal/react/boolean-prop-naming-convention -- not our types */
|
|
10
10
|
|
|
@@ -375,6 +375,26 @@ export var atlaskitComponents = [{
|
|
|
375
375
|
name: 'waitForMediaUpload',
|
|
376
376
|
type: 'boolean'
|
|
377
377
|
}]
|
|
378
|
+
}, {
|
|
379
|
+
name: 'Editor Core',
|
|
380
|
+
package: '@atlaskit/editor-extension-dropbox',
|
|
381
|
+
description: 'A an atlassian editor extension to add a native dropbox picker',
|
|
382
|
+
status: 'general-availability',
|
|
383
|
+
usageGuidelines: [],
|
|
384
|
+
contentGuidelines: [],
|
|
385
|
+
accessibilityGuidelines: [],
|
|
386
|
+
keywords: ['editor', 'extension-dropbox', 'atlaskit'],
|
|
387
|
+
category: 'editor',
|
|
388
|
+
examples: ["import React, { useState } from 'react';\nimport Button from '@atlaskit/button/new';\nimport SectionMessage from '@atlaskit/section-message';\nimport Modal from '../src/modal';\nexport default (): React.JSX.Element => {\n\tconst [isOpen, setIsOpen] = useState(true);\n\treturn (\n\t\t<>\n\t\t\t<SectionMessage appearance=\"warning\">\n\t\t\t\tInternal component only - not consumable outside this package\n\t\t\t</SectionMessage>\n\t\t\t<Button onClick={() => setIsOpen(true)}>Show Modal</Button>\n\t\t\t<Modal\n\t\t\t\tshowModal={isOpen}\n\t\t\t\tonClose={() => setIsOpen(false)}\n\t\t\t\tTEST_ONLY_src=\"http://localhost:9000/examples.html?groupId=editor&packageId=extension-dropbox&exampleId=bad-example-modal-content\"\n\t\t\t/>\n\t\t</>\n\t);\n};"],
|
|
389
|
+
props: [{
|
|
390
|
+
name: 'appKey',
|
|
391
|
+
type: 'string',
|
|
392
|
+
isRequired: true
|
|
393
|
+
}, {
|
|
394
|
+
name: 'canMountinIframe',
|
|
395
|
+
type: 'boolean',
|
|
396
|
+
isRequired: true
|
|
397
|
+
}]
|
|
378
398
|
}, {
|
|
379
399
|
name: 'Editor Plugin Block Controls',
|
|
380
400
|
package: '@atlaskit/editor-plugin-block-controls',
|
|
@@ -502,7 +522,7 @@ export var atlaskitComponents = [{
|
|
|
502
522
|
examples: ["import applyDevTools from 'prosemirror-dev-tools';\nimport { ComposableEditor } from '@atlaskit/editor-core/composable-editor';\nimport { usePreset } from '@atlaskit/editor-core/use-preset';\nimport { analyticsPlugin } from '@atlaskit/editor-plugins/analytics';\nimport { annotationPlugin } from '@atlaskit/editor-plugins/annotation';\nimport type { AnnotationProviders } from '@atlaskit/editor-plugins/annotation';\nimport { basePlugin } from '@atlaskit/editor-plugins/base';\nimport { blockControlsPlugin } from '@atlaskit/editor-plugins/block-controls';\nimport { blockTypePlugin } from '@atlaskit/editor-plugins/block-type';\nimport { breakoutPlugin } from '@atlaskit/editor-plugins/breakout';\nimport { codeBlockPlugin } from '@atlaskit/editor-plugins/code-block';\nimport { compositionPlugin } from '@atlaskit/editor-plugins/composition';\nimport { contentInsertionPlugin } from '@atlaskit/editor-plugins/content-insertion';\nimport { copyButtonPlugin } from '@atlaskit/editor-plugins/copy-button';\nimport { decorationsPlugin } from '@atlaskit/editor-plugins/decorations';\nimport { editorDisabledPlugin } from '@atlaskit/editor-plugins/editor-disabled';\nimport { emojiPlugin } from '@atlaskit/editor-plugins/emoji';\nimport { expandPlugin } from '@atlaskit/editor-plugins/expand';\nimport { extensionPlugin } from '@atlaskit/editor-plugins/extension';\nimport { floatingToolbarPlugin } from '@atlaskit/editor-plugins/floating-toolbar';\nimport { focusPlugin } from '@atlaskit/editor-plugins/focus';\nimport { gridPlugin } from '@atlaskit/editor-plugins/grid';\nimport { guidelinePlugin } from '@atlaskit/editor-plugins/guideline';\nimport { layoutPlugin } from '@atlaskit/editor-plugins/layout';\nimport { listPlugin } from '@atlaskit/editor-plugins/list';\nimport { mediaPlugin } from '@atlaskit/editor-plugins/media';\nimport { panelPlugin } from '@atlaskit/editor-plugins/panel';\nimport { quickInsertPlugin } from '@atlaskit/editor-plugins/quick-insert';\nimport { rulePlugin } from '@atlaskit/editor-plugins/rule';\nimport { selectionPlugin } from '@atlaskit/editor-plugins/selection';\nimport { selectionToolbarPlugin } from '@atlaskit/editor-plugins/selection-toolbar';\nimport { tablesPlugin } from '@atlaskit/editor-plugins/table';\nimport { tasksAndDecisionsPlugin } from '@atlaskit/editor-plugins/tasks-and-decisions';\nimport { textFormattingPlugin } from '@atlaskit/editor-plugins/text-formatting';\nimport { typeAheadPlugin } from '@atlaskit/editor-plugins/type-ahead';\nimport { widthPlugin } from '@atlaskit/editor-plugins/width';\nimport { LocalUserPreferencesProvider } from './user-preferences-provider';\nexport default function Editor(): React.JSX.Element {\n\tconst localUserPreferencesProvider = new LocalUserPreferencesProvider();\n\tconst { preset } = usePreset((builder) =>\n\t\tbuilder\n\t\t\t.add(basePlugin)\n\t\t\t.add(blockTypePlugin)\n\t\t\t.add(focusPlugin)\n\t\t\t.add(typeAheadPlugin)\n\t\t\t.add(quickInsertPlugin)\n\t\t\t.add(selectionPlugin)\n\t\t\t.add(decorationsPlugin)\n\t\t\t.add(layoutPlugin)\n\t\t\t.add(listPlugin)\n\t\t\t.add([analyticsPlugin, {}])\n\t\t\t.add(contentInsertionPlugin)\n\t\t\t.add(widthPlugin)\n\t\t\t.add(guidelinePlugin)\n\t\t\t.add(textFormattingPlugin)\n\t\t\t.add([\n\t\t\t\ttablesPlugin,\n\t\t\t\t{\n\t\t\t\t\ttableOptions: {\n\t\t\t\t\t\tadvanced: true,\n\t\t\t\t\t\tallowColumnResizing: true,\n\t\t\t\t\t\tallowHeaderRow: true,\n\t\t\t\t\t\tallowTableResizing: true,\n\t\t\t\t\t},\n\t\t\t\t\tisTableScalingEnabled: true,\n\t\t\t\t\tallowContextualMenu: true,\n\t\t\t\t\tfullWidthEnabled: true,\n\t\t\t\t},\n\t\t\t])\n\t\t\t.add(emojiPlugin)\n\t\t\t.add(panelPlugin)\n\t\t\t.add(rulePlugin)\n\t\t\t.add(tasksAndDecisionsPlugin)\n\t\t\t.add([expandPlugin, { allowInsertion: true, appearance: 'full-page' }])\n\t\t\t.add(editorDisabledPlugin)\n\t\t\t.add(copyButtonPlugin)\n\t\t\t.add(compositionPlugin)\n\t\t\t.add(codeBlockPlugin)\n\t\t\t.add(blockControlsPlugin)\n\t\t\t.add(breakoutPlugin)\n\t\t\t.add(gridPlugin)\n\t\t\t.add(floatingToolbarPlugin)\n\t\t\t.add([\n\t\t\t\tselectionToolbarPlugin,\n\t\t\t\t{\n\t\t\t\t\tpreferenceToolbarAboveSelection: true,\n\t\t\t\t\tcontextualFormattingEnabled: true,\n\t\t\t\t\tuserPreferencesProvider: localUserPreferencesProvider,\n\t\t\t\t},\n\t\t\t])\n\t\t\t.add([\n\t\t\t\tmediaPlugin,\n\t\t\t\t{\n\t\t\t\t\tallowMediaSingle: { disableLayout: true },\n\t\t\t\t\tallowMediaGroup: false,\n\t\t\t\t\tallowResizing: true,\n\t\t\t\t\tisCopyPasteEnabled: true,\n\t\t\t\t\tallowBreakoutSnapPoints: true,\n\t\t\t\t\tallowAdvancedToolBarOptions: true,\n\t\t\t\t\tallowDropzoneDropLine: true,\n\t\t\t\t\tallowMediaSingleEditable: true,\n\t\t\t\t\tallowImagePreview: true,\n\t\t\t\t\tfullWidthEnabled: true,\n\t\t\t\t\twaitForMediaUpload: true,\n\t\t\t\t},\n\t\t\t])\n\t\t\t.add([\n\t\t\t\tannotationPlugin,\n\t\t\t\t{\n\t\t\t\t\tinlineComment: {},\n\t\t\t\t} as AnnotationProviders,\n\t\t\t])\n\t\t\t.add(extensionPlugin),\n\t);\n\treturn (\n\t\t<ComposableEditor\n\t\t\tappearance=\"full-page\"\n\t\t\tonChange={(view) => {\n\t\t\t\tapplyDevTools(view);\n\t\t\t}}\n\t\t\tpreset={preset}\n\t\t/>\n\t);\n}"],
|
|
503
523
|
props: [{
|
|
504
524
|
name: 'api',
|
|
505
|
-
type: '{ selectionToolbar: BasePluginDependenciesAPI<{ actions?: {
|
|
525
|
+
type: '{ selectionToolbar: BasePluginDependenciesAPI<{ actions?: { clearToolbarDockingOverride?: () => boolean; forceToolbarDockingWithoutAnalytics?: (toolbarDocking: ToolbarDocking) => boolean; overrideToolbarDocking?: (toolbarDocking: ToolbarDocking) => boolean; refreshToolbarDocking?: () => boolean; setToolbarDocking?: ...'
|
|
506
526
|
}, {
|
|
507
527
|
name: 'config',
|
|
508
528
|
type: '{ contextualFormattingEnabled?: boolean; disablePin?: boolean; preferenceToolbarAboveSelection?: boolean; userPreferencesProvider?: UserPreferencesProvider; }',
|
|
@@ -597,7 +617,7 @@ export var atlaskitComponents = [{
|
|
|
597
617
|
examples: ["import applyDevTools from 'prosemirror-dev-tools';\nimport { ComposableEditor } from '@atlaskit/editor-core/composable-editor';\nimport { usePreset } from '@atlaskit/editor-core/use-preset';\nimport { analyticsPlugin } from '@atlaskit/editor-plugins/analytics';\nimport { annotationPlugin } from '@atlaskit/editor-plugins/annotation';\nimport type { AnnotationProviders } from '@atlaskit/editor-plugins/annotation';\nimport { basePlugin } from '@atlaskit/editor-plugins/base';\nimport { blockControlsPlugin } from '@atlaskit/editor-plugins/block-controls';\nimport { blockTypePlugin } from '@atlaskit/editor-plugins/block-type';\nimport { breakoutPlugin } from '@atlaskit/editor-plugins/breakout';\nimport { codeBlockPlugin } from '@atlaskit/editor-plugins/code-block';\nimport { compositionPlugin } from '@atlaskit/editor-plugins/composition';\nimport { contentInsertionPlugin } from '@atlaskit/editor-plugins/content-insertion';\nimport { copyButtonPlugin } from '@atlaskit/editor-plugins/copy-button';\nimport { decorationsPlugin } from '@atlaskit/editor-plugins/decorations';\nimport { editorDisabledPlugin } from '@atlaskit/editor-plugins/editor-disabled';\nimport { emojiPlugin } from '@atlaskit/editor-plugins/emoji';\nimport { expandPlugin } from '@atlaskit/editor-plugins/expand';\nimport { extensionPlugin } from '@atlaskit/editor-plugins/extension';\nimport { floatingToolbarPlugin } from '@atlaskit/editor-plugins/floating-toolbar';\nimport { focusPlugin } from '@atlaskit/editor-plugins/focus';\nimport { gridPlugin } from '@atlaskit/editor-plugins/grid';\nimport { guidelinePlugin } from '@atlaskit/editor-plugins/guideline';\nimport { layoutPlugin } from '@atlaskit/editor-plugins/layout';\nimport { listPlugin } from '@atlaskit/editor-plugins/list';\nimport { mediaPlugin } from '@atlaskit/editor-plugins/media';\nimport { panelPlugin } from '@atlaskit/editor-plugins/panel';\nimport { quickInsertPlugin } from '@atlaskit/editor-plugins/quick-insert';\nimport { rulePlugin } from '@atlaskit/editor-plugins/rule';\nimport { selectionPlugin } from '@atlaskit/editor-plugins/selection';\nimport { selectionToolbarPlugin } from '@atlaskit/editor-plugins/selection-toolbar';\nimport { tablesPlugin } from '@atlaskit/editor-plugins/table';\nimport { tasksAndDecisionsPlugin } from '@atlaskit/editor-plugins/tasks-and-decisions';\nimport { textFormattingPlugin } from '@atlaskit/editor-plugins/text-formatting';\nimport { typeAheadPlugin } from '@atlaskit/editor-plugins/type-ahead';\nimport { widthPlugin } from '@atlaskit/editor-plugins/width';\nimport { getUserPreferencesProvider } from '@atlaskit/editor-test-helpers/mock-user-preference-provider';\nimport { userPreferencesPlugin } from '../src';\n/**\n * This is an example Editor class\n * @example return <Editor />\n */\nexport default function Editor(): React.JSX.Element {\n\tconst { preset } = usePreset((builder) =>\n\t\tbuilder\n\t\t\t.add(basePlugin)\n\t\t\t.add(blockTypePlugin)\n\t\t\t.add([userPreferencesPlugin, { userPreferencesProvider: getUserPreferencesProvider() }])\n\t\t\t.add(focusPlugin)\n\t\t\t.add(typeAheadPlugin)\n\t\t\t.add(quickInsertPlugin)\n\t\t\t.add(selectionPlugin)\n\t\t\t.add(decorationsPlugin)\n\t\t\t.add(layoutPlugin)\n\t\t\t.add(listPlugin)\n\t\t\t.add([analyticsPlugin, {}])\n\t\t\t.add(contentInsertionPlugin)\n\t\t\t.add(widthPlugin)\n\t\t\t.add(guidelinePlugin)\n\t\t\t.add(textFormattingPlugin)\n\t\t\t.add([\n\t\t\t\ttablesPlugin,\n\t\t\t\t{\n\t\t\t\t\ttableOptions: {\n\t\t\t\t\t\tadvanced: true,\n\t\t\t\t\t\tallowColumnResizing: true,\n\t\t\t\t\t\tallowHeaderRow: true,\n\t\t\t\t\t\tallowTableResizing: true,\n\t\t\t\t\t},\n\t\t\t\t\tisTableScalingEnabled: true,\n\t\t\t\t\tallowContextualMenu: true,\n\t\t\t\t\tfullWidthEnabled: true,\n\t\t\t\t},\n\t\t\t])\n\t\t\t.add(emojiPlugin)\n\t\t\t.add(panelPlugin)\n\t\t\t.add(rulePlugin)\n\t\t\t.add(tasksAndDecisionsPlugin)\n\t\t\t.add([expandPlugin, { allowInsertion: true, appearance: 'full-page' }])\n\t\t\t.add(editorDisabledPlugin)\n\t\t\t.add(copyButtonPlugin)\n\t\t\t.add(compositionPlugin)\n\t\t\t.add(codeBlockPlugin)\n\t\t\t.add(blockControlsPlugin)\n\t\t\t.add(breakoutPlugin)\n\t\t\t.add(gridPlugin)\n\t\t\t.add(floatingToolbarPlugin)\n\t\t\t.add([\n\t\t\t\tselectionToolbarPlugin,\n\t\t\t\t{\n\t\t\t\t\tpreferenceToolbarAboveSelection: true,\n\t\t\t\t\tcontextualFormattingEnabled: true,\n\t\t\t\t},\n\t\t\t])\n\t\t\t.add([\n\t\t\t\tmediaPlugin,\n\t\t\t\t{\n\t\t\t\t\tallowMediaSingle: { disableLayout: true },\n\t\t\t\t\tallowMediaGroup: false,\n\t\t\t\t\tallowResizing: true,\n\t\t\t\t\tisCopyPasteEnabled: true,\n\t\t\t\t\tallowBreakoutSnapPoints: true,\n\t\t\t\t\tallowAdvancedToolBarOptions: true,\n\t\t\t\t\tallowDropzoneDropLine: true,\n\t\t\t\t\tallowMediaSingleEditable: true,\n\t\t\t\t\tallowImagePreview: true,\n\t\t\t\t\tfullWidthEnabled: true,\n\t\t\t\t\twaitForMediaUpload: true,\n\t\t\t\t},\n\t\t\t])\n\t\t\t.add([\n\t\t\t\tannotationPlugin,\n\t\t\t\t{\n\t\t\t\t\tinlineComment: {},\n\t\t\t\t} as AnnotationProviders,\n\t\t\t])\n\t\t\t.add(extensionPlugin),\n\t);\n\treturn (\n\t\t<ComposableEditor\n\t\t\tappearance=\"full-page\"\n\t\t\tonChange={(view) => {\n\t\t\t\tapplyDevTools(view);\n\t\t\t}}\n\t\t\tpreset={preset}\n\t\t/>\n\t);\n}"],
|
|
598
618
|
props: [{
|
|
599
619
|
name: 'api',
|
|
600
|
-
type: '{ userPreferences: BasePluginDependenciesAPI<{ actions: { getUserPreferences: () => ResolvedUserPreferences; updateUserPreference: (key: "toolbarDockingPosition", value: "top" | "none") => EditorCommand; }; dependencies: [...]; pluginConfiguration: UserPreferencesPluginOptions; sharedState:
|
|
620
|
+
type: '{ userPreferences: BasePluginDependenciesAPI<{ actions: { getUserPreferences: () => ResolvedUserPreferences; updateUserPreference: (key: "toolbarDockingPosition", value: "top" | "none") => EditorCommand; }; commands: { ...; }; dependencies: [...]; pluginConfiguration: UserPreferencesPluginOptions; sharedState: UserP...'
|
|
601
621
|
}, {
|
|
602
622
|
name: 'config',
|
|
603
623
|
type: '{ initialUserPreferences?: ResolvedUserPreferences; userPreferencesProvider?: UserPreferencesProvider; }',
|
|
@@ -661,264 +681,219 @@ export var atlaskitComponents = [{
|
|
|
661
681
|
isRequired: true
|
|
662
682
|
}]
|
|
663
683
|
}, {
|
|
664
|
-
name: '
|
|
665
|
-
package: '@atlaskit/
|
|
666
|
-
description: '
|
|
684
|
+
name: 'AssetsConfigModal',
|
|
685
|
+
package: '@atlaskit/link-datasource',
|
|
686
|
+
description: 'Configuration modal for the Assets (object schema) datasource. Lets users set up a list of links from an Assets schema and produces Assets datasource ADF.',
|
|
667
687
|
status: 'general-availability',
|
|
668
|
-
usageGuidelines: [],
|
|
688
|
+
usageGuidelines: ['Use when the user is configuring an Assets-based list of links. On confirm, use the returned parameters for datasource ADF or table view.'],
|
|
669
689
|
contentGuidelines: [],
|
|
670
|
-
accessibilityGuidelines: [],
|
|
671
|
-
keywords: ['
|
|
672
|
-
category: '
|
|
673
|
-
examples: ["import React, { useState } from 'react';\nimport Button from '@atlaskit/button/new';\nimport
|
|
690
|
+
accessibilityGuidelines: ['Ensure the modal has an accessible title and that schema/object pickers have clear labels.'],
|
|
691
|
+
keywords: ['link-datasource', 'assets', 'datasource', 'config', 'modal'],
|
|
692
|
+
category: 'linking',
|
|
693
|
+
examples: ["import React, { useState } from 'react';\nimport Button from '@atlaskit/button/new';\nimport { SmartCardProvider } from '@atlaskit/link-provider';\nimport { mockAssetsClientFetchRequests } from '@atlaskit/link-test-helpers/assets';\nimport SmartLinkClient from '../../examples-helpers/smartLinkCustomClient';\nimport { ASSETS_LIST_OF_LINKS_DATASOURCE_ID, type AssetsDatasourceParameters } from '../../src';\nimport JSMAssetsConfigModal from '../../src/ui/assets-modal';\nmockAssetsClientFetchRequests({ delayedResponse: false });\nconst mockVisibleColumnKeys = [\n\t'Key',\n\t'Label',\n\t'Created',\n\t'Is Virtual',\n\t'Hardware Components',\n\t'Applications',\n\t'Software Services',\n\t'Number of Slots',\n\t'Primary Capability',\n\t'Owners',\n\t'Notes',\n];\nexport default (): React.JSX.Element => {\n\tconst [showModal, setShowModal] = useState(false);\n\tconst [parameters] = useState<AssetsDatasourceParameters>({\n\t\taql: 'dummy aql',\n\t\tworkspaceId: '',\n\t\tschemaId: '1',\n\t});\n\tconst [visibleColumnKeys] = useState<string[] | undefined>(mockVisibleColumnKeys);\n\tconst toggleIsOpen = () => setShowModal((prevOpenState) => !prevOpenState);\n\tconst closeModal = () => setShowModal(false);\n\treturn (\n\t\t<SmartCardProvider client={new SmartLinkClient()}>\n\t\t\t<Button appearance=\"primary\" onClick={toggleIsOpen}>\n\t\t\t\tToggle Modal\n\t\t\t</Button>\n\t\t\t{showModal && (\n\t\t\t\t<JSMAssetsConfigModal\n\t\t\t\t\tdatasourceId={ASSETS_LIST_OF_LINKS_DATASOURCE_ID}\n\t\t\t\t\tvisibleColumnKeys={visibleColumnKeys}\n\t\t\t\t\tparameters={parameters}\n\t\t\t\t\tonCancel={closeModal}\n\t\t\t\t\tonInsert={closeModal}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</SmartCardProvider>\n\t);\n};"],
|
|
674
694
|
props: [{
|
|
675
|
-
name: '
|
|
695
|
+
name: 'columnCustomSizes',
|
|
696
|
+
type: 'ColumnSizesMap',
|
|
697
|
+
description: 'Map of column key to custom column width'
|
|
698
|
+
}, {
|
|
699
|
+
name: 'datasourceId',
|
|
676
700
|
type: 'string',
|
|
701
|
+
description: 'Unique identifier for which type of datasource is being rendered and for making its requests',
|
|
677
702
|
isRequired: true
|
|
678
703
|
}, {
|
|
679
|
-
name: '
|
|
704
|
+
name: 'disableDisplayDropdown',
|
|
680
705
|
type: 'boolean',
|
|
706
|
+
description: 'Disable the view mode display dropdown'
|
|
707
|
+
}, {
|
|
708
|
+
name: 'onCancel',
|
|
709
|
+
type: '() => void',
|
|
710
|
+
description: 'Callback function to be invoked when the modal is closed either via cancel button click, esc keydown, or modal blanket click',
|
|
711
|
+
isRequired: true
|
|
712
|
+
}, {
|
|
713
|
+
name: 'onInsert',
|
|
714
|
+
type: '(adf: InlineCardAdf | AssetsDatasourceAdf, analyticsEvent?: UIAnalyticsEvent) => void',
|
|
715
|
+
description: 'Callback function to be invoked when the insert issues button is clicked',
|
|
681
716
|
isRequired: true
|
|
717
|
+
}, {
|
|
718
|
+
name: 'parameters',
|
|
719
|
+
type: 'DatasourceParameters | AssetsDatasourceParameters',
|
|
720
|
+
description: 'Parameters for making the data requests necessary to render data within the table'
|
|
721
|
+
}, {
|
|
722
|
+
name: 'shouldReturnFocus',
|
|
723
|
+
type: 'boolean | React.RefObject<HTMLElement>',
|
|
724
|
+
description: 'Set the focus to return to the element that had focus before focus lock was activated or pass through a specific ref element\nDefaults to false, meaning focus remains where it was when the FocusLock was deactivated'
|
|
725
|
+
}, {
|
|
726
|
+
name: 'url',
|
|
727
|
+
type: 'string',
|
|
728
|
+
description: 'The url that was used to insert a List of Links'
|
|
729
|
+
}, {
|
|
730
|
+
name: 'viewMode',
|
|
731
|
+
type: '"table" | "inline"',
|
|
732
|
+
description: "The view mode that the modal will show on open:\n- Table = Displays a list of links in table format\n- Inline = Presents a smart link that shows the count of query results. However, if there's only one result, it converts to an inline smart link of that issue."
|
|
733
|
+
}, {
|
|
734
|
+
name: 'visibleColumnKeys',
|
|
735
|
+
type: 'string[]',
|
|
736
|
+
description: 'List of properties/column keys that are visible/selected'
|
|
737
|
+
}, {
|
|
738
|
+
name: 'wrappedColumnKeys',
|
|
739
|
+
type: 'string[]',
|
|
740
|
+
description: 'List of column keys that needs to be shown without truncation (content will wrap to a new line)'
|
|
682
741
|
}]
|
|
683
742
|
}, {
|
|
684
|
-
name: '
|
|
685
|
-
package: '@atlaskit/
|
|
686
|
-
description: '
|
|
743
|
+
name: 'ConfluenceSearchConfigModal',
|
|
744
|
+
package: '@atlaskit/link-datasource',
|
|
745
|
+
description: 'Configuration modal for the Confluence search datasource. Lets users set up a "list of links" backed by a Confluence search query (space, query, sort) and produces Confluence search datasource ADF.',
|
|
687
746
|
status: 'general-availability',
|
|
688
|
-
usageGuidelines: ['Use
|
|
747
|
+
usageGuidelines: ['Use when the user is configuring a Confluence search-based list of links (e.g. in a block or sidebar). On confirm, use the returned parameters to build datasource ADF or pass to DatasourceTableView.'],
|
|
689
748
|
contentGuidelines: [],
|
|
690
|
-
accessibilityGuidelines: [],
|
|
691
|
-
keywords: ['
|
|
692
|
-
category: '
|
|
693
|
-
examples: ["import
|
|
749
|
+
accessibilityGuidelines: ['Ensure the modal has an accessible title and focus is trapped; form fields (space, query, sort) must have labels and error messages announced.'],
|
|
750
|
+
keywords: ['link-datasource', 'confluence', 'search', 'datasource', 'config', 'modal'],
|
|
751
|
+
category: 'linking',
|
|
752
|
+
examples: ["import React, { useState } from 'react';\nimport { IntlProvider } from 'react-intl';\nimport Button from '@atlaskit/button/standard-button';\nimport { SmartCardProvider } from '@atlaskit/link-provider';\nimport {\n\tdefaultInitialVisibleConfluenceColumnKeys,\n\tmockBasicFilterAGGFetchRequests,\n\tmockDatasourceFetchRequests,\n\tmockProductsData,\n\tmockSiteData,\n} from '@atlaskit/link-test-helpers/datasource';\nimport SmartLinkClient from '../../examples-helpers/smartLinkCustomClient';\nimport { CONFLUENCE_SEARCH_DATASOURCE_ID } from '../../src/ui/confluence-search-modal';\nimport { ConfluenceSearchConfigModal } from '../../src/ui/confluence-search-modal/modal';\nimport { type ConfluenceSearchDatasourceParameters } from '../../src/ui/confluence-search-modal/types';\nmockDatasourceFetchRequests({\n\ttype: 'confluence',\n\tdelayedResponse: false,\n\tshouldMockORSBatch: true,\n\tavailableSitesOverride: mockSiteData.filter(\n\t\t(site) => !['test1', 'test2', 'test4'].includes(site.displayName),\n\t),\n\taccessibleProductsOverride: mockProductsData.filter((product) =>\n\t\t['confluence.ondemand'].includes(product.productId),\n\t),\n});\nmockBasicFilterAGGFetchRequests();\nexport default (): React.JSX.Element => {\n\tconst [showModal, setShowModal] = useState(false);\n\tconst [parameters] = useState<ConfluenceSearchDatasourceParameters>({\n\t\tcloudId: '67899',\n\t\tsearchString: 'Searched something',\n\t});\n\tconst [visibleColumnKeys] = useState<string[] | undefined>(\n\t\tdefaultInitialVisibleConfluenceColumnKeys,\n\t);\n\tconst toggleIsOpen = () => setShowModal((prevOpenState) => !prevOpenState);\n\tconst closeModal = () => setShowModal(false);\n\treturn (\n\t\t<IntlProvider locale=\"en\">\n\t\t\t<SmartCardProvider client={new SmartLinkClient()}>\n\t\t\t\t<Button appearance=\"primary\" onClick={toggleIsOpen}>\n\t\t\t\t\tToggle Modal\n\t\t\t\t</Button>\n\t\t\t\t{showModal && (\n\t\t\t\t\t<ConfluenceSearchConfigModal\n\t\t\t\t\t\tdatasourceId={CONFLUENCE_SEARCH_DATASOURCE_ID}\n\t\t\t\t\t\tvisibleColumnKeys={visibleColumnKeys}\n\t\t\t\t\t\tparameters={parameters}\n\t\t\t\t\t\tonCancel={closeModal}\n\t\t\t\t\t\tonInsert={closeModal}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</SmartCardProvider>\n\t\t</IntlProvider>\n\t);\n};"],
|
|
694
753
|
props: [{
|
|
695
|
-
name: '
|
|
696
|
-
type: '
|
|
697
|
-
description: '
|
|
754
|
+
name: 'columnCustomSizes',
|
|
755
|
+
type: 'ColumnSizesMap',
|
|
756
|
+
description: 'Map of column key to custom column width'
|
|
698
757
|
}, {
|
|
699
|
-
name: '
|
|
700
|
-
type: '
|
|
758
|
+
name: 'datasourceId',
|
|
759
|
+
type: 'string',
|
|
760
|
+
description: 'Unique identifier for which type of datasource is being rendered and for making its requests',
|
|
761
|
+
isRequired: true
|
|
701
762
|
}, {
|
|
702
|
-
name: '
|
|
703
|
-
type: 'boolean'
|
|
763
|
+
name: 'disableDisplayDropdown',
|
|
764
|
+
type: 'boolean',
|
|
765
|
+
description: 'Disable the view mode display dropdown'
|
|
704
766
|
}, {
|
|
705
|
-
name: '
|
|
767
|
+
name: 'disableSiteSelector',
|
|
706
768
|
type: 'boolean'
|
|
707
769
|
}, {
|
|
708
|
-
name: '
|
|
709
|
-
type: '
|
|
770
|
+
name: 'onCancel',
|
|
771
|
+
type: '() => void',
|
|
772
|
+
description: 'Callback function to be invoked when the modal is closed either via cancel button click, esc keydown, or modal blanket click',
|
|
773
|
+
isRequired: true
|
|
710
774
|
}, {
|
|
711
|
-
name: '
|
|
712
|
-
type: '
|
|
775
|
+
name: 'onInsert',
|
|
776
|
+
type: '(adf: InlineCardAdf | ConfluenceSearchDatasourceAdf, analyticsEvent?: UIAnalyticsEvent) => void',
|
|
777
|
+
description: 'Callback function to be invoked when the insert issues button is clicked',
|
|
778
|
+
isRequired: true
|
|
713
779
|
}, {
|
|
714
|
-
name: '
|
|
715
|
-
type: '
|
|
780
|
+
name: 'overrideParameters',
|
|
781
|
+
type: '{ entityTypes?: string[]; }'
|
|
716
782
|
}, {
|
|
717
|
-
name: '
|
|
718
|
-
type: '
|
|
783
|
+
name: 'parameters',
|
|
784
|
+
type: 'DatasourceParameters | ConfluenceSearchDatasourceParameters',
|
|
785
|
+
description: 'Parameters for making the data requests necessary to render data within the table'
|
|
719
786
|
}, {
|
|
720
|
-
name: '
|
|
721
|
-
type: 'boolean |
|
|
787
|
+
name: 'shouldReturnFocus',
|
|
788
|
+
type: 'boolean | React.RefObject<HTMLElement>',
|
|
789
|
+
description: 'Set the focus to return to the element that had focus before focus lock was activated or pass through a specific ref element\nDefaults to false, meaning focus remains where it was when the FocusLock was deactivated'
|
|
722
790
|
}, {
|
|
723
|
-
name: '
|
|
724
|
-
type: '
|
|
791
|
+
name: 'url',
|
|
792
|
+
type: 'string',
|
|
793
|
+
description: 'The url that was used to insert a List of Links'
|
|
725
794
|
}, {
|
|
726
|
-
name: '
|
|
727
|
-
type: '
|
|
795
|
+
name: 'viewMode',
|
|
796
|
+
type: '"table" | "inline"',
|
|
797
|
+
description: "The view mode that the modal will show on open:\n- Table = Displays a list of links in table format\n- Inline = Presents a smart link that shows the count of query results. However, if there's only one result, it converts to an inline smart link of that issue."
|
|
728
798
|
}, {
|
|
729
|
-
name: '
|
|
730
|
-
type: '
|
|
799
|
+
name: 'visibleColumnKeys',
|
|
800
|
+
type: 'string[]',
|
|
801
|
+
description: 'List of properties/column keys that are visible/selected'
|
|
731
802
|
}, {
|
|
732
|
-
name: '
|
|
733
|
-
type: '
|
|
803
|
+
name: 'wrappedColumnKeys',
|
|
804
|
+
type: 'string[]',
|
|
805
|
+
description: 'List of column keys that needs to be shown without truncation (content will wrap to a new line)'
|
|
806
|
+
}]
|
|
807
|
+
}, {
|
|
808
|
+
name: 'DatasourceTableView',
|
|
809
|
+
package: '@atlaskit/link-datasource',
|
|
810
|
+
description: 'Table view component that renders a datasource (list of links) with configurable columns, sorting, and actions. Consumes datasource ADF or parameters and fetches data via the link client.',
|
|
811
|
+
status: 'general-availability',
|
|
812
|
+
usageGuidelines: ['Use when you need to display a list of links (Jira issues, Confluence search, Assets) in a table. Pass the datasource ADF or parameters; wrap in SmartCardProvider so resolution and actions work.'],
|
|
813
|
+
contentGuidelines: [],
|
|
814
|
+
accessibilityGuidelines: ['Ensure the table has a caption or aria-label; column headers and sort controls must be focusable and announced. Loading and error states should be announced.'],
|
|
815
|
+
keywords: ['link-datasource', 'table', 'datasource', 'list of links', 'view'],
|
|
816
|
+
category: 'linking',
|
|
817
|
+
examples: ["import { DatasourceTableView } from '@atlaskit/link-datasource';\nimport { ExampleJiraIssuesTableView } from '../examples-helpers/buildJiraIssuesTable';\nimport { FakeModalDialogContainer } from '../examples-helpers/fakeModalDialogContainer';\nexport default (): React.JSX.Element => {\n\treturn (\n\t\t<FakeModalDialogContainer>\n\t\t\t<ExampleJiraIssuesTableView DatasourceTable={DatasourceTableView} />\n\t\t</FakeModalDialogContainer>\n\t);\n};"],
|
|
818
|
+
props: [{
|
|
819
|
+
name: 'columnCustomSizes',
|
|
820
|
+
type: 'ColumnSizesMap',
|
|
821
|
+
description: 'Map of column key to custom column width'
|
|
734
822
|
}, {
|
|
735
|
-
name: '
|
|
736
|
-
type: '
|
|
823
|
+
name: 'datasourceId',
|
|
824
|
+
type: 'string',
|
|
825
|
+
description: 'Unique identifier for which type of datasource is being rendered and for making its requests',
|
|
826
|
+
isRequired: true
|
|
737
827
|
}, {
|
|
738
|
-
name: '
|
|
739
|
-
type: '
|
|
828
|
+
name: 'onColumnResize',
|
|
829
|
+
type: '(key: string, width: number) => void'
|
|
740
830
|
}, {
|
|
741
|
-
name: '
|
|
742
|
-
type: '
|
|
831
|
+
name: 'onVisibleColumnKeysChange',
|
|
832
|
+
type: '(visibleColumnKeys: string[]) => void',
|
|
833
|
+
description: 'Callback to be invoked whenever a user changes the visible columns in a datasource table\neither by selecting/unselecting or reordering (drag and drop)\n\n@param visibleColumnKeys the array of keys for all of the selected columns'
|
|
743
834
|
}, {
|
|
744
|
-
name: '
|
|
745
|
-
type: '
|
|
835
|
+
name: 'onWrappedColumnChange',
|
|
836
|
+
type: '(key: string, shouldWrap: boolean) => void',
|
|
837
|
+
description: 'Callback to be invoked whenever user changes wrap attribute of the column.\n\n@param key Column key\n@param shouldWrap Whenever column should wrap'
|
|
746
838
|
}, {
|
|
747
|
-
name: '
|
|
748
|
-
type: '
|
|
749
|
-
description: '
|
|
839
|
+
name: 'parameters',
|
|
840
|
+
type: 'DatasourceParameters',
|
|
841
|
+
description: 'Parameters for making the data requests necessary to render data within the table',
|
|
842
|
+
isRequired: true
|
|
750
843
|
}, {
|
|
751
|
-
name: '
|
|
752
|
-
type: '
|
|
844
|
+
name: 'scrollableContainerHeight',
|
|
845
|
+
type: 'number',
|
|
846
|
+
description: 'If this number is set it will restrict (max-height) maximum size of the component AND make main container a scrollable container.\nIt this number is 0 it will not restrict height and not make container scrollable.'
|
|
753
847
|
}, {
|
|
754
|
-
name: '
|
|
755
|
-
type: '
|
|
848
|
+
name: 'url',
|
|
849
|
+
type: 'string',
|
|
850
|
+
description: 'Url for an existing datasource, initially used for displaying to a user unauthorized to query that site'
|
|
756
851
|
}, {
|
|
757
|
-
name: '
|
|
758
|
-
type: '
|
|
852
|
+
name: 'visibleColumnKeys',
|
|
853
|
+
type: 'string[]',
|
|
854
|
+
description: 'List of properties/column keys that are visible/selected'
|
|
759
855
|
}, {
|
|
760
|
-
name: '
|
|
761
|
-
type: '
|
|
762
|
-
description: '
|
|
856
|
+
name: 'wrappedColumnKeys',
|
|
857
|
+
type: 'string[]',
|
|
858
|
+
description: 'List of column keys that needs to be shown without truncation (content will wrap to a new line)'
|
|
859
|
+
}]
|
|
860
|
+
}, {
|
|
861
|
+
name: 'JiraIssuesConfigModal',
|
|
862
|
+
package: '@atlaskit/link-datasource',
|
|
863
|
+
description: 'Configuration modal for the Jira issues datasource. Lets users set up a list of Jira issues (JQL, columns, filters) and produces Jira issues datasource ADF.',
|
|
864
|
+
status: 'general-availability',
|
|
865
|
+
usageGuidelines: ['Use when the user is configuring a Jira issues list (e.g. in a block or table). On confirm, use the returned parameters for datasource ADF or DatasourceTableView.'],
|
|
866
|
+
contentGuidelines: [],
|
|
867
|
+
accessibilityGuidelines: ['Ensure the modal has an accessible title and focus management; JQL and column pickers must have clear labels and error announcements.'],
|
|
868
|
+
keywords: ['link-datasource', 'jira', 'issues', 'datasource', 'config', 'modal', 'JQL'],
|
|
869
|
+
category: 'linking',
|
|
870
|
+
examples: ["import React, { useState } from 'react';\nimport { IntlProvider } from 'react-intl';\nimport Button from '@atlaskit/button/new';\nimport { SmartCardProvider } from '@atlaskit/link-provider';\nimport {\n\tdefaultInitialVisibleJiraColumnKeys,\n\tmockBasicFilterAGGFetchRequests,\n\tmockDatasourceFetchRequests,\n\tmockProductsData,\n\tmockSiteData,\n} from '@atlaskit/link-test-helpers/datasource';\nimport SmartLinkClient from '../../examples-helpers/smartLinkCustomClient';\nimport { JIRA_LIST_OF_LINKS_DATASOURCE_ID, JiraIssuesConfigModal } from '../../src';\nmockDatasourceFetchRequests({\n\tdelayedResponse: false,\n\tshouldMockORSBatch: true,\n\tavailableSitesOverride: mockSiteData\n\t\t.map((site, index) => ({\n\t\t\t...site,\n\t\t\tcloudId: index === 0 ? 'doc-cloudId' : site.cloudId,\n\t\t}))\n\t\t.filter((site) => !['test1', 'test2', 'test4'].includes(site.displayName)),\n\taccessibleProductsOverride: mockProductsData\n\t\t.filter((product) => ['jira-servicedesk.ondemand'].includes(product.productId))\n\t\t.flatMap((product) => ({\n\t\t\t...product,\n\t\t\tworkspaces: product.workspaces?.map((workspace, index) => ({\n\t\t\t\t...workspace,\n\t\t\t\tcloudId: index === 0 ? 'doc-cloudId' : workspace.cloudId,\n\t\t\t})),\n\t\t})),\n});\nmockBasicFilterAGGFetchRequests({ withJiraFilterHydration: false });\nexport default (): React.JSX.Element => {\n\tconst [showModal, setShowModal] = useState(false);\n\tconst [visibleColumnKeys] = useState<string[] | undefined>(defaultInitialVisibleJiraColumnKeys);\n\tconst [columnCustomSizes] = useState<{ [key: string]: number } | undefined>();\n\tconst [wrappedColumnKeys] = useState<string[] | undefined>();\n\tconst toggleIsOpen = () => setShowModal((prevOpenState) => !prevOpenState);\n\tconst closeModal = () => setShowModal(false);\n\treturn (\n\t\t<IntlProvider locale=\"en\">\n\t\t\t<SmartCardProvider client={new SmartLinkClient()}>\n\t\t\t\t<Button appearance=\"primary\" onClick={toggleIsOpen}>\n\t\t\t\t\tToggle Modal\n\t\t\t\t</Button>\n\t\t\t\t{showModal && (\n\t\t\t\t\t<JiraIssuesConfigModal\n\t\t\t\t\t\tdatasourceId={JIRA_LIST_OF_LINKS_DATASOURCE_ID}\n\t\t\t\t\t\tvisibleColumnKeys={visibleColumnKeys}\n\t\t\t\t\t\tcolumnCustomSizes={columnCustomSizes}\n\t\t\t\t\t\twrappedColumnKeys={wrappedColumnKeys}\n\t\t\t\t\t\tparameters={{ cloudId: 'doc-cloudId' }}\n\t\t\t\t\t\tonCancel={closeModal}\n\t\t\t\t\t\tonInsert={closeModal}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</SmartCardProvider>\n\t\t</IntlProvider>\n\t);\n};", "import { DatasourceTableView } from '@atlaskit/link-datasource';\nimport { ExampleJiraIssuesTableView } from '../examples-helpers/buildJiraIssuesTable';\nimport { FakeModalDialogContainer } from '../examples-helpers/fakeModalDialogContainer';\nexport default (): React.JSX.Element => {\n\treturn (\n\t\t<FakeModalDialogContainer>\n\t\t\t<ExampleJiraIssuesTableView DatasourceTable={DatasourceTableView} />\n\t\t</FakeModalDialogContainer>\n\t);\n};"],
|
|
871
|
+
props: [{
|
|
872
|
+
name: 'columnCustomSizes',
|
|
873
|
+
type: 'ColumnSizesMap',
|
|
874
|
+
description: 'Map of column key to custom column width'
|
|
763
875
|
}, {
|
|
764
|
-
name: '
|
|
765
|
-
type: '
|
|
876
|
+
name: 'datasourceId',
|
|
877
|
+
type: 'string',
|
|
878
|
+
description: 'Unique identifier for which type of datasource is being rendered and for making its requests',
|
|
766
879
|
isRequired: true
|
|
767
880
|
}, {
|
|
768
|
-
name: '
|
|
769
|
-
type: '
|
|
881
|
+
name: 'disableDisplayDropdown',
|
|
882
|
+
type: 'boolean',
|
|
883
|
+
description: 'Disable the view mode display dropdown'
|
|
770
884
|
}, {
|
|
771
|
-
name: '
|
|
772
|
-
type: '
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
type: 'EventHandlers'
|
|
776
|
-
}, {
|
|
777
|
-
name: 'extensionHandlers',
|
|
778
|
-
type: 'ExtensionHandlers<any>'
|
|
779
|
-
}, {
|
|
780
|
-
name: 'extensionViewportSizes',
|
|
781
|
-
type: 'ExtensionViewportSize[]'
|
|
782
|
-
}, {
|
|
783
|
-
name: 'fadeOutHeight',
|
|
784
|
-
type: 'number'
|
|
785
|
-
}, {
|
|
786
|
-
name: 'featureFlags',
|
|
787
|
-
type: '{ [featureFlag: string]: boolean; } | Partial<RawObjectFeatureFlags>',
|
|
788
|
-
description: "@description\nShort lived feature flags for experiments and gradual rollouts\nFlags are expected to follow these rules or they are filtered out\n\n1. cased in kebab-case (match [a-z-])\n2. have boolean values or object {} values\n\n@example\n```tsx\n(<Renderer featureFlags={{ 'my-feature': true }} />);\ngetFeatureFlags()?.myFeature === true;\n```\n\n@example\n```tsx\n(<Renderer featureFlags={{ 'my-feature': 'thing' }} />);\ngetFeatureFlags()?.myFeature === undefined;\n```\n\n@example\n```tsx\n(<Renderer featureFlags={{ 'product.my-feature': false }} />);\ngetFeatureFlags()?.myFeature === undefined;\ngetFeatureFlags()?.productMyFeature === undefined;\n```",
|
|
789
|
-
defaultValue: 'undefined'
|
|
790
|
-
}, {
|
|
791
|
-
name: 'getExtensionHeight',
|
|
792
|
-
type: '(node: PMNode) => string'
|
|
793
|
-
}, {
|
|
794
|
-
name: 'includeNodesCountInStats',
|
|
795
|
-
type: 'boolean'
|
|
796
|
-
}, {
|
|
797
|
-
name: 'innerRef',
|
|
798
|
-
type: 'React.RefObject<HTMLDivElement>'
|
|
799
|
-
}, {
|
|
800
|
-
name: 'isInsideOfInlineExtension',
|
|
801
|
-
type: 'boolean'
|
|
802
|
-
}, {
|
|
803
|
-
name: 'isTopLevelRenderer',
|
|
804
|
-
type: 'boolean'
|
|
805
|
-
}, {
|
|
806
|
-
name: 'maxHeight',
|
|
807
|
-
type: 'number'
|
|
808
|
-
}, {
|
|
809
|
-
name: 'media',
|
|
810
|
-
type: 'MediaOptions'
|
|
811
|
-
}, {
|
|
812
|
-
name: 'nodeComponents',
|
|
813
|
-
type: '{ [key: string]: React.ComponentType<any>; }'
|
|
814
|
-
}, {
|
|
815
|
-
name: 'noOpSSRInlineScript',
|
|
816
|
-
type: 'boolean'
|
|
817
|
-
}, {
|
|
818
|
-
name: 'onComplete',
|
|
819
|
-
type: '(stat: RenderOutputStat) => void'
|
|
820
|
-
}, {
|
|
821
|
-
name: 'onError',
|
|
822
|
-
type: '(error: any) => void'
|
|
823
|
-
}, {
|
|
824
|
-
name: 'onSetLinkTarget',
|
|
825
|
-
type: '(url: string) => "_blank"',
|
|
826
|
-
description: "Optional callback to programatically determine the link target for rendered links. Controls whether a link should render as external or not.\nReturn _blank if the url should render as an external link.\nReturn undefined to use the links default behavior and target.\n\n@param url - The URL of the link being rendered\n@returns '_blank' to render as an external link or undefined to not change the link"
|
|
827
|
-
}, {
|
|
828
|
-
name: 'portal',
|
|
829
|
-
type: 'HTMLElement'
|
|
830
|
-
}, {
|
|
831
|
-
name: 'rendererContext',
|
|
832
|
-
type: 'RendererContext'
|
|
833
|
-
}, {
|
|
834
|
-
name: 'schema',
|
|
835
|
-
type: 'Schema<any, any>'
|
|
836
|
-
}, {
|
|
837
|
-
name: 'scrollToBlock',
|
|
838
|
-
type: '(element: HTMLElement) => void',
|
|
839
|
-
description: 'Optional callback to scroll an element into view when using block links (#block-xxx).\nWhen provided, this is used instead of the default scrollIntoView for accurate positioning\nin product-specific scroll containers (e.g. Confluence view page).'
|
|
840
|
-
}, {
|
|
841
|
-
name: 'shouldDisplayExtensionAsInline',
|
|
842
|
-
type: '(extensionParams: ExtensionParams<Parameters>) => boolean',
|
|
843
|
-
description: 'Determines if the extension should be displayed as inline based on the extension parameters.\n@param extensionParams - The extension parameters.\n@returns True if the extension should be displayed as inline, false otherwise.'
|
|
844
|
-
}, {
|
|
845
|
-
name: 'shouldOpenMediaViewer',
|
|
846
|
-
type: 'boolean'
|
|
847
|
-
}, {
|
|
848
|
-
name: 'shouldRemoveEmptySpaceAroundContent',
|
|
849
|
-
type: 'boolean'
|
|
850
|
-
}, {
|
|
851
|
-
name: 'smartLinks',
|
|
852
|
-
type: 'SmartLinksOptions'
|
|
853
|
-
}, {
|
|
854
|
-
name: 'stickyHeaders',
|
|
855
|
-
type: 'boolean | ({ show?: boolean; } & { offsetTop?: number; } & StickyHeaderConfig_DO_NOT_USE)'
|
|
856
|
-
}, {
|
|
857
|
-
name: 'textHighlighter',
|
|
858
|
-
type: '{ component: React.ComponentType<{ children: React.ReactNode; groups: string[]; marks: Set<string>; match: string; startPos: number; }>; pattern: RegExp; }'
|
|
859
|
-
}, {
|
|
860
|
-
name: 'timeZone',
|
|
861
|
-
type: 'string'
|
|
862
|
-
}, {
|
|
863
|
-
name: 'truncated',
|
|
864
|
-
type: 'boolean'
|
|
865
|
-
}, {
|
|
866
|
-
name: 'UNSTABLE_allowTableAlignment',
|
|
867
|
-
type: 'boolean'
|
|
868
|
-
}, {
|
|
869
|
-
name: 'UNSTABLE_allowTableResizing',
|
|
870
|
-
type: 'boolean'
|
|
871
|
-
}, {
|
|
872
|
-
name: 'UNSTABLE_isPresentational',
|
|
873
|
-
type: 'boolean',
|
|
874
|
-
description: 'When true, elements may render without their default semantic roles\n(e.g., using role="presentation"), indicating that they are used solely for layout or styling purposes.\nElements currently affected: Tables.'
|
|
875
|
-
}, {
|
|
876
|
-
name: 'unsupportedContentLevelsTracking',
|
|
877
|
-
type: '{ enabled: boolean; samplingRates?: { [key: string]: number; }; thresholds?: Partial<UnsupportedContentLevelThresholds>; }'
|
|
878
|
-
}]
|
|
879
|
-
}, {
|
|
880
|
-
name: 'ConfluenceSearchConfigModal',
|
|
881
|
-
package: '@atlaskit/link-datasource',
|
|
882
|
-
description: 'Configuration modal for the Confluence search datasource. Lets users set up a "list of links" backed by a Confluence search query (space, query, sort) and produces Confluence search datasource ADF.',
|
|
883
|
-
status: 'general-availability',
|
|
884
|
-
usageGuidelines: ['Use when the user is configuring a Confluence search-based list of links (e.g. in a block or sidebar). On confirm, use the returned parameters to build datasource ADF or pass to DatasourceTableView.'],
|
|
885
|
-
contentGuidelines: [],
|
|
886
|
-
accessibilityGuidelines: ['Ensure the modal has an accessible title and focus is trapped; form fields (space, query, sort) must have labels and error messages announced.'],
|
|
887
|
-
keywords: ['link-datasource', 'confluence', 'search', 'datasource', 'config', 'modal'],
|
|
888
|
-
category: 'linking',
|
|
889
|
-
examples: ["import React, { useState } from 'react';\nimport { IntlProvider } from 'react-intl';\nimport Button from '@atlaskit/button/standard-button';\nimport { SmartCardProvider } from '@atlaskit/link-provider';\nimport {\n\tdefaultInitialVisibleConfluenceColumnKeys,\n\tmockBasicFilterAGGFetchRequests,\n\tmockDatasourceFetchRequests,\n\tmockProductsData,\n\tmockSiteData,\n} from '@atlaskit/link-test-helpers/datasource';\nimport SmartLinkClient from '../../examples-helpers/smartLinkCustomClient';\nimport { CONFLUENCE_SEARCH_DATASOURCE_ID } from '../../src/ui/confluence-search-modal';\nimport { ConfluenceSearchConfigModal } from '../../src/ui/confluence-search-modal/modal';\nimport { type ConfluenceSearchDatasourceParameters } from '../../src/ui/confluence-search-modal/types';\nmockDatasourceFetchRequests({\n\ttype: 'confluence',\n\tdelayedResponse: false,\n\tshouldMockORSBatch: true,\n\tavailableSitesOverride: mockSiteData.filter(\n\t\t(site) => !['test1', 'test2', 'test4'].includes(site.displayName),\n\t),\n\taccessibleProductsOverride: mockProductsData.filter((product) =>\n\t\t['confluence.ondemand'].includes(product.productId),\n\t),\n});\nmockBasicFilterAGGFetchRequests();\nexport default (): React.JSX.Element => {\n\tconst [showModal, setShowModal] = useState(false);\n\tconst [parameters] = useState<ConfluenceSearchDatasourceParameters>({\n\t\tcloudId: '67899',\n\t\tsearchString: 'Searched something',\n\t});\n\tconst [visibleColumnKeys] = useState<string[] | undefined>(\n\t\tdefaultInitialVisibleConfluenceColumnKeys,\n\t);\n\tconst toggleIsOpen = () => setShowModal((prevOpenState) => !prevOpenState);\n\tconst closeModal = () => setShowModal(false);\n\treturn (\n\t\t<IntlProvider locale=\"en\">\n\t\t\t<SmartCardProvider client={new SmartLinkClient()}>\n\t\t\t\t<Button appearance=\"primary\" onClick={toggleIsOpen}>\n\t\t\t\t\tToggle Modal\n\t\t\t\t</Button>\n\t\t\t\t{showModal && (\n\t\t\t\t\t<ConfluenceSearchConfigModal\n\t\t\t\t\t\tdatasourceId={CONFLUENCE_SEARCH_DATASOURCE_ID}\n\t\t\t\t\t\tvisibleColumnKeys={visibleColumnKeys}\n\t\t\t\t\t\tparameters={parameters}\n\t\t\t\t\t\tonCancel={closeModal}\n\t\t\t\t\t\tonInsert={closeModal}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</SmartCardProvider>\n\t\t</IntlProvider>\n\t);\n};"],
|
|
890
|
-
props: [{
|
|
891
|
-
name: 'columnCustomSizes',
|
|
892
|
-
type: 'ColumnSizesMap',
|
|
893
|
-
description: 'Map of column key to custom column width'
|
|
894
|
-
}, {
|
|
895
|
-
name: 'datasourceId',
|
|
896
|
-
type: 'string',
|
|
897
|
-
description: 'Unique identifier for which type of datasource is being rendered and for making its requests',
|
|
898
|
-
isRequired: true
|
|
899
|
-
}, {
|
|
900
|
-
name: 'disableDisplayDropdown',
|
|
901
|
-
type: 'boolean',
|
|
902
|
-
description: 'Disable the view mode display dropdown'
|
|
903
|
-
}, {
|
|
904
|
-
name: 'disableSiteSelector',
|
|
905
|
-
type: 'boolean'
|
|
906
|
-
}, {
|
|
907
|
-
name: 'onCancel',
|
|
908
|
-
type: '() => void',
|
|
909
|
-
description: 'Callback function to be invoked when the modal is closed either via cancel button click, esc keydown, or modal blanket click',
|
|
910
|
-
isRequired: true
|
|
885
|
+
name: 'onCancel',
|
|
886
|
+
type: '() => void',
|
|
887
|
+
description: 'Callback function to be invoked when the modal is closed either via cancel button click, esc keydown, or modal blanket click',
|
|
888
|
+
isRequired: true
|
|
911
889
|
}, {
|
|
912
890
|
name: 'onInsert',
|
|
913
|
-
type: '(adf: InlineCardAdf |
|
|
891
|
+
type: '(adf: InlineCardAdf | DatasourceAdf<Record<string, unknown>>, analyticsEvent?: UIAnalyticsEvent) => void',
|
|
914
892
|
description: 'Callback function to be invoked when the insert issues button is clicked',
|
|
915
893
|
isRequired: true
|
|
916
|
-
}, {
|
|
917
|
-
name: 'overrideParameters',
|
|
918
|
-
type: '{ entityTypes?: string[]; }'
|
|
919
894
|
}, {
|
|
920
895
|
name: 'parameters',
|
|
921
|
-
type: 'DatasourceParameters |
|
|
896
|
+
type: 'DatasourceParameters | JiraIssueDatasourceParameters',
|
|
922
897
|
description: 'Parameters for making the data requests necessary to render data within the table'
|
|
923
898
|
}, {
|
|
924
899
|
name: 'shouldReturnFocus',
|
|
@@ -942,295 +917,320 @@ export var atlaskitComponents = [{
|
|
|
942
917
|
description: 'List of column keys that needs to be shown without truncation (content will wrap to a new line)'
|
|
943
918
|
}]
|
|
944
919
|
}, {
|
|
945
|
-
name: '
|
|
946
|
-
package: '@atlaskit/link-
|
|
947
|
-
description: '
|
|
920
|
+
name: 'LinkPicker',
|
|
921
|
+
package: '@atlaskit/link-picker',
|
|
922
|
+
description: 'Standalone link picker UI that lets users search and select links to insert. Supports plugins for different data sources (recents, search, Jira, Confluence, etc.) and can be used in modals, popups, or inline.',
|
|
948
923
|
status: 'general-availability',
|
|
949
|
-
usageGuidelines: ['Use when the user
|
|
924
|
+
usageGuidelines: ['Use when the user needs to choose a link to insert (e.g. in an editor, form, or toolbar). Add plugins to define tabs and data sources; use SmartCardProvider above the picker so selected links resolve correctly.'],
|
|
950
925
|
contentGuidelines: [],
|
|
951
|
-
accessibilityGuidelines: ['Ensure the
|
|
952
|
-
keywords: ['link-
|
|
926
|
+
accessibilityGuidelines: ['Ensure the picker is focusable and has an accessible name (e.g. "Insert link"). Provide a keyboard-accessible way to open and close; ensure search and results are announced to screen readers.'],
|
|
927
|
+
keywords: ['link-picker', 'link', 'picker', 'search', 'insert link', 'plugins'],
|
|
953
928
|
category: 'linking',
|
|
954
|
-
examples: ["import React, { useState } from 'react';\nimport {
|
|
929
|
+
examples: ["import React, { Fragment, type SyntheticEvent, useMemo, useState } from 'react';\nimport Link from '@atlaskit/link';\nimport { useSmartLinkLifecycleAnalytics } from '@atlaskit/link-analytics';\nimport { token } from '@atlaskit/tokens';\nimport { AtlassianLinkPickerPlugin, Scope } from '@atlassian/link-picker-atlassian-plugin';\nimport { mockEndpoints } from '@atlassian/recent-work-client/mocks';\nimport { PageWrapper } from '../example-helpers/common';\nimport { mockPluginEndpoints } from '../example-helpers/mock-plugin-endpoints';\nimport { MOCK_DATA_V3 as mockRecentData } from '../example-helpers/mock-recents-data';\nimport { LinkPicker, type LinkPickerProps } from '../src';\ntype OnSubmitPayload = Parameters<LinkPickerProps['onSubmit']>[0];\nmockPluginEndpoints();\nmockEndpoints(undefined, undefined, mockRecentData);\nfunction Basic() {\n\tconst [link, setLink] = useState<OnSubmitPayload>({\n\t\turl: '',\n\t\tdisplayText: null,\n\t\ttitle: null,\n\t\tmeta: {\n\t\t\tinputMethod: 'manual',\n\t\t},\n\t});\n\tconst linkAnalytics = useSmartLinkLifecycleAnalytics();\n\tconst handleSubmit: LinkPickerProps['onSubmit'] = (payload, analytic) => {\n\t\tsetLink(payload);\n\t\tlinkAnalytics.linkCreated(payload, analytic);\n\t};\n\tconst handleClick = (e: SyntheticEvent) => {\n\t\te.preventDefault();\n\t};\n\tconst plugins = useMemo(\n\t\t() => [\n\t\t\tnew AtlassianLinkPickerPlugin({\n\t\t\t\tcloudId: 'DUMMY-a5a01d21-1cc3-4f29-9565-f2bb8cd969f5',\n\t\t\t\tscope: Scope.ConfluenceContentType,\n\t\t\t\taggregatorUrl: 'https://pug.jira-dev.com/gateway/api/xpsearch-aggregator',\n\t\t\t\tactivityClientEndpoint: 'https://pug.jira-dev.com/gateway/api/graphql',\n\t\t\t}),\n\t\t],\n\t\t[],\n\t);\n\treturn (\n\t\t<Fragment>\n\t\t\t{\n\t\t\t<div style={{ paddingBottom: token('space.250') }}>\n\t\t\t\t<Link id=\"test-link\" href={link.url} target=\"_blank\" onClick={handleClick}>\n\t\t\t\t\t{link.displayText || link.url}\n\t\t\t\t</Link>\n\t\t\t</div>\n\t\t\t<LinkPicker\n\t\t\t\tplugins={plugins}\n\t\t\t\turl={link.url}\n\t\t\t\tdisplayText={link.displayText}\n\t\t\t\tonSubmit={handleSubmit}\n\t\t\t/>\n\t\t</Fragment>\n\t);\n}\nexport default function BasicWrapper(): React.JSX.Element {\n\treturn (\n\t\t<PageWrapper>\n\t\t\t<Basic />\n\t\t</PageWrapper>\n\t);\n}", "import React, { Fragment, type SyntheticEvent, useState } from 'react';\nimport Button from '@atlaskit/button/new';\nimport Link from '@atlaskit/link';\nimport Popup from '@atlaskit/popup';\nimport { token } from '@atlaskit/tokens';\nimport { PageHeader, PageWrapper } from '../example-helpers/common';\nimport { LinkPicker } from '../src';\ntype OnSubmitPayload = Parameters<Required<React.ComponentProps<typeof LinkPicker>>['onSubmit']>[0];\nfunction WithoutPlugins() {\n\tconst [isOpen, setIsOpen] = useState(true);\n\tconst [link, setLink] = useState<OnSubmitPayload>({\n\t\turl: '',\n\t\tdisplayText: null,\n\t\ttitle: null,\n\t\tmeta: {\n\t\t\tinputMethod: 'manual',\n\t\t},\n\t});\n\tconst handleToggle = () => setIsOpen(!isOpen);\n\tconst handleSubmit = (payload: OnSubmitPayload) => {\n\t\tsetLink(payload);\n\t\tsetIsOpen(false);\n\t};\n\tconst handleClick = (e: SyntheticEvent) => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\tsetIsOpen(true);\n\t};\n\tconst linkPickerInPopup = (\n\t\t<Popup\n\t\t\tisOpen={isOpen}\n\t\t\tautoFocus={false}\n\t\t\tonClose={handleToggle}\n\t\t\tcontent={({ update }) => (\n\t\t\t\t<LinkPicker\n\t\t\t\t\turl={link.url}\n\t\t\t\t\tdisplayText={link.displayText}\n\t\t\t\t\tonSubmit={handleSubmit}\n\t\t\t\t\tonCancel={handleToggle}\n\t\t\t\t\tonContentResize={update}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\tplacement=\"right-start\"\n\t\t\ttrigger={({ ref, ...triggerProps }) => (\n\t\t\t\t<Button\n\t\t\t\t\t{...triggerProps}\n\t\t\t\t\tref={ref}\n\t\t\t\t\tappearance=\"primary\"\n\t\t\t\t\tisSelected={isOpen}\n\t\t\t\t\tonClick={handleToggle}\n\t\t\t\t>\n\t\t\t\t\t{isOpen ? '-' : '+'}\n\t\t\t\t</Button>\n\t\t\t)}\n\t\t/>\n\t);\n\treturn (\n\t\t<Fragment>\n\t\t\t<PageHeader>\n\t\t\t\t<p>\n\t\t\t\t\t<b>LinkPicker</b> without search, used as an interface to submit a valid link with custom\n\t\t\t\t\tdisplay text.\n\t\t\t\t</p>\n\t\t\t</PageHeader>\n\t\t\t{\n\t\t\t<div style={{ paddingBottom: token('space.250') }}>\n\t\t\t\t<Link id=\"test-link\" href={link.url} target=\"_blank\" onClick={handleClick}>\n\t\t\t\t\t{link.displayText || link.url}\n\t\t\t\t</Link>\n\t\t\t</div>\n\t\t\t{linkPickerInPopup}\n\t\t</Fragment>\n\t);\n}\nexport default function WithoutPluginsWrapper(): React.JSX.Element {\n\treturn (\n\t\t<PageWrapper>\n\t\t\t<WithoutPlugins />\n\t\t</PageWrapper>\n\t);\n}"],
|
|
955
930
|
props: [{
|
|
956
|
-
name: '
|
|
957
|
-
type: '
|
|
958
|
-
description: '
|
|
931
|
+
name: 'adaptiveHeight',
|
|
932
|
+
type: 'boolean',
|
|
933
|
+
description: 'Allows height of search results to adapt to the number of results being displayed.'
|
|
959
934
|
}, {
|
|
960
|
-
name: '
|
|
961
|
-
type: 'string',
|
|
962
|
-
description: '
|
|
963
|
-
isRequired: true
|
|
935
|
+
name: 'additionalError',
|
|
936
|
+
type: 'string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal',
|
|
937
|
+
description: 'This prop passes one additional error that is secondary to component errors'
|
|
964
938
|
}, {
|
|
965
|
-
name: '
|
|
939
|
+
name: 'alwaysShowTabs',
|
|
966
940
|
type: 'boolean',
|
|
967
|
-
description: '
|
|
941
|
+
description: 'When true, tabs are displayed even if there is only one plugin.'
|
|
968
942
|
}, {
|
|
969
|
-
name: '
|
|
970
|
-
type: '
|
|
971
|
-
description: '
|
|
972
|
-
isRequired: true
|
|
943
|
+
name: 'component',
|
|
944
|
+
type: 'ComponentClass<Partial<LinkPickerProps> & { children: ReactElement<any, string | JSXElementConstructor<any>>; }, any> | FunctionComponent<...>',
|
|
945
|
+
description: 'Customise the link picker root component'
|
|
973
946
|
}, {
|
|
974
|
-
name: '
|
|
975
|
-
type: '
|
|
976
|
-
description: '
|
|
977
|
-
isRequired: true
|
|
947
|
+
name: 'customMessages',
|
|
948
|
+
type: '{ linkLabel?: MessageDescriptor; linkAriaLabel?: MessageDescriptor; linkPlaceholder?: MessageDescriptor; linkTextLabel?: MessageDescriptor; linkTextPlaceholder?: MessageDescriptor; linkHelperTextLabel?: MessageDescriptor; submitButtonLabel?: MessageDescriptor; }',
|
|
949
|
+
description: 'Allows for customisation of text in the link picker.'
|
|
978
950
|
}, {
|
|
979
|
-
name: '
|
|
980
|
-
type: '
|
|
981
|
-
description: '
|
|
951
|
+
name: 'disableWidth',
|
|
952
|
+
type: 'boolean',
|
|
953
|
+
description: 'Disables the default width containing the link picker.'
|
|
982
954
|
}, {
|
|
983
|
-
name: '
|
|
984
|
-
type: '
|
|
985
|
-
description: '
|
|
955
|
+
name: 'displayHelperText',
|
|
956
|
+
type: 'string',
|
|
957
|
+
description: 'The desired text to be displayed below the display text input field. Only displayed when `platform-linking-visual-refresh-link-picker` gate is enabled.'
|
|
986
958
|
}, {
|
|
987
|
-
name: '
|
|
959
|
+
name: 'displayText',
|
|
988
960
|
type: 'string',
|
|
989
|
-
description: 'The
|
|
961
|
+
description: 'The desired text to be displayed alternatively to the title of the linked resource for editing.'
|
|
990
962
|
}, {
|
|
991
|
-
name: '
|
|
992
|
-
type: '
|
|
993
|
-
description: "The view mode that the modal will show on open:\n- Table = Displays a list of links in table format\n- Inline = Presents a smart link that shows the count of query results. However, if there's only one result, it converts to an inline smart link of that issue."
|
|
963
|
+
name: 'featureFlags',
|
|
964
|
+
type: '{ [x: string]: unknown; }'
|
|
994
965
|
}, {
|
|
995
|
-
name: '
|
|
996
|
-
type: '
|
|
997
|
-
description: '
|
|
966
|
+
name: 'hideDisplayText',
|
|
967
|
+
type: 'boolean',
|
|
968
|
+
description: 'Hides the link picker display text field if set to true.'
|
|
998
969
|
}, {
|
|
999
|
-
name: '
|
|
1000
|
-
type: '
|
|
1001
|
-
description: '
|
|
1002
|
-
}]
|
|
1003
|
-
}, {
|
|
1004
|
-
name: 'AssetsConfigModal',
|
|
1005
|
-
package: '@atlaskit/link-datasource',
|
|
1006
|
-
description: 'Configuration modal for the Assets (object schema) datasource. Lets users set up a list of links from an Assets schema and produces Assets datasource ADF.',
|
|
1007
|
-
status: 'general-availability',
|
|
1008
|
-
usageGuidelines: ['Use when the user is configuring an Assets-based list of links. On confirm, use the returned parameters for datasource ADF or table view.'],
|
|
1009
|
-
contentGuidelines: [],
|
|
1010
|
-
accessibilityGuidelines: ['Ensure the modal has an accessible title and that schema/object pickers have clear labels.'],
|
|
1011
|
-
keywords: ['link-datasource', 'assets', 'datasource', 'config', 'modal'],
|
|
1012
|
-
category: 'linking',
|
|
1013
|
-
examples: ["import React, { useState } from 'react';\nimport Button from '@atlaskit/button/new';\nimport { SmartCardProvider } from '@atlaskit/link-provider';\nimport { mockAssetsClientFetchRequests } from '@atlaskit/link-test-helpers/assets';\nimport SmartLinkClient from '../../examples-helpers/smartLinkCustomClient';\nimport { ASSETS_LIST_OF_LINKS_DATASOURCE_ID, type AssetsDatasourceParameters } from '../../src';\nimport JSMAssetsConfigModal from '../../src/ui/assets-modal';\nmockAssetsClientFetchRequests({ delayedResponse: false });\nconst mockVisibleColumnKeys = [\n\t'Key',\n\t'Label',\n\t'Created',\n\t'Is Virtual',\n\t'Hardware Components',\n\t'Applications',\n\t'Software Services',\n\t'Number of Slots',\n\t'Primary Capability',\n\t'Owners',\n\t'Notes',\n];\nexport default (): React.JSX.Element => {\n\tconst [showModal, setShowModal] = useState(false);\n\tconst [parameters] = useState<AssetsDatasourceParameters>({\n\t\taql: 'dummy aql',\n\t\tworkspaceId: '',\n\t\tschemaId: '1',\n\t});\n\tconst [visibleColumnKeys] = useState<string[] | undefined>(mockVisibleColumnKeys);\n\tconst toggleIsOpen = () => setShowModal((prevOpenState) => !prevOpenState);\n\tconst closeModal = () => setShowModal(false);\n\treturn (\n\t\t<SmartCardProvider client={new SmartLinkClient()}>\n\t\t\t<Button appearance=\"primary\" onClick={toggleIsOpen}>\n\t\t\t\tToggle Modal\n\t\t\t</Button>\n\t\t\t{showModal && (\n\t\t\t\t<JSMAssetsConfigModal\n\t\t\t\t\tdatasourceId={ASSETS_LIST_OF_LINKS_DATASOURCE_ID}\n\t\t\t\t\tvisibleColumnKeys={visibleColumnKeys}\n\t\t\t\t\tparameters={parameters}\n\t\t\t\t\tonCancel={closeModal}\n\t\t\t\t\tonInsert={closeModal}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</SmartCardProvider>\n\t);\n};"],
|
|
1014
|
-
props: [{
|
|
1015
|
-
name: 'columnCustomSizes',
|
|
1016
|
-
type: 'ColumnSizesMap',
|
|
1017
|
-
description: 'Map of column key to custom column width'
|
|
970
|
+
name: 'inputRef',
|
|
971
|
+
type: '((instance: HTMLInputElement) => void) | RefObject<HTMLInputElement>',
|
|
972
|
+
description: 'Ref to the link picker search input.'
|
|
1018
973
|
}, {
|
|
1019
|
-
name: '
|
|
1020
|
-
type: '
|
|
1021
|
-
description: '
|
|
1022
|
-
isRequired: true
|
|
974
|
+
name: 'isLoadingPlugins',
|
|
975
|
+
type: 'boolean',
|
|
976
|
+
description: 'If set true, Link picker will show the loading spinner where the tabs and results will show.'
|
|
1023
977
|
}, {
|
|
1024
|
-
name: '
|
|
978
|
+
name: 'isSubmitting',
|
|
1025
979
|
type: 'boolean',
|
|
1026
|
-
description: '
|
|
980
|
+
description: 'Controls showing a "submission in-progres" UX'
|
|
981
|
+
}, {
|
|
982
|
+
name: 'moveSubmitButton',
|
|
983
|
+
type: 'boolean',
|
|
984
|
+
description: 'This prop controls where the submit button appears. When true the submit button will move below the input field and be full width'
|
|
1027
985
|
}, {
|
|
1028
986
|
name: 'onCancel',
|
|
1029
987
|
type: '() => void',
|
|
1030
|
-
description: 'Callback
|
|
1031
|
-
isRequired: true
|
|
988
|
+
description: 'Callback to fire when the cancel button is clicked.\nIf not provided, cancel button is not displayed.'
|
|
1032
989
|
}, {
|
|
1033
|
-
name: '
|
|
1034
|
-
type: '(
|
|
1035
|
-
description: 'Callback
|
|
990
|
+
name: 'onContentResize',
|
|
991
|
+
type: '() => void',
|
|
992
|
+
description: 'Callback to fire when content is changed inside the link picker e.g. items, when loading, tabs'
|
|
993
|
+
}, {
|
|
994
|
+
name: 'onSubmit',
|
|
995
|
+
type: '(arg: OnSubmitParameter, analytic?: UIAnalyticsEvent) => void',
|
|
996
|
+
description: 'Callback to fire on form submission.',
|
|
1036
997
|
isRequired: true
|
|
1037
998
|
}, {
|
|
1038
|
-
name: '
|
|
1039
|
-
type: '
|
|
1040
|
-
description: '
|
|
999
|
+
name: 'paddingBottom',
|
|
1000
|
+
type: 'string',
|
|
1001
|
+
description: 'Override the default bottom padding.'
|
|
1041
1002
|
}, {
|
|
1042
|
-
name: '
|
|
1043
|
-
type: '
|
|
1044
|
-
description: '
|
|
1003
|
+
name: 'paddingLeft',
|
|
1004
|
+
type: 'string',
|
|
1005
|
+
description: 'Override the default left padding.'
|
|
1045
1006
|
}, {
|
|
1046
|
-
name: '
|
|
1007
|
+
name: 'paddingRight',
|
|
1047
1008
|
type: 'string',
|
|
1048
|
-
description: '
|
|
1009
|
+
description: 'Override the default right padding.'
|
|
1049
1010
|
}, {
|
|
1050
|
-
name: '
|
|
1051
|
-
type: '
|
|
1052
|
-
description:
|
|
1011
|
+
name: 'paddingTop',
|
|
1012
|
+
type: 'string',
|
|
1013
|
+
description: 'Override the default top padding.'
|
|
1053
1014
|
}, {
|
|
1054
|
-
name: '
|
|
1055
|
-
type: '
|
|
1056
|
-
description: '
|
|
1015
|
+
name: 'plugins',
|
|
1016
|
+
type: 'LinkPickerPlugin[]',
|
|
1017
|
+
description: 'Plugins that provide link suggestions / search capabilities.'
|
|
1057
1018
|
}, {
|
|
1058
|
-
name: '
|
|
1059
|
-
type: '
|
|
1060
|
-
description: '
|
|
1019
|
+
name: 'previewableLinksOnly',
|
|
1020
|
+
type: 'boolean',
|
|
1021
|
+
description: 'Disables URLs that do not have an embeddable preview'
|
|
1022
|
+
}, {
|
|
1023
|
+
name: 'recentSearchListSize',
|
|
1024
|
+
type: 'number',
|
|
1025
|
+
description: 'Showing dynamic list size based on window height'
|
|
1026
|
+
}, {
|
|
1027
|
+
name: 'shouldRenderNoResultsImage',
|
|
1028
|
+
type: 'boolean',
|
|
1029
|
+
description: 'Controls showing the image in the no results state'
|
|
1030
|
+
}, {
|
|
1031
|
+
name: 'submitOnInputChange',
|
|
1032
|
+
type: 'boolean',
|
|
1033
|
+
description: 'This prop disables submit button and handles submit on input change'
|
|
1034
|
+
}, {
|
|
1035
|
+
name: 'url',
|
|
1036
|
+
type: 'string',
|
|
1037
|
+
description: 'The url of the linked resource for editing.'
|
|
1061
1038
|
}]
|
|
1062
1039
|
}, {
|
|
1063
|
-
name: '
|
|
1064
|
-
package: '@atlaskit/
|
|
1065
|
-
description: '
|
|
1040
|
+
name: 'Renderer',
|
|
1041
|
+
package: '@atlaskit/renderer',
|
|
1042
|
+
description: 'Renderer component',
|
|
1066
1043
|
status: 'general-availability',
|
|
1067
|
-
usageGuidelines: ['Use when
|
|
1044
|
+
usageGuidelines: ['Use ReactRenderer with an ADF document; use a transformer (e.g. BitbucketTransformer) with ADFEncoder when your storage format is not ADF.', 'Avoid unnecessary props changes: extract static objects to constants, avoid passing new objects or anonymous functions on every render, use useMemo/useCallback for props and callbacks to prevent performance degradation.', 'Ensure only one version of Renderer sub-dependencies (adf-schema, editor-common, prosemirror-model, etc.) in your bundles; use deduplication or resolutions. Use correct peer dependency versions.', 'Use the truncated prop with maxHeight/fadeOutHeight when you need to cap rendered content with a fade; add polyfills for fetch and ES6/ES7 when targeting older browsers.'],
|
|
1068
1045
|
contentGuidelines: [],
|
|
1069
|
-
accessibilityGuidelines: [
|
|
1070
|
-
keywords: ['
|
|
1071
|
-
category: '
|
|
1072
|
-
examples: ["import {
|
|
1046
|
+
accessibilityGuidelines: [],
|
|
1047
|
+
keywords: ['editor', 'renderer', 'atlaskit'],
|
|
1048
|
+
category: 'editor',
|
|
1049
|
+
examples: ["import type { ChangeEvent } from 'react';\nimport RendererDemo from './helper/RendererDemo';\nimport { SmartCardProvider, CardClient } from '@atlaskit/link-provider';\nimport { getSchemaBasedOnStage } from '@atlaskit/adf-schema/schema-default';\nimport type { ADFStage } from '@atlaskit/editor-common/validator';\nconst ADF_STAGE0 = 'stage0';\nconst ADF_FINAL = 'final';\nexport default function Example(): React.JSX.Element {\n\tconst [adfStage, setAdfStage] = React.useState<ADFStage>(ADF_FINAL);\n\tconst schema = getSchemaBasedOnStage(adfStage);\n\tconst onSchemaToggle = (event: ChangeEvent<HTMLInputElement>) => {\n\t\tsetAdfStage(event.currentTarget.checked ? ADF_STAGE0 : ADF_FINAL);\n\t};\n\tconst toggleCheckbox = (\n\t\t<label>\n\t\t\t{\n\t\t\t<input type=\"checkbox\" checked={adfStage === ADF_STAGE0} onChange={onSchemaToggle} />\n\t\t\tUse stage0 (experimental) document schema\n\t\t</label>\n\t);\n\treturn (\n\t\t<SmartCardProvider client={new CardClient('staging')}>\n\t\t\t<RendererDemo\n\t\t\t\tallowColumnSorting\n\t\t\t\tallowSelectAllTrap\n\t\t\t\tallowWrapCodeBlock\n\t\t\t\tallowCopyToClipboard\n\t\t\t\tserializer=\"react\"\n\t\t\t\tadfStage={adfStage}\n\t\t\t\tschema={schema}\n\t\t\t\tactionButtons={toggleCheckbox}\n\t\t\t\twithProviders\n\t\t\t/>\n\t\t</SmartCardProvider>\n\t);\n}", 'import RendererDemo from \'./helper/RendererDemo\';\nimport {\n\tNORMAL_SEVERITY_THRESHOLD,\n\tDEGRADED_SEVERITY_THRESHOLD,\n} from \'../../renderer/src/ui/Renderer\';\nexport default function Example(): React.JSX.Element {\n\treturn (\n\t\t<RendererDemo\n\t\t\tappearance="full-page"\n\t\t\tserializer="react"\n\t\t\tallowHeadingAnchorLinks\n\t\t\tallowColumnSorting={true}\n\t\t\tallowCopyToClipboard\n\t\t\tallowWrapCodeBlock\n\t\t\tUNSTABLE_allowTableAlignment\n\t\t\tUNSTABLE_allowTableResizing\n\t\t\tanalyticsEventSeverityTracking={{\n\t\t\t\tenabled: true,\n\t\t\t\tseverityNormalThreshold: NORMAL_SEVERITY_THRESHOLD,\n\t\t\t\tseverityDegradedThreshold: DEGRADED_SEVERITY_THRESHOLD,\n\t\t\t}}\n\t\t/>\n\t);\n}', 'import RendererDemo from \'./helper/RendererDemo\';\nexport default function Example(): React.JSX.Element {\n\treturn <RendererDemo withProviders={true} serializer="react" />;\n}'],
|
|
1073
1050
|
props: [{
|
|
1074
|
-
name: '
|
|
1075
|
-
type: '
|
|
1076
|
-
description: '
|
|
1051
|
+
name: 'addTelepointer',
|
|
1052
|
+
type: 'boolean',
|
|
1053
|
+
description: 'When enabled a trailing telepointer will be added to the rendered document\nfollowing content updates.\n\nContent is updated by passing a new value prop to the renderer.\n\nThe trailing pointer is updated by dom injection to the last text node which\nis updated as a result of a content update.'
|
|
1077
1054
|
}, {
|
|
1078
|
-
name: '
|
|
1079
|
-
type: '
|
|
1080
|
-
description: 'Unique identifier for which type of datasource is being rendered and for making its requests',
|
|
1081
|
-
isRequired: true
|
|
1055
|
+
name: 'adfStage',
|
|
1056
|
+
type: '"final" | "stage0"'
|
|
1082
1057
|
}, {
|
|
1083
|
-
name: '
|
|
1084
|
-
type: '
|
|
1058
|
+
name: 'allowAltTextOnImages',
|
|
1059
|
+
type: 'boolean'
|
|
1085
1060
|
}, {
|
|
1086
|
-
name: '
|
|
1087
|
-
type: '
|
|
1088
|
-
description: 'Callback to be invoked whenever a user changes the visible columns in a datasource table\neither by selecting/unselecting or reordering (drag and drop)\n\n@param visibleColumnKeys the array of keys for all of the selected columns'
|
|
1061
|
+
name: 'allowAnnotations',
|
|
1062
|
+
type: 'boolean'
|
|
1089
1063
|
}, {
|
|
1090
|
-
name: '
|
|
1091
|
-
type: '
|
|
1092
|
-
description: 'Callback to be invoked whenever user changes wrap attribute of the column.\n\n@param key Column key\n@param shouldWrap Whenever column should wrap'
|
|
1064
|
+
name: 'allowColumnSorting',
|
|
1065
|
+
type: 'boolean'
|
|
1093
1066
|
}, {
|
|
1094
|
-
name: '
|
|
1095
|
-
type: '
|
|
1096
|
-
description: 'Parameters for making the data requests necessary to render data within the table',
|
|
1097
|
-
isRequired: true
|
|
1067
|
+
name: 'allowCopyToClipboard',
|
|
1068
|
+
type: 'boolean'
|
|
1098
1069
|
}, {
|
|
1099
|
-
name: '
|
|
1100
|
-
type: '
|
|
1101
|
-
description: 'If this number is set it will restrict (max-height) maximum size of the component AND make main container a scrollable container.\nIt this number is 0 it will not restrict height and not make container scrollable.'
|
|
1070
|
+
name: 'allowCustomPanels',
|
|
1071
|
+
type: 'boolean'
|
|
1102
1072
|
}, {
|
|
1103
|
-
name: '
|
|
1104
|
-
type: '
|
|
1105
|
-
description: 'Url for an existing datasource, initially used for displaying to a user unauthorized to query that site'
|
|
1073
|
+
name: 'allowFixedColumnWidthOption',
|
|
1074
|
+
type: 'boolean'
|
|
1106
1075
|
}, {
|
|
1107
|
-
name: '
|
|
1108
|
-
type: '
|
|
1109
|
-
description: 'List of properties/column keys that are visible/selected'
|
|
1076
|
+
name: 'allowHeadingAnchorLinks',
|
|
1077
|
+
type: 'boolean | HeadingAnchorLinksConfig'
|
|
1110
1078
|
}, {
|
|
1111
|
-
name: '
|
|
1112
|
-
type: '
|
|
1113
|
-
description: 'List of column keys that needs to be shown without truncation (content will wrap to a new line)'
|
|
1114
|
-
}]
|
|
1115
|
-
}, {
|
|
1116
|
-
name: 'LinkPicker',
|
|
1117
|
-
package: '@atlaskit/link-picker',
|
|
1118
|
-
description: 'Standalone link picker UI that lets users search and select links to insert. Supports plugins for different data sources (recents, search, Jira, Confluence, etc.) and can be used in modals, popups, or inline.',
|
|
1119
|
-
status: 'general-availability',
|
|
1120
|
-
usageGuidelines: ['Use when the user needs to choose a link to insert (e.g. in an editor, form, or toolbar). Add plugins to define tabs and data sources; use SmartCardProvider above the picker so selected links resolve correctly.'],
|
|
1121
|
-
contentGuidelines: [],
|
|
1122
|
-
accessibilityGuidelines: ['Ensure the picker is focusable and has an accessible name (e.g. "Insert link"). Provide a keyboard-accessible way to open and close; ensure search and results are announced to screen readers.'],
|
|
1123
|
-
keywords: ['link-picker', 'link', 'picker', 'search', 'insert link', 'plugins'],
|
|
1124
|
-
category: 'linking',
|
|
1125
|
-
examples: ["import React, { Fragment, type SyntheticEvent, useMemo, useState } from 'react';\nimport Link from '@atlaskit/link';\nimport { useSmartLinkLifecycleAnalytics } from '@atlaskit/link-analytics';\nimport { token } from '@atlaskit/tokens';\nimport { AtlassianLinkPickerPlugin, Scope } from '@atlassian/link-picker-atlassian-plugin';\nimport { mockEndpoints } from '@atlassian/recent-work-client/mocks';\nimport { PageWrapper } from '../example-helpers/common';\nimport { mockPluginEndpoints } from '../example-helpers/mock-plugin-endpoints';\nimport { MOCK_DATA_V3 as mockRecentData } from '../example-helpers/mock-recents-data';\nimport { LinkPicker, type LinkPickerProps } from '../src';\ntype OnSubmitPayload = Parameters<LinkPickerProps['onSubmit']>[0];\nmockPluginEndpoints();\nmockEndpoints(undefined, undefined, mockRecentData);\nfunction Basic() {\n\tconst [link, setLink] = useState<OnSubmitPayload>({\n\t\turl: '',\n\t\tdisplayText: null,\n\t\ttitle: null,\n\t\tmeta: {\n\t\t\tinputMethod: 'manual',\n\t\t},\n\t});\n\tconst linkAnalytics = useSmartLinkLifecycleAnalytics();\n\tconst handleSubmit: LinkPickerProps['onSubmit'] = (payload, analytic) => {\n\t\tsetLink(payload);\n\t\tlinkAnalytics.linkCreated(payload, analytic);\n\t};\n\tconst handleClick = (e: SyntheticEvent) => {\n\t\te.preventDefault();\n\t};\n\tconst plugins = useMemo(\n\t\t() => [\n\t\t\tnew AtlassianLinkPickerPlugin({\n\t\t\t\tcloudId: 'DUMMY-a5a01d21-1cc3-4f29-9565-f2bb8cd969f5',\n\t\t\t\tscope: Scope.ConfluenceContentType,\n\t\t\t\taggregatorUrl: 'https://pug.jira-dev.com/gateway/api/xpsearch-aggregator',\n\t\t\t\tactivityClientEndpoint: 'https://pug.jira-dev.com/gateway/api/graphql',\n\t\t\t}),\n\t\t],\n\t\t[],\n\t);\n\treturn (\n\t\t<Fragment>\n\t\t\t{\n\t\t\t<div style={{ paddingBottom: token('space.250') }}>\n\t\t\t\t<Link id=\"test-link\" href={link.url} target=\"_blank\" onClick={handleClick}>\n\t\t\t\t\t{link.displayText || link.url}\n\t\t\t\t</Link>\n\t\t\t</div>\n\t\t\t<LinkPicker\n\t\t\t\tplugins={plugins}\n\t\t\t\turl={link.url}\n\t\t\t\tdisplayText={link.displayText}\n\t\t\t\tonSubmit={handleSubmit}\n\t\t\t/>\n\t\t</Fragment>\n\t);\n}\nexport default function BasicWrapper(): React.JSX.Element {\n\treturn (\n\t\t<PageWrapper>\n\t\t\t<Basic />\n\t\t</PageWrapper>\n\t);\n}", "import React, { Fragment, type SyntheticEvent, useState } from 'react';\nimport Button from '@atlaskit/button/new';\nimport Link from '@atlaskit/link';\nimport Popup from '@atlaskit/popup';\nimport { token } from '@atlaskit/tokens';\nimport { PageHeader, PageWrapper } from '../example-helpers/common';\nimport { LinkPicker } from '../src';\ntype OnSubmitPayload = Parameters<Required<React.ComponentProps<typeof LinkPicker>>['onSubmit']>[0];\nfunction WithoutPlugins() {\n\tconst [isOpen, setIsOpen] = useState(true);\n\tconst [link, setLink] = useState<OnSubmitPayload>({\n\t\turl: '',\n\t\tdisplayText: null,\n\t\ttitle: null,\n\t\tmeta: {\n\t\t\tinputMethod: 'manual',\n\t\t},\n\t});\n\tconst handleToggle = () => setIsOpen(!isOpen);\n\tconst handleSubmit = (payload: OnSubmitPayload) => {\n\t\tsetLink(payload);\n\t\tsetIsOpen(false);\n\t};\n\tconst handleClick = (e: SyntheticEvent) => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\tsetIsOpen(true);\n\t};\n\tconst linkPickerInPopup = (\n\t\t<Popup\n\t\t\tisOpen={isOpen}\n\t\t\tautoFocus={false}\n\t\t\tonClose={handleToggle}\n\t\t\tcontent={({ update }) => (\n\t\t\t\t<LinkPicker\n\t\t\t\t\turl={link.url}\n\t\t\t\t\tdisplayText={link.displayText}\n\t\t\t\t\tonSubmit={handleSubmit}\n\t\t\t\t\tonCancel={handleToggle}\n\t\t\t\t\tonContentResize={update}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\tplacement=\"right-start\"\n\t\t\ttrigger={({ ref, ...triggerProps }) => (\n\t\t\t\t<Button\n\t\t\t\t\t{...triggerProps}\n\t\t\t\t\tref={ref}\n\t\t\t\t\tappearance=\"primary\"\n\t\t\t\t\tisSelected={isOpen}\n\t\t\t\t\tonClick={handleToggle}\n\t\t\t\t>\n\t\t\t\t\t{isOpen ? '-' : '+'}\n\t\t\t\t</Button>\n\t\t\t)}\n\t\t/>\n\t);\n\treturn (\n\t\t<Fragment>\n\t\t\t<PageHeader>\n\t\t\t\t<p>\n\t\t\t\t\t<b>LinkPicker</b> without search, used as an interface to submit a valid link with custom\n\t\t\t\t\tdisplay text.\n\t\t\t\t</p>\n\t\t\t</PageHeader>\n\t\t\t{\n\t\t\t<div style={{ paddingBottom: token('space.250') }}>\n\t\t\t\t<Link id=\"test-link\" href={link.url} target=\"_blank\" onClick={handleClick}>\n\t\t\t\t\t{link.displayText || link.url}\n\t\t\t\t</Link>\n\t\t\t</div>\n\t\t\t{linkPickerInPopup}\n\t\t</Fragment>\n\t);\n}\nexport default function WithoutPluginsWrapper(): React.JSX.Element {\n\treturn (\n\t\t<PageWrapper>\n\t\t\t<WithoutPlugins />\n\t\t</PageWrapper>\n\t);\n}"],
|
|
1126
|
-
props: [{
|
|
1127
|
-
name: 'adaptiveHeight',
|
|
1128
|
-
type: 'boolean',
|
|
1129
|
-
description: 'Allows height of search results to adapt to the number of results being displayed.'
|
|
1079
|
+
name: 'allowPlaceholderText',
|
|
1080
|
+
type: 'boolean'
|
|
1130
1081
|
}, {
|
|
1131
|
-
name: '
|
|
1132
|
-
type: '
|
|
1133
|
-
description: 'This prop passes one additional error that is secondary to component errors'
|
|
1082
|
+
name: 'allowRendererContainerStyles',
|
|
1083
|
+
type: 'boolean'
|
|
1134
1084
|
}, {
|
|
1135
|
-
name: '
|
|
1085
|
+
name: 'allowSelectAllTrap',
|
|
1086
|
+
type: 'boolean'
|
|
1087
|
+
}, {
|
|
1088
|
+
name: 'allowUgcScrubber',
|
|
1089
|
+
type: 'boolean'
|
|
1090
|
+
}, {
|
|
1091
|
+
name: 'allowWrapCodeBlock',
|
|
1092
|
+
type: 'boolean'
|
|
1093
|
+
}, {
|
|
1094
|
+
name: 'analyticsEventSeverityTracking',
|
|
1095
|
+
type: '{ enabled: boolean; severityDegradedThreshold: number; severityNormalThreshold: number; }'
|
|
1096
|
+
}, {
|
|
1097
|
+
name: 'annotationProvider',
|
|
1098
|
+
type: '{ annotationManager?: AnnotationManager; inlineComment: InlineCommentAnnotationProvider; }'
|
|
1099
|
+
}, {
|
|
1100
|
+
name: 'appearance',
|
|
1101
|
+
type: '"comment" | "full-page" | "full-width" | "max"'
|
|
1102
|
+
}, {
|
|
1103
|
+
name: 'createSerializer',
|
|
1104
|
+
type: '(init: ReactSerializerInit) => Serializer<JSX.Element>',
|
|
1105
|
+
description: 'Creates a new `Serializer` to transform the ADF `document` into `JSX.Element`.\nAllows Confluence to implement {@link https://hello.atlassian.net/wiki/spaces/~lmarinov/pages/5177285037/COMPLEXIT+Progressive+rendering+of+ADF progressive rendering}.'
|
|
1106
|
+
}, {
|
|
1107
|
+
name: 'dataProviders',
|
|
1108
|
+
type: 'ProviderFactory'
|
|
1109
|
+
}, {
|
|
1110
|
+
name: 'disableActions',
|
|
1111
|
+
type: 'boolean'
|
|
1112
|
+
}, {
|
|
1113
|
+
name: 'disableHeadingIDs',
|
|
1114
|
+
type: 'boolean'
|
|
1115
|
+
}, {
|
|
1116
|
+
name: 'disableTableOverflowShadow',
|
|
1136
1117
|
type: 'boolean',
|
|
1137
|
-
description: 'When true,
|
|
1118
|
+
description: 'When true, disables the overflow shadow (visual indication) on the edges\nof tables.'
|
|
1138
1119
|
}, {
|
|
1139
|
-
name: '
|
|
1140
|
-
type: '
|
|
1141
|
-
|
|
1120
|
+
name: 'document',
|
|
1121
|
+
type: 'DocNode',
|
|
1122
|
+
isRequired: true
|
|
1123
|
+
}, {
|
|
1124
|
+
name: 'emojiResourceConfig',
|
|
1125
|
+
type: 'EmojiResourceConfig'
|
|
1126
|
+
}, {
|
|
1127
|
+
name: 'enableSsrInlineScripts',
|
|
1128
|
+
type: 'boolean'
|
|
1129
|
+
}, {
|
|
1130
|
+
name: 'eventHandlers',
|
|
1131
|
+
type: 'EventHandlers'
|
|
1132
|
+
}, {
|
|
1133
|
+
name: 'extensionHandlers',
|
|
1134
|
+
type: 'ExtensionHandlers<any>'
|
|
1135
|
+
}, {
|
|
1136
|
+
name: 'extensionViewportSizes',
|
|
1137
|
+
type: 'ExtensionViewportSize[]'
|
|
1138
|
+
}, {
|
|
1139
|
+
name: 'fadeOutHeight',
|
|
1140
|
+
type: 'number'
|
|
1141
|
+
}, {
|
|
1142
|
+
name: 'featureFlags',
|
|
1143
|
+
type: '{ [featureFlag: string]: boolean; } | Partial<RawObjectFeatureFlags>',
|
|
1144
|
+
description: "@description\nShort lived feature flags for experiments and gradual rollouts\nFlags are expected to follow these rules or they are filtered out\n\n1. cased in kebab-case (match [a-z-])\n2. have boolean values or object {} values\n\n@example\n```tsx\n(<Renderer featureFlags={{ 'my-feature': true }} />);\ngetFeatureFlags()?.myFeature === true;\n```\n\n@example\n```tsx\n(<Renderer featureFlags={{ 'my-feature': 'thing' }} />);\ngetFeatureFlags()?.myFeature === undefined;\n```\n\n@example\n```tsx\n(<Renderer featureFlags={{ 'product.my-feature': false }} />);\ngetFeatureFlags()?.myFeature === undefined;\ngetFeatureFlags()?.productMyFeature === undefined;\n```",
|
|
1145
|
+
defaultValue: 'undefined'
|
|
1146
|
+
}, {
|
|
1147
|
+
name: 'getExtensionHeight',
|
|
1148
|
+
type: '(node: PMNode) => string'
|
|
1149
|
+
}, {
|
|
1150
|
+
name: 'includeNodesCountInStats',
|
|
1151
|
+
type: 'boolean'
|
|
1152
|
+
}, {
|
|
1153
|
+
name: 'innerRef',
|
|
1154
|
+
type: 'React.RefObject<HTMLDivElement>'
|
|
1155
|
+
}, {
|
|
1156
|
+
name: 'isInsideOfInlineExtension',
|
|
1157
|
+
type: 'boolean'
|
|
1142
1158
|
}, {
|
|
1143
|
-
name: '
|
|
1144
|
-
type: '
|
|
1145
|
-
description: 'Allows for customisation of text in the link picker.'
|
|
1159
|
+
name: 'isTopLevelRenderer',
|
|
1160
|
+
type: 'boolean'
|
|
1146
1161
|
}, {
|
|
1147
|
-
name: '
|
|
1148
|
-
type: '
|
|
1149
|
-
description: 'Disables the default width containing the link picker.'
|
|
1162
|
+
name: 'maxHeight',
|
|
1163
|
+
type: 'number'
|
|
1150
1164
|
}, {
|
|
1151
|
-
name: '
|
|
1152
|
-
type: '
|
|
1153
|
-
description: 'The desired text to be displayed below the display text input field. Only displayed when `platform-linking-visual-refresh-link-picker` gate is enabled.'
|
|
1165
|
+
name: 'media',
|
|
1166
|
+
type: 'MediaOptions'
|
|
1154
1167
|
}, {
|
|
1155
|
-
name: '
|
|
1156
|
-
type: 'string'
|
|
1157
|
-
description: 'The desired text to be displayed alternatively to the title of the linked resource for editing.'
|
|
1168
|
+
name: 'nodeComponents',
|
|
1169
|
+
type: '{ [key: string]: React.ComponentType<any>; }'
|
|
1158
1170
|
}, {
|
|
1159
|
-
name: '
|
|
1160
|
-
type: '
|
|
1171
|
+
name: 'noOpSSRInlineScript',
|
|
1172
|
+
type: 'boolean'
|
|
1161
1173
|
}, {
|
|
1162
|
-
name: '
|
|
1163
|
-
type: '
|
|
1164
|
-
description: 'Hides the link picker display text field if set to true.'
|
|
1174
|
+
name: 'onComplete',
|
|
1175
|
+
type: '(stat: RenderOutputStat) => void'
|
|
1165
1176
|
}, {
|
|
1166
|
-
name: '
|
|
1167
|
-
type: '(
|
|
1168
|
-
description: 'Ref to the link picker search input.'
|
|
1177
|
+
name: 'onError',
|
|
1178
|
+
type: '(error: any) => void'
|
|
1169
1179
|
}, {
|
|
1170
|
-
name: '
|
|
1171
|
-
type: '
|
|
1172
|
-
description:
|
|
1180
|
+
name: 'onSetLinkTarget',
|
|
1181
|
+
type: '(url: string) => "_blank"',
|
|
1182
|
+
description: "Optional callback to programatically determine the link target for rendered links. Controls whether a link should render as external or not.\nReturn _blank if the url should render as an external link.\nReturn undefined to use the links default behavior and target.\n\n@param url - The URL of the link being rendered\n@returns '_blank' to render as an external link or undefined to not change the link"
|
|
1173
1183
|
}, {
|
|
1174
|
-
name: '
|
|
1175
|
-
type: '
|
|
1176
|
-
description: 'Controls showing a "submission in-progres" UX'
|
|
1184
|
+
name: 'portal',
|
|
1185
|
+
type: 'HTMLElement'
|
|
1177
1186
|
}, {
|
|
1178
|
-
name: '
|
|
1179
|
-
type: '
|
|
1180
|
-
description: 'This prop controls where the submit button appears. When true the submit button will move below the input field and be full width'
|
|
1187
|
+
name: 'rendererContext',
|
|
1188
|
+
type: 'RendererContext'
|
|
1181
1189
|
}, {
|
|
1182
|
-
name: '
|
|
1183
|
-
type: '
|
|
1184
|
-
description: 'Callback to fire when the cancel button is clicked.\nIf not provided, cancel button is not displayed.'
|
|
1190
|
+
name: 'schema',
|
|
1191
|
+
type: 'Schema<any, any>'
|
|
1185
1192
|
}, {
|
|
1186
|
-
name: '
|
|
1187
|
-
type: '() => void',
|
|
1188
|
-
description: '
|
|
1193
|
+
name: 'scrollToBlock',
|
|
1194
|
+
type: '(element: HTMLElement) => void',
|
|
1195
|
+
description: 'Optional callback to scroll an element into view when using block links (#block-xxx).\nWhen provided, this is used instead of the default scrollIntoView for accurate positioning\nin product-specific scroll containers (e.g. Confluence view page).'
|
|
1189
1196
|
}, {
|
|
1190
|
-
name: '
|
|
1191
|
-
type: '(
|
|
1192
|
-
description: '
|
|
1193
|
-
isRequired: true
|
|
1197
|
+
name: 'shouldDisplayExtensionAsInline',
|
|
1198
|
+
type: '(extensionParams: ExtensionParams<Parameters>) => boolean',
|
|
1199
|
+
description: 'Determines if the extension should be displayed as inline based on the extension parameters.\n@param extensionParams - The extension parameters.\n@returns True if the extension should be displayed as inline, false otherwise.'
|
|
1194
1200
|
}, {
|
|
1195
|
-
name: '
|
|
1196
|
-
type: '
|
|
1197
|
-
description: 'Override the default bottom padding.'
|
|
1201
|
+
name: 'shouldOpenMediaViewer',
|
|
1202
|
+
type: 'boolean'
|
|
1198
1203
|
}, {
|
|
1199
|
-
name: '
|
|
1200
|
-
type: '
|
|
1201
|
-
description: 'Override the default left padding.'
|
|
1204
|
+
name: 'shouldRemoveEmptySpaceAroundContent',
|
|
1205
|
+
type: 'boolean'
|
|
1202
1206
|
}, {
|
|
1203
|
-
name: '
|
|
1204
|
-
type: '
|
|
1205
|
-
description: 'Override the default right padding.'
|
|
1207
|
+
name: 'smartLinks',
|
|
1208
|
+
type: 'SmartLinksOptions'
|
|
1206
1209
|
}, {
|
|
1207
|
-
name: '
|
|
1208
|
-
type: '
|
|
1209
|
-
description: 'Override the default top padding.'
|
|
1210
|
+
name: 'stickyHeaders',
|
|
1211
|
+
type: 'boolean | ({ show?: boolean; } & { offsetTop?: number; } & StickyHeaderConfig_DO_NOT_USE)'
|
|
1210
1212
|
}, {
|
|
1211
|
-
name: '
|
|
1212
|
-
type: '
|
|
1213
|
-
description: 'Plugins that provide link suggestions / search capabilities.'
|
|
1213
|
+
name: 'textHighlighter',
|
|
1214
|
+
type: '{ component: React.ComponentType<{ children: React.ReactNode; groups: string[]; marks: Set<string>; match: string; startPos: number; }>; pattern: RegExp; }'
|
|
1214
1215
|
}, {
|
|
1215
|
-
name: '
|
|
1216
|
-
type: '
|
|
1217
|
-
description: 'Disables URLs that do not have an embeddable preview'
|
|
1216
|
+
name: 'timeZone',
|
|
1217
|
+
type: 'string'
|
|
1218
1218
|
}, {
|
|
1219
|
-
name: '
|
|
1220
|
-
type: '
|
|
1221
|
-
description: 'Showing dynamic list size based on window height'
|
|
1219
|
+
name: 'truncated',
|
|
1220
|
+
type: 'boolean'
|
|
1222
1221
|
}, {
|
|
1223
|
-
name: '
|
|
1224
|
-
type: 'boolean'
|
|
1225
|
-
description: 'Controls showing the image in the no results state'
|
|
1222
|
+
name: 'UNSTABLE_allowTableAlignment',
|
|
1223
|
+
type: 'boolean'
|
|
1226
1224
|
}, {
|
|
1227
|
-
name: '
|
|
1225
|
+
name: 'UNSTABLE_allowTableResizing',
|
|
1226
|
+
type: 'boolean'
|
|
1227
|
+
}, {
|
|
1228
|
+
name: 'UNSTABLE_isPresentational',
|
|
1228
1229
|
type: 'boolean',
|
|
1229
|
-
description: '
|
|
1230
|
+
description: 'When true, elements may render without their default semantic roles\n(e.g., using role="presentation"), indicating that they are used solely for layout or styling purposes.\nElements currently affected: Tables.'
|
|
1230
1231
|
}, {
|
|
1231
|
-
name: '
|
|
1232
|
-
type: 'string'
|
|
1233
|
-
description: 'The url of the linked resource for editing.'
|
|
1232
|
+
name: 'unsupportedContentLevelsTracking',
|
|
1233
|
+
type: '{ enabled: boolean; samplingRates?: { [key: string]: number; }; thresholds?: Partial<UnsupportedContentLevelThresholds>; }'
|
|
1234
1234
|
}]
|
|
1235
1235
|
}, {
|
|
1236
1236
|
name: 'Card',
|
|
@@ -1351,97 +1351,147 @@ export var atlaskitComponents = [{
|
|
|
1351
1351
|
description: 'The url link of the resource to be resolved and shown as Smart Link.'
|
|
1352
1352
|
}]
|
|
1353
1353
|
}, {
|
|
1354
|
-
name: '
|
|
1354
|
+
name: 'FooterBlock',
|
|
1355
1355
|
package: '@atlaskit/smart-card',
|
|
1356
|
-
description: '
|
|
1356
|
+
description: 'A block component for the Smart Link footer, typically showing actions (e.g. copy, open, follow).',
|
|
1357
1357
|
status: 'general-availability',
|
|
1358
|
-
usageGuidelines: ['Use
|
|
1358
|
+
usageGuidelines: ['Use at the bottom of a FlexibleCard when you need actions such as copy link, open, or follow.'],
|
|
1359
1359
|
contentGuidelines: [],
|
|
1360
|
-
accessibilityGuidelines: ['
|
|
1361
|
-
keywords: ['smart-card', '
|
|
1360
|
+
accessibilityGuidelines: ['Give each action button or control an accessible name (e.g. "Copy link", "Open in new tab") so purpose is clear to screen readers.', 'Ensure actions are keyboard operable and appear in a logical tab order.'],
|
|
1361
|
+
keywords: ['smart-card', 'footer block', 'flexible', 'block', 'actions'],
|
|
1362
1362
|
category: 'linking',
|
|
1363
|
-
examples: ["import {
|
|
1363
|
+
examples: ["import { FooterBlock } from '../../src';\nimport ExampleContainer from './example-container';\nexport default (): React.JSX.Element => (\n\t<ExampleContainer>\n\t\t<FooterBlock />\n\t</ExampleContainer>\n);"],
|
|
1364
1364
|
props: [{
|
|
1365
|
-
name: '
|
|
1366
|
-
type: '
|
|
1367
|
-
description: '
|
|
1365
|
+
name: 'actions',
|
|
1366
|
+
type: 'ActionItem[]',
|
|
1367
|
+
description: 'An array of actions to be displayed on the right.\nAdding more than three actions will result in the second and following\nactions being hidden inside of a dropdown\n@see ActionItem'
|
|
1368
1368
|
}, {
|
|
1369
|
-
name: '
|
|
1369
|
+
name: 'alwaysShow',
|
|
1370
1370
|
type: 'boolean',
|
|
1371
|
-
description: '
|
|
1371
|
+
description: 'Allows rendering of the footer regardless of whether the block has resolved'
|
|
1372
1372
|
}, {
|
|
1373
|
-
name: '
|
|
1374
|
-
type: '
|
|
1375
|
-
description: '
|
|
1373
|
+
name: 'blockRef',
|
|
1374
|
+
type: '((instance: HTMLDivElement) => void) | React.RefObject<HTMLDivElement>',
|
|
1375
|
+
description: 'Ref to block wrapper div.'
|
|
1376
1376
|
}, {
|
|
1377
1377
|
name: 'children',
|
|
1378
|
-
type: 'React.ReactElement<any, string | React.JSXElementConstructor<any>>',
|
|
1379
|
-
description: 'React children
|
|
1380
|
-
isRequired: true
|
|
1378
|
+
type: 'string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | React.ReactPortal',
|
|
1379
|
+
description: 'React children'
|
|
1381
1380
|
}, {
|
|
1382
|
-
name: '
|
|
1381
|
+
name: 'hideIconLoadingSkeleton',
|
|
1383
1382
|
type: 'boolean',
|
|
1384
|
-
description: '
|
|
1383
|
+
description: 'For image icons in the title, whether to hide the loading skeleton while the image is loading.'
|
|
1385
1384
|
}, {
|
|
1386
|
-
name: '
|
|
1387
|
-
type: '
|
|
1388
|
-
description: '
|
|
1385
|
+
name: 'hideProvider',
|
|
1386
|
+
type: 'boolean',
|
|
1387
|
+
description: 'Allows hiding of the resources provider'
|
|
1389
1388
|
}, {
|
|
1390
|
-
name: '
|
|
1391
|
-
type: '
|
|
1392
|
-
description: '
|
|
1389
|
+
name: 'isPreviewBlockErrored',
|
|
1390
|
+
type: 'boolean',
|
|
1391
|
+
description: 'Used with RovoActions to determine if the preview block is visible or not'
|
|
1393
1392
|
}, {
|
|
1394
|
-
name: '
|
|
1393
|
+
name: 'onActionMenuOpenChange',
|
|
1394
|
+
type: '(options: OnActionMenuOpenChangeOptions) => void',
|
|
1395
|
+
description: 'Function to be called when footer action dropdown open state is changed.'
|
|
1396
|
+
}, {
|
|
1397
|
+
name: 'placeholderId',
|
|
1395
1398
|
type: 'string',
|
|
1396
|
-
description: '
|
|
1399
|
+
description: 'A unique identifier for the placeholder loading state, which is constant across all loading states of the same item.'
|
|
1397
1400
|
}, {
|
|
1398
|
-
name: '
|
|
1399
|
-
type: '
|
|
1400
|
-
description: '
|
|
1401
|
+
name: 'size',
|
|
1402
|
+
type: 'SmartLinkSize',
|
|
1403
|
+
description: 'The size of the block and the size that the underlying elements should\ndefault to.'
|
|
1404
|
+
}]
|
|
1405
|
+
}, {
|
|
1406
|
+
name: 'MetadataBlock',
|
|
1407
|
+
package: '@atlaskit/smart-card',
|
|
1408
|
+
description: 'A block component that displays a row of metadata elements (e.g. created by, due date, state) in a Smart Link.',
|
|
1409
|
+
status: 'general-availability',
|
|
1410
|
+
usageGuidelines: ['Use when you need a single row of metadata (e.g. created by, due date, state) in a block Smart Link.'],
|
|
1411
|
+
contentGuidelines: [],
|
|
1412
|
+
accessibilityGuidelines: ['Ensure metadata is available to screen readers (e.g. not conveyed only by color or icon).', 'Use a list or group with an accessible name if the metadata row has a specific purpose (e.g. "Contributors", "Dates").'],
|
|
1413
|
+
keywords: ['smart-card', 'metadata block', 'flexible', 'block', 'metadata'],
|
|
1414
|
+
category: 'linking',
|
|
1415
|
+
examples: ["import { ElementName, MetadataBlock } from '../../src';\nimport ExampleContainer from './example-container';\nexport default (): React.JSX.Element => (\n\t<ExampleContainer>\n\t\t<MetadataBlock\n\t\t\tprimary={[{ name: ElementName.CollaboratorGroup }, { name: ElementName.ModifiedOn }]}\n\t\t/>\n\t</ExampleContainer>\n);"],
|
|
1416
|
+
props: [{
|
|
1417
|
+
name: 'blockRef',
|
|
1418
|
+
type: '((instance: HTMLDivElement) => void) | React.RefObject<HTMLDivElement>',
|
|
1419
|
+
description: 'Ref to block wrapper div.'
|
|
1401
1420
|
}, {
|
|
1402
|
-
name: '
|
|
1403
|
-
type: 'string',
|
|
1404
|
-
description: '
|
|
1421
|
+
name: 'children',
|
|
1422
|
+
type: 'string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | React.ReactPortal',
|
|
1423
|
+
description: 'React children'
|
|
1405
1424
|
}, {
|
|
1406
|
-
name: '
|
|
1425
|
+
name: 'hideIconLoadingSkeleton',
|
|
1407
1426
|
type: 'boolean',
|
|
1408
|
-
description: '
|
|
1427
|
+
description: 'For image icons in the title, whether to hide the loading skeleton while the image is loading.'
|
|
1409
1428
|
}, {
|
|
1410
|
-
name: '
|
|
1411
|
-
type: '
|
|
1412
|
-
description: '
|
|
1429
|
+
name: 'maxLines',
|
|
1430
|
+
type: 'number',
|
|
1431
|
+
description: 'Determines the number of lines the metadata should span across.\nDefault is 2. Maximum is 2.',
|
|
1432
|
+
defaultValue: '2'
|
|
1413
1433
|
}, {
|
|
1414
|
-
name: '
|
|
1434
|
+
name: 'placeholderId',
|
|
1415
1435
|
type: 'string',
|
|
1416
|
-
description: '
|
|
1417
|
-
isRequired: true
|
|
1436
|
+
description: 'A unique identifier for the placeholder loading state, which is constant across all loading states of the same item.'
|
|
1418
1437
|
}, {
|
|
1419
|
-
name: '
|
|
1420
|
-
type: '
|
|
1421
|
-
description: '
|
|
1438
|
+
name: 'primary',
|
|
1439
|
+
type: 'ElementItem[]',
|
|
1440
|
+
description: 'An array of metadata elements to display on the left.\nBy default elements will be shown to the right of the TitleBlock.\nThe visibility of the element is determine by the link data.\nIf link contain no data to display a particular element, the element\nwill simply not show up.\n@see ElementItem',
|
|
1441
|
+
defaultValue: '[]'
|
|
1442
|
+
}, {
|
|
1443
|
+
name: 'secondary',
|
|
1444
|
+
type: 'ElementItem[]',
|
|
1445
|
+
description: 'An array of metadata elements to display on the right.\nBy default elements will be shown to the right of the TitleBlock.\nThe visibility of the element is determine by the link data.\nIf link contain no data to display a particular element, the element\nwill simply not show up.\n@see ElementItem',
|
|
1446
|
+
defaultValue: '[]'
|
|
1447
|
+
}, {
|
|
1448
|
+
name: 'size',
|
|
1449
|
+
type: 'SmartLinkSize',
|
|
1450
|
+
description: 'The size of the block and the size that the underlying elements should\ndefault to.'
|
|
1422
1451
|
}]
|
|
1423
1452
|
}, {
|
|
1424
|
-
name: '
|
|
1453
|
+
name: 'PreviewBlock',
|
|
1425
1454
|
package: '@atlaskit/smart-card',
|
|
1426
|
-
description: '
|
|
1455
|
+
description: 'A block component that displays a preview image or media for the Smart Link.',
|
|
1427
1456
|
status: 'general-availability',
|
|
1428
|
-
usageGuidelines: ['Use when the
|
|
1457
|
+
usageGuidelines: ['Use when the linked resource has a preview image or media and you want to surface it in the block card.'],
|
|
1429
1458
|
contentGuidelines: [],
|
|
1430
|
-
accessibilityGuidelines: ['
|
|
1431
|
-
keywords: ['smart-card', '
|
|
1459
|
+
accessibilityGuidelines: ['If the preview image conveys information, provide meaningful alt text; if purely decorative, use alt="" or aria-hidden.', 'Ensure no critical information is shown only in the preview; duplicate in text or metadata when needed.'],
|
|
1460
|
+
keywords: ['smart-card', 'preview block', 'flexible', 'block', 'preview', 'image'],
|
|
1432
1461
|
category: 'linking',
|
|
1433
|
-
examples: [
|
|
1462
|
+
examples: ["import { PreviewBlock } from '../../src';\nimport ExampleContainer from './example-container';\nexport default (): React.JSX.Element => (\n\t<ExampleContainer>\n\t\t<PreviewBlock />\n\t</ExampleContainer>\n);"],
|
|
1434
1463
|
props: [{
|
|
1435
|
-
name: '
|
|
1464
|
+
name: 'blockRef',
|
|
1465
|
+
type: '((instance: HTMLDivElement) => void) | React.RefObject<HTMLDivElement>',
|
|
1466
|
+
description: 'Ref to block wrapper div.'
|
|
1467
|
+
}, {
|
|
1468
|
+
name: 'children',
|
|
1469
|
+
type: 'string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | React.ReactPortal',
|
|
1470
|
+
description: 'React children'
|
|
1471
|
+
}, {
|
|
1472
|
+
name: 'hideIconLoadingSkeleton',
|
|
1436
1473
|
type: 'boolean',
|
|
1437
|
-
description: '
|
|
1474
|
+
description: 'For image icons in the title, whether to hide the loading skeleton while the image is loading.'
|
|
1438
1475
|
}, {
|
|
1439
|
-
name: '
|
|
1476
|
+
name: 'ignoreContainerPadding',
|
|
1440
1477
|
type: 'boolean',
|
|
1441
|
-
description: '
|
|
1478
|
+
description: 'Indicate whether preview block should ignore the padding its parent container.\nDefault is false.'
|
|
1442
1479
|
}, {
|
|
1443
|
-
name: '
|
|
1444
|
-
type: '
|
|
1480
|
+
name: 'overrideUrl',
|
|
1481
|
+
type: 'string',
|
|
1482
|
+
description: 'An image URL to render. This will replace the default image from smart link data.'
|
|
1483
|
+
}, {
|
|
1484
|
+
name: 'placeholderId',
|
|
1485
|
+
type: 'string',
|
|
1486
|
+
description: 'A unique identifier for the placeholder loading state, which is constant across all loading states of the same item.'
|
|
1487
|
+
}, {
|
|
1488
|
+
name: 'placement',
|
|
1489
|
+
type: 'MediaPlacement',
|
|
1490
|
+
description: 'The placement of the preview block in relation of its container.\nThis makes the preview block leave flex layout to absolute positioning\nto the left/right of the container.'
|
|
1491
|
+
}, {
|
|
1492
|
+
name: 'size',
|
|
1493
|
+
type: 'SmartLinkSize',
|
|
1494
|
+
description: 'The size of the block and the size that the underlying elements should\ndefault to.'
|
|
1445
1495
|
}]
|
|
1446
1496
|
}, {
|
|
1447
1497
|
name: 'FlexibleCard',
|
|
@@ -1639,145 +1689,6 @@ export var atlaskitComponents = [{
|
|
|
1639
1689
|
type: 'string',
|
|
1640
1690
|
description: 'The URL of the link for Competitor Prompt'
|
|
1641
1691
|
}]
|
|
1642
|
-
}, {
|
|
1643
|
-
name: 'MetadataBlock',
|
|
1644
|
-
package: '@atlaskit/smart-card',
|
|
1645
|
-
description: 'A block component that displays a row of metadata elements (e.g. created by, due date, state) in a Smart Link.',
|
|
1646
|
-
status: 'general-availability',
|
|
1647
|
-
usageGuidelines: ['Use when you need a single row of metadata (e.g. created by, due date, state) in a block Smart Link.'],
|
|
1648
|
-
contentGuidelines: [],
|
|
1649
|
-
accessibilityGuidelines: ['Ensure metadata is available to screen readers (e.g. not conveyed only by color or icon).', 'Use a list or group with an accessible name if the metadata row has a specific purpose (e.g. "Contributors", "Dates").'],
|
|
1650
|
-
keywords: ['smart-card', 'metadata block', 'flexible', 'block', 'metadata'],
|
|
1651
|
-
category: 'linking',
|
|
1652
|
-
examples: ["import { ElementName, MetadataBlock } from '../../src';\nimport ExampleContainer from './example-container';\nexport default (): React.JSX.Element => (\n\t<ExampleContainer>\n\t\t<MetadataBlock\n\t\t\tprimary={[{ name: ElementName.CollaboratorGroup }, { name: ElementName.ModifiedOn }]}\n\t\t/>\n\t</ExampleContainer>\n);"],
|
|
1653
|
-
props: [{
|
|
1654
|
-
name: 'blockRef',
|
|
1655
|
-
type: '((instance: HTMLDivElement) => void) | React.RefObject<HTMLDivElement>',
|
|
1656
|
-
description: 'Ref to block wrapper div.'
|
|
1657
|
-
}, {
|
|
1658
|
-
name: 'children',
|
|
1659
|
-
type: 'string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | React.ReactPortal',
|
|
1660
|
-
description: 'React children'
|
|
1661
|
-
}, {
|
|
1662
|
-
name: 'hideIconLoadingSkeleton',
|
|
1663
|
-
type: 'boolean',
|
|
1664
|
-
description: 'For image icons in the title, whether to hide the loading skeleton while the image is loading.'
|
|
1665
|
-
}, {
|
|
1666
|
-
name: 'maxLines',
|
|
1667
|
-
type: 'number',
|
|
1668
|
-
description: 'Determines the number of lines the metadata should span across.\nDefault is 2. Maximum is 2.',
|
|
1669
|
-
defaultValue: '2'
|
|
1670
|
-
}, {
|
|
1671
|
-
name: 'placeholderId',
|
|
1672
|
-
type: 'string',
|
|
1673
|
-
description: 'A unique identifier for the placeholder loading state, which is constant across all loading states of the same item.'
|
|
1674
|
-
}, {
|
|
1675
|
-
name: 'primary',
|
|
1676
|
-
type: 'ElementItem[]',
|
|
1677
|
-
description: 'An array of metadata elements to display on the left.\nBy default elements will be shown to the right of the TitleBlock.\nThe visibility of the element is determine by the link data.\nIf link contain no data to display a particular element, the element\nwill simply not show up.\n@see ElementItem',
|
|
1678
|
-
defaultValue: '[]'
|
|
1679
|
-
}, {
|
|
1680
|
-
name: 'secondary',
|
|
1681
|
-
type: 'ElementItem[]',
|
|
1682
|
-
description: 'An array of metadata elements to display on the right.\nBy default elements will be shown to the right of the TitleBlock.\nThe visibility of the element is determine by the link data.\nIf link contain no data to display a particular element, the element\nwill simply not show up.\n@see ElementItem',
|
|
1683
|
-
defaultValue: '[]'
|
|
1684
|
-
}, {
|
|
1685
|
-
name: 'size',
|
|
1686
|
-
type: 'SmartLinkSize',
|
|
1687
|
-
description: 'The size of the block and the size that the underlying elements should\ndefault to.'
|
|
1688
|
-
}]
|
|
1689
|
-
}, {
|
|
1690
|
-
name: 'PreviewBlock',
|
|
1691
|
-
package: '@atlaskit/smart-card',
|
|
1692
|
-
description: 'A block component that displays a preview image or media for the Smart Link.',
|
|
1693
|
-
status: 'general-availability',
|
|
1694
|
-
usageGuidelines: ['Use when the linked resource has a preview image or media and you want to surface it in the block card.'],
|
|
1695
|
-
contentGuidelines: [],
|
|
1696
|
-
accessibilityGuidelines: ['If the preview image conveys information, provide meaningful alt text; if purely decorative, use alt="" or aria-hidden.', 'Ensure no critical information is shown only in the preview; duplicate in text or metadata when needed.'],
|
|
1697
|
-
keywords: ['smart-card', 'preview block', 'flexible', 'block', 'preview', 'image'],
|
|
1698
|
-
category: 'linking',
|
|
1699
|
-
examples: ["import { PreviewBlock } from '../../src';\nimport ExampleContainer from './example-container';\nexport default (): React.JSX.Element => (\n\t<ExampleContainer>\n\t\t<PreviewBlock />\n\t</ExampleContainer>\n);"],
|
|
1700
|
-
props: [{
|
|
1701
|
-
name: 'blockRef',
|
|
1702
|
-
type: '((instance: HTMLDivElement) => void) | React.RefObject<HTMLDivElement>',
|
|
1703
|
-
description: 'Ref to block wrapper div.'
|
|
1704
|
-
}, {
|
|
1705
|
-
name: 'children',
|
|
1706
|
-
type: 'string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | React.ReactPortal',
|
|
1707
|
-
description: 'React children'
|
|
1708
|
-
}, {
|
|
1709
|
-
name: 'hideIconLoadingSkeleton',
|
|
1710
|
-
type: 'boolean',
|
|
1711
|
-
description: 'For image icons in the title, whether to hide the loading skeleton while the image is loading.'
|
|
1712
|
-
}, {
|
|
1713
|
-
name: 'ignoreContainerPadding',
|
|
1714
|
-
type: 'boolean',
|
|
1715
|
-
description: 'Indicate whether preview block should ignore the padding its parent container.\nDefault is false.'
|
|
1716
|
-
}, {
|
|
1717
|
-
name: 'overrideUrl',
|
|
1718
|
-
type: 'string',
|
|
1719
|
-
description: 'An image URL to render. This will replace the default image from smart link data.'
|
|
1720
|
-
}, {
|
|
1721
|
-
name: 'placeholderId',
|
|
1722
|
-
type: 'string',
|
|
1723
|
-
description: 'A unique identifier for the placeholder loading state, which is constant across all loading states of the same item.'
|
|
1724
|
-
}, {
|
|
1725
|
-
name: 'placement',
|
|
1726
|
-
type: 'MediaPlacement',
|
|
1727
|
-
description: 'The placement of the preview block in relation of its container.\nThis makes the preview block leave flex layout to absolute positioning\nto the left/right of the container.'
|
|
1728
|
-
}, {
|
|
1729
|
-
name: 'size',
|
|
1730
|
-
type: 'SmartLinkSize',
|
|
1731
|
-
description: 'The size of the block and the size that the underlying elements should\ndefault to.'
|
|
1732
|
-
}]
|
|
1733
|
-
}, {
|
|
1734
|
-
name: 'FooterBlock',
|
|
1735
|
-
package: '@atlaskit/smart-card',
|
|
1736
|
-
description: 'A block component for the Smart Link footer, typically showing actions (e.g. copy, open, follow).',
|
|
1737
|
-
status: 'general-availability',
|
|
1738
|
-
usageGuidelines: ['Use at the bottom of a FlexibleCard when you need actions such as copy link, open, or follow.'],
|
|
1739
|
-
contentGuidelines: [],
|
|
1740
|
-
accessibilityGuidelines: ['Give each action button or control an accessible name (e.g. "Copy link", "Open in new tab") so purpose is clear to screen readers.', 'Ensure actions are keyboard operable and appear in a logical tab order.'],
|
|
1741
|
-
keywords: ['smart-card', 'footer block', 'flexible', 'block', 'actions'],
|
|
1742
|
-
category: 'linking',
|
|
1743
|
-
examples: ["import { FooterBlock } from '../../src';\nimport ExampleContainer from './example-container';\nexport default (): React.JSX.Element => (\n\t<ExampleContainer>\n\t\t<FooterBlock />\n\t</ExampleContainer>\n);"],
|
|
1744
|
-
props: [{
|
|
1745
|
-
name: 'actions',
|
|
1746
|
-
type: 'ActionItem[]',
|
|
1747
|
-
description: 'An array of actions to be displayed on the right.\nAdding more than three actions will result in the second and following\nactions being hidden inside of a dropdown\n@see ActionItem'
|
|
1748
|
-
}, {
|
|
1749
|
-
name: 'alwaysShow',
|
|
1750
|
-
type: 'boolean',
|
|
1751
|
-
description: 'Allows rendering of the footer regardless of whether the block has resolved'
|
|
1752
|
-
}, {
|
|
1753
|
-
name: 'blockRef',
|
|
1754
|
-
type: '((instance: HTMLDivElement) => void) | React.RefObject<HTMLDivElement>',
|
|
1755
|
-
description: 'Ref to block wrapper div.'
|
|
1756
|
-
}, {
|
|
1757
|
-
name: 'children',
|
|
1758
|
-
type: 'string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | React.ReactPortal',
|
|
1759
|
-
description: 'React children'
|
|
1760
|
-
}, {
|
|
1761
|
-
name: 'hideIconLoadingSkeleton',
|
|
1762
|
-
type: 'boolean',
|
|
1763
|
-
description: 'For image icons in the title, whether to hide the loading skeleton while the image is loading.'
|
|
1764
|
-
}, {
|
|
1765
|
-
name: 'hideProvider',
|
|
1766
|
-
type: 'boolean',
|
|
1767
|
-
description: 'Allows hiding of the resources provider'
|
|
1768
|
-
}, {
|
|
1769
|
-
name: 'onActionMenuOpenChange',
|
|
1770
|
-
type: '(options: OnActionMenuOpenChangeOptions) => void',
|
|
1771
|
-
description: 'Function to be called when footer action dropdown open state is changed.'
|
|
1772
|
-
}, {
|
|
1773
|
-
name: 'placeholderId',
|
|
1774
|
-
type: 'string',
|
|
1775
|
-
description: 'A unique identifier for the placeholder loading state, which is constant across all loading states of the same item.'
|
|
1776
|
-
}, {
|
|
1777
|
-
name: 'size',
|
|
1778
|
-
type: 'SmartLinkSize',
|
|
1779
|
-
description: 'The size of the block and the size that the underlying elements should\ndefault to.'
|
|
1780
|
-
}]
|
|
1781
1692
|
}, {
|
|
1782
1693
|
name: 'useSmartLinkEvents',
|
|
1783
1694
|
package: '@atlaskit/smart-card',
|
|
@@ -1905,7 +1816,7 @@ export var atlaskitComponents = [{
|
|
|
1905
1816
|
accessibilityGuidelines: ['When rendering actions from this hook (e.g. buttons or menus), provide accessible labels (e.g. from action.text) and ensure keyboard support.'],
|
|
1906
1817
|
keywords: ['smart-card', 'hooks', 'useSmartLinkActions', 'actions'],
|
|
1907
1818
|
category: 'linking',
|
|
1908
|
-
examples: ["import React, { useCallback } from 'react';\nimport Button from '@atlaskit/button/new';\nimport { SmartCardProvider } from '@atlaskit/link-provider';\nimport { ResolvedClient, ResolvedClientUrl } from '@atlaskit/link-test-helpers';\nimport { Box } from '@atlaskit/primitives/compiled';\nimport { Card
|
|
1819
|
+
examples: ["import React, { useCallback } from 'react';\nimport Button from '@atlaskit/button/new';\nimport { SmartCardProvider } from '@atlaskit/link-provider';\nimport { ResolvedClient, ResolvedClientUrl } from '@atlaskit/link-test-helpers';\nimport { Box } from '@atlaskit/primitives/compiled';\nimport { Card } from '../../src';\nimport { CardAction } from '../../src/constants';\nimport { useSmartLinkActions } from '../../src/hooks';\nimport ExampleContainer from './example-container';\nconst PreviewButton = ({ url }: { url: string }) => {\n\tconst actions = useSmartLinkActions({ url, appearance: 'block' });\n\t// actions are returned in an array, find the preview action\n\tconst previewAction = actions.find((action) => action.id === 'preview-content');\n\tconst handleClick = useCallback(() => {\n\t\tif (previewAction) {\n\t\t\tpreviewAction.invoke();\n\t\t}\n\t}, [previewAction]);\n\tif (!previewAction) {\n\t\treturn null;\n\t}\n\treturn <Button onClick={handleClick}>{previewAction.text}</Button>;\n};\nconst UseSmartLinkActionsExample = (): React.JSX.Element => (\n\t<ExampleContainer>\n\t\t<SmartCardProvider client={new ResolvedClient()}>\n\t\t\t<Card\n\t\t\t\tappearance=\"block\"\n\t\t\t\turl={ResolvedClientUrl}\n\t\t\t\tactionOptions={{ hide: false, exclude: [CardAction.PreviewAction] }}\n\t\t\t/>\n\t\t\t<Box paddingBlockStart=\"space.200\">\n\t\t\t\t<PreviewButton url={ResolvedClientUrl} />\n\t\t\t</Box>\n\t\t</SmartCardProvider>\n\t</ExampleContainer>\n);\nexport default UseSmartLinkActionsExample;"],
|
|
1909
1820
|
props: [{
|
|
1910
1821
|
name: 'actionOptions',
|
|
1911
1822
|
type: 'CardActionVisibilityOptions & { previewAction?: { hideBlanket?: boolean; size?: EmbedModalSize; }; rovoChatAction?: { optIn: boolean; }; }',
|
|
@@ -1935,4 +1846,97 @@ export var atlaskitComponents = [{
|
|
|
1935
1846
|
description: 'Smart Link URL for which actions will be invoked.\n@example https://start.atlassian.com',
|
|
1936
1847
|
isRequired: true
|
|
1937
1848
|
}]
|
|
1849
|
+
}, {
|
|
1850
|
+
name: 'HoverCard',
|
|
1851
|
+
package: '@atlaskit/smart-card',
|
|
1852
|
+
description: 'Hover cards can be used as a standalone component to wrap any React component and display information about a supplied URL when the user hovers over the child. Different actions are shown depending on the resource type.',
|
|
1853
|
+
status: 'general-availability',
|
|
1854
|
+
usageGuidelines: ['Use when you need a Smart Link preview on hover over a custom trigger (e.g. text, icon). For hover preview on inline Smart Links in body text, use Card with showHoverPreview instead.'],
|
|
1855
|
+
contentGuidelines: [],
|
|
1856
|
+
accessibilityGuidelines: ['Provide a keyboard-accessible way to open the preview (e.g. focus or explicit trigger); do not rely on hover alone.', 'Ensure the trigger element has an accessible name and role (e.g. link or button).', 'Ensure the hover card content is announced when shown (e.g. aria-describedby or live region) and can be dismissed via keyboard.'],
|
|
1857
|
+
keywords: ['smart-card', 'hover card', 'hover', 'preview', 'smart link'],
|
|
1858
|
+
category: 'linking',
|
|
1859
|
+
examples: ["import { IntlProvider } from 'react-intl';\nimport { SmartCardProvider } from '@atlaskit/link-provider';\nimport { ResolvedClient, ResolvedClientEmbedUrl } from '@atlaskit/link-test-helpers';\nimport { HoverCard } from '../../src/hoverCard';\nimport HoverOverMe from '../utils/hover-card-box';\nexport default (): React.JSX.Element => (\n\t<IntlProvider locale=\"en\">\n\t\t<SmartCardProvider client={new ResolvedClient('stg')}>\n\t\t\t<HoverCard url={ResolvedClientEmbedUrl}>\n\t\t\t\t<HoverOverMe />\n\t\t\t</HoverCard>\n\t\t</SmartCardProvider>\n\t</IntlProvider>\n);"],
|
|
1860
|
+
props: [{
|
|
1861
|
+
name: 'actionOptions',
|
|
1862
|
+
type: 'CardActionVisibilityOptions & { previewAction?: { hideBlanket?: boolean; size?: EmbedModalSize; }; rovoChatAction?: { optIn: boolean; }; }',
|
|
1863
|
+
description: 'Configure visibility of server and client actions'
|
|
1864
|
+
}, {
|
|
1865
|
+
name: 'allowEventPropagation',
|
|
1866
|
+
type: 'boolean',
|
|
1867
|
+
description: 'Allow click event to bubble up from hover preview trigger component.'
|
|
1868
|
+
}, {
|
|
1869
|
+
name: 'canOpen',
|
|
1870
|
+
type: 'boolean',
|
|
1871
|
+
description: 'Determines if the hover card is allowed to open. If changed from true to false while the\nhover card is open, the hover card will be closed.'
|
|
1872
|
+
}, {
|
|
1873
|
+
name: 'children',
|
|
1874
|
+
type: 'React.ReactElement<any, string | React.JSXElementConstructor<any>>',
|
|
1875
|
+
description: 'React children component over which the hover card can be triggered.',
|
|
1876
|
+
isRequired: true
|
|
1877
|
+
}, {
|
|
1878
|
+
name: 'closeOnChildClick',
|
|
1879
|
+
type: 'boolean',
|
|
1880
|
+
description: 'Determines if the hover card should close when the children passed in are\nclicked.'
|
|
1881
|
+
}, {
|
|
1882
|
+
name: 'hoverPreviewOptions',
|
|
1883
|
+
type: 'HoverPreviewOptions',
|
|
1884
|
+
description: 'Additional configurations for hover card.'
|
|
1885
|
+
}, {
|
|
1886
|
+
name: 'id',
|
|
1887
|
+
type: 'string',
|
|
1888
|
+
description: 'Unique ID for a hover card. Used for analytics.'
|
|
1889
|
+
}, {
|
|
1890
|
+
name: 'label',
|
|
1891
|
+
type: 'string',
|
|
1892
|
+
description: 'Refers to an `aria-label` attribute. Sets an accessible name for the hover card to announce it to users of assistive technology.\nUsage of either this, or the `titleId` attribute is strongly recommended.'
|
|
1893
|
+
}, {
|
|
1894
|
+
name: 'onVisibilityChange',
|
|
1895
|
+
type: '(isVisible: boolean) => void',
|
|
1896
|
+
description: 'Callback function that is called when the hover card is visible or hidden.'
|
|
1897
|
+
}, {
|
|
1898
|
+
name: 'role',
|
|
1899
|
+
type: 'string',
|
|
1900
|
+
description: 'Use this to set the accessibility role for the hover card.\nShould be used along with `label` or `titleId` for supported roles.'
|
|
1901
|
+
}, {
|
|
1902
|
+
name: 'shouldRenderToParent',
|
|
1903
|
+
type: 'boolean',
|
|
1904
|
+
description: 'Whether the hover card should render to the parent element, to the\natlaskit-portal-container at the root of the document. Defaults to false.'
|
|
1905
|
+
}, {
|
|
1906
|
+
name: 'titleId',
|
|
1907
|
+
type: 'string',
|
|
1908
|
+
description: 'Id referenced by the hover card `aria-labelledby` attribute.\nUsage of either this, or the `label` attribute is strongly recommended.'
|
|
1909
|
+
}, {
|
|
1910
|
+
name: 'url',
|
|
1911
|
+
type: 'string',
|
|
1912
|
+
description: 'Hover card will display data from this url.',
|
|
1913
|
+
isRequired: true
|
|
1914
|
+
}, {
|
|
1915
|
+
name: 'zIndex',
|
|
1916
|
+
type: 'number',
|
|
1917
|
+
description: 'Z-index that the hover card should be displayed in.\nThis is passed to the portal component.'
|
|
1918
|
+
}]
|
|
1919
|
+
}, {
|
|
1920
|
+
name: 'LinkUrl',
|
|
1921
|
+
package: '@atlaskit/smart-card',
|
|
1922
|
+
description: 'LinkUrl is a plain hyperlink (<a>) with a built-in safety check. Use it when you want to warn users if the link description looks like one URL but the actual destination is different.',
|
|
1923
|
+
status: 'general-availability',
|
|
1924
|
+
usageGuidelines: ['Use when the link text might look like one URL but point elsewhere—e.g. user-generated or external links—so users get a warning before navigating.'],
|
|
1925
|
+
contentGuidelines: [],
|
|
1926
|
+
accessibilityGuidelines: ['Use descriptive link text that indicates the destination or action; avoid exposing only the URL when possible.', 'Ensure the safety-check warning (when link text and destination differ) is announced to screen readers.'],
|
|
1927
|
+
keywords: ['smart-card', 'link', 'url', 'safety', 'hyperlink'],
|
|
1928
|
+
category: 'linking',
|
|
1929
|
+
examples: ['import Link from \'@atlaskit/link\';\nimport { CardClient, SmartCardProvider } from \'@atlaskit/link-provider\';\nimport { UnAuthClient } from \'@atlaskit/link-test-helpers\';\nimport LinkUrl from \'../../src/view/LinkUrl\';\nexport default (): React.JSX.Element => (\n\t<div>\n\t\t<h2>Link safety warning</h2>\n\t\t<ul>\n\t\t\t<li>\n\t\t\t\tLink description is a URL and it\'s different from a destination.\n\t\t\t\t<br />\n\t\t\t\t<LinkUrl href="https://www.google.com/">atlassian.com</LinkUrl>\n\t\t\t</li>\n\t\t</ul>\n\t\t<h2>No link safety warning</h2>\n\t\t<ul>\n\t\t\t<li>\n\t\t\t\tLink description is a plain text.\n\t\t\t\t<br />\n\t\t\t\t<LinkUrl href="https://www.google.com/">Here is a google link</LinkUrl>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\tLink description is a URL identical to a destination.\n\t\t\t\t<br />\n\t\t\t\t<LinkUrl href="https://www.atlassian.com/solutions/devops">\n\t\t\t\t\thttps://www.atlassian.com/solutions/devops\n\t\t\t\t</LinkUrl>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\tLink is a multi-line URL.\n\t\t\t\t<br />\n\t\t\t\t<LinkUrl href="https://www.atlassian.com/solutions/devops">\n\t\t\t\t\t<p>Help</p>\n\t\t\t\t\t<Link href="https://www.atlassian.com/solutions/devops">\n\t\t\t\t\t\thttps://www.atlassian.com/solutions/devops\n\t\t\t\t\t</Link>\n\t\t\t\t</LinkUrl>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\tLink is a multi-line URL.\n\t\t\t\t<br />\n\t\t\t\t<LinkUrl href="https://hello.atlassian.com/wiki">\n\t\t\t\t\t<div>Help</div>\n\t\t\t\t\t<span>https://hello.atlas...</span>\n\t\t\t\t</LinkUrl>\n\t\t\t</li>\n\t\t</ul>\n\t\t<h2>Link with smart link resolver</h2>\n\t\t<ul>\n\t\t\t<li>\n\t\t\t\tThis link trigger smart link resolver\n\t\t\t\t<br />\n\t\t\t\t<SmartCardProvider client={new CardClient(\'stg\')}>\n\t\t\t\t\t<LinkUrl enableResolve={true} href="https://www.google.com/">\n\t\t\t\t\t\thttps://www.resolved-link.com/\n\t\t\t\t\t</LinkUrl>\n\t\t\t\t</SmartCardProvider>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\tThis link trigger smart link resolver with unauth\n\t\t\t\t<br />\n\t\t\t\t<SmartCardProvider client={new UnAuthClient()}>\n\t\t\t\t\t<LinkUrl enableResolve={true} href="https://www.unauth-link.com/">\n\t\t\t\t\t\thttps://www.unauth-link.com/\n\t\t\t\t\t</LinkUrl>\n\t\t\t\t</SmartCardProvider>\n\t\t\t</li>\n\t\t</ul>\n\t</div>\n);'],
|
|
1930
|
+
props: [{
|
|
1931
|
+
name: 'checkSafety',
|
|
1932
|
+
type: 'boolean',
|
|
1933
|
+
description: 'Determines if we want to perform a link safety check. True by default.'
|
|
1934
|
+
}, {
|
|
1935
|
+
name: 'enableResolve',
|
|
1936
|
+
type: 'boolean',
|
|
1937
|
+
description: 'Determines if we want to resolve the URL in the background for Rovo indexing. This has no impact on the UI/UX. False by default.'
|
|
1938
|
+
}, {
|
|
1939
|
+
name: 'isLinkComponent',
|
|
1940
|
+
type: 'boolean'
|
|
1941
|
+
}]
|
|
1938
1942
|
}];
|