mds-url-view

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 | | ------------------ | --------- | -------------------------------------------------------------------------------------------------------------------------- | -------------------------------- | ----------- | | icon | icon | Specifies if domain is visible on header | string \| undefined | undefined | | label | label | Specifies if the window has a label | string \| undefined | undefined | | loading | loading | Specifies whether a browser should load an iframe immediately or to defer loading of images until some conditions are met. | "eager" \| "lazy" \| undefined | 'lazy' | | src (required) | src | Specifies the URL to the web page | string | undefined |

Events

| Event | Description | Type | | ----------------- | -------------------------------------- | ------------------- | | mdsUrlViewClose | Emits when the close button is clicked | CustomEvent<void> |

Methods

updateLang() => Promise<void>

Returns

Type: Promise<void>

CSS Custom Properties

| Name | Description | | --------------------------- | ------------------------------------------ | | --mds-url-view-background | Sets the background-color of the component | | --mds-url-view-color | Sets the text color of the component | | --mds-url-view-radius | Sets the border-radius of the component | | --mds-url-view-shadow | Sets the box-shadow of the component |

Dependencies

Depends on

• mds-icon
• mds-text
• mds-button

Graph

graph TD;
  mds-url-view --> mds-icon
  mds-url-view --> mds-text
  mds-url-view --> mds-button
  mds-button --> mds-spinner
  mds-button --> mds-icon
  mds-button --> mds-text
  style mds-url-view fill:#f9f,stroke:#333,stroke-width:4px

Built with love @ Gruppo Maggioli from R&D Department