Sha256: 277d3646efd26090ad5885cf28ef11256bf27070582a0ac9e286cef9e51ec83b

Contents?: true

Size: 1.42 KB

Versions: 643

Compression:

Stored size: 1.42 KB

Contents

import React from 'react'
import classnames from 'classnames'

import { buildCss, buildHtmlProps } from '../../utilities/props'
import { GlobalProps, globalProps } from '../../utilities/globalProps'

import Flex from '../../pb_flex/_flex'
import SectionSeparator from '../../pb_section_separator/_section_separator'


type DialogFooterProps = {
  aria?: {[key: string]: string},
  children: React.ReactChild[] | React.ReactChild | string,
  className?: string,
  data?: {[key: string]: string},
  htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
  id?: string,
  padding?: string,
  paddingBottom?: string,
  paddingX?: string,
  separator?: boolean,
  spacing?: "none" | "between" | "around" | "evenly",
} & GlobalProps

// Footer component
const DialogFooter = (props: DialogFooterProps): React.ReactElement => {
  const {
    children,
    className,
    htmlOptions = {},
    spacing = "between",
    separator = false,
  } = props

  const footerCSS = buildCss("dialog_footer")
  const footerSpacing = globalProps(props)
  const htmlProps = buildHtmlProps(htmlOptions)

  return (
    <div 
        {...htmlProps}
    >
      {separator &&
        <SectionSeparator />
      }
      <div className="dialog-pseudo-footer" />
      <Flex
          className={classnames(footerCSS, footerSpacing, className)}
          spacing={spacing}
      >
        {children}
      </Flex>
    </div>
  )
}

export default DialogFooter

Version data entries

643 entries across 643 versions & 1 rubygems

Version Path
playbook_ui-14.10.0.pre.alpha.play1662cssbargraph5201 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.11.0.pre.rc.9 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.10.0.pre.alpha.play1662cssbargraph5200 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.11.0.pre.rc.8 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.11.0.pre.rc.7 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.11.0.pre.rc.6 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.11.0.pre.rc.5 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.10.0.pre.alpha.play1662cssbargraph5193 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.11.0.pre.rc.4 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.11.0.pre.rc.3 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.10.0.pre.alpha.PBNTR662stickyrightcolumnreact5160 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.11.0.pre.rc.2 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.11.0.pre.rc.1 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.10.0.pre.alpha.PBNTR775formmatingmaskdefaultvalue5137 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.11.0.pre.rc.0 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.9.0.pre.alpha.PBNTR767advancedtablemultiheadercolumns5136 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.9.0.pre.alpha.PBNTR775formmatingmaskdefaultvalue5121 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.9.0.pre.alpha.PBNTR775formmatingmaskdefaultvalue5120 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.10.0 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx
playbook_ui-14.10.0.pre.rc.24 app/pb_kits/playbook/pb_dialog/child_kits/_dialog_footer.tsx