diff --git a/review/main/404.html b/review/main/404.html index 8c7f67ec15f..9c221a92ee1 100644 --- a/review/main/404.html +++ b/review/main/404.html @@ -1 +1 @@ -DB UI Mono
\ No newline at end of file +DB UI Mono
\ No newline at end of file diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/accordion-item.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/accordion-item.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/accordion-item.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/accordion-item.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/accordion-item/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/accordion-item/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/accordion-item/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/accordion-item/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/accordion.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/accordion.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/accordion.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/accordion.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/accordion/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/accordion/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/accordion/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/accordion/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/action.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/action.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/action.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/action.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/action/button.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/action/button.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/action/button.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/action/button.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/action/button/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/action/button/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/action/button/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/action/button/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/action/link.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/action/link.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/action/link.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/action/link.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/action/link/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/action/link/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/action/link/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/action/link/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/badge.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/badge.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/badge.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/badge.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/badge/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/badge/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/badge/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/badge/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/brand.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/brand.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/brand.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/brand.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/brand/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/brand/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/brand/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/brand/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/button.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/button.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/button.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/button.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/button/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/button/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/button/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/button/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/card.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/card.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/card.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/card.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/card/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/card/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/card/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/card/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/checkbox.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/checkbox.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/checkbox.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/checkbox.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/checkbox/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/checkbox/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/checkbox/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/checkbox/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/accordion-item.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/accordion-item.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/accordion-item.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/accordion-item.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/accordion-item/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/accordion-item/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/accordion-item/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/accordion-item/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/accordion.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/accordion.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/accordion.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/accordion.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/accordion/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/accordion/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/accordion/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/accordion/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/brand.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/brand.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/brand.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/brand.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/brand/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/brand/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/brand/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/brand/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/infotext.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/infotext.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/infotext.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/infotext.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/infotext/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/infotext/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/infotext/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/infotext/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tab-item.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tab-item.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tab-item.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tab-item.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tab-item/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tab-item/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tab-item/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tab-item/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tabs.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tabs.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tabs.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tabs.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tabs/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tabs/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tabs/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tabs/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tag.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tag.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tag.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tag.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tag/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tag/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tag/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tag/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tooltip.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tooltip.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tooltip.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tooltip.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tooltip/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tooltip/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-display/tooltip/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-display/tooltip/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/checkbox.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/checkbox.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/checkbox.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/checkbox.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/checkbox/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/checkbox/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/checkbox/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/checkbox/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/input.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/input.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/input.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/input.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/input/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/input/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/input/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/input/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/radio.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/radio.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/radio.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/radio.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/radio/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/radio/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/radio/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/radio/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/select.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/select.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/select.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/select.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/select/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/select/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/select/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/select/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/switch.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/switch.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/switch.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/switch.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/switch/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/switch/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/switch/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/switch/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/textarea.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/textarea.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/textarea.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/textarea.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/textarea/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/textarea/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/data-input/textarea/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/data-input/textarea/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/divider.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/divider.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/divider.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/divider.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/divider/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/divider/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/divider/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/divider/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/drawer.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/drawer.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/drawer.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/drawer.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/drawer/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/drawer/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/drawer/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/drawer/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/feedback.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/feedback.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/feedback.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/feedback.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/feedback/badge.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/feedback/badge.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/feedback/badge.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/feedback/badge.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/feedback/badge/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/feedback/badge/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/feedback/badge/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/feedback/badge/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/feedback/notification.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/feedback/notification.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/feedback/notification.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/feedback/notification.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/feedback/notification/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/feedback/notification/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/feedback/notification/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/feedback/notification/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/header.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/header.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/header.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/header.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/header/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/header/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/header/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/header/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/infotext.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/infotext.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/infotext.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/infotext.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/infotext/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/infotext/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/infotext/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/infotext/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/input.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/input.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/input.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/input.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/input/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/input/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/input/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/input/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/card.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/card.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/card.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/card.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/card/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/card/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/card/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/card/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/divider.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/divider.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/divider.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/divider.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/divider/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/divider/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/divider/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/divider/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/drawer.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/drawer.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/drawer.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/drawer.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/drawer/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/drawer/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/drawer/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/drawer/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/header.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/header.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/header.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/header.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/header/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/header/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/header/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/header/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/section.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/section.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/section.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/section.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/section/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/section/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/layout/section/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/layout/section/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/link.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/link.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/link.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/link.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/link/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/link/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/link/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/link/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation-item.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation-item.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation-item.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation-item.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation-item/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation-item/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation-item/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation-item/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation/navigation-item.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation/navigation-item.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation/navigation-item.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation/navigation-item.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation/navigation-item/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation/navigation-item/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation/navigation-item/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation/navigation-item/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation/navigation.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation/navigation.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation/navigation.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation/navigation.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation/navigation/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation/navigation/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation/navigation/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation/navigation/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/navigation/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/navigation/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/notification.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/notification.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/notification.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/notification.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/notification/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/notification/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/notification/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/notification/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/popover.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/popover.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/popover.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/popover.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/popover/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/popover/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/popover/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/popover/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/radio.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/radio.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/radio.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/radio.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/radio/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/radio/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/radio/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/radio/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/section.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/section.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/section.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/section.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/section/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/section/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/section/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/section/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/select.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/select.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/select.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/select.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/select/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/select/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/select/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/select/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/switch.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/switch.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/switch.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/switch.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/switch/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/switch/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/switch/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/switch/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tab-item.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tab-item.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tab-item.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tab-item.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tab-item/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tab-item/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tab-item/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tab-item/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tabs.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tabs.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tabs.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tabs.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tabs/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tabs/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tabs/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tabs/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tag.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tag.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tag.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tag.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tag/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tag/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tag/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tag/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/textarea.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/textarea.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/textarea.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/textarea.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/textarea/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/textarea/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/textarea/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/textarea/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tooltip.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tooltip.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tooltip.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tooltip.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tooltip/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tooltip/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/tooltip/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/tooltip/overview.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/utilities.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/utilities.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/utilities.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/utilities.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/utilities/popover.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/utilities/popover.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/utilities/popover.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/utilities/popover.json diff --git a/review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/utilities/popover/overview.json b/review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/utilities/popover/overview.json similarity index 100% rename from review/main/_next/data/8oVwAjSm2VYiBo7bRP8Q_/components/utilities/popover/overview.json rename to review/main/_next/data/ukPJkxRVvrZNsoqbrgbLm/components/utilities/popover/overview.json diff --git a/review/main/_next/static/chunks/2811-22e103ded3f0cef2.js b/review/main/_next/static/chunks/2811-af5aeb310cc0a476.js similarity index 57% rename from review/main/_next/static/chunks/2811-22e103ded3f0cef2.js rename to review/main/_next/static/chunks/2811-af5aeb310cc0a476.js index e2adbbbfefb..5812df52f55 100644 --- a/review/main/_next/static/chunks/2811-22e103ded3f0cef2.js +++ b/review/main/_next/static/chunks/2811-af5aeb310cc0a476.js @@ -1 +1 @@ -"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[2811],{92811:function(n,e,a){a.d(e,{Z6:function(){return tv},Ec:function(){return tm},tp:function(){return tf},vY:function(){return tB},kn:function(){return tT},vn:function(){return tj}});var t={};a.r(t),a.d(t,{Behaviour:function(){return ep},Content:function(){return eh},Density:function(){return ec},Size:function(){return eu},State:function(){return eb},Variant:function(){return ed}});var i={};a.r(i),a.d(i,{Content:function(){return eD},Density:function(){return ex},InteractionStates:function(){return em},Semantic:function(){return eg},Size:function(){return ev}});var o={};a.r(o),a.d(o,{Behaviour:function(){return eT},Density:function(){return eB},Variant:function(){return ej}});var l={};a.r(l),a.d(l,{ContentStates:function(){return ek},Density:function(){return ef},InteractionStates:function(){return ey}});var s={};a.r(s),a.d(s,{Tonality:function(){return ew},Variants:function(){return eZ}});var r={};a.r(r),a.d(r,{Animations:function(){return e_},Density:function(){return eN},Emphasis:function(){return eC},Placement:function(){return eL},Variant:function(){return eI},Width:function(){return eH}});var c={};a.r(c),a.d(c,{Density:function(){return eP},Semantic:function(){return eA},Size:function(){return eR}});var d={};a.r(d),a.d(d,{Behaviour:function(){return eF},Content:function(){return eV},Density:function(){return eS},Emphasis:function(){return eE},Example:function(){return ez},Overflow:function(){return eW},Semantic:function(){return eO},State:function(){return eM}});var b={};a.r(b),a.d(b,{Examples:function(){return eY},Orientation:function(){return eq},Overflow:function(){return eG},Tonality:function(){return eU},Width:function(){return eJ}});var u={};a.r(u),a.d(u,{Behaviour:function(){return eX},Content:function(){return eQ},ContentAlignmentFullWidth:function(){return e0},Density:function(){return e$},States:function(){return eK}});var h={};a.r(h),a.d(h,{Content:function(){return e5},Density:function(){return e1},InteractionStates:function(){return e2},Requirement:function(){return e7},Size:function(){return e4},States:function(){return e3}});var p={};a.r(p),a.d(p,{Content:function(){return aa},Density:function(){return e6},ExampleTypes:function(){return ai},ExampleTypesFloatingLabel:function(){return ao},Requirement:function(){return at},StatesFloatingLabel:function(){return ae},StatesLabelAbove:function(){return an},VariantHelperMessage:function(){return e9},VariantLabel:function(){return e8}});var x={};a.r(x),a.d(x,{Content:function(){return ab},Density:function(){return al},InteractionStates:function(){return as},Requirement:function(){return ad},Size:function(){return ac},States:function(){return ar}});var g={};a.r(g),a.d(g,{Content:function(){return am},Density:function(){return au},Requirement:function(){return av},StatesFloatingLabel:function(){return ag},StatesLabelAbove:function(){return ax},VariantHelperMessage:function(){return ap},VariantLabel:function(){return ah}});var m={};a.r(m),a.d(m,{Content:function(){return ay},Density:function(){return aD},Emphasis:function(){return aj},Examples:function(){return ak},Size:function(){return af},States:function(){return aB},VisualAid:function(){return aT}});var v={};a.r(v),a.d(v,{Density:function(){return aw},Requirement:function(){return aL},Rows:function(){return aH},StatesFloatingLabel:function(){return aC},StatesLabelAbove:function(){return aI},VariantHelperMessage:function(){return aN},VariantLabel:function(){return aZ}});var D={};a.r(D),a.d(D,{Behaviour:function(){return aR},ContentVariantDocked:function(){return aS},ContentVariantOverlay:function(){return aO},ContentVariantStandalone:function(){return aE},Density:function(){return a_},Semantic:function(){return aA},Variant:function(){return aP}});var B={};a.r(B),a.d(B,{Content:function(){return az},Density:function(){return aF},Emphasis:function(){return aM},Examples:function(){return aq},Placement:function(){return aU},Semantic:function(){return aV},Size:function(){return aW}});var j={};a.r(j),a.d(j,{Behaviour:function(){return a$},Density:function(){return aJ},ElevationLevel:function(){return aG},Example:function(){return aK},Spacing:function(){return aY}});var T={};a.r(T),a.d(T,{Density:function(){return aQ},Emphasis:function(){return a0},Variant:function(){return aX}});var f={};a.r(f),a.d(f,{Backdrop:function(){return a7},Density:function(){return a1},Directions:function(){return a5},Rounded:function(){return a3},Size:function(){return a2},Spacing:function(){return a4}});var y={};a.r(y),a.d(y,{Behaviour:function(){return a9},Examples:function(){return tn},Tonality:function(){return a6},Width:function(){return a8}});var k={};a.r(k),a.d(k,{Density:function(){return te},Spacing:function(){return tt},Width:function(){return ta}});var w={};a.r(w),a.d(w,{Density:function(){return ti}});var Z={};a.r(Z),a.d(Z,{Content:function(){return ts},Density:function(){return to},InteractionStates:function(){return tl},Width:function(){return tr}});var N={};a.r(N),a.d(N,{Animations:function(){return th},Density:function(){return tc},Gap:function(){return tu},Placement:function(){return tb},Spacing:function(){return td},Width:function(){return tp}});var I=a(52322),C=a(10326),L=a(2784),H=a(70741),_=a(45886),P=a(50350),A=a(39846),R=a(82876),S=()=>{let n=(0,R.useRouter)(),e=(0,R.usePathname)(),[a,t]=[(0,R.useSearchParams)()];return[a,a=>{{let n=new URLSearchParams(window.location.href.split("?")[1]);n.sort();let e=new URLSearchParams(a);if(e.sort(),n.toString()===e.toString())return}t?t(a):e&&(null==n||n.push("".concat(e,"?").concat(new URLSearchParams(a).toString())))}]},E=function(){var n,e;let a=!(arguments.length>0)||void 0===arguments[0]||arguments[0],[t,i]=S(),[o,l]=(0,L.useState)(null!==(n=t.get(A.eM))&&void 0!==n?n:A.pw.REGULAR),[s,r]=(0,L.useState)(null!==(e=t.get(A.a_))&&void 0!==e?e:A.r$.NEUTRAL_BG_LEVEL_1),[c,d]=(0,L.useState)(void 0),[b,u]=(0,L.useState)(!1),[h,p]=(0,L.useState)(!1);return(0,L.useEffect)(()=>{for(let[n,e]of Array.from(t.entries()))e&&(n===A.eM&&o!==e&&l(e),n===A.a_&&s!==e&&r(e),"page"===n&&c!==e.toLowerCase()&&d(e.toLowerCase()),"fullscreen"===n&&!!e!==b&&u(!!e));p(!0)},[t]),(0,L.useEffect)(()=>{if(h){let n={density:o,color:s};c&&(n.page=c),b&&(n.fullscreen=!0),a&&i(n)}},[s,o,c,b,h]),[o,l,s,r,c,b]},O=a(34406);let F=n=>{let{name:e,examples:a,color:t,role:i,SlotCode:o}=n,l=(0,L.useCallback)(()=>(null==t?void 0:t.includes("3"))?"3":(null==t?void 0:t.includes("2"))?"2":"1",[t]),[s,r]=(0,L.useState)();return(0,I.jsxs)(H.Z,{className:"variants-card db-code-docs",elevationLevel:l(),children:[(0,I.jsx)("div",{role:i,"aria-label":i?e:void 0,className:"variants-list",children:a.map((n,e)=>(0,I.jsx)("div",{style:n.style,className:n.className,children:n.example},"".concat(n.name,"-").concat(e)))}),o&&(0,I.jsxs)("details",{className:"code-details",onToggle:()=>{r(!s)},children:[(0,I.jsx)("summary",{className:"db-button code-button","data-size":"small","data-variant":"filled",children:s?"Hide code":"Show code"}),(0,I.jsxs)("div",{className:"db-density-functional",children:[(0,I.jsx)("div",{className:"backdrop"}),(0,I.jsx)(H.Z,{className:"code",spacing:"small",children:(0,I.jsx)(o,{})})]})]})]})};var M=n=>{var e;let{title:a,variants:t,subComponent:i,isSubComponent:o,componentName:l}=n,s=null==O||null===(e=O.env)||void 0===e,r=E(s)[4],c=E(s)[2],d=n=>{{let e=new URLSearchParams(window.location.href.split("?")[1]);return e.set("page",n.toLowerCase()),"".concat(window.location.href.split("?")[0],"?").concat(e.toString())}},b=(n,e)=>{var a;if(!window.location.origin||!window.location.href)return;let t=window.location.href.split("?"),i=t[0],o=new URLSearchParams(null!==(a=t[1])&&void 0!==a?a:"");o.set("page",e.toLowerCase());let s=l?"".concat(i.replace(/\/[a-z\d\-_]*\/overview/,"/".concat(l,"/overview")),"?").concat(o.toString()):"".concat(t[0],"?").concat(o.toString());window.open(s,"_blank")};if(r){let n=t.find(n=>n.name.toLowerCase()===r);if(n)return(0,I.jsx)(F,{...n,color:c})}return(0,I.jsxs)(I.Fragment,{children:[(0,I.jsxs)("div",{className:"default-container",children:[(0,I.jsx)(o?"h2":"h1",{children:a}),null==t?void 0:t.map((n,e)=>(0,I.jsxs)("div",{children:[(0,I.jsx)(_.Z,{}),(0,I.jsx)(P.Z,{className:"link-headline",content:"external",target:"_blank",onClick:e=>{b(e,n.name)},href:d(n.name),children:n.name}),(0,I.jsx)(F,{...n,color:c})]},"".concat(n.name,"-").concat(e)))]}),i]})},V=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]},{"name":"Variant","examples":[{"name":"(Default) Outlined - Adaptive"},{"name":"Filled - Adaptive","props":{"variant":"filled"}},{"name":"Ghost - Adaptive","props":{"variant":"ghost"}},{"name":"Brand","props":{"variant":"brand"}}]},{"name":"State","examples":[{"name":"(Default) Enabled"},{"name":"Disabled","props":{"disabled":true}}]},{"name":"Size","examples":[{"name":"(Default) Medium"},{"name":"Small","props":{"size":"small"}}]},{"name":"Content","examples":[{"name":"(Default) Text"},{"name":"Icon & Text","props":{"icon":"user"}},{"name":"Icon","props":{"icon":"user","noText":true}}]},{"name":"Behaviour","examples":[{"name":"(Default) Auto Width"},{"name":"Width full","style":{"width":"500px"},"props":{"width":"full"}}]}]');let W=(n,e,a)=>n.map((n,t)=>{var i;return{...n,SlotCode:null==a?void 0:a[null!==(i=n.codeFileName)&&void 0!==i?i:n.name.replaceAll(" ","")],examples:n.examples.map((n,a)=>{var t,i,o,l;return{...n,example:e({...n.props,id:null!==(o=null===(t=n.props)||void 0===t?void 0:t.id)&&void 0!==o?o:n.name,children:null!==(l=null===(i=n.props)||void 0===i?void 0:i.children)&&void 0!==l?l:n.name})}})}}),z=n=>{let{variant:e,state:a,size:t,noText:i,icon:o,width:l,disabled:s,children:r}=n;return(0,I.jsx)(C.Z,{variant:e,state:a,size:t,noText:i,icon:o,disabled:s,width:l,onClick:()=>{alert(r.toString())},children:r})};var U=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional","props":{"href":"#"}},{"name":"(Default) Regular","className":"db-density-regular","props":{"href":"#"}},{"name":"Expressive","className":"db-density-expressive","props":{"href":"#"}}]},{"name":"Semantic","examples":[{"name":"(Default) Adaptive","props":{"href":"#"}},{"name":"Brand","props":{"href":"#","variant":"brand"}}]},{"name":"Interaction-States","examples":[{"name":"Enabled (Default)/Hover/Pressed","props":{"href":"#"}},{"name":"Disabled","props":{"href":"#","disabled":true}}]},{"name":"Size","examples":[{"name":"(Default) Medium","props":{"href":"#"}},{"name":"Small","props":{"href":"#","size":"small"}}]},{"name":"Content","examples":[{"name":"(Default) Internal","props":{"href":"#"}},{"name":"External","props":{"href":"#","content":"external"}}]}]');let q=n=>{let{href:e,variant:a,disabled:t,size:i,content:o,children:l}=n;return(0,I.jsx)(P.Z,{href:e,variant:a,disabled:t,size:i,content:o,children:l})};var J=a(47437),G=a(38663),Y=a(70453),$=JSON.parse('[{"name":"Density","children":[{"name":"accordion-item","content":"Content 1","props":{"headline":"Item 1"}},{"name":"accordion-item","content":"Content 2","props":{"headline":"Item 2"}},{"name":"accordion-item","content":"Content 3","props":{"headline":"Item 3"}}],"examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]},{"name":"Variant","children":[{"name":"accordion-item","content":"Content 1","props":{"headline":"Item 1"}},{"name":"accordion-item","content":"Content 2","props":{"headline":"Item 2"}},{"name":"accordion-item","content":"Content 3","props":{"headline":"Item 3"}}],"examples":[{"name":"background (default)"},{"name":"card","props":{"variant":"card"}}]},{"name":"Behaviour","children":[{"name":"accordion-item","content":"Content 1","props":{"headline":"Item 1"}},{"name":"accordion-item","content":"Content 2","props":{"headline":"Item 2"}},{"name":"accordion-item","content":"Content 3","props":{"headline":"Item 3"}}],"examples":[{"name":"(Default) Multiple","props":{"behaviour":"multiple"}},{"name":"Single","props":{"behaviour":"single"}}]}]');let K=n=>{let{behaviour:e,children:a,variant:t}=n;return(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(J.Z,{size:"small",semantic:"informational",icon:"none",children:a}),(0,I.jsxs)(G.Z,{behaviour:e,variant:t,children:[(0,I.jsx)(Y.Z,{headlinePlain:"Item 1",content:"Content 1"}),(0,I.jsx)(Y.Z,{headlinePlain:"Item 2",content:"Content 2"}),(0,I.jsx)(Y.Z,{headlinePlain:"Item 3",content:"Content 3"})]})]})};var Q=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional","props":{"headlinePlain":"Functional"}},{"name":"(Default) Regular","className":"db-density-regular","props":{"headlinePlain":"(Default) Regular"}},{"name":"Expressive","className":"db-density-expressive","props":{"headlinePlain":"Expressive"}}]},{"name":"Interaction States","examples":[{"name":"Enabled (Default)/Hover/Pressed","props":{"headlinePlain":"Enabled (Default)/Hover/Pressed"}},{"name":"Disabled","props":{"headlinePlain":"Disabled","disabled":true}}]},{"name":"Content States","examples":[{"name":"(Default) Collapsed","props":{"headlinePlain":"(Default) Collapsed"}},{"name":"Open","props":{"headlinePlain":"Open","open":true}}]}]');let X=n=>{let{children:e,disabled:a,open:t,headlinePlain:i}=n;return(0,I.jsx)(Y.Z,{headlinePlain:i,disabled:a,defaultOpen:t,children:e})};var nn=n=>(0,I.jsx)(M,{title:"DBAccordionItem",isSubComponent:n.isSubComponent,componentName:n.componentName,variants:W(Q,X,n.slotCode)}),ne=a(98310),na=JSON.parse('[{"name":"Tonality","examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]},{"name":"Variants","examples":[{"name":"(Default) With Logo"},{"name":"No Logo","props":{"hideLogo":true}},{"name":"Custom Logo","props":{"hideLogo":true,"customLogo":true}}]}]'),nt=a(34406);let ni=n=>{var e,a;let{children:t,hideLogo:i,customLogo:o}=n;return(0,I.jsxs)(ne.Z,{hideLogo:i,children:[o&&(0,I.jsx)("img",{src:"".concat(null!==(a=null==nt?void 0:null===(e=nt.env)||void 0===e?void 0:"/mono/review/main")&&void 0!==a?a:"/react-showcase","/assets/images/placeholder.jpg"),alt:"logo"}),t]})};var no=a(79031),nl=JSON.parse('[{"name":"Density","children":[{"name":"button"}],"examples":[{"name":"Functional","className":"db-density-functional","props":{"content":"Tooltip","id":"tooltip-01"}},{"name":"(Default) Regular","className":"db-density-regular","props":{"content":"Tooltip","id":"tooltip-02"}},{"name":"Expressive","className":"db-density-expressive","props":{"content":"Tooltip","id":"tooltip-03"}}]},{"name":"Variant","children":[{"name":"button"}],"examples":[{"name":"(Default) With arrow","props":{"content":"Tooltip","id":"tooltip-04"}},{"name":"Basic","props":{"content":"Tooltip","variant":"basic","id":"tooltip-05"}}]},{"name":"Emphasis","children":[{"name":"button"}],"examples":[{"name":"(Default) Weak","props":{"content":"Tooltip","id":"tooltip-06"}},{"name":"Strong","props":{"content":"Tooltip","emphasis":"strong","id":"tooltip-07"}}]},{"name":"Placement","children":[{"name":"button"}],"examples":[{"name":"bottom-start","props":{"content":"Tooltip","placement":"bottom-start","id":"tooltip-08-start"}},{"name":"(Default) bottom","props":{"content":"Tooltip","placement":"bottom","id":"tooltip-08"}},{"name":"bottom-end","props":{"content":"Tooltip","placement":"bottom-end","id":"tooltip-08-end"}},{"name":"left-start","props":{"content":"Tooltip","placement":"left-start","id":"tooltip-10-start"}},{"name":"left","props":{"content":"Tooltip","placement":"left","id":"tooltip-10"}},{"name":"left-end","props":{"content":"Tooltip","placement":"left-end","id":"tooltip-10-end"}},{"name":"right-start","props":{"content":"Tooltip","placement":"right-start","id":"tooltip-11-start"}},{"name":"right","props":{"content":"Tooltip","placement":"right","id":"tooltip-11"}},{"name":"right-end","props":{"content":"Tooltip","placement":"right-end","id":"tooltip-11-end"}},{"name":"top-start","props":{"content":"Tooltip","placement":"top-start","id":"tooltip-09-start"}},{"name":"top","props":{"content":"Tooltip","placement":"top","id":"tooltip-09"}},{"name":"top-end","props":{"content":"Tooltip","placement":"top-end","id":"tooltip-09-end"}}]},{"name":"Width","children":[{"name":"button"}],"examples":[{"name":"(Default) Auto","props":{"content":"Max width, lorem ipsum dolor sit amet, consetetur sadipscing","id":"tooltip-12"}},{"name":"Fixed","props":{"content":"Max width, lorem ipsum dolor sit amet, consetetur sadipscing","width":"fixed","id":"tooltip-13"}}]},{"name":"Animations","children":[{"name":"button"}],"examples":[{"name":"(Default) Animation no delay","props":{"content":"Tooltip","id":"tooltip-14"}},{"name":"Delay slow","props":{"content":"Tooltip","delay":"slow","id":"tooltip-15"}},{"name":"Delay fast","props":{"content":"Tooltip","delay":"fast","id":"tooltip-16"}},{"name":"No animation","props":{"content":"Tooltip","animation":"disabled","id":"tooltip-17"}}]}]');let ns=n=>{let{children:e,width:a,emphasis:t,placement:i,delay:o,content:l,animation:s,variant:r}=n;return(0,I.jsxs)(C.Z,{children:[e,(0,I.jsx)(no.Z,{width:a,emphasis:t,placement:i,animation:s,delay:o,variant:r,children:l})]})};var nr=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]},{"name":"Semantic","examples":[{"name":"(Default) Adaptive"},{"name":"Neutral","props":{"semantic":"neutral"}},{"name":"Critical","props":{"semantic":"critical"}},{"name":"Informational","props":{"semantic":"informational"}},{"name":"Successful","props":{"semantic":"successful"}},{"name":"Warning","props":{"semantic":"warning"}}]},{"name":"Size","examples":[{"name":"(Default) Medium"},{"name":"Small","props":{"size":"small"}}]}]');let nc=n=>{let{semantic:e,size:a,icon:t,children:i}=n;return(0,I.jsx)(J.Z,{semantic:e,size:a,icon:t,children:i})};var nd=a(73253),nb=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]},{"name":"Emphasis","examples":[{"name":"(Default) Weak"},{"name":"Strong","props":{"emphasis":"strong"}}]},{"name":"Semantic","examples":[{"name":"(Default) Adaptive"},{"name":"Neutral","props":{"semantic":"neutral"}},{"name":"Critical","props":{"semantic":"critical"}},{"name":"Informational","props":{"semantic":"informational"}},{"name":"Successful","props":{"semantic":"successful"}},{"name":"Warning","props":{"semantic":"warning"}},{"name":"Adaptive Strong","props":{"emphasis":"strong"}},{"name":"Neutral Strong","props":{"semantic":"neutral","emphasis":"strong"}},{"name":"Critical Strong","props":{"semantic":"critical","emphasis":"strong"}},{"name":"Informational Strong","props":{"semantic":"informational","emphasis":"strong"}},{"name":"Successful Strong","props":{"semantic":"successful","emphasis":"strong"}},{"name":"Warning Strong","props":{"semantic":"warning","emphasis":"strong"}}]},{"name":"Behaviour","role":"group","examples":[{"name":"(Default) Static"},{"name":"Interactive Button","props":{"component":"button"},"children":[{"name":"button","native":true,"content":"Interactive Button"}]},{"name":"Interactive Link","props":{"component":"link"},"children":[{"name":"a","native":true,"content":"Interactive Link","props":{"href":"#"}}]},{"name":"Interactive Checkbox","props":{"component":"checkbox"},"children":[{"name":"label","native":true,"content":"Interactive Checkbox","props":{"for":"checkbox01"},"children":[{"name":"input","native":true,"props":{"id":"checkbox01","type":"checkbox"}}]}]},{"name":"Interactive Radio 1","props":{"component":"radio","identifier":"radio01"},"children":[{"name":"label","native":true,"content":"Interactive Radio 1","props":{"for":"radio01"},"children":[{"name":"input","native":true,"props":{"name":"radio01","id":"radio01","type":"radio"}}]}]},{"name":"Interactive Radio 2","props":{"component":"radio","identifier":"radio01"},"children":[{"name":"label","native":true,"content":"Interactive Radio 2","props":{"for":"radio02"},"children":[{"name":"input","native":true,"props":{"name":"radio02","id":"radio02","type":"radio"}}]}]},{"name":"Removeable","props":{"behaviour":"removable"}}]},{"name":"State","role":"group","examples":[{"name":"(Default) Unchecked","props":{"component":"checkbox"},"children":[{"name":"label","native":true,"content":"Interactive Checkbox","props":{"for":"checkbox02"},"children":[{"name":"input","native":true,"props":{"for":"checkbox02","type":"checkbox"}}]}]},{"name":"Checked","props":{"component":"checkbox","checked":true},"children":[{"name":"label","native":true,"content":"Interactive Checkbox","props":{"for":"checkbox03"},"children":[{"name":"input","native":true,"props":{"checked":true,"id":"checkbox03","type":"checkbox"}}]}]},{"name":"Disabled","props":{"component":"checkbox","checked":true,"disabled":true},"children":[{"name":"label","native":true,"content":"Interactive Checkbox","props":{"for":"checkbox04"},"children":[{"name":"input","native":true,"props":{"checked":true,"disabled":true,"id":"checkbox04","type":"checkbox"}}]}]}]},{"name":"Content","examples":[{"name":"(Default) Text"},{"name":"Icon","props":{"icon":"user","noText":true}},{"name":"Icon & Text","props":{"icon":"user"}}]},{"name":"Overflow","examples":[{"name":"(Default) No Overflow"},{"name":"With Overflow (max-width)","props":{"overflow":true}}]},{"name":"Example","role":"group","examples":[{"name":"Interactive Strong Button with Icon","props":{"component":"button","emphasis":"strong","icon":"user","behaviour":"removable"},"children":[{"name":"button","native":true,"content":"Interactive Button"}]},{"name":"Interactive Strong Link with Icon","props":{"component":"link","emphasis":"strong","icon":"user"},"children":[{"name":"a","native":true,"content":"Interactive Link","props":{"href":"#"}}]},{"name":"Interactive Strong Checkbox with Icon","props":{"component":"checkbox","emphasis":"strong","icon":"user"},"children":[{"name":"label","native":true,"content":"Interactive Checkbox","props":{"for":"checkbox05"},"children":[{"name":"input","native":true,"id":"checkbox05","type":"checkbox"}]}]},{"name":"Interactive Strong Radio 1 with Icon","props":{"component":"radio","emphasis":"strong","icon":"user","identifier":"radio03"},"children":[{"name":"label","native":true,"content":"Interactive Radio 3","props":{"for":"radio03"},"children":[{"name":"input","native":true,"props":{"name":"radio03","id":"radio03","type":"radio"}}]}]},{"name":"Interactive Strong Radio 2 with Icon","props":{"component":"radio","emphasis":"strong","icon":"user","identifier":"radio02"},"children":[{"name":"label","native":true,"content":"Interactive Radio 4","props":{"for":"radio04"},"children":[{"name":"input","native":true,"props":{"name":"radio04","id":"radio04","type":"radio"}}]}]}]}]');let nu=n=>{let{semantic:e,disabled:a,children:t,icon:i,overflow:o,noText:l,behaviour:s,emphasis:r,removeButton:c,checked:d,component:b,identifier:u}=n,[h,p]=(0,L.useState)(null!=d&&d);return(0,I.jsxs)(nd.Z,{semantic:e,disabled:a,icon:i,noText:l,behaviour:s,emphasis:r,overflow:o,removeButton:c,onRemove:()=>{alert(t.toString())},children:["button"===b&&(0,I.jsx)("button",{children:t}),"link"===b&&(0,I.jsx)("a",{href:"#",children:t}),"checkbox"===b&&(0,I.jsxs)("label",{children:[(0,I.jsx)("input",{type:"checkbox",checked:h,onChange:n=>{p(n.target.checked)}}),t]}),"radio"===b&&(0,I.jsxs)("label",{children:[(0,I.jsx)("input",{type:"radio",checked:d,name:u}),t]}),!b&&!o&&(0,I.jsx)(I.Fragment,{children:t}),!b&&o&&(0,I.jsx)("span",{children:t})]})};var nh=a(57092),np=a(57884),nx=a(57284),ng=a(49953),nm=JSON.parse('[{"name":"Tonality","children":[{"name":"tab-list","children":[{"name":"tab-item","content":"Tab 1"},{"name":"tab-item","content":"Tab 2"},{"name":"tab-item","content":"Tab 3"}]},{"name":"tab-panel","content":"Tab Panel 1"},{"name":"tab-panel","content":"Tab Panel 2"},{"name":"tab-panel","content":"Tab Panel 3"}],"examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]},{"name":"Orientation","children":[{"name":"tab-list","children":[{"name":"tab-item","content":"Tab 1"},{"name":"tab-item","content":"Tab 2"},{"name":"tab-item","content":"Tab 3"}]},{"name":"tab-panel","content":"Tab Panel 1"},{"name":"tab-panel","content":"Tab Panel 2"},{"name":"tab-panel","content":"Tab Panel 3"}],"examples":[{"name":"horizontal","props":{"orientation":"horizontal"}},{"name":"vertical","props":{"orientation":"vertical"}}]},{"name":"Width","children":[{"name":"tab-list","children":[{"name":"tab-item","content":"Tab 1"},{"name":"tab-item","content":"Tab 2"},{"name":"tab-item","content":"Tab 3"}]},{"name":"tab-panel","content":"Tab Panel 1"},{"name":"tab-panel","content":"Tab Panel 2"},{"name":"tab-panel","content":"Tab Panel 3"}],"examples":[{"name":"auto","style":{"width":"100%"},"props":{"width":"auto"}},{"name":"full - alignment: start","style":{"width":"100%"},"props":{"width":"full"}},{"name":"full - alignment: center","style":{"width":"100%"},"props":{"width":"full","alignment":"center"}}]},{"name":"Overflow","children":[{"name":"tab-list","children":[{"name":"tab-item","content":"Tab 1"},{"name":"tab-item","content":"Tab 2"},{"name":"tab-item","content":"Tab 3"}]},{"name":"tab-panel","content":"Tab Panel 1"},{"name":"tab-panel","content":"Tab Panel 2"},{"name":"tab-panel","content":"Tab Panel 3"}],"examples":[{"name":"no overflow","style":{"width":"300px"},"props":{"width":"auto"}},{"name":"with overflow - behaviour: arrows","style":{"width":"300px"},"props":{"overflow":true,"behaviour":"arrows"}},{"name":"with overflow - behaviour: scrollbar","style":{"width":"300px"},"props":{"overflow":true}}]},{"name":"Examples","children":[{"name":"tab-list","children":[{"name":"tab-item","content":"Tab 1"},{"name":"tab-item","content":"Tab 2"},{"name":"tab-item","content":"Tab 3"}]},{"name":"tab-panel","content":"Tab Panel 1"},{"name":"tab-panel","content":"Tab Panel 2"},{"name":"tab-panel","content":"Tab Panel 3"}],"examples":[{"name":"2 tab selected","props":{"initialSelectedIndex":1}},{"name":"nothing selected","props":{"initialSelectedMode":"manually"}}]}]');let nv=n=>{let{children:e,orientation:a,width:t,alignment:i,overflow:o,behaviour:l,initialSelectedMode:s,initialSelectedIndex:r}=n;return(0,I.jsxs)("div",{className:"w-full",children:[(0,I.jsxs)(J.Z,{icon:"none",size:"small",semantic:"informational",children:[e,":"]}),(0,I.jsxs)(nh.Z,{orientation:a,width:t,alignment:i,behaviour:l,initialSelectedIndex:r,initialSelectedMode:s,arrowScrollDistance:75,children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Test 1"}),(0,I.jsx)(nx.Z,{children:"Test 2"}),(0,I.jsx)(nx.Z,{children:"Test 3"}),o&&(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(nx.Z,{children:"Test 4"}),(0,I.jsx)(nx.Z,{children:"Test 5"})]})]}),(0,I.jsx)(ng.Z,{children:"Tab Panel 1"}),(0,I.jsx)(ng.Z,{children:"Tab Panel 2"}),(0,I.jsx)(ng.Z,{children:"Tab Panel 3"}),o&&(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(ng.Z,{children:"Tab Panel 4"}),(0,I.jsx)(ng.Z,{children:"Tab Panel 5"})]})]})]})};var nD=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional tab-hide-article","props":{"label":"functional"}},{"name":"(Default) Regular","className":"db-density-regular tab-hide-article","props":{"label":"(Default) Regular"}},{"name":"Expressive","className":"db-density-expressive tab-hide-article","props":{"label":"expressive"}}]},{"name":"States","examples":[{"name":"(Default) Enabled","props":{"label":"(Default) Enabled"}},{"name":"active","props":{"label":"active","active":true}},{"name":"disabled","props":{"label":"active","disabled":true}}]},{"name":"Content","examples":[{"name":"(Default) Text","props":{"label":"(Default) Text"}},{"name":"Text - Icon (Leading)","props":{"label":"Text - Icon (Leading)","icon":"x_placeholder"}},{"name":"Text - Icon (Trailing)","props":{"label":"Text - Icon (Trailing)","iconAfter":"x_placeholder"}},{"name":"Icon","props":{"icon":"x_placeholder","noText":true}}]},{"name":"Behaviour","examples":[{"name":"(Default) Auto Width","props":{"label":"(Default) Auto Width"}},{"name":"Width full","style":{"width":"500px"},"props":{"label":"Width full","width":"full"}}]},{"name":"Content Alignment Full Width","examples":[{"name":"Left","style":{"width":"500px"},"props":{"label":"Left","width":"full"}},{"name":"Centered","style":{"width":"500px"},"props":{"label":"Centered","width":"full","alignment":"center"}}]}]');let nB=n=>{let{children:e,active:a,noText:t,icon:i,iconAfter:o,disabled:l}=n;return(0,I.jsx)(np.Z,{children:(0,I.jsx)(nx.Z,{active:a,noText:t,icon:i,iconAfter:o,disabled:l,children:e})})};var nj=n=>(0,I.jsx)(M,{title:"DBTabItem",isSubComponent:n.isSubComponent,componentName:n.componentName,variants:W(nD,nB,n.slotCode)}),nT=a(1689),nf=JSON.parse('[{"name":"Density","role":"group","examples":[{"name":"Functional","className":"db-density-functional","props":{"name":"Density"}},{"name":"(Default) Regular","className":"db-density-regular","props":{"name":"Density"}},{"name":"Expressive","className":"db-density-expressive","props":{"name":"Density"}}]},{"name":"Interaction States","role":"group","examples":[{"name":"(Default) Enabled","props":{"name":"Interaction States"}},{"name":"Disabled","props":{"name":"Interaction States","disabled":true}}]},{"name":"States","role":"group","examples":[{"name":"(Default) Unchecked","props":{"name":"States"}},{"name":"Unchecked - Invalid","props":{"name":"States","required":true}},{"name":"Checked","props":{"name":"States","checked":true}},{"name":"Checked - Valid","props":{"name":"States","required":true,"checked":true}},{"name":"Indeterminate","props":{"name":"States","indeterminate":true}},{"name":"Indeterminate - Invalid","props":{"name":"States","indeterminate":true,"required":true}},{"name":"Indeterminate - Valid","props":{"name":"States","indeterminate":true,"required":true,"checked":true}}]},{"name":"Size","role":"group","examples":[{"name":"(Default) Medium","props":{"name":"Size"}},{"name":"Small","props":{"name":"Size","size":"small"}}]},{"name":"Requirement","role":"group","examples":[{"name":"(Default) Optional","props":{"name":"Requirement"}},{"name":"Required","props":{"name":"Requirement","required":true}},{"name":"Required - Indeterminate","props":{"name":"Requirement","indeterminate":true}}]},{"name":"Content","role":"group","examples":[{"name":"(Default) Label","props":{"name":"Content"}},{"name":"No Label","props":{"name":"Content","variant":"hidden"}}]}]');let ny=n=>{let{label:e,size:a,name:t,checked:i,required:o,children:l,disabled:s,indeterminate:r,variant:c}=n;return(0,I.jsx)(nT.Z,{label:e,size:a,name:t,defaultChecked:i,required:o,disabled:s,variant:c,indeterminate:r,children:l})};var nk=a(49475),nw=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional","props":{"label":"Label"}},{"name":"(Default) Regular","className":"db-density-regular","props":{"label":"Label"}},{"name":"Expressive","className":"db-density-expressive","props":{"label":"Label"}}]},{"name":"Variant Label","examples":[{"name":"(Default) Label Above","props":{"label":"Label"}},{"name":"Floating Label","props":{"label":"Label","variant":"floating","value":"Floating Label"}},{"name":"Hidden Label","props":{"label":"Label","variant":"hidden"}}]},{"name":"Variant Helper Message","examples":[{"name":"(Default) Basic","props":{"label":"Label"}},{"name":"Helper Message","props":{"label":"Label","message":"Helper Message"}}]},{"name":"States Label Above","examples":[{"name":"(Default) Empty","props":{"label":"Label"}},{"name":"Filled","props":{"label":"Label","value":"Filled"}},{"name":"Disabled","props":{"label":"Label","disabled":true}},{"name":"Readonly - Filled","props":{"label":"Label","value":"Readonly - Filled","readOnly":true}}]},{"name":"States Floating Label","examples":[{"name":"(Default) Empty","props":{"label":"Label","variant":"floating"}},{"name":"Filled","props":{"label":"Label","value":"Filled","variant":"floating"}},{"name":"Disabled","props":{"label":"Label","disabled":true,"variant":"floating"}},{"name":"Readonly - Filled","props":{"label":"Label","value":"Readonly - Filled","readOnly":true,"variant":"floating"}}]},{"name":"Content","examples":[{"name":"(Default) Text","props":{"label":"Label","value":"(Default) Text"}},{"name":"Filled Number","props":{"label":"Number","value":"123456","type":"number"}},{"name":"Text - Leading Icon","props":{"label":"Label","icon":"x_placeholder"}},{"name":"Text - Leading Icon - Trailing Icon","props":{"label":"Label","icon":"x_placeholder","iconAfter":"x_placeholder"}},{"name":"Text - Trailing Icon","props":{"label":"Label","iconAfter":"x_placeholder"}}]},{"name":"Requirement","examples":[{"name":"(Default) Optional","props":{"label":"Label"}},{"name":"Required","props":{"label":"Label","required":true}}]},{"name":"Example - Types","examples":[{"name":"(Default) Text","props":{"label":"Label"}},{"name":"Password","props":{"label":"Label","type":"password"}},{"name":"Search","props":{"label":"Label","type":"search"}},{"name":"E-Mail","props":{"label":"Label","type":"email"}},{"name":"Number","props":{"label":"Label","type":"number"}},{"name":"Tel","props":{"label":"Label","type":"tel"}},{"name":"URL","props":{"label":"Label","type":"url"}},{"name":"Date","props":{"label":"Label","type":"date"}},{"name":"Datetime Local","props":{"label":"Label","type":"datetime-local"}},{"name":"Month","props":{"label":"Label","type":"month"}},{"name":"Time","props":{"label":"Label","type":"time"}},{"name":"Week","props":{"label":"Label","type":"week"}},{"name":"Datalist","props":{"label":"Label","dataList":true}}]},{"name":"Example - Types - Floating Label","examples":[{"name":"(Default) Text","props":{"label":"Label","variant":"floating"}},{"name":"Password","props":{"label":"Label","type":"password","variant":"floating"}},{"name":"Search","props":{"label":"Label","type":"search","variant":"floating"}},{"name":"E-Mail","props":{"label":"Label","type":"email","variant":"floating"}},{"name":"Number","props":{"label":"Label","type":"number","variant":"floating"}},{"name":"Tel","props":{"label":"Label","type":"tel","variant":"floating"}},{"name":"URL","props":{"label":"Label","type":"url","variant":"floating"}},{"name":"Date","props":{"label":"Label","type":"date","variant":"floating"}},{"name":"Datetime Local","props":{"label":"Label","type":"datetime-local","variant":"floating"}},{"name":"Month","props":{"label":"Label","type":"month","variant":"floating"}},{"name":"Time","props":{"label":"Label","type":"time","variant":"floating"}},{"name":"Week","props":{"label":"Label","type":"week","variant":"floating"}},{"name":"Datalist","props":{"label":"Label","variant":"floating","dataList":true}}]}]');let nZ=n=>"floating"===n?["Test 1","Test 2"]:[{value:"test1",label:"Test 1"},{value:"test2",label:"Test 2"}],nN=n=>{let{label:e,value:a,type:t,minLength:i,required:o,disabled:l,iconAfter:s,icon:r,children:c,message:d,variant:b,readOnly:u,dataList:h}=n;return(0,I.jsx)(nk.Z,{label:e,message:d,placeholder:c,variant:b,defaultValue:a,type:t,minLength:i,required:o,disabled:l,readOnly:u,iconAfter:s,icon:r,dataList:h?nZ(b):void 0})};var nI=a(78016),nC=JSON.parse('[{"name":"Density","role":"radiogroup","examples":[{"name":"Functional","className":"db-density-functional","props":{"name":"Density","value":"functional"}},{"name":"(Default) Regular","className":"db-density-regular","props":{"name":"Density","value":"regular"}},{"name":"Expressive","className":"db-density-expressive","props":{"name":"Density","value":"expressive"}}]},{"name":"Interaction States","role":"radiogroup","examples":[{"name":"(Default) Enabled","props":{"name":"Interaction States"}},{"name":"Disabled","props":{"name":"Interaction States","disabled":true}}]},{"name":"States","role":"radiogroup","examples":[{"name":"(Default) Unselected","props":{"name":"States"}},{"name":"Unselected - Invalid","props":{"name":"States Required","required":true}},{"name":"Selected","props":{"name":"States","checked":true}},{"name":"Selected - Valid","props":{"name":"States Required","required":true,"checked":true}}]},{"name":"Size","role":"radiogroup","examples":[{"name":"(Default) Medium","props":{"name":"Size"}},{"name":"Small","props":{"name":"Size","size":"small"}}]},{"name":"Requirement","role":"radiogroup","examples":[{"name":"(Default) Optional","props":{"name":"Requirement"}},{"name":"Required","props":{"name":"Requirement","required":true}}]},{"name":"Content","role":"radiogroup","examples":[{"name":"(Default) Label","props":{"name":"Content"}},{"name":"Hidden Label","props":{"name":"Content","variant":"hidden"}}]}]');let nL=n=>{let{label:e,size:a,name:t,checked:i,required:o,children:l,disabled:s,value:r,variant:c}=n;return(0,I.jsx)(nI.Z,{label:e,size:a,name:t,defaultChecked:i,required:o,disabled:s,variant:c,value:r,children:l})};var nH=a(79081),n_=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label"}},{"name":"(Default) Regular","className":"db-density-regular","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label"}},{"name":"Expressive","className":"db-density-expressive","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label"}}]},{"name":"Variant Label","examples":[{"name":"(Default) Label Above","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label"}},{"name":"Floating Label","style":{"width":"300px"},"props":{"options":[{"value":"Floating Label"},{"value":"Option 2"}],"label":"Label","variant":"floating","value":"Floating Label"}},{"name":"Hidden Label","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label","variant":"hidden"}}]},{"name":"Variant Helper Message","examples":[{"name":"(Default) Basic","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label"}},{"name":"Helper Message","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label","message":"Helper Message"}}]},{"name":"States Label Above","examples":[{"name":"(Default) Empty","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label"}},{"name":"Filled","style":{"width":"300px"},"props":{"options":[{"value":"Filled","selected":true},{"value":"Option 2"}],"label":"Label","value":"Filled"}},{"name":"Disabled","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label","disabled":true}}]},{"name":"States Floating Label","examples":[{"name":"(Default) Empty","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label","variant":"floating"}},{"name":"Filled","style":{"width":"300px"},"props":{"options":[{"value":"Filled","selected":true},{"value":"Option 2"}],"label":"Label","value":"Filled","variant":"floating"}},{"name":"Disabled","style":{"width":"300px"},"props":{"options":[{"value":"Disabled"},{"value":"Option 2"}],"label":"Label","disabled":true,"variant":"floating","value":"Disabled"}}]},{"name":"Content","examples":[{"name":"(Default) Text","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label"}},{"name":"Text - Leading Icon","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label","icon":"x_placeholder"}}]},{"name":"Requirement","examples":[{"name":"(Default) Optional","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label"}},{"name":"Required","style":{"width":"300px"},"props":{"options":[{"value":"Option 1"},{"value":"Option 2"}],"label":"Label","required":true}}]}]');let nP=n=>{let{children:e,label:a,options:t,icon:i,message:o,disabled:l,value:s,required:r,variant:c}=n,[d,b]=(0,L.useState)(s);return(0,I.jsx)(nH.Z,{label:a,placeholder:e,options:t,disabled:l,variant:c,icon:i,value:d,onChange:n=>{b(n.target.value)},message:o,required:r,children:e})};var nA=a(55025),nR=JSON.parse('[{"name":"Density","examples":[{"name":"functional","className":"db-density-functional"},{"name":"regular (Default)","className":"db-density-regular"},{"name":"expressive","className":"db-density-expressive"}]},{"name":"States","examples":[{"name":"(Def) Enabled"},{"name":"Checked","props":{"checked":true}},{"name":"Disabled","props":{"disabled":true}}]},{"name":"Emphasis","examples":[{"name":"(Def) Weak + unchecked","props":{"emphasis":"weak"}},{"name":"Strong + unchecked","props":{"emphasis":"strong"}},{"name":"(Def) Weak + checked","props":{"emphasis":"weak","checked":true}},{"name":"Strong + checked","props":{"emphasis":"strong","checked":true}}]},{"name":"Visual Aid","examples":[{"name":"(Def) No Visual Aid + unchecked","props":{"visualAid":false}},{"name":"Visual Aid + unchecked","props":{"visualAid":true}},{"name":"(Def) No Visual Aid + checked","props":{"visualAid":false,"checked":true}},{"name":"Visual Aid + checked","props":{"visualAid":true,"checked":true}}]},{"name":"Size","examples":[{"name":"(Def) Medium"},{"name":"Small","props":{"size":"small"}}]},{"name":"Content","examples":[{"name":"(Def) Label"},{"name":"No Label","props":{"variant":"hidden"}}]},{"name":"Examples","examples":[{"name":"Custom Icons","props":{"visualAid":true,"icon":"night","iconAfter":"day"}},{"name":"Custom Icons+ Emphasis","props":{"visualAid":true,"icon":"lock_closed","iconAfter":"lock_open","emphasis":"strong"}}]}]');let nS=n=>{let{children:e,checked:a,visualAid:t,disabled:i,variant:o,emphasis:l,size:s,icon:r,iconAfter:c}=n;return(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(nA.Z,{visualAid:t,defaultChecked:a,disabled:i,variant:o,size:s,emphasis:l,icon:r,iconAfter:c,children:e}),"hidden"===o&&(0,I.jsx)(J.Z,{semantic:"informational",icon:"none",children:e})]})};var nE=a(22723),nO=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional","props":{"label":"Label"}},{"name":"(Default) Regular","className":"db-density-regular","props":{"label":"Label"}},{"name":"Expressive","className":"db-density-expressive","props":{"label":"Label"}}]},{"name":"Variant Label","examples":[{"name":"(Default) Label Above","props":{"label":"Label"}},{"name":"Floating Label","props":{"label":"Label","variant":"floating","value":"Floating Label"}},{"name":"Hidden Label","props":{"label":"Label","variant":"hidden"}}]},{"name":"Variant Helper Message","examples":[{"name":"(Default) Basic","props":{"label":"Label"}},{"name":"Helper Message","props":{"label":"Label","message":"Helper Message"}}]},{"name":"States Label Above","examples":[{"name":"(Default) Empty","props":{"label":"Label"}},{"name":"Filled","props":{"label":"Label","value":"Filled"}},{"name":"Disabled","props":{"label":"Label","disabled":true}},{"name":"Readonly - Filled","props":{"label":"Label","value":"Readonly - Filled","readOnly":true}}]},{"name":"States Floating Label","examples":[{"name":"(Default) Empty","props":{"label":"Label","variant":"floating"}},{"name":"Filled","props":{"label":"Label","value":"Filled","variant":"floating"}},{"name":"Disabled","props":{"label":"Label","disabled":true,"variant":"floating"}},{"name":"Readonly - Filled","props":{"label":"Label","value":"Readonly - Filled","readOnly":true,"variant":"floating"}}]},{"name":"Requirement","examples":[{"name":"(Default) Optional","props":{"label":"Label"}},{"name":"Required","props":{"label":"Label","required":true}}]},{"name":"Rows","examples":[{"name":"(Default) 4 Rows","style":{"width":"328px"},"props":{"label":"(Default) 4 Rows","value":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua."}},{"name":"Custom","style":{"width":"328px"},"props":{"label":"Custom Example 8 Rows","rows":8,"value":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua."}}]}]');let nF=n=>{let{cols:e,disabled:a,message:t,label:i,placeholder:o,rows:l,value:s,readOnly:r,required:c,children:d,variant:b}=n,[u,h]=(0,L.useState)(s);return(0,I.jsx)(nE.Z,{cols:e,disabled:a,message:t,label:i,variant:b,readOnly:r,onChange:n=>{h(n.target.value)},required:c,placeholder:null!=o?o:d,rows:l,value:u})};var nM=a(99242),nV=JSON.parse('[{"name":"Density","examples":[{"name":"functional","style":{"width":"300px"},"className":"db-density-functional","props":{"headline":"Headline","icon":"information_circle","behaviour":"closable"}},{"name":"regular (Default)","style":{"width":"300px"},"className":"db-density-regular","props":{"headline":"Headline","icon":"information_circle","behaviour":"closable"}},{"name":"expressive","style":{"width":"300px"},"className":"db-density-expressive","props":{"headline":"Headline","icon":"information_circle","behaviour":"closable"}}]},{"name":"Variant","examples":[{"name":"(Default) Docked","style":{"width":"300px"},"props":{"variant":"docked","headline":"Headline","icon":"information_circle","behaviour":"closable"}},{"name":"Standalone","style":{"width":"300px"},"props":{"variant":"standalone","headline":"Headline","icon":"information_circle","behaviour":"closable"}},{"name":"Overlay","style":{"width":"300px"},"props":{"variant":"overlay","headline":"Headline","icon":"information_circle","behaviour":"closable","timestamp":"10 min ago"}}]},{"name":"Semantic","examples":[{"name":"(Default) Adaptive","style":{"width":"300px"},"props":{"type":"alert","headline":"Headline","behaviour":"closable"}},{"name":"Neutral","style":{"width":"300px"},"props":{"type":"alert","semantic":"neutral","headline":"Headline","behaviour":"closable"}},{"name":"Critical","style":{"width":"300px"},"props":{"type":"alert","semantic":"critical","headline":"Headline","behaviour":"closable"}},{"name":"Informational","style":{"width":"300px"},"props":{"type":"alert","semantic":"informational","headline":"Headline","behaviour":"closable"}},{"name":"Successful","style":{"width":"300px"},"props":{"type":"alert","semantic":"successful","headline":"Headline","behaviour":"closable"}},{"name":"Warning","style":{"width":"300px"},"props":{"type":"alert","semantic":"warning","headline":"Headline","behaviour":"closable"}}]},{"name":"Behaviour","examples":[{"name":"(Default) Permanent","style":{"width":"300px"},"props":{"behaviour":"permanent"}},{"name":"Closeable","style":{"width":"300px"},"props":{"behaviour":"closable"}}]},{"name":"Content - Variant:Docked","codeFileName":"ContentVariantDocked","examples":[{"name":"Text","style":{"width":"300px"},"props":{"behaviour":"permanent"}},{"name":"Text & Icon","style":{"width":"300px"},"props":{"icon":"information_circle","behaviour":"permanent"}},{"name":"Text & Preview Image","style":{"width":"300px"},"props":{"img":true,"behaviour":"permanent"},"children":[{"name":"img","native":true,"slot":"image","content":"","props":{"src":"/assets/images/placeholder.jpg","alt":""}}]},{"name":"Text & Headline","style":{"width":"300px"},"props":{"headline":"Headline","behaviour":"permanent"}},{"name":"Text & Textlink Block","style":{"width":"300px"},"props":{"link":true,"behaviour":"permanent"},"children":[{"name":"link","slot":"link","content":"Textlink","props":{"href":"#"}}]},{"name":"Text & Textlink Inline","style":{"width":"300px"},"props":{"link":true,"linkVariant":"inline","behaviour":"permanent"},"children":[{"name":"link","slot":"link","content":"Textlink","props":{"href":"#"}}]},{"name":"Text & Headline & Textlink Inline & Cloaseable","style":{"width":"300px"},"props":{"headline":"Headline","link":true,"linkVariant":"inline"},"children":[{"name":"link","slot":"link","content":"Textlink","props":{"href":"#"}}]},{"name":"Text & Icon & Headline & Textlink Inline & Cloaseable","style":{"width":"300px"},"props":{"icon":"information_circle","headline":"Headline","link":true,"linkVariant":"inline"},"children":[{"name":"link","slot":"link","content":"Textlink","props":{"href":"#"}}]}]},{"name":"Content - Variant:Standalone","codeFileName":"ContentVariantStandalone","examples":[{"name":"Text","style":{"width":"300px"},"props":{"variant":"standalone","behaviour":"permanent"}},{"name":"Text & Icon","style":{"width":"300px"},"props":{"icon":"information_circle","variant":"standalone","behaviour":"permanent"}},{"name":"Text & Preview Image","style":{"width":"300px"},"props":{"img":true,"variant":"standalone","behaviour":"permanent"},"children":[{"name":"img","native":true,"slot":"image","content":"","props":{"src":"/assets/images/placeholder.jpg","alt":""}}]},{"name":"Text & Headline","style":{"width":"300px"},"props":{"headline":"Headline","variant":"standalone","behaviour":"permanent"}},{"name":"Text & Textlink Block","style":{"width":"300px"},"props":{"link":true,"variant":"standalone","behaviour":"permanent"},"children":[{"name":"link","slot":"link","content":"Textlink","props":{"href":"#"}}]},{"name":"Text & Textlink Inline","style":{"width":"300px"},"props":{"link":true,"linkVariant":"inline","variant":"standalone","behaviour":"permanent"},"children":[{"name":"link","slot":"link","content":"Textlink","props":{"href":"#"}}]},{"name":"Text & Headline & Textlink Inline & Cloaseable","style":{"width":"300px"},"props":{"headline":"Headline","link":true,"linkVariant":"inline","variant":"standalone"},"children":[{"name":"link","slot":"link","content":"Textlink","props":{"href":"#"}}]},{"name":"Text & Icon & Headline & Textlink Inline & Cloaseable","style":{"width":"300px"},"props":{"icon":"information_circle","headline":"Headline","link":true,"linkVariant":"inline","variant":"standalone"},"children":[{"name":"link","slot":"link","content":"Textlink","props":{"href":"#"}}]}]},{"name":"Content - Variant:Overlay","codeFileName":"ContentVariantOverlay","examples":[{"name":"Text","style":{"width":"300px"},"props":{"variant":"overlay","behaviour":"permanent"}},{"name":"Text & Icon","style":{"width":"300px"},"props":{"icon":"information_circle","variant":"overlay","behaviour":"permanent"}},{"name":"Text & Preview Image","style":{"width":"300px"},"props":{"img":true,"variant":"overlay","behaviour":"permanent"},"children":[{"name":"img","native":true,"slot":"image","content":"","props":{"src":"/assets/images/placeholder.jpg","alt":""}}]},{"name":"Text & Headline","style":{"width":"300px"},"props":{"headline":"Headline","variant":"overlay","behaviour":"permanent"}},{"name":"Text & Textlink Inline","style":{"width":"300px"},"props":{"link":true,"variant":"overlay","behaviour":"permanent"}},{"name":"Text & Headline & Textlink Inline & Cloaseable","style":{"width":"300px"},"props":{"headline":"Headline","link":true,"variant":"overlay"}},{"name":"Text & Icon & Headline & Textlink Inline & Cloaseable","style":{"width":"300px"},"props":{"icon":"information_circle","headline":"Headline","link":true,"variant":"overlay"}},{"name":"Text & Timed","style":{"width":"300px"},"props":{"timestamp":"10 min ago","variant":"overlay","behaviour":"permanent"}},{"name":"Text & Timed & Cloaseable","style":{"width":"300px"},"props":{"timestamp":"10 min ago","variant":"overlay"}},{"name":"Text & Headline & Timed & Cloaseable","style":{"width":"300px"},"props":{"headline":"Headline","timestamp":"10 min ago","variant":"overlay"}},{"name":"Text & Icon & Headline & Timed & Cloaseable","style":{"width":"300px"},"props":{"icon":"information_circle","headline":"Headline","timestamp":"10 min ago","variant":"overlay"}}]}]'),nW=a(34406);let nz=()=>{var n,e;return(null==nW?void 0:null===(n=nW.env)||void 0===n?void 0:"/mono/review/main")?"/mono/review/main":null===(e=window.env)||void 0===e?void 0:e.BASE_URL},nU=n=>{let{semantic:e,icon:a,headline:t,variant:i,children:o,behaviour:l,link:s,timestamp:r,linkVariant:c,img:d}=n;return(0,I.jsx)(nM.Z,{semantic:e,icon:a,headline:t,link:s?(0,I.jsx)(P.Z,{href:"#",children:"Textlink"}):void 0,image:d?(0,I.jsx)("img",{src:"".concat(nz(),"/assets/images/placeholder.jpg"),alt:"Placeholder"}):void 0,variant:i,behaviour:l,linkVariant:c,timestamp:r,onClose:()=>{alert(o.toString())},children:o})};var nq=a(82919),nJ=a(74819),nG=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]},{"name":"Emphasis","examples":[{"name":"(Default) Weak"},{"name":"Strong","props":{"emphasis":"strong"}}]},{"name":"Semantic","examples":[{"name":"(Default) Adaptive"},{"name":"Neutral","props":{"semantic":"neutral"}},{"name":"Critical","props":{"semantic":"critical"}},{"name":"Informational","props":{"semantic":"informational"}},{"name":"Successful","props":{"semantic":"successful"}},{"name":"Warning","props":{"semantic":"warning"}},{"name":"Adaptive Strong","props":{"emphasis":"strong"}},{"name":"Neutral Strong","props":{"semantic":"neutral","emphasis":"strong"}},{"name":"Critical Strong","props":{"semantic":"critical","emphasis":"strong"}},{"name":"Informational Strong","props":{"semantic":"informational","emphasis":"strong"}},{"name":"Successful Strong","props":{"semantic":"successful","emphasis":"strong"}},{"name":"Warning Strong","props":{"semantic":"warning","emphasis":"strong"}}]},{"name":"Size","examples":[{"name":"(Default) Small"},{"name":"Medium","props":{"size":"medium"}}]},{"name":"Content","examples":[{"name":"(Default) Text"},{"name":"(Default) Text - Medium","props":{"size":"medium"}},{"name":"Dot - Small","content":"","props":{"noContent":true}},{"name":"Dot - Medium","content":"","props":{"noContent":true,"size":"medium"}},{"name":"Icon - Small","props":{"example":"icon"}},{"name":"Icon - Medium","props":{"example":"icon","size":"medium"}}]},{"name":"Placement","examples":[{"name":"(Default) Inline","props":{"placement":"inline"}},{"name":"Corner - Top - Left","content":"","props":{"placement":"corner-top-left"}},{"name":"Corner - Center - Left","content":"","props":{"placement":"corner-center-left"}},{"name":"Corner - Bottom- Left","content":"","props":{"placement":"corner-bottom-left"}},{"name":"Corner - Top - Right","content":"","props":{"placement":"corner-top-right"}},{"name":"Corner - Center - Right","content":"","props":{"placement":"corner-center-right"}},{"name":"Corner - Bottom- Right","content":"","props":{"placement":"corner-bottom-right"}}]},{"name":"Examples","examples":[{"name":"Numbers","props":{"example":"number"}}]}]');let nY=n=>{let{children:e,semantic:a,emphasis:t,noContent:i,size:o,placement:l,example:s}=n;return(0,I.jsxs)(I.Fragment,{children:[!l&&!s&&(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(nq.Z,{semantic:a,emphasis:t,size:o,children:i?"":e}),i&&(0,I.jsx)(J.Z,{semantic:"informational",size:"small",icon:"none",children:e})]}),l&&"inline"!==l&&!s&&(0,I.jsxs)(I.Fragment,{children:[(0,I.jsxs)(C.Z,{icon:"user",variant:"outlined",noText:!0,children:[(0,I.jsx)(nq.Z,{size:"small",emphasis:"strong",semantic:"critical",placement:l}),e]}),(0,I.jsx)(J.Z,{semantic:"informational",size:"small",icon:"none",children:e})]}),"inline"===l&&(0,I.jsx)(I.Fragment,{children:(0,I.jsxs)("div",{className:"badge-inline-container",children:[(0,I.jsx)(nJ.Z,{icon:"user"}),(0,I.jsx)("span",{children:e}),(0,I.jsx)(nq.Z,{size:"small",emphasis:"strong",semantic:"critical",children:"Label"}),(0,I.jsx)(nJ.Z,{icon:"error"})]})}),"icon"===s&&(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(nq.Z,{semantic:"critical",emphasis:"strong",size:o,children:(0,I.jsx)(nJ.Z,{icon:"user",children:e})}),(0,I.jsx)(J.Z,{semantic:"informational",size:"small",icon:"none",children:e})]}),"number"===s&&(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(nq.Z,{semantic:"successful",children:"9"}),(0,I.jsx)(nq.Z,{semantic:"informational",children:"12"}),(0,I.jsx)(nq.Z,{semantic:"warning",children:"123"}),(0,I.jsx)(nq.Z,{size:"small",emphasis:"strong",semantic:"successful",children:"9"}),(0,I.jsx)(nq.Z,{size:"small",emphasis:"strong",semantic:"informational",children:"12"}),(0,I.jsx)(nq.Z,{size:"small",emphasis:"strong",semantic:"warning",children:"123"}),(0,I.jsx)(J.Z,{semantic:"informational",size:"small",icon:"none",children:e})]})]})};var n$=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]},{"name":"Elevation Level","examples":[{"name":"(Default) Level 1 - Adaptive","props":{"elevationLevel":"1"}},{"name":"Level 2 - Adaptive","props":{"elevationLevel":"2"}},{"name":"Level 3 - Adaptive","props":{"elevationLevel":"3"}}]},{"name":"Spacing","examples":[{"name":"(Default) Small","props":{"spacing":"small"}},{"name":"No Spacing","props":{"spacing":"none"}},{"name":"Medium","props":{"spacing":"medium"}}]},{"name":"Behaviour","examples":[{"name":"(Default) Non interactive"},{"name":"Interactive","props":{"behaviour":"interactive"}}]},{"name":"Example","examples":[{"name":"Level 1 - Interactive","props":{"elevationLevel":"1","behaviour":"interactive"}},{"name":"Level 2 - Interactive","props":{"elevationLevel":"2","behaviour":"interactive"}},{"name":"Level 3 - Interactive","props":{"elevationLevel":"3","behaviour":"interactive"}}]}]');let nK=n=>{let{behaviour:e,children:a,spacing:t,elevationLevel:i}=n;return(0,I.jsx)(H.Z,{behaviour:e,spacing:t,elevationLevel:i,children:(0,I.jsx)("strong",{children:a})})};var nQ=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","style":{"width":"200px"},"content":"","className":"db-density-functional"},{"name":"(Default) Regular","style":{"width":"200px"},"content":"","className":"db-density-regular"},{"name":"Expressive","style":{"width":"200px"},"content":"","className":"db-density-expressive"}]},{"name":"Variant","examples":[{"name":"(Default) Adaptive - Horizontal","style":{"width":"200px"},"content":""},{"name":"Adaptive - Vertical","style":{"height":"100px"},"content":"","props":{"variant":"vertical"}}]},{"name":"Emphasis","examples":[{"name":"(Default) Weak","style":{"width":"200px"},"content":""},{"name":"Strong","style":{"width":"200px"},"content":"","props":{"emphasis":"strong"}}]}]');let nX=n=>{let{variant:e,emphasis:a,children:t}=n;return(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(J.Z,{size:"small",semantic:"informational",children:t}),(0,I.jsx)(_.Z,{variant:e,emphasis:a})]})};var n0=a(37402),n1=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional","props":{"open":"open","onClose":"toggleDrawer(false)"}},{"name":"(Default) Regular","className":"db-density-regular","props":{"open":"open","onClose":"toggleDrawer(false)"}},{"name":"Expressive","className":"db-density-expressive","props":{"open":"open","onClose":"toggleDrawer(false)"}}]},{"name":"Size","examples":[{"name":"(Default) Medium","props":{"open":"open","onClose":"toggleDrawer(false)"}},{"name":"Full","props":{"width":"full","open":"open","onClose":"toggleDrawer(false)"}}]},{"name":"Rounded","examples":[{"name":"(Default) No rounding","props":{"open":"open","onClose":"toggleDrawer(false)"}},{"name":"Rounded","props":{"rounded":true,"open":"open","onClose":"toggleDrawer(false)"}}]},{"name":"Spacing","examples":[{"name":"(Default) Medium","props":{"open":"open","onClose":"toggleDrawer(false)"}},{"name":"Small","props":{"spacing":"small","open":"open","onClose":"toggleDrawer(false)"}},{"name":"Large","props":{"spacing":"large","open":"open","onClose":"toggleDrawer(false)"}},{"name":"No spacing","props":{"spacing":"none","open":"open","onClose":"toggleDrawer(false)"}}]},{"name":"Backdrop","examples":[{"name":"(Default) With Backdrop","props":{"open":"open","onClose":"toggleDrawer(false)"}},{"name":"Backdrop-weak","props":{"backdrop":"weak","open":"open","onClose":"toggleDrawer(false)"}},{"name":"Invisible","props":{"backdrop":"invisible","open":"open","onClose":"toggleDrawer(false)"}},{"name":"No Backdrop","props":{"backdrop":"none","open":"open","onClose":"toggleDrawer(false)"}}]},{"name":"Directions","examples":[{"name":"(Default) Right","props":{"open":"open","onClose":"toggleDrawer(false)"}},{"name":"Left","props":{"direction":"left","open":"open","onClose":"toggleDrawer(false)"}},{"name":"Up","props":{"direction":"up","open":"open","onClose":"toggleDrawer(false)"}},{"name":"Down","props":{"direction":"down","open":"open","onClose":"toggleDrawer(false)"}}]}]');let n2=n=>{let{id:e,width:a,rounded:t,spacing:i,openDrawer:o,setOpenDrawer:l,direction:s,children:r,backdrop:c}=n;return(0,I.jsxs)("div",{children:[(0,I.jsx)(n0.Z,{rounded:t,width:a,spacing:i,backdrop:c,direction:s,open:o===e,onClose:()=>{l(void 0)},children:r}),(0,I.jsxs)(C.Z,{onClick:()=>{l(e)},children:["Open: ",r]})]})};var n3=a(82664),n4=a(33759),n7=a(39120),n5=JSON.parse('[{"name":"Tonality","children":[{"name":"brand","slot":"brand","content":"DBHeader"},{"name":"link","slot":"meta-navigation","angularDirective":true,"content":"Imprint","props":{"href":"#"}},{"name":"button","slot":"primary-action","content":"Search","props":{"icon":"magnifying_glass","variant":"ghost","noText":true}},{"name":"button","slot":"secondary-action","angularDirective":true,"content":"Profile","props":{"icon":"user","variant":"ghost","noText":true}},{"name":"navigation","slot":"Navigation","angularDirective":true,"children":[{"name":"navigation-item","props":{"icon":"user"},"children":[{"name":"a","native":true,"slot":"NavigationContent","angularDirective":true,"content":"Link","props":{"href":"#"}}]},{"name":"navigation-item","props":{"icon":"user","disabled":true},"children":[{"name":"a","native":true,"slot":"NavigationContent","angularDirective":true,"content":"Link disabled","props":{"href":"#"}}]}]}],"examples":[{"name":"Functional","className":"db-density-functional","style":{"width":"100%","display":"block"}},{"name":"(Default) Regular","className":"db-density-regular","style":{"width":"100%","display":"block"}},{"name":"Expressive","className":"db-density-expressive","style":{"width":"100%","display":"block"}}]},{"name":"Width","children":[{"name":"brand","slot":"brand","content":"DBHeader"},{"name":"link","slot":"meta-navigation","angularDirective":true,"content":"Imprint","props":{"href":"#"}},{"name":"button","slot":"primary-action","content":"Search","props":{"icon":"magnifying_glass","variant":"ghost","noText":true}},{"name":"button","slot":"secondary-action","angularDirective":true,"content":"Profile","props":{"icon":"user","variant":"ghost","noText":true}},{"name":"navigation","slot":"Navigation","angularDirective":true,"children":[{"name":"navigation-item","props":{"icon":"user"},"children":[{"name":"a","native":true,"slot":"NavigationContent","angularDirective":true,"content":"Link","props":{"href":"#"}}]},{"name":"navigation-item","props":{"icon":"user","disabled":true},"children":[{"name":"a","native":true,"slot":"NavigationContent","angularDirective":true,"content":"Link disabled","props":{"href":"#"}}]}]}],"examples":[{"name":"Full","style":{"width":"100%","display":"block"}},{"name":"Medium","style":{"width":"100%","display":"block"},"props":{"width":"medium"}},{"name":"Large","style":{"width":"100%","display":"block"},"props":{"width":"large"}}]},{"name":"Behaviour","children":[{"name":"brand","slot":"brand","content":"DBHeader"},{"name":"link","slot":"meta-navigation","angularDirective":true,"content":"Imprint","props":{"href":"#"}},{"name":"button","slot":"primary-action","content":"Search","props":{"icon":"magnifying_glass","variant":"ghost","noText":true}},{"name":"button","slot":"secondary-action","angularDirective":true,"content":"Profile","props":{"icon":"user","variant":"ghost","noText":true}},{"name":"navigation","slot":"Navigation","angularDirective":true,"children":[{"name":"navigation-item","props":{"icon":"user"},"children":[{"name":"a","native":true,"slot":"NavigationContent","angularDirective":true,"content":"Link","props":{"href":"#"}}]},{"name":"navigation-item","props":{"icon":"user","disabled":true},"children":[{"name":"a","native":true,"slot":"NavigationContent","angularDirective":true,"content":"Link disabled","props":{"href":"#"}}]}]}],"examples":[{"name":"Desktop (full width)","style":{"width":"100%","display":"block"}},{"name":"Mobile","style":{"width":"100%","display":"block"},"props":{"forceMobile":"true"}}]},{"name":"Examples","children":[{"name":"brand","slot":"brand","content":"DBHeader"},{"name":"link","slot":"meta-navigation","angularDirective":true,"content":"Imprint","props":{"href":"#"}},{"name":"button","slot":"primary-action","content":"Search","props":{"icon":"magnifying_glass","variant":"ghost","noText":true}},{"name":"button","slot":"secondary-action","angularDirective":true,"content":"Profile","props":{"icon":"user","variant":"ghost","noText":true}},{"name":"navigation","slot":"Navigation","angularDirective":true,"children":[{"name":"navigation-item","props":{"icon":"user"},"children":[{"name":"a","native":true,"slot":"NavigationContent","angularDirective":true,"content":"Link","props":{"href":"#"}}]},{"name":"navigation-item","props":{"icon":"user","disabled":true},"children":[{"name":"a","native":true,"slot":"NavigationContent","angularDirective":true,"content":"Link disabled","props":{"href":"#"}}]}]}],"examples":[{"name":"With Application Name + Navigation","style":{"width":"100%","display":"block"},"props":{"example":true,"withName":true,"withNavigation":true}},{"name":"Without Navigation","style":{"width":"100%","display":"block"},"props":{"example":true,"withName":true,"withNavigation":false}},{"name":"Without Application Name","style":{"width":"100%","display":"block"},"props":{"example":true,"withName":false,"withNavigation":true}},{"name":"Without Application Name + Navigation","style":{"width":"100%","display":"block"},"props":{"example":true,"withName":false,"withNavigation":false}}]}]');let n6=n=>{let{drawerOpen:e,forceMobile:a,burgerMenuLabel:t,children:i,className:o,describedbyid:l,id:s,key:r,onToggle:c,width:d,example:b,withNavigation:u,withName:h}=n;return(0,I.jsx)(n3.Z,{width:d,brand:(0,I.jsx)(ne.Z,{title:"DBHeader",children:(!b||h)&&"DBHeader"}),metaNavigation:!b&&(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(P.Z,{href:"#",children:"Imprint"}),(0,I.jsx)(P.Z,{href:"#",children:"Help"})]}),primaryAction:!b&&(0,I.jsx)(C.Z,{icon:"magnifying_glass",variant:"ghost",noText:!0,children:"Search"}),secondaryAction:!b&&(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(C.Z,{icon:"user",variant:"ghost",noText:!0,children:"Profile"}),(0,I.jsx)(C.Z,{icon:"bell",variant:"ghost",noText:!0,children:"Notification"}),(0,I.jsx)(C.Z,{icon:"question_mark_circle",variant:"ghost",noText:!0,children:"Help"})]}),drawerOpen:e,forceMobile:a,burgerMenuLabel:t,className:o,describedbyid:l,id:s,onToggle:c,children:(!b||u)&&(0,I.jsxs)(n4.Z,{"aria-label":i,children:[(0,I.jsx)(n7.Z,{icon:"user",children:(0,I.jsx)("a",{href:"#",children:i})}),(0,I.jsx)(n7.Z,{disabled:!0,children:(0,I.jsxs)("a",{href:"#",children:[i," disabled"]})})]})},r)};var n8=a(55327),n9=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]},{"name":"Width","examples":[{"name":"(Default) Full","style":{"width":"100%","display":"block"}},{"name":"Medium","style":{"width":"100%","display":"block"},"props":{"width":"medium"}},{"name":"Large","style":{"width":"100%","display":"block"},"props":{"width":"large"}}]},{"name":"Spacing","examples":[{"name":"(Default) Medium"},{"name":"Large","props":{"spacing":"large"}},{"name":"Small","props":{"spacing":"small"}}]}]');let en=n=>{let{width:e,spacing:a,children:t}=n;return(0,I.jsx)(n8.Z,{className:"db-informational-bg-basic-level-2",spacing:a,width:e,children:t})};var ee=JSON.parse('[{"name":"Density","children":[{"name":"navigation-item","content":"Navi-Item 1","props":{"active":true},"children":[{"name":"navigation-item","content":"Sub-Navi-Item 1","slot":"sub-navigation","props":{"active":true},"children":[{"name":"navigation-item","content":"Sub-Sub-Navi-Item 1","slot":"sub-navigation","props":{"active":true}}]}]},{"name":"navigation-item","content":"Navi-Item 2"}],"examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]}]');let ea=n=>{let{children:e}=n,a="".concat(e.replaceAll(/\W/g,"_").toLowerCase());return(0,I.jsxs)("div",{children:[(0,I.jsx)(J.Z,{id:a,size:"small",semantic:"informational",icon:"none",children:e}),(0,I.jsxs)(n4.Z,{labelledBy:a,children:[(0,I.jsx)(n7.Z,{active:!0,subNavigation:(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(n7.Z,{active:!0,subNavigation:(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(n7.Z,{active:!0,children:(0,I.jsx)("a",{href:"#",children:"Sub-Sub-Navi-Item 1"})}),(0,I.jsx)(n7.Z,{children:(0,I.jsx)("a",{href:"#",children:"Sub-Sub-Navi-Item 2"})})]}),children:"Sub-Navi-Item 1"}),(0,I.jsx)(n7.Z,{children:(0,I.jsx)("a",{href:"#",children:"Sub-Navi-Item 2"})})]}),children:"Navi-Item 1"}),(0,I.jsx)(n7.Z,{icon:"user",children:(0,I.jsx)("a",{href:"#",children:"Navi-Item 2"})}),(0,I.jsx)(n7.Z,{disabled:!0,children:(0,I.jsx)("a",{href:"#",children:"Navi-Item 3"})})]})]})};var et=JSON.parse('[{"name":"Density","examples":[{"name":"Functional","className":"db-density-functional"},{"name":"(Default) Regular","className":"db-density-regular"},{"name":"Expressive","className":"db-density-expressive"}]},{"name":"Interaction-States","examples":[{"name":"Enabled (Default)/Hover/Pressed"},{"name":"Active","props":{"active":true}},{"name":"Disabled","props":{"disabled":true}}]},{"name":"Content","examples":[{"name":"(Default) Text","props":{"areaPopup":false}},{"name":"Text - Icon (Leading)","props":{"icon":"user"}},{"name":"Text - Icons (Leading, Chevron)","props":{"icon":"user","areaPopup":true}},{"name":"Text - Icon (Chevron)","props":{"areaPopup":true}}]},{"name":"Width","examples":[{"name":"(Default) Auto","style":{"width":"400px"}},{"name":"Full","style":{"width":"400px"},"props":{"width":"full"}}]}]');let ei=n=>{let{children:e,icon:a,disabled:t,active:i,width:o,areaPopup:l}=n;return(0,I.jsx)("ul",{children:(0,I.jsx)(n7.Z,{icon:a,disabled:t,active:i,width:o,onClick:()=>{alert(e.toString())},subNavigation:l&&(0,I.jsxs)("ul",{children:[(0,I.jsx)(n7.Z,{children:(0,I.jsx)("a",{href:"#",children:"Test1"})}),(0,I.jsx)(n7.Z,{children:(0,I.jsx)("a",{href:"#",children:"Test2"})})]}),children:l?e:(0,I.jsx)("a",{href:"#",children:e})})})};var eo=n=>(0,I.jsx)(M,{title:"DBNavigationItem",isSubComponent:n.isSubComponent,componentName:n.componentName,variants:W(et,ei,n.slotCode)}),el=a(60029),es=JSON.parse('[{"name":"Density","children":[{"name":"button","slot":"trigger"},{"name":"button","content":"Inside Popover"}],"examples":[{"name":"Functional","className":"db-density-functional","props":{"id":"popover-01"}},{"name":"(Default) Regular","className":"db-density-regular","props":{"id":"popover-02"}},{"name":"Expressive","className":"db-density-expressive","props":{"id":"popover-03"}}]},{"name":"Spacing","children":[{"name":"button","slot":"trigger"},{"name":"button","content":"Inside Popover"}],"examples":[{"name":"(Default) Small","props":{"spacing":"small","id":"popover-04"}},{"name":"Medium","props":{"spacing":"medium","id":"popover-05"}},{"name":"None","props":{"spacing":"none","id":"popover-06"}}]},{"name":"Placement","children":[{"name":"button","slot":"trigger"},{"name":"button","content":"Inside Popover"}],"examples":[{"name":"bottom-start","props":{"placement":"bottom-start","id":"popover-07-start"}},{"name":"(Default) bottom","props":{"placement":"bottom","id":"popover-07"}},{"name":"bottom-end","props":{"placement":"bottom-end","id":"popover-07-end"}},{"name":"left-start","props":{"placement":"left-start","id":"popover-09-start"}},{"name":"left","props":{"placement":"left","id":"popover-09"}},{"name":"left-end","props":{"placement":"left-end","id":"popover-09-end"}},{"name":"right-start","props":{"placement":"right-start","id":"popover-10-start"}},{"name":"right","props":{"placement":"right","id":"popover-10"}},{"name":"right-end","props":{"placement":"right-end","id":"popover-10-end"}},{"name":"top-start","props":{"placement":"top-start","id":"popover-08-start"}},{"name":"top","props":{"placement":"top","id":"popover-08"}},{"name":"top-end","props":{"placement":"top-end","id":"popover-08-end"}}]},{"name":"Gap","children":[{"name":"button","slot":"trigger"},{"name":"button","content":"Inside Popover"}],"examples":[{"name":"(Default) No gap","props":{"id":"popover-11"}},{"name":"With gap","props":{"gap":true,"id":"popover-12"}}]},{"name":"Animations","children":[{"name":"button","slot":"trigger"},{"name":"button","content":"Inside Popover"}],"examples":[{"name":"(Default) Animation no delay","props":{"id":"popover-13"}},{"name":"Delay slow","props":{"delay":"slow","id":"popover-14"}},{"name":"Delay fast","props":{"delay":"fast","id":"popover-15"}},{"name":"No animation","props":{"animation":"disabled","id":"popover-16"}}]},{"name":"Width","children":[{"name":"button","slot":"trigger"},{"name":"button","content":"Inside Popover"}],"examples":[{"name":"(Default) Auto","props":{"content":"Max width, lorem ipsum dolor sit amet, consetetur sadipscing","id":"popover-17"}},{"name":"Fixed","props":{"content":"Max width, lorem ipsum dolor sit amet, consetetur sadipscing","width":"fixed","id":"popover-18"}}]}]');let er=n=>{let{id:e,children:a,width:t,gap:i,spacing:o,placement:l,delay:s,content:r,animation:c}=n;return(0,I.jsx)(el.Z,{trigger:(0,I.jsx)(C.Z,{children:a}),width:t,gap:i,spacing:o,placement:l,animation:c,delay:s,id:e,children:null!=r?r:(0,I.jsxs)(I.Fragment,{children:[(0,I.jsxs)("ul",{className:"popover-list",children:[(0,I.jsx)("li",{children:"Popover Custom Item 1"}),(0,I.jsx)("li",{children:"Popover Custom Item 2"})]}),(0,I.jsx)(C.Z,{children:"Popover Custom Item 3"})]})})};var ec=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Functional '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Functional '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Functional '),navigator.clipboard.writeText(' Functional ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Functional'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Functional'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Functional'),navigator.clipboard.writeText('Functional')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFunctional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFunctional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFunctional\n'),navigator.clipboard.writeText('\nFunctional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Regular '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Regular '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Regular '),navigator.clipboard.writeText(' (Default) Regular ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Regular'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Regular'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Regular'),navigator.clipboard.writeText('(Default) Regular')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Regular\n'),navigator.clipboard.writeText('\n(Default) Regular\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Expressive '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Expressive '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Expressive '),navigator.clipboard.writeText(' Expressive ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Expressive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Expressive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Expressive'),navigator.clipboard.writeText('Expressive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nExpressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nExpressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nExpressive\n'),navigator.clipboard.writeText('\nExpressive\n')},children:"Copy code"})]})]})})]})},ed=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Outlined - Adaptive "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Outlined - Adaptive "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Outlined - Adaptive "),navigator.clipboard.writeText(" (Default) Outlined - Adaptive ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Outlined - Adaptive"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Outlined - Adaptive"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Outlined - Adaptive"),navigator.clipboard.writeText("(Default) Outlined - Adaptive")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Outlined - Adaptive\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Outlined - Adaptive\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Outlined - Adaptive\n"),navigator.clipboard.writeText("\n(Default) Outlined - Adaptive\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Filled - Adaptive '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Filled - Adaptive '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Filled - Adaptive '),navigator.clipboard.writeText(' Filled - Adaptive ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Filled - Adaptive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Filled - Adaptive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Filled - Adaptive'),navigator.clipboard.writeText('Filled - Adaptive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFilled - Adaptive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFilled - Adaptive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFilled - Adaptive\n'),navigator.clipboard.writeText('\nFilled - Adaptive\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Ghost - Adaptive '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Ghost - Adaptive '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Ghost - Adaptive '),navigator.clipboard.writeText(' Ghost - Adaptive ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Ghost - Adaptive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Ghost - Adaptive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Ghost - Adaptive'),navigator.clipboard.writeText('Ghost - Adaptive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nGhost - Adaptive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nGhost - Adaptive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nGhost - Adaptive\n'),navigator.clipboard.writeText('\nGhost - Adaptive\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Brand '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Brand '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Brand '),navigator.clipboard.writeText(' Brand ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Brand'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Brand'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Brand'),navigator.clipboard.writeText('Brand')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nBrand\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nBrand\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nBrand\n'),navigator.clipboard.writeText('\nBrand\n')},children:"Copy code"})]})]})})]})},eb=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Enabled "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Enabled "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Enabled "),navigator.clipboard.writeText(" (Default) Enabled ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Enabled"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Enabled"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Enabled"),navigator.clipboard.writeText("(Default) Enabled")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Enabled\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Enabled\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Enabled\n"),navigator.clipboard.writeText("\n(Default) Enabled\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Disabled '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Disabled '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Disabled '),navigator.clipboard.writeText(' Disabled ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"Disabled"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"Disabled"===n?"check":"copy",variant:"ghost",onClick:()=>{e("Disabled"),navigator.clipboard.writeText("Disabled")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDisabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDisabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDisabled\n'),navigator.clipboard.writeText('\nDisabled\n')},children:"Copy code"})]})]})})]})},eu=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Medium "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Medium "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Medium "),navigator.clipboard.writeText(" (Default) Medium ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Medium"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Medium"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Medium"),navigator.clipboard.writeText("(Default) Medium")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Medium\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Medium\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Medium\n"),navigator.clipboard.writeText("\n(Default) Medium\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Small '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Small '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Small '),navigator.clipboard.writeText(' Small ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Small'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Small'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Small'),navigator.clipboard.writeText('Small')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nSmall\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nSmall\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nSmall\n'),navigator.clipboard.writeText('\nSmall\n')},children:"Copy code"})]})]})})]})},eh=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Text "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Text "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Text "),navigator.clipboard.writeText(" (Default) Text ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Text"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Text"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Text"),navigator.clipboard.writeText("(Default) Text")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Text\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Text\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Text\n"),navigator.clipboard.writeText("\n(Default) Text\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Icon & Text '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Icon & Text '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Icon & Text '),navigator.clipboard.writeText(' Icon & Text ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Icon & Text'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Icon & Text'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Icon & Text'),navigator.clipboard.writeText('Icon & Text')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nIcon & Text\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nIcon & Text\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nIcon & Text\n'),navigator.clipboard.writeText('\nIcon & Text\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Icon '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Icon '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Icon '),navigator.clipboard.writeText(' Icon ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Icon\n'),navigator.clipboard.writeText('\n Icon\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nIcon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nIcon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nIcon\n'),navigator.clipboard.writeText('\nIcon\n')},children:"Copy code"})]})]})})]})},ep=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Auto Width "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Auto Width "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Auto Width "),navigator.clipboard.writeText(" (Default) Auto Width ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Auto Width"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Auto Width"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Auto Width"),navigator.clipboard.writeText("(Default) Auto Width")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Auto Width\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Auto Width\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Auto Width\n"),navigator.clipboard.writeText("\n(Default) Auto Width\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Width full '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Width full '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Width full '),navigator.clipboard.writeText(' Width full ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Width full'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Width full'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Width full'),navigator.clipboard.writeText('Width full')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nWidth full\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nWidth full\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nWidth full\n'),navigator.clipboard.writeText('\nWidth full\n')},children:"Copy code"})]})]})})]})},ex=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Functional '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Functional '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Functional '),navigator.clipboard.writeText(' Functional ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Functional'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Functional'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Functional'),navigator.clipboard.writeText('Functional')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Functional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Functional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Functional\n'),navigator.clipboard.writeText('\n Functional\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFunctional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFunctional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFunctional\n'),navigator.clipboard.writeText('\nFunctional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Regular '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Regular '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Regular '),navigator.clipboard.writeText(' (Default) Regular ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'(Default) Regular'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Regular'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Regular'),navigator.clipboard.writeText('(Default) Regular')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n (Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Regular\n'),navigator.clipboard.writeText('\n (Default) Regular\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Regular\n'),navigator.clipboard.writeText('\n(Default) Regular\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Expressive '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Expressive '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Expressive '),navigator.clipboard.writeText(' Expressive ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Expressive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Expressive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Expressive'),navigator.clipboard.writeText('Expressive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Expressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Expressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Expressive\n'),navigator.clipboard.writeText('\n Expressive\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nExpressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nExpressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nExpressive\n'),navigator.clipboard.writeText('\nExpressive\n')},children:"Copy code"})]})]})})]})},eg=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Adaptive '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Adaptive '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Adaptive '),navigator.clipboard.writeText(' (Default) Adaptive ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'(Default) Adaptive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Adaptive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Adaptive'),navigator.clipboard.writeText('(Default) Adaptive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Adaptive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Adaptive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Adaptive'),navigator.clipboard.writeText('(Default) Adaptive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Adaptive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Adaptive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Adaptive\n'),navigator.clipboard.writeText('\n(Default) Adaptive\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Brand '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Brand '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Brand '),navigator.clipboard.writeText(' Brand ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Brand'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Brand'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Brand'),navigator.clipboard.writeText('Brand')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Brand\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Brand\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Brand\n'),navigator.clipboard.writeText('\n Brand\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nBrand\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nBrand\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nBrand\n'),navigator.clipboard.writeText('\nBrand\n')},children:"Copy code"})]})]})})]})},em=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Enabled (Default)/Hover/Pressed '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Enabled (Default)/Hover/Pressed '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Enabled (Default)/Hover/Pressed '),navigator.clipboard.writeText(' Enabled (Default)/Hover/Pressed ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Enabled (Default)/Hover/Pressed'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Enabled (Default)/Hover/Pressed'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Enabled (Default)/Hover/Pressed'),navigator.clipboard.writeText('Enabled (Default)/Hover/Pressed')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nEnabled (Default)/Hover/Pressed\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nEnabled (Default)/Hover/Pressed\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nEnabled (Default)/Hover/Pressed\n'),navigator.clipboard.writeText('\nEnabled (Default)/Hover/Pressed\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Disabled '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Disabled '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Disabled '),navigator.clipboard.writeText(' Disabled ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Disabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Disabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Disabled\n'),navigator.clipboard.writeText('\n Disabled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDisabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDisabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDisabled\n'),navigator.clipboard.writeText('\nDisabled\n')},children:"Copy code"})]})]})})]})},ev=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Medium '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Medium '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Medium '),navigator.clipboard.writeText(' (Default) Medium ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'(Default) Medium'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Medium'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Medium'),navigator.clipboard.writeText('(Default) Medium')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Medium'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Medium'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Medium'),navigator.clipboard.writeText('(Default) Medium')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Medium\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Medium\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Medium\n'),navigator.clipboard.writeText('\n(Default) Medium\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Small '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Small '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Small '),navigator.clipboard.writeText(' Small ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Small'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Small'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Small'),navigator.clipboard.writeText('Small')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Small\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Small\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Small\n'),navigator.clipboard.writeText('\n Small\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nSmall\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nSmall\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nSmall\n'),navigator.clipboard.writeText('\nSmall\n')},children:"Copy code"})]})]})})]})},eD=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Internal '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Internal '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Internal '),navigator.clipboard.writeText(' (Default) Internal ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'(Default) Internal'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Internal'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Internal'),navigator.clipboard.writeText('(Default) Internal')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Internal'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Internal'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Internal'),navigator.clipboard.writeText('(Default) Internal')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Internal\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Internal\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Internal\n'),navigator.clipboard.writeText('\n(Default) Internal\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' External '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' External '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' External '),navigator.clipboard.writeText(' External ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'External'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'External'===n?"check":"copy",variant:"ghost",onClick:()=>{e('External'),navigator.clipboard.writeText('External')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n External\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n External\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n External\n'),navigator.clipboard.writeText('\n External\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nExternal\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nExternal\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nExternal\n'),navigator.clipboard.writeText('\nExternal\n')},children:"Copy code"})]})]})})]})},eB=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Content 1 \n Content 2 \n Content 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1 \n Content 2 \n Content 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1 \n Content 2 \n Content 3 \n'),navigator.clipboard.writeText('\n Content 1 \n Content 2 \n Content 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'),navigator.clipboard.writeText('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Content 1\n Content 2\n Content 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1\n Content 2\n Content 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1\n Content 2\n Content 3\n'),navigator.clipboard.writeText('\n Content 1\n Content 2\n Content 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'),navigator.clipboard.writeText('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Content 1 \n Content 2 \n Content 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1 \n Content 2 \n Content 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1 \n Content 2 \n Content 3 \n'),navigator.clipboard.writeText('\n Content 1 \n Content 2 \n Content 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'),navigator.clipboard.writeText('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Content 1\n Content 2\n Content 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1\n Content 2\n Content 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1\n Content 2\n Content 3\n'),navigator.clipboard.writeText('\n Content 1\n Content 2\n Content 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'),navigator.clipboard.writeText('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Content 1 \n Content 2 \n Content 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1 \n Content 2 \n Content 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1 \n Content 2 \n Content 3 \n'),navigator.clipboard.writeText('\n Content 1 \n Content 2 \n Content 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'),navigator.clipboard.writeText('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Content 1\n Content 2\n Content 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1\n Content 2\n Content 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1\n Content 2\n Content 3\n'),navigator.clipboard.writeText('\n Content 1\n Content 2\n Content 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'),navigator.clipboard.writeText('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n')},children:"Copy code"})]})]})})]})},ej=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Content 1 \n Content 2 \n Content 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1 \n Content 2 \n Content 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1 \n Content 2 \n Content 3 \n'),navigator.clipboard.writeText('\n Content 1 \n Content 2 \n Content 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'),navigator.clipboard.writeText('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Content 1\n Content 2\n Content 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1\n Content 2\n Content 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1\n Content 2\n Content 3\n'),navigator.clipboard.writeText('\n Content 1\n Content 2\n Content 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'),navigator.clipboard.writeText('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Content 1 \n Content 2 \n Content 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1 \n Content 2 \n Content 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1 \n Content 2 \n Content 3 \n'),navigator.clipboard.writeText('\n Content 1 \n Content 2 \n Content 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'),navigator.clipboard.writeText('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Content 1\n Content 2\n Content 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1\n Content 2\n Content 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1\n Content 2\n Content 3\n'),navigator.clipboard.writeText('\n Content 1\n Content 2\n Content 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'),navigator.clipboard.writeText('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n')},children:"Copy code"})]})]})})]})},eT=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Content 1 \n Content 2 \n Content 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1 \n Content 2 \n Content 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1 \n Content 2 \n Content 3 \n'),navigator.clipboard.writeText('\n Content 1 \n Content 2 \n Content 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'),navigator.clipboard.writeText('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Content 1\n Content 2\n Content 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1\n Content 2\n Content 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1\n Content 2\n Content 3\n'),navigator.clipboard.writeText('\n Content 1\n Content 2\n Content 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'),navigator.clipboard.writeText('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Content 1 \n Content 2 \n Content 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1 \n Content 2 \n Content 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1 \n Content 2 \n Content 3 \n'),navigator.clipboard.writeText('\n Content 1 \n Content 2 \n Content 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
'),navigator.clipboard.writeText('
\n
\n Item 1\n
Content 1
\n
\n
\n Item 2\n
Content 2
\n
\n
\n Item 3\n
Content 3
\n
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Content 1\n Content 2\n Content 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Content 1\n Content 2\n Content 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Content 1\n Content 2\n Content 3\n'),navigator.clipboard.writeText('\n Content 1\n Content 2\n Content 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n'),navigator.clipboard.writeText('\n \nContent 1\n\n\nContent 2\n\n\nContent 3\n\n')},children:"Copy code"})]})]})})]})},ef=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Functional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Functional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Functional\n'),navigator.clipboard.writeText('\n Functional\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Functional\n
Functional
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Functional\n
Functional
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Functional\n
Functional
\n'),navigator.clipboard.writeText('\n Functional\n
Functional
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Functional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Functional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Functional\n'),navigator.clipboard.writeText('\n Functional\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFunctional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFunctional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFunctional\n'),navigator.clipboard.writeText('\nFunctional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n (Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Regular\n'),navigator.clipboard.writeText('\n (Default) Regular\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n (Default) Regular\n
(Default) Regular
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n (Default) Regular\n
(Default) Regular
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n (Default) Regular\n
(Default) Regular
\n
'),navigator.clipboard.writeText('
\n (Default) Regular\n
(Default) Regular
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n (Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Regular\n'),navigator.clipboard.writeText('\n (Default) Regular\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Regular\n'),navigator.clipboard.writeText('\n(Default) Regular\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Expressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Expressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Expressive\n'),navigator.clipboard.writeText('\n Expressive\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Expressive\n
Expressive
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Expressive\n
Expressive
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Expressive\n
Expressive
\n'),navigator.clipboard.writeText('\n Expressive\n
Expressive
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Expressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Expressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Expressive\n'),navigator.clipboard.writeText('\n Expressive\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nExpressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nExpressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nExpressive\n'),navigator.clipboard.writeText('\nExpressive\n')},children:"Copy code"})]})]})})]})},ey=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Enabled (Default)/Hover/Pressed\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Enabled (Default)/Hover/Pressed\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Enabled (Default)/Hover/Pressed\n'),navigator.clipboard.writeText('\n Enabled (Default)/Hover/Pressed\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Enabled (Default)/Hover/Pressed\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Enabled (Default)/Hover/Pressed\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Enabled (Default)/Hover/Pressed\n'),navigator.clipboard.writeText('\n Enabled (Default)/Hover/Pressed\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nEnabled (Default)/Hover/Pressed\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nEnabled (Default)/Hover/Pressed\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nEnabled (Default)/Hover/Pressed\n'),navigator.clipboard.writeText('\nEnabled (Default)/Hover/Pressed\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Disabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Disabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Disabled\n'),navigator.clipboard.writeText('\n Disabled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Disabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Disabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Disabled\n'),navigator.clipboard.writeText('\n Disabled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDisabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDisabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDisabled\n'),navigator.clipboard.writeText('\nDisabled\n')},children:"Copy code"})]})]})})]})},ek=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n (Default) Collapsed\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Collapsed\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Collapsed\n'),navigator.clipboard.writeText('\n (Default) Collapsed\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n (Default) Collapsed\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Collapsed\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Collapsed\n'),navigator.clipboard.writeText('\n (Default) Collapsed\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Collapsed\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Collapsed\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Collapsed\n'),navigator.clipboard.writeText('\n(Default) Collapsed\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Open '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Open '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Open '),navigator.clipboard.writeText(' Open ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Open\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Open\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Open\n'),navigator.clipboard.writeText('\n Open\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nOpen\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nOpen\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nOpen\n'),navigator.clipboard.writeText('\nOpen\n')},children:"Copy code"})]})]})})]})},ew=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Functional '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Functional '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Functional '),navigator.clipboard.writeText(' Functional ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Functional
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Functional
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Functional
'),navigator.clipboard.writeText('
Functional
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Functional'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Functional'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Functional'),navigator.clipboard.writeText('Functional')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFunctional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFunctional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFunctional\n'),navigator.clipboard.writeText('\nFunctional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Regular '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Regular '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Regular '),navigator.clipboard.writeText(' (Default) Regular ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
(Default) Regular
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
(Default) Regular
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
(Default) Regular
'),navigator.clipboard.writeText('
(Default) Regular
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Regular'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Regular'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Regular'),navigator.clipboard.writeText('(Default) Regular')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Regular\n'),navigator.clipboard.writeText('\n(Default) Regular\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Expressive '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Expressive '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Expressive '),navigator.clipboard.writeText(' Expressive ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Expressive
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Expressive
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Expressive
'),navigator.clipboard.writeText('
Expressive
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Expressive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Expressive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Expressive'),navigator.clipboard.writeText('Expressive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nExpressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nExpressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nExpressive\n'),navigator.clipboard.writeText('\nExpressive\n')},children:"Copy code"})]})]})})]})},eZ=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) With Logo "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) With Logo "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) With Logo "),navigator.clipboard.writeText(" (Default) With Logo ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
(Default) With Logo
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
(Default) With Logo
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
(Default) With Logo
'),navigator.clipboard.writeText('
(Default) With Logo
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) With Logo"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) With Logo"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) With Logo"),navigator.clipboard.writeText("(Default) With Logo")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) With Logo\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) With Logo\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) With Logo\n"),navigator.clipboard.writeText("\n(Default) With Logo\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' No Logo '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' No Logo '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' No Logo '),navigator.clipboard.writeText(' No Logo ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
No Logo
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
No Logo
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
No Logo
'),navigator.clipboard.writeText('
No Logo
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"No Logo"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"No Logo"===n?"check":"copy",variant:"ghost",onClick:()=>{e("No Logo"),navigator.clipboard.writeText("No Logo")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nNo Logo\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nNo Logo\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nNo Logo\n'),navigator.clipboard.writeText('\nNo Logo\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Custom Logo '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Custom Logo '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Custom Logo '),navigator.clipboard.writeText(' Custom Logo ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Custom Logo
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Custom Logo
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Custom Logo
'),navigator.clipboard.writeText('
Custom Logo
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n Custom Logo\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n Custom Logo\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n Custom Logo\n"),navigator.clipboard.writeText("\n Custom Logo\n")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nCustom Logo\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nCustom Logo\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nCustom Logo\n'),navigator.clipboard.writeText('\nCustom Logo\n')},children:"Copy code"})]})]})})]})},eN=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})})]})},eI=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})})]})},eC=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})})]})},eL=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})})]})},eH=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})})]})},e_=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n button \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button \n'),navigator.clipboard.writeText('\n button \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:''})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:''===n?"check":"copy",variant:"ghost",onClick:()=>{e(''),navigator.clipboard.writeText('')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n button\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n button\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n button\n'),navigator.clipboard.writeText('\n button\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nbutton\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nbutton\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nbutton\n\n'),navigator.clipboard.writeText('\n \nbutton\n\n')},children:"Copy code"})]})]})})]})},eP=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Functional '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Functional '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Functional '),navigator.clipboard.writeText(' Functional ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Functional'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Functional'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Functional'),navigator.clipboard.writeText('Functional')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Functional'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Functional'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Functional'),navigator.clipboard.writeText('Functional')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFunctional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFunctional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFunctional\n'),navigator.clipboard.writeText('\nFunctional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Regular '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Regular '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Regular '),navigator.clipboard.writeText(' (Default) Regular ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'(Default) Regular'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Regular'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Regular'),navigator.clipboard.writeText('(Default) Regular')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Regular'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Regular'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Regular'),navigator.clipboard.writeText('(Default) Regular')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Regular\n'),navigator.clipboard.writeText('\n(Default) Regular\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Expressive '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Expressive '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Expressive '),navigator.clipboard.writeText(' Expressive ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Expressive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Expressive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Expressive'),navigator.clipboard.writeText('Expressive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Expressive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Expressive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Expressive'),navigator.clipboard.writeText('Expressive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nExpressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nExpressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nExpressive\n'),navigator.clipboard.writeText('\nExpressive\n')},children:"Copy code"})]})]})})]})},eA=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Adaptive "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Adaptive "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Adaptive "),navigator.clipboard.writeText(" (Default) Adaptive ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'(Default) Adaptive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Adaptive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Adaptive'),navigator.clipboard.writeText('(Default) Adaptive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Adaptive"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Adaptive"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Adaptive"),navigator.clipboard.writeText("(Default) Adaptive")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Adaptive\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Adaptive\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Adaptive\n"),navigator.clipboard.writeText("\n(Default) Adaptive\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Neutral '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Neutral '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Neutral '),navigator.clipboard.writeText(' Neutral ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Neutral'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Neutral'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Neutral'),navigator.clipboard.writeText('Neutral')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Neutral'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Neutral'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Neutral'),navigator.clipboard.writeText('Neutral')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nNeutral\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nNeutral\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nNeutral\n'),navigator.clipboard.writeText('\nNeutral\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Critical '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Critical '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Critical '),navigator.clipboard.writeText(' Critical ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Critical'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Critical'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Critical'),navigator.clipboard.writeText('Critical')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Critical'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Critical'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Critical'),navigator.clipboard.writeText('Critical')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nCritical\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nCritical\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nCritical\n'),navigator.clipboard.writeText('\nCritical\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Informational '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Informational '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Informational '),navigator.clipboard.writeText(' Informational ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Informational'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Informational'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Informational'),navigator.clipboard.writeText('Informational')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Informational'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Informational'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Informational'),navigator.clipboard.writeText('Informational')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nInformational\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nInformational\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nInformational\n'),navigator.clipboard.writeText('\nInformational\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Successful '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Successful '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Successful '),navigator.clipboard.writeText(' Successful ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Successful'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Successful'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Successful'),navigator.clipboard.writeText('Successful')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Successful'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Successful'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Successful'),navigator.clipboard.writeText('Successful')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nSuccessful\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nSuccessful\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nSuccessful\n'),navigator.clipboard.writeText('\nSuccessful\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Warning '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Warning '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Warning '),navigator.clipboard.writeText(' Warning ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Warning'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Warning'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Warning'),navigator.clipboard.writeText('Warning')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Warning'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Warning'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Warning'),navigator.clipboard.writeText('Warning')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nWarning\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nWarning\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nWarning\n'),navigator.clipboard.writeText('\nWarning\n')},children:"Copy code"})]})]})})]})},eR=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Medium "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Medium "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Medium "),navigator.clipboard.writeText(" (Default) Medium ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'(Default) Medium'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Medium'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Medium'),navigator.clipboard.writeText('(Default) Medium')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Medium"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Medium"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Medium"),navigator.clipboard.writeText("(Default) Medium")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Medium\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Medium\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Medium\n"),navigator.clipboard.writeText("\n(Default) Medium\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Small '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Small '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Small '),navigator.clipboard.writeText(' Small ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'Small'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Small'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Small'),navigator.clipboard.writeText('Small')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Small'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Small'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Small'),navigator.clipboard.writeText('Small')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nSmall\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nSmall\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nSmall\n'),navigator.clipboard.writeText('\nSmall\n')},children:"Copy code"})]})]})})]})},eS=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Functional '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Functional '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Functional '),navigator.clipboard.writeText(' Functional ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Functional
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Functional
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Functional
'),navigator.clipboard.writeText('
Functional
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Functional'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Functional'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Functional'),navigator.clipboard.writeText('Functional')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFunctional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFunctional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFunctional\n'),navigator.clipboard.writeText('\nFunctional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Regular '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Regular '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Regular '),navigator.clipboard.writeText(' (Default) Regular ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
(Default) Regular
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
(Default) Regular
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
(Default) Regular
'),navigator.clipboard.writeText('
(Default) Regular
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Regular'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Regular'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Regular'),navigator.clipboard.writeText('(Default) Regular')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Regular\n'),navigator.clipboard.writeText('\n(Default) Regular\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Expressive '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Expressive '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Expressive '),navigator.clipboard.writeText(' Expressive ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Expressive
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Expressive
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Expressive
'),navigator.clipboard.writeText('
Expressive
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Expressive'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Expressive'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Expressive'),navigator.clipboard.writeText('Expressive')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nExpressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nExpressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nExpressive\n'),navigator.clipboard.writeText('\nExpressive\n')},children:"Copy code"})]})]})})]})},eE=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Weak "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Weak "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Weak "),navigator.clipboard.writeText(" (Default) Weak ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
(Default) Weak
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
(Default) Weak
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
(Default) Weak
'),navigator.clipboard.writeText('
(Default) Weak
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Weak"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Weak"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Weak"),navigator.clipboard.writeText("(Default) Weak")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Weak\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Weak\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Weak\n"),navigator.clipboard.writeText("\n(Default) Weak\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Strong '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Strong '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Strong '),navigator.clipboard.writeText(' Strong ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Strong
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Strong
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Strong
'),navigator.clipboard.writeText('
Strong
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Strong'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Strong'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Strong'),navigator.clipboard.writeText('Strong')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nStrong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nStrong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nStrong\n'),navigator.clipboard.writeText('\nStrong\n')},children:"Copy code"})]})]})})]})},eO=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Adaptive "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Adaptive "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Adaptive "),navigator.clipboard.writeText(" (Default) Adaptive ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
(Default) Adaptive
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
(Default) Adaptive
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
(Default) Adaptive
'),navigator.clipboard.writeText('
(Default) Adaptive
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Adaptive"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Adaptive"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Adaptive"),navigator.clipboard.writeText("(Default) Adaptive")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Adaptive\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Adaptive\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Adaptive\n"),navigator.clipboard.writeText("\n(Default) Adaptive\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Neutral '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Neutral '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Neutral '),navigator.clipboard.writeText(' Neutral ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Neutral
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Neutral
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Neutral
'),navigator.clipboard.writeText('
Neutral
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Neutral'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Neutral'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Neutral'),navigator.clipboard.writeText('Neutral')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nNeutral\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nNeutral\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nNeutral\n'),navigator.clipboard.writeText('\nNeutral\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Critical '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Critical '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Critical '),navigator.clipboard.writeText(' Critical ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Critical
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Critical
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Critical
'),navigator.clipboard.writeText('
Critical
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Critical'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Critical'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Critical'),navigator.clipboard.writeText('Critical')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nCritical\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nCritical\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nCritical\n'),navigator.clipboard.writeText('\nCritical\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Informational '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Informational '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Informational '),navigator.clipboard.writeText(' Informational ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Informational
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Informational
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Informational
'),navigator.clipboard.writeText('
Informational
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Informational'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Informational'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Informational'),navigator.clipboard.writeText('Informational')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nInformational\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nInformational\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nInformational\n'),navigator.clipboard.writeText('\nInformational\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Successful '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Successful '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Successful '),navigator.clipboard.writeText(' Successful ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Successful
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Successful
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Successful
'),navigator.clipboard.writeText('
Successful
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Successful'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Successful'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Successful'),navigator.clipboard.writeText('Successful')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nSuccessful\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nSuccessful\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nSuccessful\n'),navigator.clipboard.writeText('\nSuccessful\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Warning '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Warning '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Warning '),navigator.clipboard.writeText(' Warning ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Warning
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Warning
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Warning
'),navigator.clipboard.writeText('
Warning
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Warning'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Warning'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Warning'),navigator.clipboard.writeText('Warning')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nWarning\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nWarning\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nWarning\n'),navigator.clipboard.writeText('\nWarning\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Adaptive Strong '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Adaptive Strong '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Adaptive Strong '),navigator.clipboard.writeText(' Adaptive Strong ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Adaptive Strong
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Adaptive Strong
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Adaptive Strong
'),navigator.clipboard.writeText('
Adaptive Strong
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Adaptive Strong'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Adaptive Strong'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Adaptive Strong'),navigator.clipboard.writeText('Adaptive Strong')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nAdaptive Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nAdaptive Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nAdaptive Strong\n'),navigator.clipboard.writeText('\nAdaptive Strong\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Neutral Strong '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Neutral Strong '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Neutral Strong '),navigator.clipboard.writeText(' Neutral Strong ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n Neutral Strong\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n Neutral Strong\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n Neutral Strong\n
'),navigator.clipboard.writeText('
\n Neutral Strong\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Neutral Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Neutral Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Neutral Strong\n'),navigator.clipboard.writeText('\n Neutral Strong\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nNeutral Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nNeutral Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nNeutral Strong\n'),navigator.clipboard.writeText('\nNeutral Strong\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Critical Strong '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Critical Strong '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Critical Strong '),navigator.clipboard.writeText(' Critical Strong ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n Critical Strong\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n Critical Strong\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n Critical Strong\n
'),navigator.clipboard.writeText('
\n Critical Strong\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Critical Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Critical Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Critical Strong\n'),navigator.clipboard.writeText('\n Critical Strong\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nCritical Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nCritical Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nCritical Strong\n'),navigator.clipboard.writeText('\nCritical Strong\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Informational Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Informational Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Informational Strong\n'),navigator.clipboard.writeText('\n Informational Strong\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n Informational Strong\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n Informational Strong\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n Informational Strong\n
'),navigator.clipboard.writeText('
\n Informational Strong\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Informational Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Informational Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Informational Strong\n'),navigator.clipboard.writeText('\n Informational Strong\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nInformational Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nInformational Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nInformational Strong\n'),navigator.clipboard.writeText('\nInformational Strong\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Successful Strong '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Successful Strong '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Successful Strong '),navigator.clipboard.writeText(' Successful Strong ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n Successful Strong\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n Successful Strong\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n Successful Strong\n
'),navigator.clipboard.writeText('
\n Successful Strong\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Successful Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Successful Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Successful Strong\n'),navigator.clipboard.writeText('\n Successful Strong\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nSuccessful Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nSuccessful Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nSuccessful Strong\n'),navigator.clipboard.writeText('\nSuccessful Strong\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Warning Strong '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Warning Strong '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Warning Strong '),navigator.clipboard.writeText(' Warning Strong ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n Warning Strong\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n Warning Strong\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n Warning Strong\n
'),navigator.clipboard.writeText('
\n Warning Strong\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Warning Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Warning Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Warning Strong\n'),navigator.clipboard.writeText('\n Warning Strong\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nWarning Strong\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nWarning Strong\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nWarning Strong\n'),navigator.clipboard.writeText('\nWarning Strong\n')},children:"Copy code"})]})]})})]})},eF=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Static "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Static "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Static "),navigator.clipboard.writeText(" (Default) Static ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
(Default) Static
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
(Default) Static
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
(Default) Static
'),navigator.clipboard.writeText('
(Default) Static
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Static"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Static"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Static"),navigator.clipboard.writeText("(Default) Static")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Static\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Static\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Static\n"),navigator.clipboard.writeText("\n(Default) Static\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"\n \n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n \n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n \n"),navigator.clipboard.writeText("\n \n")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
'),navigator.clipboard.writeText('
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n \n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n \n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n \n"),navigator.clipboard.writeText("\n \n")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n \n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n \n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n \n"),navigator.clipboard.writeText("\n \n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Interactive Link \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Interactive Link \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Interactive Link \n'),navigator.clipboard.writeText('\n Interactive Link \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Interactive Link
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Interactive Link
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Interactive Link
'),navigator.clipboard.writeText('
Interactive Link
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Interactive Link\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Interactive Link\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Interactive Link\n'),navigator.clipboard.writeText('\n Interactive Link\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nInteractive Link\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nInteractive Link\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nInteractive Link\n\n'),navigator.clipboard.writeText('\n \nInteractive Link\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
'),navigator.clipboard.writeText('
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
'),navigator.clipboard.writeText('
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
'),navigator.clipboard.writeText('
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Removeable '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Removeable '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Removeable '),navigator.clipboard.writeText(' Removeable ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n Removeable\n Remove tag\n \n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n Removeable\n Remove tag\n \n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n Removeable\n Remove tag\n \n
'),navigator.clipboard.writeText('
\n Removeable\n Remove tag\n \n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Removeable'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Removeable'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Removeable'),navigator.clipboard.writeText('Removeable')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nRemoveable\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nRemoveable\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nRemoveable\n'),navigator.clipboard.writeText('\nRemoveable\n')},children:"Copy code"})]})]})})]})},eM=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
'),navigator.clipboard.writeText('
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
'),navigator.clipboard.writeText('
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
'),navigator.clipboard.writeText('
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]})]})})]})},eV=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) Text "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) Text "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) Text "),navigator.clipboard.writeText(" (Default) Text ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
(Default) Text
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
(Default) Text
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
(Default) Text
'),navigator.clipboard.writeText('
(Default) Text
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) Text"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) Text"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) Text"),navigator.clipboard.writeText("(Default) Text")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) Text\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) Text\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) Text\n"),navigator.clipboard.writeText("\n(Default) Text\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Icon '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Icon '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Icon '),navigator.clipboard.writeText(' Icon ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Icon
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Icon
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Icon
'),navigator.clipboard.writeText('
Icon
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Icon\n'),navigator.clipboard.writeText('\n Icon\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nIcon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nIcon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nIcon\n'),navigator.clipboard.writeText('\nIcon\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Icon & Text '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Icon & Text '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Icon & Text '),navigator.clipboard.writeText(' Icon & Text ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
Icon & Text
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
Icon & Text
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
Icon & Text
'),navigator.clipboard.writeText('
Icon & Text
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'Icon & Text'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'Icon & Text'===n?"check":"copy",variant:"ghost",onClick:()=>{e('Icon & Text'),navigator.clipboard.writeText('Icon & Text')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nIcon & Text\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nIcon & Text\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nIcon & Text\n'),navigator.clipboard.writeText('\nIcon & Text\n')},children:"Copy code"})]})]})})]})},eW=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:" (Default) No Overflow "})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:" (Default) No Overflow "===n?"check":"copy",variant:"ghost",onClick:()=>{e(" (Default) No Overflow "),navigator.clipboard.writeText(" (Default) No Overflow ")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
(Default) No Overflow
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
(Default) No Overflow
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
(Default) No Overflow
'),navigator.clipboard.writeText('
(Default) No Overflow
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"(Default) No Overflow"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"(Default) No Overflow"===n?"check":"copy",variant:"ghost",onClick:()=>{e("(Default) No Overflow"),navigator.clipboard.writeText("(Default) No Overflow")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n(Default) No Overflow\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n(Default) No Overflow\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n(Default) No Overflow\n"),navigator.clipboard.writeText("\n(Default) No Overflow\n")},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' With Overflow (max-width) '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' With Overflow (max-width) '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' With Overflow (max-width) '),navigator.clipboard.writeText(' With Overflow (max-width) ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
With Overflow (max-width)
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
With Overflow (max-width)
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
With Overflow (max-width)
'),navigator.clipboard.writeText('
With Overflow (max-width)
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"With Overflow (max-width)"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"With Overflow (max-width)"===n?"check":"copy",variant:"ghost",onClick:()=>{e("With Overflow (max-width)"),navigator.clipboard.writeText("With Overflow (max-width)")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nWith Overflow (max-width)\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nWith Overflow (max-width)\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nWith Overflow (max-width)\n'),navigator.clipboard.writeText('\nWith Overflow (max-width)\n')},children:"Copy code"})]})]})})]})},ez=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n \n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n \n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n \n
'),navigator.clipboard.writeText('
\n \n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Interactive Link \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Interactive Link \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Interactive Link \n'),navigator.clipboard.writeText('\n Interactive Link \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n Interactive Link\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n Interactive Link\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n Interactive Link\n
'),navigator.clipboard.writeText('
\n Interactive Link\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Interactive Link\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Interactive Link\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Interactive Link\n'),navigator.clipboard.writeText('\n Interactive Link\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \nInteractive Link\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \nInteractive Link\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \nInteractive Link\n\n'),navigator.clipboard.writeText('\n \nInteractive Link\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n \n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n \n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n \n
'),navigator.clipboard.writeText('
\n \n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
'),navigator.clipboard.writeText('
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
\n
'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
\n
'===n?"check":"copy",variant:"ghost",onClick:()=>{e('
\n
'),navigator.clipboard.writeText('
\n
')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n'),navigator.clipboard.writeText('\n \n')},children:"Copy code"})]})]})})]})},eU=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n \n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})})]})},eq=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})})]})},eJ=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})})]})},eG=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n"),navigator.clipboard.writeText("\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})})]})},eY=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:"\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n"===n?"check":"copy",variant:"ghost",onClick:()=>{e("\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n"),navigator.clipboard.writeText("\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n'),navigator.clipboard.writeText('\n \n Tab 1 \n Tab 2 \n Tab 3 \n \n Tab Panel 1 \n Tab Panel 2 \n Tab Panel 3 \n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n'),navigator.clipboard.writeText('\n
\n
    \n
  • \n Tab 1\n
    • \n
  • \n Tab 2\n
    • \n
  • \n Tab 3\n
    • \n
\n
\n
Tab Panel 1
\n
Tab Panel 2
\n
Tab Panel 3
\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n'),navigator.clipboard.writeText('\n \n Tab 1\n Tab 2\n Tab 3\n \n Tab Panel 1\n Tab Panel 2\n Tab Panel 3\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n'),navigator.clipboard.writeText('\n \n \nTab 1\n\n\nTab 2\n\n\nTab 3\n\n\n\nTab Panel 1\n\n\nTab Panel 2\n\n\nTab Panel 3\n\n')},children:"Copy code"})]})]})})]})},e$=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Functional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Functional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Functional\n'),navigator.clipboard.writeText('\n Functional\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n functionalFunctional\n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n functionalFunctional\n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n functionalFunctional\n
    • '),navigator.clipboard.writeText('
  • \n functionalFunctional\n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Functional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Functional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Functional\n'),navigator.clipboard.writeText('\n Functional\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFunctional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFunctional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFunctional\n'),navigator.clipboard.writeText('\nFunctional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n (Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Regular\n'),navigator.clipboard.writeText('\n (Default) Regular\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n (Default) Regular(Default)\n Regular\n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n (Default) Regular(Default)\n Regular\n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n (Default) Regular(Default)\n Regular\n
    • '),navigator.clipboard.writeText('
  • \n (Default) Regular(Default)\n Regular\n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n (Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Regular\n'),navigator.clipboard.writeText('\n (Default) Regular\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Regular\n'),navigator.clipboard.writeText('\n(Default) Regular\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Expressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Expressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Expressive\n'),navigator.clipboard.writeText('\n Expressive\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n expressiveExpressive\n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n expressiveExpressive\n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n expressiveExpressive\n
    • '),navigator.clipboard.writeText('
  • \n expressiveExpressive\n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Expressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Expressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Expressive\n'),navigator.clipboard.writeText('\n Expressive\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nExpressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nExpressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nExpressive\n'),navigator.clipboard.writeText('\nExpressive\n')},children:"Copy code"})]})]})})]})},eK=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Enabled '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Enabled '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Enabled '),navigator.clipboard.writeText(' (Default) Enabled ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n (Default) Enabled(Default)\n Enabled\n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n (Default) Enabled(Default)\n Enabled\n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n (Default) Enabled(Default)\n Enabled\n
    • '),navigator.clipboard.writeText('
  • \n (Default) Enabled(Default)\n Enabled\n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Enabled'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Enabled'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Enabled'),navigator.clipboard.writeText('(Default) Enabled')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Enabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Enabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Enabled\n'),navigator.clipboard.writeText('\n(Default) Enabled\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' active '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' active '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' active '),navigator.clipboard.writeText(' active ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n activeactive\n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n activeactive\n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n activeactive\n
    • '),navigator.clipboard.writeText('
  • \n activeactive\n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n active\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n active\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n active\n'),navigator.clipboard.writeText('\n active\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nactive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nactive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nactive\n'),navigator.clipboard.writeText('\nactive\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' disabled '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' disabled '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' disabled '),navigator.clipboard.writeText(' disabled ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n activedisabled\n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n activedisabled\n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n activedisabled\n
    • '),navigator.clipboard.writeText('
  • \n activedisabled\n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n disabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n disabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n disabled\n'),navigator.clipboard.writeText('\n disabled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\ndisabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\ndisabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\ndisabled\n'),navigator.clipboard.writeText('\ndisabled\n')},children:"Copy code"})]})]})})]})},eQ=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Text '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Text '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Text '),navigator.clipboard.writeText(' (Default) Text ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n (Default) Text(Default)\n Text\n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n (Default) Text(Default)\n Text\n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n (Default) Text(Default)\n Text\n
    • '),navigator.clipboard.writeText('
  • \n (Default) Text(Default)\n Text\n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Text'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Text'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Text'),navigator.clipboard.writeText('(Default) Text')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Text\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Text\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Text\n'),navigator.clipboard.writeText('\n(Default) Text\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Text - Icon (Leading)\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Text - Icon (Leading)\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Text - Icon (Leading)\n'),navigator.clipboard.writeText('\n Text - Icon (Leading)\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n
    • '),navigator.clipboard.writeText('
  • \n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Text - Icon (Leading)\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Text - Icon (Leading)\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Text - Icon (Leading)\n'),navigator.clipboard.writeText('\n Text - Icon (Leading)\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nText - Icon (Leading)\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nText - Icon (Leading)\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nText - Icon (Leading)\n'),navigator.clipboard.writeText('\nText - Icon (Leading)\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Text - Icon (Trailing)\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Text - Icon (Trailing)\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Text - Icon (Trailing)\n'),navigator.clipboard.writeText('\n Text - Icon (Trailing)\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n
    • '),navigator.clipboard.writeText('
  • \n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Text - Icon (Trailing)\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Text - Icon (Trailing)\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Text - Icon (Trailing)\n'),navigator.clipboard.writeText('\n Text - Icon (Trailing)\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nText - Icon (Trailing)\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nText - Icon (Trailing)\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nText - Icon (Trailing)\n'),navigator.clipboard.writeText('\nText - Icon (Trailing)\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Icon '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Icon '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Icon '),navigator.clipboard.writeText(' Icon ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n
    • '),navigator.clipboard.writeText('
  • \n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Icon\n'),navigator.clipboard.writeText('\n Icon\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nIcon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nIcon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nIcon\n'),navigator.clipboard.writeText('\nIcon\n')},children:"Copy code"})]})]})})]})},eX=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Auto Width '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Auto Width '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Auto Width '),navigator.clipboard.writeText(' (Default) Auto Width ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n (Default) Auto Width(Default)\n Auto Width\n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n (Default) Auto Width(Default)\n Auto Width\n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n (Default) Auto Width(Default)\n Auto Width\n
    • '),navigator.clipboard.writeText('
  • \n (Default) Auto Width(Default)\n Auto Width\n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Auto Width'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Auto Width'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Auto Width'),navigator.clipboard.writeText('(Default) Auto Width')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Auto Width\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Auto Width\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Auto Width\n'),navigator.clipboard.writeText('\n(Default) Auto Width\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Width full '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Width full '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Width full '),navigator.clipboard.writeText(' Width full ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
  • \n Width fullWidth\n full\n
    • '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
  • \n Width fullWidth\n full\n
    • '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
  • \n Width fullWidth\n full\n
    • '),navigator.clipboard.writeText('
  • \n Width fullWidth\n full\n
    • ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Width full\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Width full\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Width full\n'),navigator.clipboard.writeText('\n Width full\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nWidth full\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nWidth full\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nWidth full\n'),navigator.clipboard.writeText('\nWidth full\n')},children:"Copy code"})]})]})})]})},e0=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Left '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Left '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Left '),navigator.clipboard.writeText(' Left ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Left\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Left\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Left\n'),navigator.clipboard.writeText('\n Left\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nLeft\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nLeft\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nLeft\n'),navigator.clipboard.writeText('\nLeft\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Centered\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Centered\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Centered\n'),navigator.clipboard.writeText('\n Centered\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Centered\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Centered\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Centered\n'),navigator.clipboard.writeText('\n Centered\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nCentered\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nCentered\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nCentered\n'),navigator.clipboard.writeText('\nCentered\n')},children:"Copy code"})]})]})})]})},e1=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Functional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Functional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Functional\n'),navigator.clipboard.writeText('\n Functional\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Functional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Functional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Functional\n'),navigator.clipboard.writeText('\n Functional\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFunctional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFunctional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFunctional\n'),navigator.clipboard.writeText('\nFunctional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n (Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Regular\n'),navigator.clipboard.writeText('\n (Default) Regular\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n (Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Regular\n'),navigator.clipboard.writeText('\n (Default) Regular\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Regular\n'),navigator.clipboard.writeText('\n(Default) Regular\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Expressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Expressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Expressive\n'),navigator.clipboard.writeText('\n Expressive\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Expressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Expressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Expressive\n'),navigator.clipboard.writeText('\n Expressive\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nExpressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nExpressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nExpressive\n'),navigator.clipboard.writeText('\nExpressive\n')},children:"Copy code"})]})]})})]})},e2=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Enabled '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Enabled '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Enabled '),navigator.clipboard.writeText(' (Default) Enabled ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Enabled'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Enabled'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Enabled'),navigator.clipboard.writeText('(Default) Enabled')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Enabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Enabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Enabled\n'),navigator.clipboard.writeText('\n(Default) Enabled\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Disabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Disabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Disabled\n'),navigator.clipboard.writeText('\n Disabled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Disabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Disabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Disabled\n'),navigator.clipboard.writeText('\n Disabled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDisabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDisabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDisabled\n'),navigator.clipboard.writeText('\nDisabled\n')},children:"Copy code"})]})]})})]})},e3=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Unchecked '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Unchecked '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Unchecked '),navigator.clipboard.writeText(' (Default) Unchecked ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Unchecked'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Unchecked'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Unchecked'),navigator.clipboard.writeText('(Default) Unchecked')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Unchecked\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Unchecked\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Unchecked\n'),navigator.clipboard.writeText('\n(Default) Unchecked\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Unchecked - Invalid '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Unchecked - Invalid '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Unchecked - Invalid '),navigator.clipboard.writeText(' Unchecked - Invalid ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Unchecked - Invalid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Unchecked - Invalid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Unchecked - Invalid\n'),navigator.clipboard.writeText('\n Unchecked - Invalid\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nUnchecked - Invalid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nUnchecked - Invalid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nUnchecked - Invalid\n'),navigator.clipboard.writeText('\nUnchecked - Invalid\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Checked '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Checked '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Checked '),navigator.clipboard.writeText(' Checked ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Checked\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Checked\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Checked\n'),navigator.clipboard.writeText('\n Checked\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nChecked\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nChecked\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nChecked\n'),navigator.clipboard.writeText('\nChecked\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Checked - Valid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Checked - Valid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Checked - Valid\n'),navigator.clipboard.writeText('\n Checked - Valid\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Checked - Valid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Checked - Valid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Checked - Valid\n'),navigator.clipboard.writeText('\n Checked - Valid\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nChecked - Valid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nChecked - Valid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nChecked - Valid\n'),navigator.clipboard.writeText('\nChecked - Valid\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Indeterminate '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Indeterminate '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Indeterminate '),navigator.clipboard.writeText(' Indeterminate ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Indeterminate\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Indeterminate\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Indeterminate\n'),navigator.clipboard.writeText('\n Indeterminate\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nIndeterminate\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nIndeterminate\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nIndeterminate\n'),navigator.clipboard.writeText('\nIndeterminate\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Indeterminate - Invalid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Indeterminate - Invalid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Indeterminate - Invalid\n'),navigator.clipboard.writeText('\n Indeterminate - Invalid\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Indeterminate - Invalid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Indeterminate - Invalid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Indeterminate - Invalid\n'),navigator.clipboard.writeText('\n Indeterminate - Invalid\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nIndeterminate - Invalid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nIndeterminate - Invalid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nIndeterminate - Invalid\n'),navigator.clipboard.writeText('\nIndeterminate - Invalid\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Indeterminate - Valid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Indeterminate - Valid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Indeterminate - Valid\n'),navigator.clipboard.writeText('\n Indeterminate - Valid\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Indeterminate - Valid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Indeterminate - Valid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Indeterminate - Valid\n'),navigator.clipboard.writeText('\n Indeterminate - Valid\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nIndeterminate - Valid\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nIndeterminate - Valid\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nIndeterminate - Valid\n'),navigator.clipboard.writeText('\nIndeterminate - Valid\n')},children:"Copy code"})]})]})})]})},e4=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Medium '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Medium '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Medium '),navigator.clipboard.writeText(' (Default) Medium ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Medium'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Medium'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Medium'),navigator.clipboard.writeText('(Default) Medium')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Medium\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Medium\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Medium\n'),navigator.clipboard.writeText('\n(Default) Medium\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Small '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Small '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Small '),navigator.clipboard.writeText(' Small ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Small\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Small\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Small\n'),navigator.clipboard.writeText('\n Small\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nSmall\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nSmall\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nSmall\n'),navigator.clipboard.writeText('\nSmall\n')},children:"Copy code"})]})]})})]})},e7=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Optional '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Optional '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Optional '),navigator.clipboard.writeText(' (Default) Optional ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Optional'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Optional'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Optional'),navigator.clipboard.writeText('(Default) Optional')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Optional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Optional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Optional\n'),navigator.clipboard.writeText('\n(Default) Optional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Required '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Required '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Required '),navigator.clipboard.writeText(' Required ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Required\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Required\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Required\n'),navigator.clipboard.writeText('\n Required\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nRequired\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nRequired\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nRequired\n'),navigator.clipboard.writeText('\nRequired\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Required - Indeterminate\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Required - Indeterminate\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Required - Indeterminate\n'),navigator.clipboard.writeText('\n Required - Indeterminate\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Required - Indeterminate\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Required - Indeterminate\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Required - Indeterminate\n'),navigator.clipboard.writeText('\n Required - Indeterminate\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nRequired - Indeterminate\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nRequired - Indeterminate\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nRequired - Indeterminate\n'),navigator.clipboard.writeText('\nRequired - Indeterminate\n')},children:"Copy code"})]})]})})]})},e5=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Label '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Label '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Label '),navigator.clipboard.writeText(' (Default) Label ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Label'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Label'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Label'),navigator.clipboard.writeText('(Default) Label')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Label\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Label\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Label\n'),navigator.clipboard.writeText('\n(Default) Label\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' No Label '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' No Label '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' No Label '),navigator.clipboard.writeText(' No Label ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n No Label\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n No Label\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n No Label\n'),navigator.clipboard.writeText('\n No Label\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nNo Label\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nNo Label\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nNo Label\n'),navigator.clipboard.writeText('\nNo Label\n')},children:"Copy code"})]})]})})]})},e6=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Functional '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Functional '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Functional '),navigator.clipboard.writeText(' Functional ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Functional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Functional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Functional\n'),navigator.clipboard.writeText('\n Functional\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFunctional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFunctional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFunctional\n'),navigator.clipboard.writeText('\nFunctional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n (Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Regular\n'),navigator.clipboard.writeText('\n (Default) Regular\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n (Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Regular\n'),navigator.clipboard.writeText('\n (Default) Regular\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Regular\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Regular\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Regular\n'),navigator.clipboard.writeText('\n(Default) Regular\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Expressive '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Expressive '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Expressive '),navigator.clipboard.writeText(' Expressive ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Expressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Expressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Expressive\n'),navigator.clipboard.writeText('\n Expressive\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nExpressive\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nExpressive\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nExpressive\n'),navigator.clipboard.writeText('\nExpressive\n')},children:"Copy code"})]})]})})]})},e8=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Label Above '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Label Above '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Label Above '),navigator.clipboard.writeText(' (Default) Label Above ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Label Above'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Label Above'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Label Above'),navigator.clipboard.writeText('(Default) Label Above')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Label Above\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Label Above\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Label Above\n'),navigator.clipboard.writeText('\n(Default) Label Above\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Floating Label\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Floating Label\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Floating Label\n'),navigator.clipboard.writeText('\n Floating Label\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Floating Label\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Floating Label\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Floating Label\n'),navigator.clipboard.writeText('\n Floating Label\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFloating Label\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFloating Label\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFloating Label\n'),navigator.clipboard.writeText('\nFloating Label\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Hidden Label '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Hidden Label '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Hidden Label '),navigator.clipboard.writeText(' Hidden Label ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Hidden Label\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Hidden Label\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Hidden Label\n'),navigator.clipboard.writeText('\n Hidden Label\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nHidden Label\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nHidden Label\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nHidden Label\n'),navigator.clipboard.writeText('\nHidden Label\n')},children:"Copy code"})]})]})})]})},e9=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Basic '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Basic '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Basic '),navigator.clipboard.writeText(' (Default) Basic ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Basic'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Basic'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Basic'),navigator.clipboard.writeText('(Default) Basic')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Basic\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Basic\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Basic\n'),navigator.clipboard.writeText('\n(Default) Basic\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Helper Message '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Helper Message '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Helper Message '),navigator.clipboard.writeText(' Helper Message ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Helper Message\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Helper Message\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Helper Message\n'),navigator.clipboard.writeText('\n Helper Message\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nHelper Message\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nHelper Message\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nHelper Message\n'),navigator.clipboard.writeText('\nHelper Message\n')},children:"Copy code"})]})]})})]})},an=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Empty '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Empty '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Empty '),navigator.clipboard.writeText(' (Default) Empty ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Empty'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Empty'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Empty'),navigator.clipboard.writeText('(Default) Empty')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Empty\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Empty\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Empty\n'),navigator.clipboard.writeText('\n(Default) Empty\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Filled '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Filled '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Filled '),navigator.clipboard.writeText(' Filled ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Filled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Filled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Filled\n'),navigator.clipboard.writeText('\n Filled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFilled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFilled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFilled\n'),navigator.clipboard.writeText('\nFilled\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Disabled '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Disabled '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Disabled '),navigator.clipboard.writeText(' Disabled ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Disabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Disabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Disabled\n'),navigator.clipboard.writeText('\n Disabled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDisabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDisabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDisabled\n'),navigator.clipboard.writeText('\nDisabled\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Readonly - Filled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Readonly - Filled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Readonly - Filled\n'),navigator.clipboard.writeText('\n Readonly - Filled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Readonly - Filled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Readonly - Filled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Readonly - Filled\n'),navigator.clipboard.writeText('\n Readonly - Filled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nReadonly - Filled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nReadonly - Filled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nReadonly - Filled\n'),navigator.clipboard.writeText('\nReadonly - Filled\n')},children:"Copy code"})]})]})})]})},ae=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Empty '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Empty '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Empty '),navigator.clipboard.writeText(' (Default) Empty ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n (Default) Empty\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Empty\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Empty\n'),navigator.clipboard.writeText('\n (Default) Empty\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Empty\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Empty\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Empty\n'),navigator.clipboard.writeText('\n(Default) Empty\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Filled '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Filled '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Filled '),navigator.clipboard.writeText(' Filled ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Filled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Filled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Filled\n'),navigator.clipboard.writeText('\n Filled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFilled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFilled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFilled\n'),navigator.clipboard.writeText('\nFilled\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Disabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Disabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Disabled\n'),navigator.clipboard.writeText('\n Disabled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Disabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Disabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Disabled\n'),navigator.clipboard.writeText('\n Disabled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDisabled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDisabled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDisabled\n'),navigator.clipboard.writeText('\nDisabled\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Readonly - Filled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Readonly - Filled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Readonly - Filled\n'),navigator.clipboard.writeText('\n Readonly - Filled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Readonly - Filled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Readonly - Filled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Readonly - Filled\n'),navigator.clipboard.writeText('\n Readonly - Filled\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nReadonly - Filled\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nReadonly - Filled\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nReadonly - Filled\n'),navigator.clipboard.writeText('\nReadonly - Filled\n')},children:"Copy code"})]})]})})]})},aa=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Text '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Text '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Text '),navigator.clipboard.writeText(' (Default) Text ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n (Default) Text\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Text\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Text\n'),navigator.clipboard.writeText('\n (Default) Text\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Text\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Text\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Text\n'),navigator.clipboard.writeText('\n(Default) Text\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Filled Number '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Filled Number '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Filled Number '),navigator.clipboard.writeText(' Filled Number ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Filled Number\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Filled Number\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Filled Number\n'),navigator.clipboard.writeText('\n Filled Number\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nFilled Number\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nFilled Number\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nFilled Number\n'),navigator.clipboard.writeText('\nFilled Number\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Text - Leading Icon '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Text - Leading Icon '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Text - Leading Icon '),navigator.clipboard.writeText(' Text - Leading Icon ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Text - Leading Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Text - Leading Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Text - Leading Icon\n'),navigator.clipboard.writeText('\n Text - Leading Icon\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nText - Leading Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nText - Leading Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nText - Leading Icon\n'),navigator.clipboard.writeText('\nText - Leading Icon\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Text - Leading Icon - Trailing Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Text - Leading Icon - Trailing Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Text - Leading Icon - Trailing Icon\n'),navigator.clipboard.writeText('\n Text - Leading Icon - Trailing Icon\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Text - Leading Icon - Trailing Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Text - Leading Icon - Trailing Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Text - Leading Icon - Trailing Icon\n'),navigator.clipboard.writeText('\n Text - Leading Icon - Trailing Icon\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nText - Leading Icon - Trailing Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nText - Leading Icon - Trailing Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nText - Leading Icon - Trailing Icon\n'),navigator.clipboard.writeText('\nText - Leading Icon - Trailing Icon\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Text - Trailing Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Text - Trailing Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Text - Trailing Icon\n'),navigator.clipboard.writeText('\n Text - Trailing Icon\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Text - Trailing Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Text - Trailing Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Text - Trailing Icon\n'),navigator.clipboard.writeText('\n Text - Trailing Icon\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nText - Trailing Icon\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nText - Trailing Icon\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nText - Trailing Icon\n'),navigator.clipboard.writeText('\nText - Trailing Icon\n')},children:"Copy code"})]})]})})]})},at=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Optional '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Optional '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Optional '),navigator.clipboard.writeText(' (Default) Optional ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Optional'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Optional'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Optional'),navigator.clipboard.writeText('(Default) Optional')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Optional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Optional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Optional\n'),navigator.clipboard.writeText('\n(Default) Optional\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Required '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Required '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Required '),navigator.clipboard.writeText(' Required ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'
    \n
    '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'
    \n
    '===n?"check":"copy",variant:"ghost",onClick:()=>{e('
    \n
    '),navigator.clipboard.writeText('
    \n
    ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Required\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Required\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Required\n'),navigator.clipboard.writeText('\n Required\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nRequired\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nRequired\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nRequired\n'),navigator.clipboard.writeText('\nRequired\n')},children:"Copy code"})]})]})})]})},ai=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Text '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Text '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Text '),navigator.clipboard.writeText(' (Default) Text ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'(Default) Text'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'(Default) Text'===n?"check":"copy",variant:"ghost",onClick:()=>{e('(Default) Text'),navigator.clipboard.writeText('(Default) Text')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Text\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Text\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Text\n'),navigator.clipboard.writeText('\n(Default) Text\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Password '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Password '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Password '),navigator.clipboard.writeText(' Password ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Password\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Password\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Password\n'),navigator.clipboard.writeText('\n Password\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nPassword\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nPassword\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nPassword\n'),navigator.clipboard.writeText('\nPassword\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Search '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Search '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Search '),navigator.clipboard.writeText(' Search ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Search\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Search\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Search\n'),navigator.clipboard.writeText('\n Search\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nSearch\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nSearch\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nSearch\n'),navigator.clipboard.writeText('\nSearch\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' E-Mail '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' E-Mail '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' E-Mail '),navigator.clipboard.writeText(' E-Mail ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n E-Mail\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n E-Mail\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n E-Mail\n'),navigator.clipboard.writeText('\n E-Mail\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nE-Mail\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nE-Mail\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nE-Mail\n'),navigator.clipboard.writeText('\nE-Mail\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Number '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Number '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Number '),navigator.clipboard.writeText(' Number ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Number\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Number\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Number\n'),navigator.clipboard.writeText('\n Number\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nNumber\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nNumber\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nNumber\n'),navigator.clipboard.writeText('\nNumber\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Tel '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Tel '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Tel '),navigator.clipboard.writeText(' Tel ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Tel\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Tel\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Tel\n'),navigator.clipboard.writeText('\n Tel\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nTel\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nTel\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nTel\n'),navigator.clipboard.writeText('\nTel\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' URL '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' URL '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' URL '),navigator.clipboard.writeText(' URL ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n URL\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n URL\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n URL\n'),navigator.clipboard.writeText('\n URL\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nURL\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nURL\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nURL\n'),navigator.clipboard.writeText('\nURL\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Date '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Date '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Date '),navigator.clipboard.writeText(' Date ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Date\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Date\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Date\n'),navigator.clipboard.writeText('\n Date\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDate\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDate\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDate\n'),navigator.clipboard.writeText('\nDate\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Datetime Local '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Datetime Local '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Datetime Local '),navigator.clipboard.writeText(' Datetime Local ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Datetime Local\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Datetime Local\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Datetime Local\n'),navigator.clipboard.writeText('\n Datetime Local\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDatetime Local\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDatetime Local\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDatetime Local\n'),navigator.clipboard.writeText('\nDatetime Local\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Month '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Month '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Month '),navigator.clipboard.writeText(' Month ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Month\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Month\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Month\n'),navigator.clipboard.writeText('\n Month\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nMonth\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nMonth\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nMonth\n'),navigator.clipboard.writeText('\nMonth\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Time '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Time '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Time '),navigator.clipboard.writeText(' Time ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Time\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Time\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Time\n'),navigator.clipboard.writeText('\n Time\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nTime\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nTime\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nTime\n'),navigator.clipboard.writeText('\nTime\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Week '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Week '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Week '),navigator.clipboard.writeText(' Week ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Week\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Week\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Week\n'),navigator.clipboard.writeText('\n Week\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nWeek\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nWeek\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nWeek\n'),navigator.clipboard.writeText('\nWeek\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Datalist '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Datalist '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Datalist '),navigator.clipboard.writeText(' Datalist ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Datalist\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Datalist\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Datalist\n'),navigator.clipboard.writeText('\n Datalist\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDatalist\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDatalist\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDatalist\n'),navigator.clipboard.writeText('\nDatalist\n')},children:"Copy code"})]})]})})]})},ao=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' (Default) Text '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' (Default) Text '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' (Default) Text '),navigator.clipboard.writeText(' (Default) Text ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n (Default) Text\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n (Default) Text\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n (Default) Text\n'),navigator.clipboard.writeText('\n (Default) Text\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n(Default) Text\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n(Default) Text\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n(Default) Text\n'),navigator.clipboard.writeText('\n(Default) Text\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Password '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Password '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Password '),navigator.clipboard.writeText(' Password ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Password\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Password\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Password\n'),navigator.clipboard.writeText('\n Password\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nPassword\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nPassword\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nPassword\n'),navigator.clipboard.writeText('\nPassword\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Search '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Search '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Search '),navigator.clipboard.writeText(' Search ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Search\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Search\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Search\n'),navigator.clipboard.writeText('\n Search\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nSearch\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nSearch\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nSearch\n'),navigator.clipboard.writeText('\nSearch\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' E-Mail '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' E-Mail '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' E-Mail '),navigator.clipboard.writeText(' E-Mail ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n E-Mail\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n E-Mail\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n E-Mail\n'),navigator.clipboard.writeText('\n E-Mail\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nE-Mail\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nE-Mail\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nE-Mail\n'),navigator.clipboard.writeText('\nE-Mail\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Number '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Number '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Number '),navigator.clipboard.writeText(' Number ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Number\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Number\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Number\n'),navigator.clipboard.writeText('\n Number\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nNumber\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nNumber\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nNumber\n'),navigator.clipboard.writeText('\nNumber\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Tel '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Tel '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Tel '),navigator.clipboard.writeText(' Tel ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Tel\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Tel\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Tel\n'),navigator.clipboard.writeText('\n Tel\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nTel\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nTel\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nTel\n'),navigator.clipboard.writeText('\nTel\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' URL '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' URL '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' URL '),navigator.clipboard.writeText(' URL ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n URL\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n URL\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n URL\n'),navigator.clipboard.writeText('\n URL\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nURL\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nURL\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nURL\n'),navigator.clipboard.writeText('\nURL\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Date '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Date '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Date '),navigator.clipboard.writeText(' Date ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Date\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Date\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Date\n'),navigator.clipboard.writeText('\n Date\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDate\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDate\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDate\n'),navigator.clipboard.writeText('\nDate\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Datetime Local\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Datetime Local\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Datetime Local\n'),navigator.clipboard.writeText('\n Datetime Local\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Datetime Local\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Datetime Local\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Datetime Local\n'),navigator.clipboard.writeText('\n Datetime Local\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDatetime Local\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDatetime Local\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDatetime Local\n'),navigator.clipboard.writeText('\nDatetime Local\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Month '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Month '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Month '),navigator.clipboard.writeText(' Month ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Month\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Month\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Month\n'),navigator.clipboard.writeText('\n Month\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nMonth\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nMonth\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nMonth\n'),navigator.clipboard.writeText('\nMonth\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Time '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Time '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Time '),navigator.clipboard.writeText(' Time ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Time\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Time\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Time\n'),navigator.clipboard.writeText('\n Time\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nTime\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nTime\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nTime\n'),navigator.clipboard.writeText('\nTime\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:' Week '})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:' Week '===n?"check":"copy",variant:"ghost",onClick:()=>{e(' Week '),navigator.clipboard.writeText(' Week ')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Week\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Week\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Week\n'),navigator.clipboard.writeText('\n Week\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nWeek\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nWeek\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nWeek\n'),navigator.clipboard.writeText('\nWeek\n')},children:"Copy code"})]})]})}),(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Datalist\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Datalist\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Datalist\n'),navigator.clipboard.writeText('\n Datalist\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:"undefined"})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:"undefined"===n?"check":"copy",variant:"ghost",onClick:()=>{e("undefined"),navigator.clipboard.writeText("undefined")},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=react",children:"How to use this in react"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\n Datalist\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Datalist\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Datalist\n'),navigator.clipboard.writeText('\n Datalist\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=vue",children:"How to use this in vue"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-tsx",children:'\nDatalist\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\nDatalist\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\nDatalist\n'),navigator.clipboard.writeText('\nDatalist\n')},children:"Copy code"})]})]})})]})},al=()=>{let[n,e]=(0,L.useState)();return(0,L.useEffect)(()=>{n&&setTimeout(()=>e(""),1500)},[n]),(0,I.jsxs)(I.Fragment,{children:[(0,I.jsx)(H.Z,{className:"tab-container",children:(0,I.jsxs)(nh.Z,{children:[(0,I.jsxs)(np.Z,{children:[(0,I.jsx)(nx.Z,{children:"Angular"}),(0,I.jsx)(nx.Z,{children:"HTML"}),(0,I.jsx)(nx.Z,{children:"React"}),(0,I.jsx)(nx.Z,{children:"Vue"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=angular",children:"How to use this in angular"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'\n Functional\n'})}),(0,I.jsx)(C.Z,{className:"copy-button",noText:!0,icon:'\n Functional\n'===n?"check":"copy",variant:"ghost",onClick:()=>{e('\n Functional\n'),navigator.clipboard.writeText('\n Functional\n')},children:"Copy code"})]}),(0,I.jsxs)(ng.Z,{children:[(0,I.jsx)(P.Z,{content:"external",target:"_blank",href:"how-to-use?current=html",children:"How to use this in html"}),(0,I.jsx)("pre",{children:(0,I.jsx)("code",{className:"hljs language-html",children:'