@ember-eui/core 14.1.3 → 14.1.4
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/declarations/components/eui-page-body.d.ts +2 -1
- package/declarations/components/eui-page-body.d.ts.map +1 -1
- package/declarations/components/eui-page-content-body.d.ts +2 -1
- package/declarations/components/eui-page-content-body.d.ts.map +1 -1
- package/declarations/components/eui-page-content.d.ts +1 -1
- package/declarations/components/eui-page-content.d.ts.map +1 -1
- package/declarations/components/eui-page-template.d.ts +16 -15
- package/declarations/components/eui-page-template.d.ts.map +1 -1
- package/declarations/components/eui-page.d.ts +2 -1
- package/declarations/components/eui-page.d.ts.map +1 -1
- package/declarations/components/eui-pagination.d.ts.map +1 -1
- package/declarations/components/eui-panel.d.ts.map +1 -1
- package/declarations/components/eui-refresh-interval.d.ts +2 -0
- package/declarations/components/eui-refresh-interval.d.ts.map +1 -1
- package/declarations/components/eui-tabbed-content.d.ts.map +1 -1
- package/declarations/helpers/eui-page-restrict-width.d.ts.map +1 -1
- package/dist/components/eui-page-body.js.map +1 -1
- package/dist/components/eui-page-content-body.js.map +1 -1
- package/dist/components/eui-page-content.js.map +1 -1
- package/dist/components/eui-page-template.js +5 -5
- package/dist/components/eui-page-template.js.map +1 -1
- package/dist/components/eui-page.js.map +1 -1
- package/dist/components/eui-pagination.js +7 -4
- package/dist/components/eui-pagination.js.map +1 -1
- package/dist/components/eui-panel.js +1 -1
- package/dist/components/eui-panel.js.map +1 -1
- package/dist/components/eui-range.js +1 -1
- package/dist/components/eui-range.js.map +1 -1
- package/dist/components/eui-refresh-interval.js +22 -1
- package/dist/components/eui-refresh-interval.js.map +1 -1
- package/dist/components/eui-tabbed-content.js +6 -5
- package/dist/components/eui-tabbed-content.js.map +1 -1
- package/dist/helpers/eui-page-restrict-width.js +1 -1
- package/dist/helpers/eui-page-restrict-width.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-page-template.js","sources":["../../src/components/eui-page-template.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\n\nimport style from 'ember-style-modifier/modifiers/style';\n// import { tabbable } from 'tabbable';\n// import {\n// anchorPositionMapping,\n// displayMapping\n// } from '../../utils/css-mappings/eui-popover.ts';\n// import { paddingSizeMapping } from '../../utils/css-mappings/eui-panel.ts';\n// import { scheduleOnce, later, cancel } from '@ember/runloop';\n// import { assert } from '@ember/debug';\n// import { htmlSafe } from '@ember/template';\nimport { and, eq, or } from 'ember-truth-helpers';\n\n// import { action } from '@ember/object';\n// import { tracked } from '@glimmer/tracking';\n// import {\n// getTransitionTimings,\n// getWaitDuration,\n// performOnFrame\n// } from '../../utils/transition';\n// import { findPopoverPosition, getElementZIndex } from '../../utils/popover';\n// import { EuiPopoverPosition } from '../../utils/popover/types';\n// import { cascadingMenuKeys } from '../../utils/accesibility';\nimport argOrDefault, {\n argOrDefaultDecorator\n} from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\nimport inlineStyles from '../helpers/inline-styles.ts';\nimport useIsWithinBreakpoints from '../modifiers/use-is-within-breakpoints.ts';\nimport EuiBottomBar from './eui-bottom-bar.gts';\nimport EuiFlexGroup from './eui-flex-group.gts';\nimport EuiFlexItem from './eui-flex-item.gts';\nimport EuiPage from './eui-page.gts';\nimport EuiPageBody from './eui-page-body.gts';\nimport EuiPageContent from './eui-page-content.gts';\nimport EuiPageContentBody from './eui-page-content-body.gts';\nimport EuiPageHeader from './eui-page-header.gts';\nimport EuiPageSideBar from './eui-page-side-bar.gts';\n\nimport type { EuiBreakpointSize } from '../utils/breakpoint.ts';\nimport type { EuiButtomBarArgs } from './eui-bottom-bar';\nimport type { EuiPageBodySignature } from './eui-page-body';\nimport type { EuiPageContentSignature } from './eui-page-content';\nimport type { EuiPageContentBodySignature } from './eui-page-content-body';\nimport type { EuiPageHeaderSignature } from './eui-page-header';\nimport type { EuiPageSideBarSignature } from './eui-page-side-bar';\n\nexport const TEMPLATES = [\n 'default',\n 'centeredBody',\n 'centeredContent',\n 'empty'\n] as const;\n\nconst BREAKPOINTS: EuiBreakpointSize[] = ['m', 'l', 'xl'];\n\ninterface NormalProps {\n className?: string;\n}\n\nexport type EuiPageTemplateProps = {\n /**\n * Layout: `'default'` (header and content), `'centeredBody'` (content\n * panel centered in the page), `'centeredContent'` (content centered in\n * the body, e.g. an empty prompt) or `'empty'` (no panels).\n * Defaults to `'default'`.\n */\n template?: (typeof TEMPLATES)[number];\n\n /** Props for the `EuiPageBody`: `{ className }`. */\n pageBodyProps: NormalProps & EuiPageBodySignature['Args'];\n /**\n * Props for the `EuiPageContent`: `{ className, hasBorder, hasShadow,\n * color, borderRadius, grow, role }`.\n */\n pageContentProps: NormalProps & EuiPageContentSignature['Args'];\n /** Props for the `EuiPageContentBody`: `{ className }`. */\n pageContentBodyProps: NormalProps & EuiPageContentBodySignature['Args'];\n\n /**\n * The page header, as EuiPageHeader args: `{ pageTitle, iconType,\n * description, tabs, responsive, bottomBorder }`. Use the\n * `<:pageHeader…>` blocks for its title, description and actions.\n */\n pageHeader: NormalProps & EuiPageHeaderSignature['Args'];\n\n /** Props for the `EuiPageSideBar`: `{ className }`. */\n pageSideBarProps: NormalProps & EuiPageSideBarSignature['Args'];\n\n /** @deprecated Has no effect, use the `<:bottomBar>` block. */\n bottomBar?: any;\n\n /** @private Render the `<:bottomBar>` block. Defaults to `true`. */\n hasBottomBarBlock?: boolean;\n\n /** @deprecated Has no effect. */\n bottomBarProps?: EuiButtomBarArgs;\n /**\n * Stretches the page to the window's height and scrolls the content\n * instead of the page (templates `'default'` and `'empty'`, on medium\n * screens and up). Defaults to `false`.\n */\n fullHeight?: boolean;\n /** Minimum height of the page, in px or any CSS height. Defaults to `460`. */\n minHeight?: number;\n\n /**\n * Max width of the header and content: `true` for EUI's default, a number\n * in px or any CSS width. Defaults to `true`.\n */\n restrictWidth?: boolean | number | string;\n\n /** Fills the window's height. Defaults to `true`. */\n grow?: boolean;\n /** Padding of the page's sections: `'none'`, `'s'`, `'m'` or `'l'`. Defaults to `'l'`. */\n paddingSize?: EuiPageSideBarSignature['Args']['paddingSize'];\n /** @private Render the `<:pageSideBar>` block. Defaults to `true`. */\n hasPageSideBarBlock?: boolean;\n /** @private Render the `<:pageHeaderPageTitle>` block. Defaults to `true`. */\n hasPageHeaderPageTitleBlock?: boolean;\n /** @private Render the `<:pageHeaderDefault>` block. Defaults to `true`. */\n hasPageHeaderDefaultBlock?: boolean;\n /** @private Render the `<:pageHeaderRightSideItems>` block. Defaults to `true`. */\n hasPageHeaderRightSideItemsBlock?: boolean;\n /** @private Render the `<:pageHeaderDescription>` block. Defaults to `true`. */\n hasPageHeaderDescriptionBlock?: boolean;\n /** @deprecated Has no effect. */\n hasPageHeader?: boolean;\n /** @deprecated Has no effect. */\n hasPageContent?: boolean;\n /** @deprecated Has no effect. */\n hasPageContentBody?: boolean;\n};\n\n/**\n * A whole page layout in one component: side bar, header, content and\n * bottom bar, arranged by `@template`.\n */\nexport interface EuiPageTemplateSignature {\n Element: HTMLElement;\n Args: EuiPageTemplateProps;\n Blocks: {\n /** The page's content. */\n default: [];\n /** A side bar, e.g. an `EuiSideNav`. */\n pageSideBar: [];\n /** The header's title, instead of `pageHeader.pageTitle`. */\n pageHeaderPageTitle: [];\n /** Extra header content. */\n pageHeaderDefault: [];\n /** The header's description. */\n pageHeaderDescription: [];\n /** Header actions; yields an item to wrap each in, see EuiPageHeader. */\n pageHeaderRightSideItems: EuiPageHeaderSignature['Blocks']['rightSideItems'];\n /** Content of a bottom bar (EuiBottomBar), e.g. save/cancel buttons. */\n bottomBar: [];\n };\n}\n\nexport default class EuiPageTemplate extends Component<EuiPageTemplateSignature> {\n // Defaults\n @argOrDefaultDecorator(false) fullHeight!: boolean;\n @argOrDefaultDecorator('default') template!: (typeof TEMPLATES)[number];\n\n @tracked isWithinBreakpoints = false;\n\n setIsWithinBreakpoints = (value: boolean) => {\n this.isWithinBreakpoints = value;\n };\n\n get minHeight() {\n const minHeight = this.args.minHeight ?? 460;\n\n if (typeof this.args.minHeight === 'number') {\n return `${minHeight}px`;\n }\n\n return minHeight;\n }\n\n get restrictWidth() {\n const width = this.args.restrictWidth ?? true;\n\n if (typeof this.args.restrictWidth === 'number') {\n return `${width}px`;\n }\n\n return width;\n }\n\n get classes() {\n return `euiPageTemplate ${this.fullHeightClass}`;\n }\n\n get fullHeightClass() {\n return this.fullHeight && this.canFullHeight ? 'eui-fullHeight ' : '';\n }\n\n get yScrollClass() {\n return this.fullHeight && this.canFullHeight ? 'eui-yScroll ' : '';\n }\n\n get canFullHeight() {\n return (\n this.isWithinBreakpoints &&\n (this.template === 'default' || this.template === 'empty')\n );\n }\n\n get pageBodyPropsClass() {\n return `${this.fullHeightClass} ${this.args.pageBodyProps?.className}`;\n }\n\n get pageContentPropsClass() {\n return `${this.yScrollClass} ${this.args.pageContentProps?.className}`;\n }\n\n get pageContentBodyPropsClass() {\n return `${this.fullHeightClass} ${this.args.pageContentBodyProps?.className}`;\n }\n\n <template>\n {{#let\n (argOrDefault @grow true)\n (argOrDefault @paddingSize \"l\")\n (and (argOrDefault @hasBottomBarBlock true) (has-block \"bottomBar\"))\n (and (argOrDefault @hasPageSideBarBlock true) (has-block \"pageSideBar\"))\n (and\n (argOrDefault @hasPageHeaderPageTitleBlock true)\n (has-block \"pageHeaderPageTitle\")\n )\n (and\n (argOrDefault @hasPageHeaderDefaultBlock true)\n (has-block \"pageHeaderDefault\")\n )\n (and\n (argOrDefault @hasPageHeaderRightSideItemsBlock true)\n (has-block \"pageHeaderRightSideItems\")\n )\n (and\n (argOrDefault @hasPageHeaderDescriptionBlock true)\n (has-block \"pageHeaderDescription\")\n )\n (modifier\n useIsWithinBreakpoints\n sizes=BREAKPOINTS\n isActive=true\n setIsWithinBreakpointsValue=this.setIsWithinBreakpoints\n )\n as |grow paddingSize hasBottomBarBlock hasPageSideBarBlock hasPageHeaderPageTitleBlock hasPageHeaderDefaultBlock hasPageHeaderRightSideItemsBlock hasPageHeaderDescriptionBlock isWithinBreakpointsModifier|\n }}\n {{#let\n (or\n @pageHeader\n hasPageHeaderPageTitleBlock\n hasPageHeaderDefaultBlock\n hasPageHeaderRightSideItemsBlock\n hasPageHeaderDescriptionBlock\n )\n as |hasPageHeader|\n }}\n {{#if (eq this.template \"centeredBody\")}}\n {{#if hasPageSideBarBlock}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageSideBar\n class={{@pageSideBarProps.className}}\n @sticky={{true}}\n @paddingSize={{paddingSize}}\n >\n {{yield to=\"pageSideBar\"}}\n </EuiPageSideBar>\n <EuiPageBody\n class={{this.pageBodyPropsClass}}\n @paddingSize={{paddingSize}}\n >\n <EuiPageHeader\n @restrictWidth={{this.restrictWidth}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n >\n <:pageTitle>\n {{yield to=\"pageHeaderPageTitle\"}}\n </:pageTitle>\n <:default>\n {{yield to=\"pageHeaderDefault\"}}\n </:default>\n <:description>\n {{yield to=\"pageHeaderDescription\"}}\n </:description>\n <:rightSideItems as |item|>\n {{yield item to=\"pageHeaderRightSideItems\"}}\n </:rightSideItems>\n </EuiPageHeader>\n\n <EuiPageContent\n class={{this.pageContentPropsClass}}\n @verticalPosition=\"center\"\n @horizontalPosition=\"center\"\n @paddingSize={{paddingSize}}\n >\n <EuiPageContentBody\n class={{this.pageContentBodyPropsClass}}\n @restrictWidth={{this.restrictWidth}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n </EuiPage>\n {{else}}\n <EuiPage\n class={{this.classes}}\n @paddingSize={{paddingSize}}\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageBody\n class={{this.pageBodyPropsClass}}\n @restrictWidth={{this.restrictWidth}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n @restrictWidth={{false}}\n @bottomBorder={{@pageHeader.bottomBorder}}\n @paddingSize=\"none\"\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n >\n <:pageTitle>\n {{yield to=\"pageHeaderPageTitle\"}}\n </:pageTitle>\n <:default>\n {{yield to=\"pageHeaderDefault\"}}\n </:default>\n <:description>\n {{yield to=\"pageHeaderDescription\"}}\n </:description>\n <:rightSideItems as |item|>\n {{yield item to=\"pageHeaderRightSideItems\"}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageBody>\n <EuiPageContent\n class={{this.pageContentPropsClass}}\n @verticalPosition=\"center\"\n @horizontalPosition=\"center\"\n @hasBorder={{@pageContentProps.hasBorder}}\n @hasShadow={{@pageContentProps.hasShadow}}\n @color={{@pageContentProps.color}}\n @borderRadius={{@pageContentProps.borderRadius}}\n @grow={{@pageContentProps.grow}}\n @role={{@pageContentProps.role}}\n @paddingSize={{paddingSize}}\n >\n <EuiPageContentBody\n class={{this.pageContentBodyPropsClass}}\n @paddingSize=\"none\"\n @restrictWidth={{this.restrictWidth}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n </EuiPageBody>\n </EuiPage>\n {{/if}}\n {{else if (eq this.template \"centeredContent\")}}\n {{#if hasPageSideBarBlock}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageSideBar\n class={{@pageSideBarProps.className}}\n @sticky={{true}}\n @paddingSize={{paddingSize}}\n >\n {{yield to=\"pageSideBar\"}}\n </EuiPageSideBar>\n <EuiPageBody\n @panelled={{true}}\n @paddingSize={{paddingSize}}\n class={{this.pageBodyPropsClass}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n @restrictWidth={{this.restrictWidth}}\n @paddingSize={{@pageHeader.paddingSize}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n >\n <:pageTitle>\n {{yield to=\"pageHeaderPageTitle\"}}\n </:pageTitle>\n <:default>\n {{yield to=\"pageHeaderDefault\"}}\n </:default>\n <:description>\n {{yield to=\"pageHeaderDescription\"}}\n </:description>\n <:rightSideItems as |item|>\n {{yield item to=\"pageHeaderRightSideItems\"}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageContent\n @verticalPosition=\"center\"\n @horizontalPosition=\"center\"\n @hasShadow={{false}}\n @color=\"subdued\"\n @paddingSize={{paddingSize}}\n class={{this.pageContentPropsClass}}\n >\n <EuiPageContentBody\n @restrictWidth={{this.restrictWidth}}\n class={{this.pageContentBodyPropsClass}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n </EuiPage>\n {{else}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageBody class={{this.pageBodyPropsClass}}>\n {{#if hasPageHeader}}\n <EuiPageHeader\n @restrictWidth={{this.restrictWidth}}\n @paddingSize={{paddingSize}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n >\n <:pageTitle>\n {{yield to=\"pageHeaderPageTitle\"}}\n </:pageTitle>\n <:default>\n {{yield to=\"pageHeaderDefault\"}}\n </:default>\n <:description>\n {{yield to=\"pageHeaderDescription\"}}\n </:description>\n <:rightSideItems as |item|>\n {{yield item to=\"pageHeaderRightSideItems\"}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n {{!template-lint-disable}}\n <EuiPageContent\n role={{null}}\n @borderRadius=\"none\"\n @hasShadow={{false}}\n @paddingSize={{paddingSize}}\n style=\"display: flex\"\n >\n {{!template-lint-enable}}\n <EuiPageContent\n @verticalPosition=\"center\"\n @horizontalPosition=\"center\"\n @hasShadow={{false}}\n @color=\"subdued\"\n @paddingSize={{paddingSize}}\n class={{this.pageContentPropsClass}}\n >\n <EuiPageContentBody\n @restrictWidth={{this.restrictWidth}}\n class={{this.pageContentBodyPropsClass}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n\n </EuiPageContent>\n </EuiPageBody>\n </EuiPage>\n {{/if}}\n {{else if (eq this.template \"empty\")}}\n {{#if hasPageSideBarBlock}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageSideBar\n class={{@pageSideBarProps.className}}\n @sticky={{true}}\n @paddingSize={{paddingSize}}\n >\n {{yield to=\"pageSideBar\"}}\n </EuiPageSideBar>\n <EuiPageBody\n @paddingSize={{paddingSize}}\n class={{this.pageBodyPropsClass}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n @restrictWidth={{this.restrictWidth}}\n @paddingSize={{@pageHeader.paddingSize}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n >\n <:pageTitle>\n {{yield to=\"pageHeaderPageTitle\"}}\n </:pageTitle>\n <:default>\n {{yield to=\"pageHeaderDefault\"}}\n </:default>\n <:description>\n {{yield to=\"pageHeaderDescription\"}}\n </:description>\n <:rightSideItems as |item|>\n {{yield item to=\"pageHeaderRightSideItems\"}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageContent\n @hasBorder={{false}}\n @hasShadow={{false}}\n @paddingSize=\"none\"\n @color=\"transparent\"\n @borderRadius=\"none\"\n class={{this.pageContentPropsClass}}\n >\n <EuiPageContentBody\n @restrictWidth={{this.restrictWidth}}\n class={{this.pageContentBodyPropsClass}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n </EuiPage>\n {{else}}\n <EuiPage\n class={{this.classes}}\n @paddingSize={{paddingSize}}\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageBody\n @restrictWidth={{this.restrictWidth}}\n class={{this.pageBodyPropsClass}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n @bottomBorder={{@pageHeader.bottomBorder}}\n @restrictWidth={{false}}\n @paddingSize={{@pageHeader.paddingSize}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n >\n <:pageTitle>\n {{yield to=\"pageHeaderPageTitle\"}}\n </:pageTitle>\n <:default>\n {{yield to=\"pageHeaderDefault\"}}\n </:default>\n <:description>\n {{yield to=\"pageHeaderDescription\"}}\n </:description>\n <:rightSideItems as |item|>\n {{yield item to=\"pageHeaderRightSideItems\"}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageContent\n @hasBorder={{false}}\n @hasShadow={{false}}\n @paddingSize=\"none\"\n @color=\"transparent\"\n @borderRadius=\"none\"\n class={{this.pageContentPropsClass}}\n >\n <EuiPageContentBody\n @restrictWidth={{false}}\n class={{this.pageContentBodyPropsClass}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n </EuiPage>\n {{/if}}\n {{else}}\n {{#if hasPageSideBarBlock}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageSideBar\n class={{@pageSideBarProps.className}}\n @sticky={{true}}\n @paddingSize={{paddingSize}}\n >\n {{yield to=\"pageSideBar\"}}\n </EuiPageSideBar>\n <EuiPageBody\n @panelled={{true}}\n @paddingSize=\"none\"\n class={{this.pageBodyPropsClass}}\n >\n <EuiPageBody\n class={{this.pageBodyPropsClass}}\n @paddingSize={{paddingSize}}\n @tagName=\"div\"\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n @bottomBorder={{@pageHeader.bottomBorder}}\n @restrictWidth={{this.restrictWidth}}\n @paddingSize={{@pageHeader.paddingSize}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n >\n <:pageTitle>\n {{yield to=\"pageHeaderPageTitle\"}}\n </:pageTitle>\n <:default>\n {{yield to=\"pageHeaderDefault\"}}\n </:default>\n <:description>\n {{yield to=\"pageHeaderDescription\"}}\n </:description>\n <:rightSideItems as |item|>\n {{yield item to=\"pageHeaderRightSideItems\"}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageContent\n @hasShadow={{false}}\n @hasBorder={{false}}\n @color=\"transparent\"\n @borderRadius=\"none\"\n @paddingSize=\"none\"\n class={{this.pageContentPropsClass}}\n >\n <EuiPageContentBody\n @restrictWidth={{this.restrictWidth}}\n class={{this.pageContentBodyPropsClass}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n {{#if hasBottomBarBlock}}\n <EuiBottomBar\n @paddingSize={{paddingSize}}\n @position={{if\n (and this.canFullHeight this.fullHeight)\n \"static\"\n \"sticky\"\n }}\n >\n <EuiPageContentBody\n @paddingSize=\"none\"\n @restrictWidth={{this.restrictWidth}}\n >\n {{yield to=\"bottomBar\"}}\n </EuiPageContentBody>\n </EuiBottomBar>\n {{/if}}\n </EuiPageBody>\n </EuiPage>\n {{else}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageBody class={{this.pageBodyPropsClass}}>\n {{#if hasPageHeader}}\n <EuiPageHeader\n @restrictWidth={{this.restrictWidth}}\n @bottomBorder={{@pageHeader.bottomBorder}}\n @paddingSize={{paddingSize}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n >\n <:pageTitle>\n {{yield to=\"pageHeaderPageTitle\"}}\n </:pageTitle>\n <:default>\n {{yield to=\"pageHeaderDefault\"}}\n </:default>\n <:description>\n {{yield to=\"pageHeaderDescription\"}}\n </:description>\n <:rightSideItems as |item|>\n {{yield item to=\"pageHeaderRightSideItems\"}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageContent\n @hasBorder={{if hasPageHeader false}}\n @hasShadow={{false}}\n @paddingSize=\"none\"\n @color=\"plain\"\n @borderRadius=\"none\"\n class={{this.pageContentPropsClass}}\n >\n <EuiPageContentBody\n @restrictWidth={{this.restrictWidth}}\n @paddingSize={{paddingSize}}\n class={{this.pageContentBodyPropsClass}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n {{#if hasBottomBarBlock}}\n <EuiBottomBar\n @paddingSize={{paddingSize}}\n @position={{if\n (and this.canFullHeight this.fullHeight)\n \"static\"\n \"sticky\"\n }}\n >\n <EuiPageContentBody\n @paddingSize=\"none\"\n @restrictWidth={{this.restrictWidth}}\n >\n {{yield to=\"bottomBar\"}}\n </EuiPageContentBody>\n </EuiBottomBar>\n {{/if}}\n </EuiPageBody>\n </EuiPage>\n {{/if}}\n {{/if}}\n {{/let}}\n {{/let}}\n </template>\n}\n"],"names":["TEMPLATES","BREAKPOINTS","EuiPageTemplate","Component","g","prototype","argOrDefaultDecorator","i","tracked","setIsWithinBreakpoints","value","isWithinBreakpoints","minHeight","args","restrictWidth","width","classes","fullHeightClass","fullHeight","canFullHeight","yScrollClass","template","pageBodyPropsClass","pageBodyProps","className","pageContentPropsClass","pageContentProps","pageContentBodyPropsClass","pageContentBodyProps","setComponentTemplate","precompileTemplate","strictMode","scope","argOrDefault","and","useIsWithinBreakpoints","or","eq","EuiPage","style","inlineStyles","EuiPageSideBar","EuiPageBody","EuiPageHeader","EuiPageContent","EuiPageContentBody","EuiFlexGroup","EuiFlexItem","classNames","EuiBottomBar"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"eui-page-template.js","sources":["../../src/components/eui-page-template.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\n\nimport style from 'ember-style-modifier/modifiers/style';\nimport { and, eq, or } from 'ember-truth-helpers';\n\nimport argOrDefault, {\n argOrDefaultDecorator\n} from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\nimport inlineStyles from '../helpers/inline-styles.ts';\nimport useIsWithinBreakpoints from '../modifiers/use-is-within-breakpoints.ts';\nimport EuiBottomBar from './eui-bottom-bar.gts';\nimport EuiFlexGroup from './eui-flex-group.gts';\nimport EuiFlexItem from './eui-flex-item.gts';\nimport EuiPage from './eui-page.gts';\nimport EuiPageBody from './eui-page-body.gts';\nimport EuiPageContent from './eui-page-content.gts';\nimport EuiPageContentBody from './eui-page-content-body.gts';\nimport EuiPageHeader from './eui-page-header.gts';\nimport EuiPageSideBar from './eui-page-side-bar.gts';\n\nimport type { EuiBreakpointSize } from '../utils/breakpoint.ts';\nimport type { EuiButtomBarArgs } from './eui-bottom-bar';\nimport type { EuiPageBodySignature } from './eui-page-body';\nimport type { EuiPageContentSignature } from './eui-page-content';\nimport type { EuiPageContentBodySignature } from './eui-page-content-body';\nimport type { EuiPageHeaderSignature } from './eui-page-header';\nimport type { EuiPageSideBarSignature } from './eui-page-side-bar';\n\nexport const TEMPLATES = [\n 'default',\n 'centeredBody',\n 'centeredContent',\n 'empty'\n] as const;\n\nconst BREAKPOINTS: EuiBreakpointSize[] = ['m', 'l', 'xl'];\n\ninterface NormalProps {\n className?: string;\n}\n\nexport type EuiPageTemplateProps = {\n /**\n * Layout: `'default'` (header and content), `'centeredBody'` (content\n * panel centered in the page), `'centeredContent'` (content centered in\n * the body, e.g. an empty prompt) or `'empty'` (no panels).\n * Defaults to `'default'`.\n */\n template?: (typeof TEMPLATES)[number];\n\n /** Props for the `EuiPageBody`, overriding layout defaults. */\n pageBodyProps?: NormalProps & EuiPageBodySignature['Args'];\n /**\n * Props for the `EuiPageContent`: `{ className, hasBorder, hasShadow,\n * color, borderRadius, grow, role }`.\n */\n pageContentProps?: NormalProps & EuiPageContentSignature['Args'];\n /** Props for the `EuiPageContentBody`, overriding layout defaults. */\n pageContentBodyProps?: NormalProps & EuiPageContentBodySignature['Args'];\n\n /**\n * The page header, as EuiPageHeader args: `{ pageTitle, iconType,\n * description, tabs, responsive, bottomBorder }`. Use the\n * `<:pageHeader…>` blocks for its title, description and actions.\n */\n pageHeader?: NormalProps & EuiPageHeaderSignature['Args'];\n\n /** Props for the side bar, including `sticky` and `paddingSize`. */\n pageSideBarProps?: NormalProps & EuiPageSideBarSignature['Args'];\n\n /** @deprecated Has no effect, use the `<:bottomBar>` block. */\n bottomBar?: any;\n\n /** @private Render the `<:bottomBar>` block. Defaults to `true`. */\n hasBottomBarBlock?: boolean;\n\n /** Props for the bottom bar; override the layout defaults. */\n bottomBarProps?: NormalProps & EuiButtomBarArgs;\n /**\n * Stretches the page to the window's height and scrolls the content\n * instead of the page (templates `'default'` and `'empty'`, on medium\n * screens and up). Use `'noscroll'` to fill the height without adding\n * a scrolling wrapper around the content. Defaults to `false`.\n */\n fullHeight?: boolean | 'noscroll';\n /** Minimum height of the page, in px or any CSS height. Defaults to `460`. */\n minHeight?: number | string;\n\n /**\n * Max width of the header and content: `true` for EUI's default, a number\n * in px or any CSS width. Defaults to `true`.\n */\n restrictWidth?: boolean | number | string;\n\n /** Fills the window's height. Defaults to `true`. */\n grow?: boolean;\n /** Padding of the page's sections: `'none'`, `'s'`, `'m'` or `'l'`. Defaults to `'l'`. */\n paddingSize?: EuiPageSideBarSignature['Args']['paddingSize'];\n /** @private Render the `<:pageSideBar>` block. Defaults to `true`. */\n hasPageSideBarBlock?: boolean;\n /** @private Render the `<:pageHeaderPageTitle>` block. Defaults to `true`. */\n hasPageHeaderPageTitleBlock?: boolean;\n /** @private Render the `<:pageHeaderDefault>` block. Defaults to `true`. */\n hasPageHeaderDefaultBlock?: boolean;\n /** @private Render the `<:pageHeaderRightSideItems>` block. Defaults to `true`. */\n hasPageHeaderRightSideItemsBlock?: boolean;\n /** @private Render the `<:pageHeaderDescription>` block. Defaults to `true`. */\n hasPageHeaderDescriptionBlock?: boolean;\n /** @deprecated Has no effect. */\n hasPageHeader?: boolean;\n /** @deprecated Has no effect. */\n hasPageContent?: boolean;\n /** @deprecated Has no effect. */\n hasPageContentBody?: boolean;\n};\n\n/**\n * A whole page layout in one component: side bar, header, content and\n * bottom bar, arranged by `@template`.\n */\nexport interface EuiPageTemplateSignature {\n Element: HTMLElement;\n Args: EuiPageTemplateProps;\n Blocks: {\n /** The page's content. */\n default: [];\n /** A side bar, e.g. an `EuiSideNav`. */\n pageSideBar: [];\n /** The header's title, instead of `pageHeader.pageTitle`. */\n pageHeaderPageTitle: [];\n /** Extra header content. */\n pageHeaderDefault: [];\n /** The header's description. */\n pageHeaderDescription: [];\n /** Header actions; yields an item to wrap each in, see EuiPageHeader. */\n pageHeaderRightSideItems: EuiPageHeaderSignature['Blocks']['rightSideItems'];\n /** Content of a bottom bar (EuiBottomBar), e.g. save/cancel buttons. */\n bottomBar: [];\n };\n}\n\nexport default class EuiPageTemplate extends Component<EuiPageTemplateSignature> {\n // Defaults\n @argOrDefaultDecorator(false) fullHeight!: boolean | 'noscroll';\n @argOrDefaultDecorator('default') template!: (typeof TEMPLATES)[number];\n\n @tracked isWithinBreakpoints = false;\n\n setIsWithinBreakpoints = (value: boolean) => {\n this.isWithinBreakpoints = value;\n };\n\n get minHeight() {\n const minHeight = this.args.minHeight ?? 460;\n\n if (typeof minHeight === 'number') {\n return `${minHeight}px`;\n }\n\n return minHeight;\n }\n\n get restrictWidth() {\n const width = this.args.restrictWidth ?? true;\n\n if (typeof this.args.restrictWidth === 'number') {\n return `${width}px`;\n }\n\n return width;\n }\n\n get classes() {\n return `euiPageTemplate ${this.fullHeightClass}`;\n }\n\n get fullHeightClass() {\n return this.fullHeight && this.canFullHeight ? 'eui-fullHeight ' : '';\n }\n\n get yScrollClass() {\n return this.fullHeight && this.canFullHeight ? 'eui-yScroll ' : '';\n }\n\n get canFullHeight() {\n return (\n this.isWithinBreakpoints &&\n (this.template === 'default' || this.template === 'empty')\n );\n }\n\n get pageBodyPropsClass() {\n return [this.fullHeightClass, this.args.pageBodyProps?.className]\n .filter(Boolean)\n .join(' ');\n }\n\n get pageContentPropsClass() {\n return [this.yScrollClass, this.args.pageContentProps?.className]\n .filter(Boolean)\n .join(' ');\n }\n\n get pageContentBodyPropsClass() {\n return [this.fullHeightClass, this.args.pageContentBodyProps?.className]\n .filter(Boolean)\n .join(' ');\n }\n\n <template>\n {{#let\n (argOrDefault @grow true)\n (argOrDefault @paddingSize \"l\")\n (and (argOrDefault @hasBottomBarBlock true) (has-block \"bottomBar\"))\n (and (argOrDefault @hasPageSideBarBlock true) (has-block \"pageSideBar\"))\n (and\n (argOrDefault @hasPageHeaderPageTitleBlock true)\n (has-block \"pageHeaderPageTitle\")\n )\n (and\n (argOrDefault @hasPageHeaderDefaultBlock true)\n (has-block \"pageHeaderDefault\")\n )\n (and\n (argOrDefault @hasPageHeaderRightSideItemsBlock true)\n (has-block \"pageHeaderRightSideItems\")\n )\n (and\n (argOrDefault @hasPageHeaderDescriptionBlock true)\n (has-block \"pageHeaderDescription\")\n )\n (modifier\n useIsWithinBreakpoints\n sizes=BREAKPOINTS\n isActive=true\n setIsWithinBreakpointsValue=this.setIsWithinBreakpoints\n )\n as |grow paddingSize hasBottomBarBlock hasPageSideBarBlock hasPageHeaderPageTitleBlock hasPageHeaderDefaultBlock hasPageHeaderRightSideItemsBlock hasPageHeaderDescriptionBlock isWithinBreakpointsModifier|\n }}\n {{#let\n (or\n @pageHeader\n hasPageHeaderPageTitleBlock\n hasPageHeaderDefaultBlock\n hasPageHeaderRightSideItemsBlock\n hasPageHeaderDescriptionBlock\n )\n as |hasPageHeader|\n }}\n {{#if (eq this.template \"centeredBody\")}}\n {{#if hasPageSideBarBlock}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageSideBar\n class={{@pageSideBarProps.className}}\n @sticky={{argOrDefault @pageSideBarProps.sticky true}}\n @paddingSize={{argOrDefault\n @pageSideBarProps.paddingSize\n paddingSize\n }}\n >\n {{yield to=\"pageSideBar\"}}\n </EuiPageSideBar>\n <EuiPageBody\n class={{this.pageBodyPropsClass}}\n @paddingSize={{argOrDefault\n @pageBodyProps.paddingSize\n paddingSize\n }}\n @tagName={{@pageBodyProps.tagName}}\n @restrictWidth={{@pageBodyProps.restrictWidth}}\n @borderRadius={{@pageBodyProps.borderRadius}}\n @panelled={{@pageBodyProps.panelled}}\n @color={{@pageBodyProps.color}}\n @hasBorder={{@pageBodyProps.hasBorder}}\n @hasShadow={{@pageBodyProps.hasShadow}}\n @style={{@pageBodyProps.style}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n class={{@pageHeader.className}}\n @restrictWidth={{argOrDefault\n @pageHeader.restrictWidth\n this.restrictWidth\n }}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n @paddingSize={{@pageHeader.paddingSize}}\n @bottomBorder={{@pageHeader.bottomBorder}}\n @alignItems={{@pageHeader.alignItems}}\n @breadcrumbs={{@pageHeader.breadcrumbs}}\n @pageTitleProps={{@pageHeader.pageTitleProps}}\n @style={{@pageHeader.style}}\n >\n <:pageTitle>\n {{#if hasPageHeaderPageTitleBlock}}{{yield\n to=\"pageHeaderPageTitle\"\n }}{{/if}}\n </:pageTitle>\n <:default>\n {{#if hasPageHeaderDefaultBlock}}{{yield\n to=\"pageHeaderDefault\"\n }}{{/if}}\n </:default>\n <:description>\n {{#if hasPageHeaderDescriptionBlock}}{{yield\n to=\"pageHeaderDescription\"\n }}{{/if}}\n </:description>\n <:rightSideItems as |item|>\n {{#if hasPageHeaderRightSideItemsBlock}}{{yield\n item\n to=\"pageHeaderRightSideItems\"\n }}{{/if}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n\n <EuiPageContent\n class={{this.pageContentPropsClass}}\n @verticalPosition={{argOrDefault\n @pageContentProps.verticalPosition\n \"center\"\n }}\n @horizontalPosition={{argOrDefault\n @pageContentProps.horizontalPosition\n \"center\"\n }}\n @paddingSize={{argOrDefault\n @pageContentProps.paddingSize\n paddingSize\n }}\n @role={{@pageContentProps.role}}\n @hasBorder={{@pageContentProps.hasBorder}}\n @hasShadow={{@pageContentProps.hasShadow}}\n @color={{@pageContentProps.color}}\n @borderRadius={{@pageContentProps.borderRadius}}\n @grow={{@pageContentProps.grow}}\n >\n <EuiPageContentBody\n class={{this.pageContentBodyPropsClass}}\n @restrictWidth={{argOrDefault\n @pageContentBodyProps.restrictWidth\n this.restrictWidth\n }}\n @paddingSize={{@pageContentBodyProps.paddingSize}}\n @style={{@pageContentBodyProps.style}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n </EuiPage>\n {{else}}\n <EuiPage\n class={{this.classes}}\n @paddingSize={{paddingSize}}\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageBody\n class={{this.pageBodyPropsClass}}\n @restrictWidth={{argOrDefault\n @pageBodyProps.restrictWidth\n this.restrictWidth\n }}\n @tagName={{@pageBodyProps.tagName}}\n @paddingSize={{@pageBodyProps.paddingSize}}\n @borderRadius={{@pageBodyProps.borderRadius}}\n @panelled={{@pageBodyProps.panelled}}\n @color={{@pageBodyProps.color}}\n @hasBorder={{@pageBodyProps.hasBorder}}\n @hasShadow={{@pageBodyProps.hasShadow}}\n @style={{@pageBodyProps.style}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n class={{@pageHeader.className}}\n @restrictWidth={{argOrDefault\n @pageHeader.restrictWidth\n false\n }}\n @bottomBorder={{argOrDefault @pageHeader.bottomBorder true}}\n @paddingSize={{argOrDefault @pageHeader.paddingSize \"none\"}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n @alignItems={{@pageHeader.alignItems}}\n @breadcrumbs={{@pageHeader.breadcrumbs}}\n @pageTitleProps={{@pageHeader.pageTitleProps}}\n @style={{@pageHeader.style}}\n >\n <:pageTitle>\n {{#if hasPageHeaderPageTitleBlock}}{{yield\n to=\"pageHeaderPageTitle\"\n }}{{/if}}\n </:pageTitle>\n <:default>\n {{#if hasPageHeaderDefaultBlock}}{{yield\n to=\"pageHeaderDefault\"\n }}{{/if}}\n </:default>\n <:description>\n {{#if hasPageHeaderDescriptionBlock}}{{yield\n to=\"pageHeaderDescription\"\n }}{{/if}}\n </:description>\n <:rightSideItems as |item|>\n {{#if hasPageHeaderRightSideItemsBlock}}{{yield\n item\n to=\"pageHeaderRightSideItems\"\n }}{{/if}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageBody>\n <EuiPageContent\n class={{this.pageContentPropsClass}}\n @verticalPosition={{argOrDefault\n @pageContentProps.verticalPosition\n \"center\"\n }}\n @horizontalPosition={{argOrDefault\n @pageContentProps.horizontalPosition\n \"center\"\n }}\n @hasBorder={{@pageContentProps.hasBorder}}\n @hasShadow={{@pageContentProps.hasShadow}}\n @color={{@pageContentProps.color}}\n @borderRadius={{@pageContentProps.borderRadius}}\n @grow={{@pageContentProps.grow}}\n @role={{@pageContentProps.role}}\n @paddingSize={{argOrDefault\n @pageContentProps.paddingSize\n paddingSize\n }}\n >\n <EuiPageContentBody\n class={{this.pageContentBodyPropsClass}}\n @paddingSize={{argOrDefault\n @pageContentBodyProps.paddingSize\n \"none\"\n }}\n @restrictWidth={{argOrDefault\n @pageContentBodyProps.restrictWidth\n this.restrictWidth\n }}\n @style={{@pageContentBodyProps.style}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n </EuiPageBody>\n </EuiPage>\n {{/if}}\n {{else if (eq this.template \"centeredContent\")}}\n {{#if hasPageSideBarBlock}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageSideBar\n class={{@pageSideBarProps.className}}\n @sticky={{argOrDefault @pageSideBarProps.sticky true}}\n @paddingSize={{argOrDefault\n @pageSideBarProps.paddingSize\n paddingSize\n }}\n >\n {{yield to=\"pageSideBar\"}}\n </EuiPageSideBar>\n <EuiPageBody\n @panelled={{argOrDefault @pageBodyProps.panelled true}}\n @paddingSize={{argOrDefault\n @pageBodyProps.paddingSize\n paddingSize\n }}\n class={{this.pageBodyPropsClass}}\n @tagName={{@pageBodyProps.tagName}}\n @restrictWidth={{@pageBodyProps.restrictWidth}}\n @borderRadius={{@pageBodyProps.borderRadius}}\n @color={{@pageBodyProps.color}}\n @hasBorder={{@pageBodyProps.hasBorder}}\n @hasShadow={{@pageBodyProps.hasShadow}}\n @style={{@pageBodyProps.style}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n class={{@pageHeader.className}}\n @restrictWidth={{argOrDefault\n @pageHeader.restrictWidth\n this.restrictWidth\n }}\n @paddingSize={{@pageHeader.paddingSize}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n @bottomBorder={{@pageHeader.bottomBorder}}\n @alignItems={{@pageHeader.alignItems}}\n @breadcrumbs={{@pageHeader.breadcrumbs}}\n @pageTitleProps={{@pageHeader.pageTitleProps}}\n @style={{@pageHeader.style}}\n >\n <:pageTitle>\n {{#if hasPageHeaderPageTitleBlock}}{{yield\n to=\"pageHeaderPageTitle\"\n }}{{/if}}\n </:pageTitle>\n <:default>\n {{#if hasPageHeaderDefaultBlock}}{{yield\n to=\"pageHeaderDefault\"\n }}{{/if}}\n </:default>\n <:description>\n {{#if hasPageHeaderDescriptionBlock}}{{yield\n to=\"pageHeaderDescription\"\n }}{{/if}}\n </:description>\n <:rightSideItems as |item|>\n {{#if hasPageHeaderRightSideItemsBlock}}{{yield\n item\n to=\"pageHeaderRightSideItems\"\n }}{{/if}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageContent\n @verticalPosition={{argOrDefault\n @pageContentProps.verticalPosition\n \"center\"\n }}\n @horizontalPosition={{argOrDefault\n @pageContentProps.horizontalPosition\n \"center\"\n }}\n @hasShadow={{argOrDefault @pageContentProps.hasShadow false}}\n @color={{argOrDefault @pageContentProps.color \"subdued\"}}\n @paddingSize={{argOrDefault\n @pageContentProps.paddingSize\n paddingSize\n }}\n class={{this.pageContentPropsClass}}\n @role={{@pageContentProps.role}}\n @hasBorder={{@pageContentProps.hasBorder}}\n @borderRadius={{@pageContentProps.borderRadius}}\n @grow={{@pageContentProps.grow}}\n >\n <EuiPageContentBody\n @restrictWidth={{argOrDefault\n @pageContentBodyProps.restrictWidth\n this.restrictWidth\n }}\n class={{this.pageContentBodyPropsClass}}\n @paddingSize={{@pageContentBodyProps.paddingSize}}\n @style={{@pageContentBodyProps.style}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n </EuiPage>\n {{else}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageBody\n class={{this.pageBodyPropsClass}}\n @tagName={{@pageBodyProps.tagName}}\n @restrictWidth={{@pageBodyProps.restrictWidth}}\n @paddingSize={{@pageBodyProps.paddingSize}}\n @borderRadius={{@pageBodyProps.borderRadius}}\n @panelled={{@pageBodyProps.panelled}}\n @color={{@pageBodyProps.color}}\n @hasBorder={{@pageBodyProps.hasBorder}}\n @hasShadow={{@pageBodyProps.hasShadow}}\n @style={{@pageBodyProps.style}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n class={{@pageHeader.className}}\n @restrictWidth={{argOrDefault\n @pageHeader.restrictWidth\n this.restrictWidth\n }}\n @paddingSize={{argOrDefault\n @pageHeader.paddingSize\n paddingSize\n }}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n @bottomBorder={{@pageHeader.bottomBorder}}\n @alignItems={{@pageHeader.alignItems}}\n @breadcrumbs={{@pageHeader.breadcrumbs}}\n @pageTitleProps={{@pageHeader.pageTitleProps}}\n @style={{@pageHeader.style}}\n >\n <:pageTitle>\n {{#if hasPageHeaderPageTitleBlock}}{{yield\n to=\"pageHeaderPageTitle\"\n }}{{/if}}\n </:pageTitle>\n <:default>\n {{#if hasPageHeaderDefaultBlock}}{{yield\n to=\"pageHeaderDefault\"\n }}{{/if}}\n </:default>\n <:description>\n {{#if hasPageHeaderDescriptionBlock}}{{yield\n to=\"pageHeaderDescription\"\n }}{{/if}}\n </:description>\n <:rightSideItems as |item|>\n {{#if hasPageHeaderRightSideItemsBlock}}{{yield\n item\n to=\"pageHeaderRightSideItems\"\n }}{{/if}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n {{!template-lint-disable}}\n <EuiPageContent\n role={{null}}\n @borderRadius=\"none\"\n @hasShadow={{false}}\n @paddingSize={{paddingSize}}\n style=\"display: flex\"\n >\n {{!template-lint-enable}}\n <EuiPageContent\n @verticalPosition={{argOrDefault\n @pageContentProps.verticalPosition\n \"center\"\n }}\n @horizontalPosition={{argOrDefault\n @pageContentProps.horizontalPosition\n \"center\"\n }}\n @hasShadow={{argOrDefault\n @pageContentProps.hasShadow\n false\n }}\n @color={{argOrDefault @pageContentProps.color \"subdued\"}}\n @paddingSize={{argOrDefault\n @pageContentProps.paddingSize\n paddingSize\n }}\n class={{this.pageContentPropsClass}}\n @role={{@pageContentProps.role}}\n @hasBorder={{@pageContentProps.hasBorder}}\n @borderRadius={{@pageContentProps.borderRadius}}\n @grow={{@pageContentProps.grow}}\n >\n <EuiPageContentBody\n @restrictWidth={{argOrDefault\n @pageContentBodyProps.restrictWidth\n this.restrictWidth\n }}\n class={{this.pageContentBodyPropsClass}}\n @paddingSize={{@pageContentBodyProps.paddingSize}}\n @style={{@pageContentBodyProps.style}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n\n </EuiPageContent>\n </EuiPageBody>\n </EuiPage>\n {{/if}}\n {{else if (eq this.template \"empty\")}}\n {{#if hasPageSideBarBlock}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageSideBar\n class={{@pageSideBarProps.className}}\n @sticky={{argOrDefault @pageSideBarProps.sticky true}}\n @paddingSize={{argOrDefault\n @pageSideBarProps.paddingSize\n paddingSize\n }}\n >\n {{yield to=\"pageSideBar\"}}\n </EuiPageSideBar>\n <EuiPageBody\n @paddingSize={{argOrDefault\n @pageBodyProps.paddingSize\n paddingSize\n }}\n class={{this.pageBodyPropsClass}}\n @tagName={{@pageBodyProps.tagName}}\n @restrictWidth={{@pageBodyProps.restrictWidth}}\n @borderRadius={{@pageBodyProps.borderRadius}}\n @panelled={{@pageBodyProps.panelled}}\n @color={{@pageBodyProps.color}}\n @hasBorder={{@pageBodyProps.hasBorder}}\n @hasShadow={{@pageBodyProps.hasShadow}}\n @style={{@pageBodyProps.style}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n class={{@pageHeader.className}}\n @restrictWidth={{argOrDefault\n @pageHeader.restrictWidth\n this.restrictWidth\n }}\n @paddingSize={{@pageHeader.paddingSize}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n @bottomBorder={{@pageHeader.bottomBorder}}\n @alignItems={{@pageHeader.alignItems}}\n @breadcrumbs={{@pageHeader.breadcrumbs}}\n @pageTitleProps={{@pageHeader.pageTitleProps}}\n @style={{@pageHeader.style}}\n >\n <:pageTitle>\n {{#if hasPageHeaderPageTitleBlock}}{{yield\n to=\"pageHeaderPageTitle\"\n }}{{/if}}\n </:pageTitle>\n <:default>\n {{#if hasPageHeaderDefaultBlock}}{{yield\n to=\"pageHeaderDefault\"\n }}{{/if}}\n </:default>\n <:description>\n {{#if hasPageHeaderDescriptionBlock}}{{yield\n to=\"pageHeaderDescription\"\n }}{{/if}}\n </:description>\n <:rightSideItems as |item|>\n {{#if hasPageHeaderRightSideItemsBlock}}{{yield\n item\n to=\"pageHeaderRightSideItems\"\n }}{{/if}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageContent\n @hasBorder={{argOrDefault @pageContentProps.hasBorder false}}\n @hasShadow={{argOrDefault @pageContentProps.hasShadow false}}\n @paddingSize={{argOrDefault\n @pageContentProps.paddingSize\n \"none\"\n }}\n @color={{argOrDefault @pageContentProps.color \"transparent\"}}\n @borderRadius={{argOrDefault\n @pageContentProps.borderRadius\n \"none\"\n }}\n class={{this.pageContentPropsClass}}\n @role={{@pageContentProps.role}}\n @verticalPosition={{@pageContentProps.verticalPosition}}\n @horizontalPosition={{@pageContentProps.horizontalPosition}}\n @grow={{@pageContentProps.grow}}\n >\n <EuiPageContentBody\n @restrictWidth={{argOrDefault\n @pageContentBodyProps.restrictWidth\n this.restrictWidth\n }}\n class={{this.pageContentBodyPropsClass}}\n @paddingSize={{@pageContentBodyProps.paddingSize}}\n @style={{@pageContentBodyProps.style}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n </EuiPage>\n {{else}}\n <EuiPage\n class={{this.classes}}\n @paddingSize={{paddingSize}}\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageBody\n @restrictWidth={{argOrDefault\n @pageBodyProps.restrictWidth\n this.restrictWidth\n }}\n class={{this.pageBodyPropsClass}}\n @tagName={{@pageBodyProps.tagName}}\n @paddingSize={{@pageBodyProps.paddingSize}}\n @borderRadius={{@pageBodyProps.borderRadius}}\n @panelled={{@pageBodyProps.panelled}}\n @color={{@pageBodyProps.color}}\n @hasBorder={{@pageBodyProps.hasBorder}}\n @hasShadow={{@pageBodyProps.hasShadow}}\n @style={{@pageBodyProps.style}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n class={{@pageHeader.className}}\n @bottomBorder={{argOrDefault @pageHeader.bottomBorder true}}\n @restrictWidth={{argOrDefault\n @pageHeader.restrictWidth\n false\n }}\n @paddingSize={{argOrDefault @pageHeader.paddingSize \"none\"}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n @alignItems={{@pageHeader.alignItems}}\n @breadcrumbs={{@pageHeader.breadcrumbs}}\n @pageTitleProps={{@pageHeader.pageTitleProps}}\n @style={{@pageHeader.style}}\n >\n <:pageTitle>\n {{#if hasPageHeaderPageTitleBlock}}{{yield\n to=\"pageHeaderPageTitle\"\n }}{{/if}}\n </:pageTitle>\n <:default>\n {{#if hasPageHeaderDefaultBlock}}{{yield\n to=\"pageHeaderDefault\"\n }}{{/if}}\n </:default>\n <:description>\n {{#if hasPageHeaderDescriptionBlock}}{{yield\n to=\"pageHeaderDescription\"\n }}{{/if}}\n </:description>\n <:rightSideItems as |item|>\n {{#if hasPageHeaderRightSideItemsBlock}}{{yield\n item\n to=\"pageHeaderRightSideItems\"\n }}{{/if}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageContent\n @hasBorder={{argOrDefault @pageContentProps.hasBorder false}}\n @hasShadow={{argOrDefault @pageContentProps.hasShadow false}}\n @paddingSize={{argOrDefault\n @pageContentProps.paddingSize\n \"none\"\n }}\n @color={{argOrDefault @pageContentProps.color \"transparent\"}}\n @borderRadius={{argOrDefault\n @pageContentProps.borderRadius\n \"none\"\n }}\n class={{this.pageContentPropsClass}}\n @role={{@pageContentProps.role}}\n @verticalPosition={{@pageContentProps.verticalPosition}}\n @horizontalPosition={{@pageContentProps.horizontalPosition}}\n @grow={{@pageContentProps.grow}}\n >\n <EuiPageContentBody\n @restrictWidth={{argOrDefault\n @pageContentBodyProps.restrictWidth\n false\n }}\n class={{this.pageContentBodyPropsClass}}\n @paddingSize={{argOrDefault\n @pageContentBodyProps.paddingSize\n \"none\"\n }}\n @style={{@pageContentBodyProps.style}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n </EuiPage>\n {{/if}}\n {{else}}\n {{#if hasPageSideBarBlock}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageSideBar\n class={{@pageSideBarProps.className}}\n @sticky={{argOrDefault @pageSideBarProps.sticky true}}\n @paddingSize={{argOrDefault\n @pageSideBarProps.paddingSize\n paddingSize\n }}\n >\n {{yield to=\"pageSideBar\"}}\n </EuiPageSideBar>\n <EuiPageBody\n @panelled={{argOrDefault @pageBodyProps.panelled true}}\n @paddingSize={{argOrDefault @pageBodyProps.paddingSize \"none\"}}\n class={{this.pageBodyPropsClass}}\n @tagName={{@pageBodyProps.tagName}}\n @restrictWidth={{@pageBodyProps.restrictWidth}}\n @borderRadius={{@pageBodyProps.borderRadius}}\n @color={{@pageBodyProps.color}}\n @hasBorder={{@pageBodyProps.hasBorder}}\n @hasShadow={{@pageBodyProps.hasShadow}}\n @style={{@pageBodyProps.style}}\n >\n <EuiPageBody\n class={{this.pageBodyPropsClass}}\n @paddingSize={{paddingSize}}\n @tagName=\"div\"\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n class={{@pageHeader.className}}\n @bottomBorder={{argOrDefault\n @pageHeader.bottomBorder\n true\n }}\n @restrictWidth={{argOrDefault\n @pageHeader.restrictWidth\n this.restrictWidth\n }}\n @paddingSize={{@pageHeader.paddingSize}}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n @alignItems={{@pageHeader.alignItems}}\n @breadcrumbs={{@pageHeader.breadcrumbs}}\n @pageTitleProps={{@pageHeader.pageTitleProps}}\n @style={{@pageHeader.style}}\n >\n <:pageTitle>\n {{#if hasPageHeaderPageTitleBlock}}{{yield\n to=\"pageHeaderPageTitle\"\n }}{{/if}}\n </:pageTitle>\n <:default>\n {{#if hasPageHeaderDefaultBlock}}{{yield\n to=\"pageHeaderDefault\"\n }}{{/if}}\n </:default>\n <:description>\n {{#if hasPageHeaderDescriptionBlock}}{{yield\n to=\"pageHeaderDescription\"\n }}{{/if}}\n </:description>\n <:rightSideItems as |item|>\n {{#if hasPageHeaderRightSideItemsBlock}}{{yield\n item\n to=\"pageHeaderRightSideItems\"\n }}{{/if}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageContent\n @hasShadow={{argOrDefault\n @pageContentProps.hasShadow\n false\n }}\n @hasBorder={{argOrDefault\n @pageContentProps.hasBorder\n false\n }}\n @color={{argOrDefault\n @pageContentProps.color\n \"transparent\"\n }}\n @borderRadius={{argOrDefault\n @pageContentProps.borderRadius\n \"none\"\n }}\n @paddingSize={{argOrDefault\n @pageContentProps.paddingSize\n \"none\"\n }}\n class={{this.pageContentPropsClass}}\n @role={{@pageContentProps.role}}\n @verticalPosition={{@pageContentProps.verticalPosition}}\n @horizontalPosition={{@pageContentProps.horizontalPosition}}\n @grow={{@pageContentProps.grow}}\n >\n <EuiPageContentBody\n @restrictWidth={{argOrDefault\n @pageContentBodyProps.restrictWidth\n this.restrictWidth\n }}\n class={{this.pageContentBodyPropsClass}}\n @paddingSize={{@pageContentBodyProps.paddingSize}}\n @style={{@pageContentBodyProps.style}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n </EuiPageBody>\n {{#if hasBottomBarBlock}}\n <EuiBottomBar\n class={{@bottomBarProps.className}}\n @paddingSize={{argOrDefault\n @bottomBarProps.paddingSize\n paddingSize\n }}\n @position={{argOrDefault\n @bottomBarProps.position\n (if\n (and this.canFullHeight this.fullHeight)\n \"static\"\n \"sticky\"\n )\n }}\n @affordForDisplacement={{@bottomBarProps.affordForDisplacement}}\n @bodyClassName={{@bottomBarProps.bodyClassName}}\n @landmarkHeading={{@bottomBarProps.landmarkHeading}}\n @top={{@bottomBarProps.top}}\n @right={{@bottomBarProps.right}}\n @left={{@bottomBarProps.left}}\n @bottom={{@bottomBarProps.bottom}}\n >\n <EuiPageContentBody\n @paddingSize=\"none\"\n @restrictWidth={{this.restrictWidth}}\n >\n {{yield to=\"bottomBar\"}}\n </EuiPageContentBody>\n </EuiBottomBar>\n {{/if}}\n </EuiPageBody>\n </EuiPage>\n {{else}}\n <EuiPage\n class={{this.classes}}\n @paddingSize=\"none\"\n @grow={{grow}}\n {{isWithinBreakpointsModifier}}\n {{style (inlineStyles min-height=this.minHeight)}}\n ...attributes\n >\n <EuiPageBody\n class={{this.pageBodyPropsClass}}\n @tagName={{@pageBodyProps.tagName}}\n @restrictWidth={{@pageBodyProps.restrictWidth}}\n @paddingSize={{@pageBodyProps.paddingSize}}\n @borderRadius={{@pageBodyProps.borderRadius}}\n @panelled={{@pageBodyProps.panelled}}\n @color={{@pageBodyProps.color}}\n @hasBorder={{@pageBodyProps.hasBorder}}\n @hasShadow={{@pageBodyProps.hasShadow}}\n @style={{@pageBodyProps.style}}\n >\n {{#if hasPageHeader}}\n <EuiPageHeader\n class={{@pageHeader.className}}\n @restrictWidth={{argOrDefault\n @pageHeader.restrictWidth\n this.restrictWidth\n }}\n @bottomBorder={{@pageHeader.bottomBorder}}\n @paddingSize={{argOrDefault\n @pageHeader.paddingSize\n paddingSize\n }}\n @responsive={{@pageHeader.responsive}}\n @iconType={{@pageHeader.iconType}}\n @tabs={{@pageHeader.tabs}}\n @pageTitle={{@pageHeader.pageTitle}}\n @description={{@pageHeader.description}}\n @hasPageTitleBlock={{hasPageHeaderPageTitleBlock}}\n @hasDefaultBlock={{hasPageHeaderDefaultBlock}}\n @hasDescriptionBlock={{hasPageHeaderDescriptionBlock}}\n @hasRightSideItemsBlock={{hasPageHeaderRightSideItemsBlock}}\n @alignItems={{@pageHeader.alignItems}}\n @breadcrumbs={{@pageHeader.breadcrumbs}}\n @pageTitleProps={{@pageHeader.pageTitleProps}}\n @style={{@pageHeader.style}}\n >\n <:pageTitle>\n {{#if hasPageHeaderPageTitleBlock}}{{yield\n to=\"pageHeaderPageTitle\"\n }}{{/if}}\n </:pageTitle>\n <:default>\n {{#if hasPageHeaderDefaultBlock}}{{yield\n to=\"pageHeaderDefault\"\n }}{{/if}}\n </:default>\n <:description>\n {{#if hasPageHeaderDescriptionBlock}}{{yield\n to=\"pageHeaderDescription\"\n }}{{/if}}\n </:description>\n <:rightSideItems as |item|>\n {{#if hasPageHeaderRightSideItemsBlock}}{{yield\n item\n to=\"pageHeaderRightSideItems\"\n }}{{/if}}\n </:rightSideItems>\n </EuiPageHeader>\n {{/if}}\n <EuiPageContent\n @hasBorder={{if\n (eq @pageContentProps.hasBorder undefined)\n (if hasPageHeader undefined false)\n @pageContentProps.hasBorder\n }}\n @hasShadow={{argOrDefault @pageContentProps.hasShadow false}}\n @paddingSize={{argOrDefault\n @pageContentProps.paddingSize\n \"none\"\n }}\n @color={{argOrDefault @pageContentProps.color \"plain\"}}\n @borderRadius={{argOrDefault\n @pageContentProps.borderRadius\n \"none\"\n }}\n class={{this.pageContentPropsClass}}\n @role={{@pageContentProps.role}}\n @verticalPosition={{@pageContentProps.verticalPosition}}\n @horizontalPosition={{@pageContentProps.horizontalPosition}}\n @grow={{@pageContentProps.grow}}\n >\n <EuiPageContentBody\n @restrictWidth={{argOrDefault\n @pageContentBodyProps.restrictWidth\n this.restrictWidth\n }}\n @paddingSize={{argOrDefault\n @pageContentBodyProps.paddingSize\n paddingSize\n }}\n class={{this.pageContentBodyPropsClass}}\n @style={{@pageContentBodyProps.style}}\n >\n {{#if (and this.canFullHeight this.fullHeight)}}\n <EuiFlexGroup\n class=\"eui-fullHeight\"\n @gutterSize=\"none\"\n @direction=\"column\"\n @responsive={{false}}\n >\n <EuiFlexItem\n class={{classNames\n (if (eq this.fullHeight true) \"eui-yScroll\")\n (if\n (eq this.fullHeight \"noscroll\") \"eui-fullHeight\"\n )\n }}\n @grow={{true}}\n >\n {{yield to=\"default\"}}\n </EuiFlexItem>\n </EuiFlexGroup>\n {{else}}\n {{yield to=\"default\"}}\n {{/if}}\n </EuiPageContentBody>\n </EuiPageContent>\n {{#if hasBottomBarBlock}}\n <EuiBottomBar\n class={{@bottomBarProps.className}}\n @paddingSize={{argOrDefault\n @bottomBarProps.paddingSize\n paddingSize\n }}\n @position={{argOrDefault\n @bottomBarProps.position\n (if\n (and this.canFullHeight this.fullHeight)\n \"static\"\n \"sticky\"\n )\n }}\n @affordForDisplacement={{@bottomBarProps.affordForDisplacement}}\n @bodyClassName={{@bottomBarProps.bodyClassName}}\n @landmarkHeading={{@bottomBarProps.landmarkHeading}}\n @top={{@bottomBarProps.top}}\n @right={{@bottomBarProps.right}}\n @left={{@bottomBarProps.left}}\n @bottom={{@bottomBarProps.bottom}}\n >\n <EuiPageContentBody\n @paddingSize=\"none\"\n @restrictWidth={{this.restrictWidth}}\n >\n {{yield to=\"bottomBar\"}}\n </EuiPageContentBody>\n </EuiBottomBar>\n {{/if}}\n </EuiPageBody>\n </EuiPage>\n {{/if}}\n {{/if}}\n {{/let}}\n {{/let}}\n </template>\n}\n"],"names":["TEMPLATES","BREAKPOINTS","EuiPageTemplate","Component","g","prototype","argOrDefaultDecorator","i","tracked","setIsWithinBreakpoints","value","isWithinBreakpoints","minHeight","args","restrictWidth","width","classes","fullHeightClass","fullHeight","canFullHeight","yScrollClass","template","pageBodyPropsClass","pageBodyProps","className","filter","Boolean","join","pageContentPropsClass","pageContentProps","pageContentBodyPropsClass","pageContentBodyProps","setComponentTemplate","precompileTemplate","strictMode","scope","argOrDefault","and","useIsWithinBreakpoints","or","eq","EuiPage","style","inlineStyles","EuiPageSideBar","EuiPageBody","EuiPageHeader","EuiPageContent","EuiPageContentBody","EuiFlexGroup","EuiFlexItem","classNames","EuiBottomBar"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-page.js","sources":["../../src/components/eui-page.gts"],"sourcesContent":["import { concat } from '@ember/helper';\n\nimport style from 'ember-style-modifier/modifiers/style';\n\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\nimport euiPageRestrictWidth from '../helpers/eui-page-restrict-width.ts';\nimport inlineStyles from '../helpers/inline-styles.ts';\n\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\n/** The outermost layout of a page: holds an optional `EuiPageSideBar` and an `EuiPageBody`. See also EuiPageTemplate. */\nexport interface EuiPageSignature {\n Element: HTMLDivElement;\n Args: {\n /**\n * Max width of the content: `true` for
|
|
1
|
+
{"version":3,"file":"eui-page.js","sources":["../../src/components/eui-page.gts"],"sourcesContent":["import { concat } from '@ember/helper';\n\nimport style from 'ember-style-modifier/modifiers/style';\n\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\nimport euiPageRestrictWidth from '../helpers/eui-page-restrict-width.ts';\nimport inlineStyles from '../helpers/inline-styles.ts';\n\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\n/** The outermost layout of a page: holds an optional `EuiPageSideBar` and an `EuiPageBody`. See also EuiPageTemplate. */\nexport interface EuiPageSignature {\n Element: HTMLDivElement;\n Args: {\n /**\n * Max width of the content: `true` for the bundled Amsterdam theme's\n * default (1200px), a\n * number in px, or any CSS width. Defaults to `false` (no limit).\n */\n restrictWidth?: boolean | number | string;\n /** Padding around the page: `'none'`, `'s'`, `'m'` or `'l'`. Defaults to `'m'`. */\n paddingSize?: 'none' | 's' | 'm' | 'l';\n /** Fills the window's height. Defaults to `true`. */\n grow?: boolean;\n /**\n * `'row'` puts an `EuiPageSideBar` beside the body, `'column'` stacks\n * them. Defaults to `'row'`.\n */\n direction?: 'row' | 'column';\n /** Inline styles, merged with the max width. */\n style?: Record<string, string>;\n };\n Blocks: {\n /** `EuiPageSideBar` and `EuiPageBody`. */\n default: [];\n };\n}\n\nconst EuiPage: TemplateOnlyComponent<EuiPageSignature> = <template>\n {{#let\n (argOrDefault @restrictWidth false)\n (argOrDefault @paddingSize \"m\")\n (argOrDefault @grow true)\n (argOrDefault @direction \"row\")\n as |restrictWidth paddingSize grow direction|\n }}\n {{#let (euiPageRestrictWidth restrictWidth @style) as |styling|}}\n <div\n class={{classNames\n (if grow \"euiPage--grow\")\n (if styling.widthClassName (concat \"euiPage--\" styling.widthClassName))\n componentName=\"EuiPage\"\n paddingSize=paddingSize\n direction=direction\n }}\n ...attributes\n {{style\n (if styling.newStyle (inlineStyles styling.newStyle))\n (inlineStyles min-height=\"460px;\")\n }}\n >\n {{yield}}\n </div>\n {{/let}}\n {{/let}}\n</template>;\n\nexport default EuiPage;\n"],"names":["EuiPage","setComponentTemplate","precompileTemplate","strictMode","scope","argOrDefault","euiPageRestrictWidth","classNames","concat","style","inlineStyles","templateOnly"],"mappings":";;;;;;;;;;AAuCA,MAAMA,OAA+B,GAAAC,oBAAA,CAAoBC,kBAAA,CAAA,inBAAA,EA2BzD;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAC,YAAA;IAAAC,oBAAA;IAAAC,UAAA;IAAAC,MAAA;IAAAC,KAAA;AAAAC,IAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA;;"}
|
|
@@ -105,33 +105,36 @@ class EuiPaginationComponent extends Component {
|
|
|
105
105
|
}
|
|
106
106
|
get prevPageButtonProps() {
|
|
107
107
|
let prevPageButtonProps = {};
|
|
108
|
-
if (this.hasControl && this.activePage
|
|
108
|
+
if (this.hasControl && this.activePage > 0) {
|
|
109
109
|
prevPageButtonProps = {
|
|
110
110
|
'aria-controls': this.ariaControls,
|
|
111
111
|
href: `#${this.ariaControls}`
|
|
112
112
|
};
|
|
113
113
|
} else {
|
|
114
114
|
prevPageButtonProps = {
|
|
115
|
-
disabled: this.activePage
|
|
115
|
+
disabled: this.activePage <= 0
|
|
116
116
|
};
|
|
117
117
|
}
|
|
118
118
|
return prevPageButtonProps;
|
|
119
119
|
}
|
|
120
120
|
get nextPageButtonProps() {
|
|
121
121
|
let nextPageButtonProps = {};
|
|
122
|
-
if (this.hasControl && this.activePage
|
|
122
|
+
if (this.hasControl && this.activePage < this.pageCount - 1) {
|
|
123
123
|
nextPageButtonProps = {
|
|
124
124
|
'aria-controls': this.ariaControls,
|
|
125
125
|
href: `#${this.ariaControls}`
|
|
126
126
|
};
|
|
127
127
|
} else {
|
|
128
128
|
nextPageButtonProps = {
|
|
129
|
-
disabled: this.activePage
|
|
129
|
+
disabled: this.activePage >= this.pageCount - 1
|
|
130
130
|
};
|
|
131
131
|
}
|
|
132
132
|
return nextPageButtonProps;
|
|
133
133
|
}
|
|
134
134
|
safeClick = pageIndex => {
|
|
135
|
+
if (pageIndex < 0 || pageIndex >= this.pageCount) {
|
|
136
|
+
return;
|
|
137
|
+
}
|
|
135
138
|
if (this.ariaControls) {
|
|
136
139
|
const controlledElement = document.getElementById(this.ariaControls);
|
|
137
140
|
if (controlledElement) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-pagination.js","sources":["../../src/components/eui-pagination.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { hash } from '@ember/helper';\n\nimport add from 'ember-math-helpers/helpers/add';\nimport sub from 'ember-math-helpers/helpers/sub';\n\nimport EuiHideFor from './eui-hide-for.gts';\nimport EuiI18n from './eui-i18n.gts';\nimport ButtonWrapper from './eui-pagination/button-wrapper.gts';\nimport NextButton from './eui-pagination/next-button.gts';\nimport PreviousButton from './eui-pagination/previous-button.gts';\nimport EuiText from './eui-text.gts';\n\nimport type { EuiHideForBreakpoints } from './eui-hide-for';\n\nconst BREAKPOINTS: EuiHideForBreakpoints[] = ['xs', 's'];\n\nexport type PageClickHandler = (pageIndex: number) => void;\nexport type SafeClickHandler = (pageIndex: number) => void;\n\ninterface Args {\n /**\n * The total number of pages. Defaults to `1`.\n */\n pageCount?: number;\n\n /**\n * The current page using a zero based index.\n * So if you set the activePage to 1, it will activate the second page.\n * Defaults to `0`.\n */\n activePage?: number;\n\n /** Called with the clicked page's zero based index; update `@activePage` here. */\n onPageClick?: PageClickHandler;\n\n /**\n * If true, will only show next/prev arrows instead of page numbers.\n */\n compressed?: boolean;\n\n /**\n * If passed in, passes value through to each button to set aria-controls\n * (the id of the content the pages change).\n */\n 'aria-controls'?: string;\n /** Same as `'aria-controls'`. */\n ariaControls?: string;\n}\n\nconst MAX_VISIBLE_PAGES = 5;\nconst NUMBER_SURROUNDING_PAGES = Math.floor(MAX_VISIBLE_PAGES * 0.5);\n\n/** Page numbers with previous/next buttons, for paged lists and tables. */\nexport interface EuiPaginationSignature {\n Element: HTMLElement;\n Args: Args;\n}\n\nexport default class EuiPaginationComponent extends Component<EuiPaginationSignature> {\n get pageCount() {\n return this.args.pageCount ?? 1;\n }\n\n get activePage() {\n return this.args.activePage ?? 0;\n }\n\n get ariaControls() {\n return this.args['aria-controls'] || this.args.ariaControls;\n }\n\n get hasControl() {\n return this.ariaControls !== undefined;\n }\n\n get pages() {\n const pages = [];\n const { firstPageInRange, lastPageInRange } = this;\n\n for (\n let i = firstPageInRange, index = 0;\n i < lastPageInRange;\n i++, index++\n ) {\n pages.push({\n pageIndex: i\n });\n }\n\n return pages;\n }\n\n get firstPageButtons() {\n const firstPageButtons = [];\n\n if (this.firstPageInRange > 0) {\n firstPageButtons.push({\n pageIndex: 0\n });\n\n if (this.firstPageInRange > 1 && this.firstPageInRange !== 2) {\n firstPageButtons.push({\n i18n: {\n key: 'startingEllipses',\n token: 'euiPagination.firstRangeAriaLabel',\n default: 'Skipping pages 2 to {lastPage}',\n values: { lastPage: this.firstPageInRange }\n }\n });\n } else if (this.firstPageInRange === 2) {\n firstPageButtons.push({ pageIndex: 1 });\n }\n }\n\n return firstPageButtons;\n }\n\n get lastPageButtons() {\n const lastPageButtons = [];\n const pageCount = this.pageCount;\n const lastPageInRange = this.lastPageInRange;\n\n if (lastPageInRange < pageCount) {\n if (lastPageInRange + 1 === pageCount - 1) {\n lastPageButtons.push({ pageIndex: lastPageInRange });\n } else if (lastPageInRange < pageCount - 1) {\n lastPageButtons.push({\n i18n: {\n key: 'endingEllipses',\n token: 'euiPagination.lastRangeAriaLabel',\n default: 'Skipping pages {firstPage} to {lastPage}',\n values: { firstPage: lastPageInRange + 1, lastPage: pageCount - 1 }\n }\n });\n }\n\n lastPageButtons.push({ pageIndex: pageCount - 1 });\n }\n\n return lastPageButtons;\n }\n\n get sharedButtonProps() {\n return {\n activePage: this.activePage,\n pageCount: this.pageCount,\n ariaControls: this.ariaControls,\n safeClick: this.safeClick\n };\n }\n\n get prevPageButtonProps() {\n let prevPageButtonProps = {};\n\n if (this.hasControl && this.activePage !== 0) {\n prevPageButtonProps = {\n 'aria-controls': this.ariaControls,\n href: `#${this.ariaControls}`\n };\n } else {\n prevPageButtonProps = { disabled: this.activePage === 0 };\n }\n\n return prevPageButtonProps;\n }\n\n get nextPageButtonProps() {\n let nextPageButtonProps = {};\n\n if (this.hasControl && this.activePage !== this.pageCount - 1) {\n nextPageButtonProps = {\n 'aria-controls': this.ariaControls,\n href: `#${this.ariaControls}`\n };\n } else {\n nextPageButtonProps = {\n disabled: this.activePage === this.pageCount - 1\n };\n }\n\n return nextPageButtonProps;\n }\n\n safeClick: SafeClickHandler = (pageIndex) => {\n if (this.ariaControls) {\n const controlledElement = document.getElementById(this.ariaControls);\n\n if (controlledElement) {\n controlledElement.focus();\n }\n }\n\n this.args.onPageClick?.(pageIndex);\n };\n\n get firstPageInRange() {\n return Math.max(\n 0,\n Math.min(\n this.activePage - NUMBER_SURROUNDING_PAGES,\n this.pageCount - MAX_VISIBLE_PAGES\n )\n );\n }\n\n get lastPageInRange() {\n return Math.min(this.pageCount, this.firstPageInRange + MAX_VISIBLE_PAGES);\n }\n\n <template>\n {{#if @compressed}}\n <nav class=\"euiPagination\" ...attributes>\n <PreviousButton\n @activePage={{this.activePage}}\n @safeClick={{this.safeClick}}\n @props={{this.prevPageButtonProps}}\n />\n <EuiHideFor @sizes={{BREAKPOINTS}}>\n <EuiText @size=\"s\" class=\"euiPagination__compressedText\">\n <EuiI18n\n @token=\"euiPagination.pageOfTotalCompressed\"\n @default=\"{page} of {total}\"\n @values={{hash\n page=(component\n ButtonWrapper\n pageIndex=this.activePage\n props=this.sharedButtonProps\n inList=false\n )\n total=(component\n ButtonWrapper\n pageIndex=(sub this.pageCount 1)\n props=this.sharedButtonProps\n inList=false\n )\n }}\n as |Token|\n >\n <Token as |value|>\n {{value}}\n </Token>\n </EuiI18n>\n </EuiText>\n </EuiHideFor>\n <NextButton\n @activePage={{this.activePage}}\n @safeClick={{this.safeClick}}\n @props={{this.nextPageButtonProps}}\n @pageCount={{this.pageCount}}\n />\n </nav>\n {{else}}\n {{!template-lint-disable no-duplicate-landmark-elements}}\n <nav class=\"euiPagination\" ...attributes>\n <PreviousButton\n @activePage={{this.activePage}}\n @safeClick={{this.safeClick}}\n @props={{this.prevPageButtonProps}}\n />\n <ul class=\"euiPagination__list\">\n {{#each this.firstPageButtons as |page|}}\n {{#if page.i18n}}\n <EuiI18n\n @token=\"euiPagination.firstRangeAriaLabel\"\n @default=\"Skipping pages 2 to {lastPage}\"\n @values={{hash lastPage=this.firstPageInRange}}\n as |Token|\n >\n <Token as |firstRangeAriaLabel|>\n <li\n aria-label={{firstRangeAriaLabel}}\n class=\"euiPaginationButton-isPlaceholder euiPagination__item\"\n >\n …\n </li>\n </Token>\n </EuiI18n>\n {{else}}\n <ButtonWrapper\n @pageIndex={{page.pageIndex}}\n @props={{this.sharedButtonProps}}\n />\n {{/if}}\n {{/each}}\n {{#each this.pages as |page|}}\n <ButtonWrapper\n @pageIndex={{page.pageIndex}}\n @props={{this.sharedButtonProps}}\n />\n {{/each}}\n {{#each this.lastPageButtons as |page|}}\n {{#if page.i18n}}\n <EuiI18n\n @token=\"euiPagination.lastRangeAriaLabel\"\n @default=\"Skipping pages {firstPage} to {lastPage}\"\n @values={{hash\n firstPage=(add this.lastPageInRange 1)\n lastPage=(sub this.pageCount 1)\n }}\n as |Token|\n >\n <Token as |lastRangeAriaLabel|>\n <li\n aria-label={{lastRangeAriaLabel}}\n class=\"euiPaginationButton-isPlaceholder euiPagination__item\"\n >\n …\n </li>\n </Token>\n </EuiI18n>\n {{else}}\n <ButtonWrapper\n @pageIndex={{page.pageIndex}}\n @props={{this.sharedButtonProps}}\n />\n {{/if}}\n {{/each}}\n </ul>\n <NextButton\n @activePage={{this.activePage}}\n @safeClick={{this.safeClick}}\n @props={{this.nextPageButtonProps}}\n @pageCount={{this.pageCount}}\n />\n </nav>\n {{/if}}\n </template>\n}\n"],"names":["BREAKPOINTS","MAX_VISIBLE_PAGES","NUMBER_SURROUNDING_PAGES","Math","floor","EuiPaginationComponent","Component","pageCount","args","activePage","ariaControls","hasControl","undefined","pages","firstPageInRange","lastPageInRange","i","index","push","pageIndex","firstPageButtons","i18n","key","token","default","values","lastPage","lastPageButtons","firstPage","sharedButtonProps","safeClick","prevPageButtonProps","href","disabled","nextPageButtonProps","controlledElement","document","getElementById","focus","onPageClick","max","min","setComponentTemplate","precompileTemplate","strictMode","scope","PreviousButton","EuiHideFor","EuiText","EuiI18n","hash","ButtonWrapper","sub","NextButton","add"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"eui-pagination.js","sources":["../../src/components/eui-pagination.gts"],"sourcesContent":["import Component from '@glimmer/component';\nimport { hash } from '@ember/helper';\n\nimport add from 'ember-math-helpers/helpers/add';\nimport sub from 'ember-math-helpers/helpers/sub';\n\nimport EuiHideFor from './eui-hide-for.gts';\nimport EuiI18n from './eui-i18n.gts';\nimport ButtonWrapper from './eui-pagination/button-wrapper.gts';\nimport NextButton from './eui-pagination/next-button.gts';\nimport PreviousButton from './eui-pagination/previous-button.gts';\nimport EuiText from './eui-text.gts';\n\nimport type { EuiHideForBreakpoints } from './eui-hide-for';\n\nconst BREAKPOINTS: EuiHideForBreakpoints[] = ['xs', 's'];\n\nexport type PageClickHandler = (pageIndex: number) => void;\nexport type SafeClickHandler = (pageIndex: number) => void;\n\ninterface Args {\n /**\n * The total number of pages. Defaults to `1`.\n */\n pageCount?: number;\n\n /**\n * The current page using a zero based index.\n * So if you set the activePage to 1, it will activate the second page.\n * Defaults to `0`.\n */\n activePage?: number;\n\n /** Called with the clicked page's zero based index; update `@activePage` here. */\n onPageClick?: PageClickHandler;\n\n /**\n * If true, will only show next/prev arrows instead of page numbers.\n */\n compressed?: boolean;\n\n /**\n * If passed in, passes value through to each button to set aria-controls\n * (the id of the content the pages change).\n */\n 'aria-controls'?: string;\n /** Same as `'aria-controls'`. */\n ariaControls?: string;\n}\n\nconst MAX_VISIBLE_PAGES = 5;\nconst NUMBER_SURROUNDING_PAGES = Math.floor(MAX_VISIBLE_PAGES * 0.5);\n\n/** Page numbers with previous/next buttons, for paged lists and tables. */\nexport interface EuiPaginationSignature {\n Element: HTMLElement;\n Args: Args;\n}\n\nexport default class EuiPaginationComponent extends Component<EuiPaginationSignature> {\n get pageCount() {\n return this.args.pageCount ?? 1;\n }\n\n get activePage() {\n return this.args.activePage ?? 0;\n }\n\n get ariaControls() {\n return this.args['aria-controls'] || this.args.ariaControls;\n }\n\n get hasControl() {\n return this.ariaControls !== undefined;\n }\n\n get pages() {\n const pages = [];\n const { firstPageInRange, lastPageInRange } = this;\n\n for (\n let i = firstPageInRange, index = 0;\n i < lastPageInRange;\n i++, index++\n ) {\n pages.push({\n pageIndex: i\n });\n }\n\n return pages;\n }\n\n get firstPageButtons() {\n const firstPageButtons = [];\n\n if (this.firstPageInRange > 0) {\n firstPageButtons.push({\n pageIndex: 0\n });\n\n if (this.firstPageInRange > 1 && this.firstPageInRange !== 2) {\n firstPageButtons.push({\n i18n: {\n key: 'startingEllipses',\n token: 'euiPagination.firstRangeAriaLabel',\n default: 'Skipping pages 2 to {lastPage}',\n values: { lastPage: this.firstPageInRange }\n }\n });\n } else if (this.firstPageInRange === 2) {\n firstPageButtons.push({ pageIndex: 1 });\n }\n }\n\n return firstPageButtons;\n }\n\n get lastPageButtons() {\n const lastPageButtons = [];\n const pageCount = this.pageCount;\n const lastPageInRange = this.lastPageInRange;\n\n if (lastPageInRange < pageCount) {\n if (lastPageInRange + 1 === pageCount - 1) {\n lastPageButtons.push({ pageIndex: lastPageInRange });\n } else if (lastPageInRange < pageCount - 1) {\n lastPageButtons.push({\n i18n: {\n key: 'endingEllipses',\n token: 'euiPagination.lastRangeAriaLabel',\n default: 'Skipping pages {firstPage} to {lastPage}',\n values: { firstPage: lastPageInRange + 1, lastPage: pageCount - 1 }\n }\n });\n }\n\n lastPageButtons.push({ pageIndex: pageCount - 1 });\n }\n\n return lastPageButtons;\n }\n\n get sharedButtonProps() {\n return {\n activePage: this.activePage,\n pageCount: this.pageCount,\n ariaControls: this.ariaControls,\n safeClick: this.safeClick\n };\n }\n\n get prevPageButtonProps() {\n let prevPageButtonProps = {};\n\n if (this.hasControl && this.activePage > 0) {\n prevPageButtonProps = {\n 'aria-controls': this.ariaControls,\n href: `#${this.ariaControls}`\n };\n } else {\n prevPageButtonProps = { disabled: this.activePage <= 0 };\n }\n\n return prevPageButtonProps;\n }\n\n get nextPageButtonProps() {\n let nextPageButtonProps = {};\n\n if (this.hasControl && this.activePage < this.pageCount - 1) {\n nextPageButtonProps = {\n 'aria-controls': this.ariaControls,\n href: `#${this.ariaControls}`\n };\n } else {\n nextPageButtonProps = {\n disabled: this.activePage >= this.pageCount - 1\n };\n }\n\n return nextPageButtonProps;\n }\n\n safeClick: SafeClickHandler = (pageIndex) => {\n if (pageIndex < 0 || pageIndex >= this.pageCount) {\n return;\n }\n\n if (this.ariaControls) {\n const controlledElement = document.getElementById(this.ariaControls);\n\n if (controlledElement) {\n controlledElement.focus();\n }\n }\n\n this.args.onPageClick?.(pageIndex);\n };\n\n get firstPageInRange() {\n return Math.max(\n 0,\n Math.min(\n this.activePage - NUMBER_SURROUNDING_PAGES,\n this.pageCount - MAX_VISIBLE_PAGES\n )\n );\n }\n\n get lastPageInRange() {\n return Math.min(this.pageCount, this.firstPageInRange + MAX_VISIBLE_PAGES);\n }\n\n <template>\n {{#if @compressed}}\n <nav class=\"euiPagination\" ...attributes>\n <PreviousButton\n @activePage={{this.activePage}}\n @safeClick={{this.safeClick}}\n @props={{this.prevPageButtonProps}}\n />\n <EuiHideFor @sizes={{BREAKPOINTS}}>\n <EuiText @size=\"s\" class=\"euiPagination__compressedText\">\n <EuiI18n\n @token=\"euiPagination.pageOfTotalCompressed\"\n @default=\"{page} of {total}\"\n @values={{hash\n page=(component\n ButtonWrapper\n pageIndex=this.activePage\n props=this.sharedButtonProps\n inList=false\n )\n total=(component\n ButtonWrapper\n pageIndex=(sub this.pageCount 1)\n props=this.sharedButtonProps\n inList=false\n )\n }}\n as |Token|\n >\n <Token as |value|>\n {{value}}\n </Token>\n </EuiI18n>\n </EuiText>\n </EuiHideFor>\n <NextButton\n @activePage={{this.activePage}}\n @safeClick={{this.safeClick}}\n @props={{this.nextPageButtonProps}}\n @pageCount={{this.pageCount}}\n />\n </nav>\n {{else}}\n {{!template-lint-disable no-duplicate-landmark-elements}}\n <nav class=\"euiPagination\" ...attributes>\n <PreviousButton\n @activePage={{this.activePage}}\n @safeClick={{this.safeClick}}\n @props={{this.prevPageButtonProps}}\n />\n <ul class=\"euiPagination__list\">\n {{#each this.firstPageButtons as |page|}}\n {{#if page.i18n}}\n <EuiI18n\n @token=\"euiPagination.firstRangeAriaLabel\"\n @default=\"Skipping pages 2 to {lastPage}\"\n @values={{hash lastPage=this.firstPageInRange}}\n as |Token|\n >\n <Token as |firstRangeAriaLabel|>\n <li\n aria-label={{firstRangeAriaLabel}}\n class=\"euiPaginationButton-isPlaceholder euiPagination__item\"\n >\n …\n </li>\n </Token>\n </EuiI18n>\n {{else}}\n <ButtonWrapper\n @pageIndex={{page.pageIndex}}\n @props={{this.sharedButtonProps}}\n />\n {{/if}}\n {{/each}}\n {{#each this.pages as |page|}}\n <ButtonWrapper\n @pageIndex={{page.pageIndex}}\n @props={{this.sharedButtonProps}}\n />\n {{/each}}\n {{#each this.lastPageButtons as |page|}}\n {{#if page.i18n}}\n <EuiI18n\n @token=\"euiPagination.lastRangeAriaLabel\"\n @default=\"Skipping pages {firstPage} to {lastPage}\"\n @values={{hash\n firstPage=(add this.lastPageInRange 1)\n lastPage=(sub this.pageCount 1)\n }}\n as |Token|\n >\n <Token as |lastRangeAriaLabel|>\n <li\n aria-label={{lastRangeAriaLabel}}\n class=\"euiPaginationButton-isPlaceholder euiPagination__item\"\n >\n …\n </li>\n </Token>\n </EuiI18n>\n {{else}}\n <ButtonWrapper\n @pageIndex={{page.pageIndex}}\n @props={{this.sharedButtonProps}}\n />\n {{/if}}\n {{/each}}\n </ul>\n <NextButton\n @activePage={{this.activePage}}\n @safeClick={{this.safeClick}}\n @props={{this.nextPageButtonProps}}\n @pageCount={{this.pageCount}}\n />\n </nav>\n {{/if}}\n </template>\n}\n"],"names":["BREAKPOINTS","MAX_VISIBLE_PAGES","NUMBER_SURROUNDING_PAGES","Math","floor","EuiPaginationComponent","Component","pageCount","args","activePage","ariaControls","hasControl","undefined","pages","firstPageInRange","lastPageInRange","i","index","push","pageIndex","firstPageButtons","i18n","key","token","default","values","lastPage","lastPageButtons","firstPage","sharedButtonProps","safeClick","prevPageButtonProps","href","disabled","nextPageButtonProps","controlledElement","document","getElementById","focus","onPageClick","max","min","setComponentTemplate","precompileTemplate","strictMode","scope","PreviousButton","EuiHideFor","EuiText","EuiI18n","hash","ButtonWrapper","sub","NextButton","add"],"mappings":";;;;;;;;;;;;;AAeA,MAAMA,WAAa,GAA0B,CAAC,IAAA,EAAM,GAAA,CAAI;AAmCxD,MAAMC,iBAAA,GAAoB,CAAA;AAC1B,MAAMC,wBAAA,GAA2BC,IAAA,CAAKC,KAAK,CAACH,iBAAA,GAAoB,GAAA,CAAA;AAEhE;;AAMe,MAAMI,+BAA+BC,SAAA,CAAU;EAC5D,IAAIC,SAAAA,GAAY;AACd,IAAA,OAAO,IAAI,CAACC,IAAI,CAACD,SAAS,IAAI,CAAA;AAChC,EAAA;EAEA,IAAIE,UAAAA,GAAa;AACf,IAAA,OAAO,IAAI,CAACD,IAAI,CAACC,UAAU,IAAI,CAAA;AACjC,EAAA;EAEA,IAAIC,YAAAA,GAAe;IACjB,OAAO,IAAI,CAACF,IAAI,CAAC,eAAA,CAAgB,IAAI,IAAI,CAACA,IAAI,CAACE,YAAY;AAC7D,EAAA;EAEA,IAAIC,UAAAA,GAAa;AACf,IAAA,OAAO,IAAI,CAACD,YAAY,KAAKE,SAAA;AAC/B,EAAA;EAEA,IAAIC,KAAAA,GAAQ;IACV,MAAMA,QAAQ,EAAE;IAChB,MAAM;MAAEC,gBAAgB;AAAEC,MAAAA;AAAe,KAAE,GAAG,IAAI;AAElD,IAAA,KACE,IAAIC,IAAIF,gBAAA,EAAkBG,KAAA,GAAQ,GAClCD,CAAA,GAAID,eAAA,EACJC,KAAKC,KAAA,EAAA,EACL;MACAJ,KAAA,CAAMK,IAAI,CAAC;AACTC,QAAAA,SAAA,EAAWH;AACb,OAAA,CAAA;AACF,IAAA;AAEA,IAAA,OAAOH,KAAA;AACT,EAAA;EAEA,IAAIO,gBAAAA,GAAmB;IACrB,MAAMA,mBAAmB,EAAE;AAE3B,IAAA,IAAI,IAAI,CAACN,gBAAgB,GAAG,CAAA,EAAG;MAC7BM,gBAAA,CAAiBF,IAAI,CAAC;AACpBC,QAAAA,SAAA,EAAW;AACb,OAAA,CAAA;MAEA,IAAI,IAAI,CAACL,gBAAgB,GAAG,KAAK,IAAI,CAACA,gBAAgB,KAAK,CAAA,EAAG;QAC5DM,gBAAA,CAAiBF,IAAI,CAAC;AACpBG,UAAAA,IAAA,EAAM;AACJC,YAAAA,GAAA,EAAK,kBAAA;AACLC,YAAAA,KAAA,EAAO,mCAAA;AACPC,YAAAA,OAAA,EAAS,gCAAA;AACTC,YAAAA,MAAA,EAAQ;cAAEC,QAAA,EAAU,IAAI,CAACZ;AAAiB;AAC5C;AACF,SAAA,CAAA;AACF,MAAA,CAAA,MAAO,IAAI,IAAI,CAACA,gBAAgB,KAAK,CAAA,EAAG;QACtCM,gBAAA,CAAiBF,IAAI,CAAC;AAAEC,UAAAA,SAAA,EAAW;AAAE,SAAA,CAAA;AACvC,MAAA;AACF,IAAA;AAEA,IAAA,OAAOC,gBAAA;AACT,EAAA;EAEA,IAAIO,eAAAA,GAAkB;IACpB,MAAMA,kBAAkB,EAAE;AAC1B,IAAA,MAAMpB,SAAA,GAAY,IAAI,CAACA,SAAS;AAChC,IAAA,MAAMQ,eAAA,GAAkB,IAAI,CAACA,eAAe;IAE5C,IAAIA,kBAAkBR,SAAA,EAAW;AAC/B,MAAA,IAAIQ,eAAA,GAAkB,CAAA,KAAMR,SAAA,GAAY,CAAA,EAAG;QACzCoB,eAAA,CAAgBT,IAAI,CAAC;AAAEC,UAAAA,SAAA,EAAWJ;AAAgB,SAAA,CAAA;AACpD,MAAA,CAAA,MAAO,IAAIA,eAAA,GAAkBR,SAAA,GAAY,CAAA,EAAG;QAC1CoB,eAAA,CAAgBT,IAAI,CAAC;AACnBG,UAAAA,IAAA,EAAM;AACJC,YAAAA,GAAA,EAAK,gBAAA;AACLC,YAAAA,KAAA,EAAO,kCAAA;AACPC,YAAAA,OAAA,EAAS,0CAAA;AACTC,YAAAA,MAAA,EAAQ;cAAEG,SAAA,EAAWb,eAAA,GAAkB,CAAA;cAAGW,QAAA,EAAUnB,SAAA,GAAY;AAAE;AACpE;AACF,SAAA,CAAA;AACF,MAAA;MAEAoB,eAAA,CAAgBT,IAAI,CAAC;QAAEC,SAAA,EAAWZ,SAAA,GAAY;AAAE,OAAA,CAAA;AAClD,IAAA;AAEA,IAAA,OAAOoB,eAAA;AACT,EAAA;EAEA,IAAIE,iBAAAA,GAAoB;IACtB,OAAO;MACLpB,UAAA,EAAY,IAAI,CAACA,UAAU;MAC3BF,SAAA,EAAW,IAAI,CAACA,SAAS;MACzBG,YAAA,EAAc,IAAI,CAACA,YAAY;MAC/BoB,SAAA,EAAW,IAAI,CAACA;KAClB;AACF,EAAA;EAEA,IAAIC,mBAAAA,GAAsB;IACxB,IAAIA,sBAAsB,EAAC;IAE3B,IAAI,IAAI,CAACpB,UAAU,IAAI,IAAI,CAACF,UAAU,GAAG,CAAA,EAAG;AAC1CsB,MAAAA,mBAAA,GAAsB;QACpB,eAAA,EAAiB,IAAI,CAACrB,YAAY;AAClCsB,QAAAA,IAAA,EAAM,CAAA,CAAA,EAAI,IAAI,CAACtB,YAAY,CAAA;OAC7B;AACF,IAAA,CAAA,MAAO;AACLqB,MAAAA,mBAAA,GAAsB;AAAEE,QAAAA,QAAA,EAAU,IAAI,CAACxB,UAAU,IAAI;OAAE;AACzD,IAAA;AAEA,IAAA,OAAOsB,mBAAA;AACT,EAAA;EAEA,IAAIG,mBAAAA,GAAsB;IACxB,IAAIA,sBAAsB,EAAC;AAE3B,IAAA,IAAI,IAAI,CAACvB,UAAU,IAAI,IAAI,CAACF,UAAU,GAAG,IAAI,CAACF,SAAS,GAAG,CAAA,EAAG;AAC3D2B,MAAAA,mBAAA,GAAsB;QACpB,eAAA,EAAiB,IAAI,CAACxB,YAAY;AAClCsB,QAAAA,IAAA,EAAM,CAAA,CAAA,EAAI,IAAI,CAACtB,YAAY,CAAA;OAC7B;AACF,IAAA,CAAA,MAAO;AACLwB,MAAAA,mBAAA,GAAsB;QACpBD,QAAA,EAAU,IAAI,CAACxB,UAAU,IAAI,IAAI,CAACF,SAAS,GAAG;OAChD;AACF,IAAA;AAEA,IAAA,OAAO2B,mBAAA;AACT,EAAA;EAEAJ,SAAA,GAA+BX,SAAA,IAAA;IAC7B,IAAIA,YAAY,CAAA,IAAKA,SAAA,IAAa,IAAI,CAACZ,SAAS,EAAE;AAChD,MAAA;AACF,IAAA;IAEA,IAAI,IAAI,CAACG,YAAY,EAAE;MACrB,MAAMyB,oBAAoBC,QAAA,CAASC,cAAc,CAAC,IAAI,CAAC3B,YAAY,CAAA;AAEnE,MAAA,IAAIyB,iBAAA,EAAmB;QACrBA,iBAAA,CAAkBG,KAAK,EAAA;AACzB,MAAA;AACF,IAAA;AAEA,IAAA,IAAI,CAAC9B,IAAI,CAAC+B,WAAW,GAAGpB,SAAA,CAAA;EAC1B,CAAA;EAEA,IAAIL,gBAAAA,GAAmB;IACrB,OAAOX,IAAA,CAAKqC,GAAG,CACb,CAAA,EACArC,KAAKsC,GAAG,CACN,IAAI,CAAChC,UAAU,GAAGP,wBAAA,EAClB,IAAI,CAACK,SAAS,GAAGN,iBAAA,CAAA,CAAA;AAGvB,EAAA;EAEA,IAAIc,eAAAA,GAAkB;AACpB,IAAA,OAAOZ,IAAA,CAAKsC,GAAG,CAAC,IAAI,CAAClC,SAAS,EAAE,IAAI,CAACO,gBAAgB,GAAGb,iBAAA,CAAA;AAC1D,EAAA;AAEA,EAAA;IAAAyC,oBAAA,CAAAC,kBAAA,CAAA,izFAAA,EAqHA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;QAAAC,cAAA;oBAAAC,mBAAA;QAAA/C,WAAA;iBAAAgD,gBAAA;iBAAAC,gBAAA;QAAAC,IAAA;QAAAC,aAAA;QAAAC,GAAA;QAAAC,UAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACZ;;"}
|
|
@@ -19,7 +19,7 @@ function activateOnKey(onClick, event) {
|
|
|
19
19
|
onClick(event);
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
|
-
const EuiPanel = setComponentTemplate(precompileTemplate("{{#let (argOrDefault @hasShadow true) (argOrDefault @color \"plain\") (argOrDefault @grow true) as |hasShadow color grow|}}\n {{#let (eq color \"plain\") (or (eq color \"plain\") (eq color \"transparent\")) as |canHaveShadow canHaveBorder|}}\n {{#if @onClick}}\n <div role=\"button\" class={{classNames (if (argOrDefault @isClickable true) \"euiPanel--isClickable\") (if (and canHaveShadow (eq hasShadow true)) \"euiPanel--hasShadow\") (if (
|
|
22
|
+
const EuiPanel = setComponentTemplate(precompileTemplate("{{#let (argOrDefault @hasShadow true) (argOrDefault @color \"plain\") (argOrDefault @grow true) as |hasShadow color grow|}}\n {{#let (eq color \"plain\") (or (eq color \"plain\") (eq color \"transparent\")) as |canHaveShadow canHaveBorder|}}\n {{#if @onClick}}\n <div role=\"button\" class={{classNames (if (argOrDefault @isClickable true) \"euiPanel--isClickable\") (if (and canHaveShadow (eq hasShadow true)) \"euiPanel--hasShadow\") (if (or (not canHaveShadow) (eq hasShadow false)) \"euiPanel--noShadow\") (if (and canHaveBorder (eq @hasBorder true)) \"euiPanel--hasBorder\") (if (or (not canHaveBorder) (eq @hasBorder false)) \"euiPanel--noBorder\") (unless grow \"euiPanel--flexGrowZero\") componentName=\"EuiPanel\" paddingSize=(argOrDefault @paddingSize \"m\") borderRadius=(argOrDefault @borderRadius \"m\") color=color}} tabindex=\"0\" {{on \"click\" @onClick}} {{on \"keydown\" (fn activateOnKey @onClick)}} ...attributes>\n {{yield}}\n </div>\n {{else}}\n <div class={{classNames (if (and canHaveShadow (eq hasShadow true)) \"euiPanel--hasShadow\") (if (or (not canHaveShadow) (eq hasShadow false)) \"euiPanel--noShadow\") (if (and canHaveBorder (eq @hasBorder true)) \"euiPanel--hasBorder\") (if (or (not canHaveBorder) (eq @hasBorder false)) \"euiPanel--noBorder\") (unless grow \"euiPanel--flexGrowZero\") componentName=\"EuiPanel\" paddingSize=(argOrDefault @paddingSize \"m\") borderRadius=(argOrDefault @borderRadius \"m\") color=color}} ...attributes>\n {{yield}}\n </div>\n {{/if}}\n {{/let}}\n{{/let}}", {
|
|
23
23
|
strictMode: true,
|
|
24
24
|
scope: () => ({
|
|
25
25
|
argOrDefault,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-panel.js","sources":["../../src/components/eui-panel.gts"],"sourcesContent":["import { fn } from '@ember/helper';\nimport { on } from '@ember/modifier';\n\nimport { and, eq, not, or } from 'ember-truth-helpers';\n\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\n\nimport type {\n borderRadiusMapping,\n colorMapping,\n paddingSizeMapping} from '../utils/css-mappings/eui-panel.ts';\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\n/** A box grouping content, with background, padding, border and shadow options. */\nexport interface EuiPanelSignature {\n Element: HTMLDivElement;\n Args: {\n /**\n * Adds a box shadow (plain panels only). Defaults to `true`.\n */\n hasShadow?: boolean;\n /**\n * Adds a border (plain and transparent panels only).\n */\n hasBorder?: boolean;\n /**\n * Padding: `'none'`, `'s'`, `'m'` or `'l'`. Defaults to `'m'`.\n */\n paddingSize?: keyof typeof paddingSizeMapping;\n /**\n * `'none'` or `'m'`. Defaults to `'m'`.\n */\n borderRadius?: keyof typeof borderRadiusMapping;\n /**\n * Background: `'plain'`, `'transparent'`, `'subdued'`, `'accent'`,\n * `'primary'`, `'success'`, `'warning'` or `'danger'`.\n * Defaults to `'plain'`.\n */\n color?: keyof typeof colorMapping;\n /**\n * Grows to fill a flex parent's height. Defaults to `true`.\n */\n grow?: boolean;\n /**\n * Makes the whole panel clickable (hover styles, `role=\"button\"`,\n * focusable, Enter and Space activate it).\n */\n onClick?: (e: MouseEvent) => void;\n /**\n * Hover styles for a clickable panel. Defaults to `true`.\n */\n isClickable?: boolean;\n };\n\n Blocks: {\n /** The panel's content. */\n default: [];\n };\n}\n\n/**\n * Enter and Space activate a clickable panel, like a native button. Keys\n * pressed in controls inside the panel are left alone.\n */\nfunction activateOnKey(\n onClick: (e: MouseEvent) => void,\n event: KeyboardEvent\n): void {\n if (event.target !== event.currentTarget) return;\n\n if (event.key === 'Enter' || event.key === ' ') {\n // Space would otherwise scroll the page\n event.preventDefault();\n onClick(event as unknown as MouseEvent);\n }\n}\n\nconst EuiPanel: TemplateOnlyComponent<EuiPanelSignature> = <template>\n {{#let\n (argOrDefault @hasShadow true)\n (argOrDefault @color \"plain\")\n (argOrDefault @grow true)\n as |hasShadow color grow|\n }}\n {{#let\n (eq color \"plain\") (or (eq color \"plain\") (eq color \"transparent\"))\n as |canHaveShadow canHaveBorder|\n }}\n {{#if @onClick}}\n <div\n role=\"button\"\n class={{classNames\n (if (argOrDefault @isClickable true) \"euiPanel--isClickable\")\n (if (and canHaveShadow (eq hasShadow true)) \"euiPanel--hasShadow\")\n (if\n (
|
|
1
|
+
{"version":3,"file":"eui-panel.js","sources":["../../src/components/eui-panel.gts"],"sourcesContent":["import { fn } from '@ember/helper';\nimport { on } from '@ember/modifier';\n\nimport { and, eq, not, or } from 'ember-truth-helpers';\n\nimport argOrDefault from '../helpers/arg-or-default.ts';\nimport classNames from '../helpers/class-names.ts';\n\nimport type {\n borderRadiusMapping,\n colorMapping,\n paddingSizeMapping\n} from '../utils/css-mappings/eui-panel.ts';\nimport type { TemplateOnlyComponent } from '@ember/component/template-only';\n\n/** A box grouping content, with background, padding, border and shadow options. */\nexport interface EuiPanelSignature {\n Element: HTMLDivElement;\n Args: {\n /**\n * Adds a box shadow (plain panels only). Defaults to `true`.\n */\n hasShadow?: boolean;\n /**\n * Adds a border (plain and transparent panels only).\n */\n hasBorder?: boolean;\n /**\n * Padding: `'none'`, `'s'`, `'m'` or `'l'`. Defaults to `'m'`.\n */\n paddingSize?: keyof typeof paddingSizeMapping;\n /**\n * `'none'` or `'m'`. Defaults to `'m'`.\n */\n borderRadius?: keyof typeof borderRadiusMapping;\n /**\n * Background: `'plain'`, `'transparent'`, `'subdued'`, `'accent'`,\n * `'primary'`, `'success'`, `'warning'` or `'danger'`.\n * Defaults to `'plain'`.\n */\n color?: keyof typeof colorMapping;\n /**\n * Grows to fill a flex parent's height. Defaults to `true`.\n */\n grow?: boolean;\n /**\n * Makes the whole panel clickable (hover styles, `role=\"button\"`,\n * focusable, Enter and Space activate it).\n */\n onClick?: (e: MouseEvent) => void;\n /**\n * Hover styles for a clickable panel. Defaults to `true`.\n */\n isClickable?: boolean;\n };\n\n Blocks: {\n /** The panel's content. */\n default: [];\n };\n}\n\n/**\n * Enter and Space activate a clickable panel, like a native button. Keys\n * pressed in controls inside the panel are left alone.\n */\nfunction activateOnKey(\n onClick: (e: MouseEvent) => void,\n event: KeyboardEvent\n): void {\n if (event.target !== event.currentTarget) return;\n\n if (event.key === 'Enter' || event.key === ' ') {\n // Space would otherwise scroll the page\n event.preventDefault();\n onClick(event as unknown as MouseEvent);\n }\n}\n\nconst EuiPanel: TemplateOnlyComponent<EuiPanelSignature> = <template>\n {{#let\n (argOrDefault @hasShadow true)\n (argOrDefault @color \"plain\")\n (argOrDefault @grow true)\n as |hasShadow color grow|\n }}\n {{#let\n (eq color \"plain\") (or (eq color \"plain\") (eq color \"transparent\"))\n as |canHaveShadow canHaveBorder|\n }}\n {{#if @onClick}}\n <div\n role=\"button\"\n class={{classNames\n (if (argOrDefault @isClickable true) \"euiPanel--isClickable\")\n (if (and canHaveShadow (eq hasShadow true)) \"euiPanel--hasShadow\")\n (if\n (or (not canHaveShadow) (eq hasShadow false)) \"euiPanel--noShadow\"\n )\n (if (and canHaveBorder (eq @hasBorder true)) \"euiPanel--hasBorder\")\n (if\n (or (not canHaveBorder) (eq @hasBorder false))\n \"euiPanel--noBorder\"\n )\n (unless grow \"euiPanel--flexGrowZero\")\n componentName=\"EuiPanel\"\n paddingSize=(argOrDefault @paddingSize \"m\")\n borderRadius=(argOrDefault @borderRadius \"m\")\n color=color\n }}\n tabindex=\"0\"\n {{on \"click\" @onClick}}\n {{on \"keydown\" (fn activateOnKey @onClick)}}\n ...attributes\n >\n {{yield}}\n </div>\n {{else}}\n <div\n class={{classNames\n (if (and canHaveShadow (eq hasShadow true)) \"euiPanel--hasShadow\")\n (if\n (or (not canHaveShadow) (eq hasShadow false)) \"euiPanel--noShadow\"\n )\n (if (and canHaveBorder (eq @hasBorder true)) \"euiPanel--hasBorder\")\n (if\n (or (not canHaveBorder) (eq @hasBorder false))\n \"euiPanel--noBorder\"\n )\n (unless grow \"euiPanel--flexGrowZero\")\n componentName=\"EuiPanel\"\n paddingSize=(argOrDefault @paddingSize \"m\")\n borderRadius=(argOrDefault @borderRadius \"m\")\n color=color\n }}\n ...attributes\n >\n {{yield}}\n </div>\n {{/if}}\n {{/let}}\n {{/let}}\n</template>;\n\nexport default EuiPanel;\n"],"names":["activateOnKey","onClick","event","target","currentTarget","key","preventDefault","EuiPanel","setComponentTemplate","precompileTemplate","strictMode","scope","argOrDefault","eq","or","classNames","and","not","on","fn","templateOnly"],"mappings":";;;;;;;;;AA8DA;;;;AAIA,SAASA,aAAAA,CACPC,OAAgC,EAChCC,KAAoB,EACf;AACL,EAAA,IAAIA,KAAA,CAAMC,MAAM,KAAKD,KAAA,CAAME,aAAa,EAAE;EAE1C,IAAIF,MAAMG,GAAG,KAAK,WAAWH,KAAA,CAAMG,GAAG,KAAK,GAAA,EAAK;AAC9C;IACAH,KAAA,CAAMI,cAAc,EAAA;IACpBL,OAAA,CAAQC,KAAoB,CAAA;AAC9B,EAAA;AACF;AAEA,MAAMK,QAAgC,GAAAC,oBAAA,CAAqBC,kBAAA,CAAA,iiDAAA,EA+D3D;EAAAC,UAAA,EAAA,IAAA;AAAAC,EAAAA,KAAA,EAAAA,OAAA;IAAAC,YAAA;IAAAC,EAAA;IAAAC,EAAA;IAAAC,UAAA;IAAAC,GAAA;IAAAC,GAAA;IAAAC,EAAA;IAAAC,EAAA;AAAAnB,IAAAA;AAAA,GAAA;AAAU,CAAA,CAAA,EAAAoB,YAAA,EAAA;;"}
|
|
@@ -97,7 +97,7 @@ class EuiRangeComponent extends Component {
|
|
|
97
97
|
n(this.prototype, "handleOnChange", [action]);
|
|
98
98
|
}
|
|
99
99
|
get isValid() {
|
|
100
|
-
return isWithinRange(this.min, this.max, this.args.value
|
|
100
|
+
return isWithinRange(this.min, this.max, this.args.value ?? '');
|
|
101
101
|
}
|
|
102
102
|
get digitTolerance() {
|
|
103
103
|
return Math.max(String(this.min).length, String(this.max).length);
|