@ecl/twig-component-file

ECL File

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@ecl/twig-component-file
3.4.24 days agoa year agoMinified + gzip package size for @ecl/twig-component-file in KB

Readme

ECL File component
npm package: @ecl/twig-component-file
npm install --save @ecl/twig-component-file

Parameters

  • "icon" (object) (default: {}): object of type Icon; file type
  • "variant" (string) (default: '') Thumbnail
  • "title" (string) (default: '')
  • "description" (string) (default: '')
  • "language" (string) (default: '')
  • "meta" (string) (default: '')
  • "detailmeta" (array) (default: ) Meta element for the thumbnail variant
  • "download" (object) (default: {}): object of type Link
  • "image" (object) (default: {}): image for the thumbnail variant
  • "label" (array of objects of type Label) (default: ) labels
also supported as an object with a single label
  • "lists" (array) (default: ) Array of objects of type "description list"
- "variant" (optional) (taxonomy or horizontal) - "items" (array)
- term (string)
  • "translation" (array) (default: ):
- "toggle" (object) (default: {}): object of type Button - "items" (array) (default: ):
- "title" (string) (default: '')
- "meta" (string) (default: '')
- "lang" (string) (default: '')
- "download" (object) (default to the parent download property) object of type Link
- "description (string) (default:'')
  • "extraclasses" (optional) (string) (default: '') Extra classes (space separated)
  • "extraattributes" (optional) (array) (default: ) Extra attributes
- "name" (string) Attribute name, eg. 'data-test' - "value" (string) Attribute value, eg: 'data-test-1'

Example:

{% include '@ecl/file/file.html.twig' with {
  title: 'State of the Union 2018 brochure',
  language: 'English',
  meta: '(16.2 MB - PDF)',
  icon_path: 'path/to/icons.svg',
  icon: {
    name: 'copy',
    size: '2xl',
    path: 'path/to/icons.svg',
  },
  download: {
    label: 'Download',
    path: '/example',
    icon: {
      name: 'download',
      size: 'fluid',
      path: 'path/to/icons.svg',
    },
  },
  translation: {
    toggle: {
      label: 'Other languages (3)',
      icon: {
        name: 'corner-arrow',
        size: 'fluid',
        transform: 'rotate-180',
      },
    },
    description: 'Looking for another language which is not on the list? Find out why.',
    items: [
      {
        title: 'български',
        meta: '(15.7 MB - PDF)',
        lang: 'bg',
      },
      ...
    ],
  },
} %}