@maggioli-design-system/mds-filter-item NPM

mds-filter-item

This is a web-component from Maggioli Design System Magma, built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScript framework you are using.

Properties

Property	Attribute	Description	Type	Default
`count`	`count`	Shows the number of items will be filtered by the component	`string \\| undefined`	`undefined`
`disabled`	`disabled`	Sets if the component is disabled or not	`boolean \\| undefined`	`undefined`
`icon`	`icon`	Sets the icon of the filter item	`string \\| undefined`	`undefined`
`label`	`label`	Sets the label of the filter item	`string`	`undefined`
`selected`	`selected`	Sets the component to selected state	`boolean \\| undefined`	`undefined`
`value`	`value`	Sets the value of the component to be used with forms	`string`	`undefined`

Events

Event	Description	Type
`mdsFilterItemSelect`	Emits when the element is active	`CustomEvent<MdsFilterItemEventDetail>`

CSS Custom Properties

Name	Description
`---mds-filter-item-count-background-selected`	Sets the z-index of the component.
`---mds-filter-item-count-color-default`	Sets tge default text `color` of the count element
`---mds-filter-item-count-color-selected`	Sets the z-index of the component.
`--mds-filter-item-count-background-default`	Sets tge default `background-color` of the count element

Dependencies

Used by

mds-filter

Depends on

Graph

graph TD;
  mds-filter-item --> mds-icon
  mds-filter-item --> mds-text
  mds-filter --> mds-filter-item
  style mds-filter-item fill:#f9f,stroke:#333,stroke-width:4px

Built with love @ Gruppo Maggioli from R&D Department

@maggioli-design-system/styles @stencil/core

@infinitebrahmanuniverse/nolb-_mag @everything-registry/sub-chunk-570 @zalastax/nolb-_mag @maggioli-design-system/mds-filter

7 months ago

5 months ago

8 months ago

8 months ago