design-system icon indicating copy to clipboard operation
design-system copied to clipboard

Update component import guidelines

Open alizedebray opened this issue 1 year ago • 1 comments

The component package starting page offers the possibility to import components individually like so:

import { defineCustomElement as definePostIcon } from '@swisspost/design-system-components/dist/components/post-icon';
definePostIcon();

However this does not work in the case of nested components. Importing the tabs like so will give an error:

import { defineCustomElement as definePostTabHeader } from '@swisspost/design-system-components/dist/components/post-tab-header';
import { defineCustomElement as definePostTabPanel } from '@swisspost/design-system-components/dist/components/post-tab-panel';
import { defineCustomElement as definePostTabs } from '@swisspost/design-system-components/dist/components/post-tabs';
definePostTabHeader();
definePostTabPanel();
definePostTabs();

TypeError: tab.componentOnReady is not a function _ref post-tabs2.js:73

### Tasks
- [ ] Check if we can wait for tabs to be defined before calling the onReady function
- [ ] https://github.com/swisspost/design-system/issues/3361

alizedebray avatar Jul 09 '24 07:07 alizedebray