@flipdish/ui-library 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +338 -0
- package/dist/components/atoms/Avatar/avatar.utils.d.ts +10 -0
- package/dist/components/atoms/Avatar/avatar.utils.d.ts.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-add-button.d.ts +9 -0
- package/dist/components/atoms/Avatar/components/avatar-add-button.d.ts.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-company-icon.d.ts +8 -0
- package/dist/components/atoms/Avatar/components/avatar-company-icon.d.ts.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-count.cjs +9 -0
- package/dist/components/atoms/Avatar/components/avatar-count.cjs.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-count.d.ts +7 -0
- package/dist/components/atoms/Avatar/components/avatar-count.d.ts.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-count.js +7 -0
- package/dist/components/atoms/Avatar/components/avatar-count.js.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-online-indicator.cjs +21 -0
- package/dist/components/atoms/Avatar/components/avatar-online-indicator.cjs.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-online-indicator.d.ts +8 -0
- package/dist/components/atoms/Avatar/components/avatar-online-indicator.d.ts.map +1 -0
- package/dist/components/atoms/Avatar/components/avatar-online-indicator.js +19 -0
- package/dist/components/atoms/Avatar/components/avatar-online-indicator.js.map +1 -0
- package/dist/components/atoms/Avatar/components/verified-tick.cjs +21 -0
- package/dist/components/atoms/Avatar/components/verified-tick.cjs.map +1 -0
- package/dist/components/atoms/Avatar/components/verified-tick.d.ts +7 -0
- package/dist/components/atoms/Avatar/components/verified-tick.d.ts.map +1 -0
- package/dist/components/atoms/Avatar/components/verified-tick.js +19 -0
- package/dist/components/atoms/Avatar/components/verified-tick.js.map +1 -0
- package/dist/components/atoms/Avatar/index.cjs +54 -0
- package/dist/components/atoms/Avatar/index.cjs.map +1 -0
- package/dist/components/atoms/Avatar/index.d.ts +65 -0
- package/dist/components/atoms/Avatar/index.d.ts.map +1 -0
- package/dist/components/atoms/Avatar/index.js +52 -0
- package/dist/components/atoms/Avatar/index.js.map +1 -0
- package/dist/components/atoms/Badge/badge.types.cjs +10 -0
- package/dist/components/atoms/Badge/badge.types.cjs.map +1 -0
- package/dist/components/atoms/Badge/badge.types.d.ts +22 -0
- package/dist/components/atoms/Badge/badge.types.d.ts.map +1 -0
- package/dist/components/atoms/Badge/badge.types.js +8 -0
- package/dist/components/atoms/Badge/badge.types.js.map +1 -0
- package/dist/components/atoms/Badge/index.cjs +274 -0
- package/dist/components/atoms/Badge/index.cjs.map +1 -0
- package/dist/components/atoms/Badge/index.d.ts +129 -0
- package/dist/components/atoms/Badge/index.d.ts.map +1 -0
- package/dist/components/atoms/Badge/index.js +265 -0
- package/dist/components/atoms/Badge/index.js.map +1 -0
- package/dist/components/atoms/Button/index.cjs +164 -0
- package/dist/components/atoms/Button/index.cjs.map +1 -0
- package/dist/components/atoms/Button/index.d.ts +111 -0
- package/dist/components/atoms/Button/index.d.ts.map +1 -0
- package/dist/components/atoms/Button/index.js +161 -0
- package/dist/components/atoms/Button/index.js.map +1 -0
- package/dist/components/atoms/Checkbox/index.cjs +35 -0
- package/dist/components/atoms/Checkbox/index.cjs.map +1 -0
- package/dist/components/atoms/Checkbox/index.d.ts +26 -0
- package/dist/components/atoms/Checkbox/index.d.ts.map +1 -0
- package/dist/components/atoms/Checkbox/index.js +32 -0
- package/dist/components/atoms/Checkbox/index.js.map +1 -0
- package/dist/components/atoms/Divider/index.cjs +17 -0
- package/dist/components/atoms/Divider/index.cjs.map +1 -0
- package/dist/components/atoms/Divider/index.d.ts +17 -0
- package/dist/components/atoms/Divider/index.d.ts.map +1 -0
- package/dist/components/atoms/Divider/index.js +15 -0
- package/dist/components/atoms/Divider/index.js.map +1 -0
- package/dist/components/atoms/Dot/index.cjs +29 -0
- package/dist/components/atoms/Dot/index.cjs.map +1 -0
- package/dist/components/atoms/Dot/index.d.ts +10 -0
- package/dist/components/atoms/Dot/index.d.ts.map +1 -0
- package/dist/components/atoms/Dot/index.js +27 -0
- package/dist/components/atoms/Dot/index.js.map +1 -0
- package/dist/components/atoms/FeaturedIcon/index.cjs +122 -0
- package/dist/components/atoms/FeaturedIcon/index.cjs.map +1 -0
- package/dist/components/atoms/FeaturedIcon/index.d.ts +15 -0
- package/dist/components/atoms/FeaturedIcon/index.d.ts.map +1 -0
- package/dist/components/atoms/FeaturedIcon/index.js +120 -0
- package/dist/components/atoms/FeaturedIcon/index.js.map +1 -0
- package/dist/components/atoms/Input/components/hint-text.cjs +17 -0
- package/dist/components/atoms/Input/components/hint-text.cjs.map +1 -0
- package/dist/components/atoms/Input/components/hint-text.d.ts +15 -0
- package/dist/components/atoms/Input/components/hint-text.d.ts.map +1 -0
- package/dist/components/atoms/Input/components/hint-text.js +15 -0
- package/dist/components/atoms/Input/components/hint-text.js.map +1 -0
- package/dist/components/atoms/Input/components/label.cjs +28 -0
- package/dist/components/atoms/Input/components/label.cjs.map +1 -0
- package/dist/components/atoms/Input/components/label.d.ts +16 -0
- package/dist/components/atoms/Input/components/label.d.ts.map +1 -0
- package/dist/components/atoms/Input/components/label.js +26 -0
- package/dist/components/atoms/Input/components/label.js.map +1 -0
- package/dist/components/atoms/Input/index.cjs +78 -0
- package/dist/components/atoms/Input/index.cjs.map +1 -0
- package/dist/components/atoms/Input/index.d.ts +60 -0
- package/dist/components/atoms/Input/index.d.ts.map +1 -0
- package/dist/components/atoms/Input/index.js +72 -0
- package/dist/components/atoms/Input/index.js.map +1 -0
- package/dist/components/atoms/LoadingIndicator/index.cjs +54 -0
- package/dist/components/atoms/LoadingIndicator/index.cjs.map +1 -0
- package/dist/components/atoms/LoadingIndicator/index.d.ts +24 -0
- package/dist/components/atoms/LoadingIndicator/index.d.ts.map +1 -0
- package/dist/components/atoms/LoadingIndicator/index.js +52 -0
- package/dist/components/atoms/LoadingIndicator/index.js.map +1 -0
- package/dist/components/atoms/RadioButton/index.cjs +43 -0
- package/dist/components/atoms/RadioButton/index.cjs.map +1 -0
- package/dist/components/atoms/RadioButton/index.d.ts +33 -0
- package/dist/components/atoms/RadioButton/index.d.ts.map +1 -0
- package/dist/components/atoms/RadioButton/index.js +39 -0
- package/dist/components/atoms/RadioButton/index.js.map +1 -0
- package/dist/components/atoms/Toggle/index.cjs +63 -0
- package/dist/components/atoms/Toggle/index.cjs.map +1 -0
- package/dist/components/atoms/Toggle/index.d.ts +26 -0
- package/dist/components/atoms/Toggle/index.d.ts.map +1 -0
- package/dist/components/atoms/Toggle/index.js +60 -0
- package/dist/components/atoms/Toggle/index.js.map +1 -0
- package/dist/components/atoms/Tooltip/index.cjs +22 -0
- package/dist/components/atoms/Tooltip/index.cjs.map +1 -0
- package/dist/components/atoms/Tooltip/index.d.ts +30 -0
- package/dist/components/atoms/Tooltip/index.d.ts.map +1 -0
- package/dist/components/atoms/Tooltip/index.js +19 -0
- package/dist/components/atoms/Tooltip/index.js.map +1 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-account-item.cjs +22 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-account-item.cjs.map +1 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-account-item.d.ts +13 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-account-item.d.ts.map +1 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-account-item.js +20 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-account-item.js.map +1 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-item.cjs +44 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-item.cjs.map +1 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-item.d.ts +19 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-item.d.ts.map +1 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-item.js +42 -0
- package/dist/components/molecules/Breadcrumbs/components/breadcrumb-item.js.map +1 -0
- package/dist/components/molecules/Breadcrumbs/index.cjs +38 -0
- package/dist/components/molecules/Breadcrumbs/index.cjs.map +1 -0
- package/dist/components/molecules/Breadcrumbs/index.d.ts +25 -0
- package/dist/components/molecules/Breadcrumbs/index.d.ts.map +1 -0
- package/dist/components/molecules/Breadcrumbs/index.js +35 -0
- package/dist/components/molecules/Breadcrumbs/index.js.map +1 -0
- package/dist/components/molecules/ButtonGroup/index.cjs +64 -0
- package/dist/components/molecules/ButtonGroup/index.cjs.map +1 -0
- package/dist/components/molecules/ButtonGroup/index.d.ts +51 -0
- package/dist/components/molecules/ButtonGroup/index.d.ts.map +1 -0
- package/dist/components/molecules/ButtonGroup/index.js +60 -0
- package/dist/components/molecules/ButtonGroup/index.js.map +1 -0
- package/dist/components/molecules/Dropdown/index.cjs +66 -0
- package/dist/components/molecules/Dropdown/index.cjs.map +1 -0
- package/dist/components/molecules/Dropdown/index.d.ts +39 -0
- package/dist/components/molecules/Dropdown/index.d.ts.map +1 -0
- package/dist/components/molecules/Dropdown/index.js +64 -0
- package/dist/components/molecules/Dropdown/index.js.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-avatar.cjs +14 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-avatar.cjs.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-avatar.d.ts +16 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-avatar.d.ts.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-avatar.js +12 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-avatar.js.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-checkbox.cjs +13 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-checkbox.cjs.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-checkbox.d.ts +9 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-checkbox.d.ts.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-checkbox.js +11 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-checkbox.js.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-card.cjs +15 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-card.cjs.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-card.d.ts +21 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-card.d.ts.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-card.js +13 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-card.js.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-simple.cjs +14 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-simple.cjs.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-simple.d.ts +9 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-simple.d.ts.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-simple.js +12 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-icon-simple.js.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-payment-icon.cjs +14 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-payment-icon.cjs.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-payment-icon.d.ts +16 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-payment-icon.d.ts.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-payment-icon.js +12 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-payment-icon.js.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-radio-button.cjs +12 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-radio-button.cjs.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-radio-button.d.ts +9 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-radio-button.d.ts.map +1 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-radio-button.js +10 -0
- package/dist/components/molecules/RadioGroup/components/radio-group-radio-button.js.map +1 -0
- package/dist/components/molecules/RadioGroup/index.cjs +18 -0
- package/dist/components/molecules/RadioGroup/index.cjs.map +1 -0
- package/dist/components/molecules/RadioGroup/index.d.ts +7 -0
- package/dist/components/molecules/RadioGroup/index.d.ts.map +1 -0
- package/dist/components/molecules/RadioGroup/index.js +7 -0
- package/dist/components/molecules/RadioGroup/index.js.map +1 -0
- package/dist/components/molecules/RadioGroup/radioGroup.types.d.ts +12 -0
- package/dist/components/molecules/RadioGroup/radioGroup.types.d.ts.map +1 -0
- package/dist/components/molecules/SectionHeader/index.cjs +20 -0
- package/dist/components/molecules/SectionHeader/index.cjs.map +1 -0
- package/dist/components/molecules/SectionHeader/index.d.ts +9 -0
- package/dist/components/molecules/SectionHeader/index.d.ts.map +1 -0
- package/dist/components/molecules/SectionHeader/index.js +18 -0
- package/dist/components/molecules/SectionHeader/index.js.map +1 -0
- package/dist/components/molecules/Select/components/combobox.cjs +47 -0
- package/dist/components/molecules/Select/components/combobox.cjs.map +1 -0
- package/dist/components/molecules/Select/components/combobox.d.ts +15 -0
- package/dist/components/molecules/Select/components/combobox.d.ts.map +1 -0
- package/dist/components/molecules/Select/components/combobox.js +45 -0
- package/dist/components/molecules/Select/components/combobox.js.map +1 -0
- package/dist/components/molecules/Select/components/popover.cjs +14 -0
- package/dist/components/molecules/Select/components/popover.cjs.map +1 -0
- package/dist/components/molecules/Select/components/popover.d.ts +8 -0
- package/dist/components/molecules/Select/components/popover.d.ts.map +1 -0
- package/dist/components/molecules/Select/components/popover.js +12 -0
- package/dist/components/molecules/Select/components/popover.js.map +1 -0
- package/dist/components/molecules/Select/components/select-item.cjs +54 -0
- package/dist/components/molecules/Select/components/select-item.cjs.map +1 -0
- package/dist/components/molecules/Select/components/select-item.d.ts +11 -0
- package/dist/components/molecules/Select/components/select-item.d.ts.map +1 -0
- package/dist/components/molecules/Select/components/select-item.js +52 -0
- package/dist/components/molecules/Select/components/select-item.js.map +1 -0
- package/dist/components/molecules/Select/components/select-shared.cjs +20 -0
- package/dist/components/molecules/Select/components/select-shared.cjs.map +1 -0
- package/dist/components/molecules/Select/components/select-shared.d.ts +59 -0
- package/dist/components/molecules/Select/components/select-shared.d.ts.map +1 -0
- package/dist/components/molecules/Select/components/select-shared.js +17 -0
- package/dist/components/molecules/Select/components/select-shared.js.map +1 -0
- package/dist/components/molecules/Select/index.cjs +37 -0
- package/dist/components/molecules/Select/index.cjs.map +1 -0
- package/dist/components/molecules/Select/index.d.ts +19 -0
- package/dist/components/molecules/Select/index.d.ts.map +1 -0
- package/dist/components/molecules/Select/index.js +33 -0
- package/dist/components/molecules/Select/index.js.map +1 -0
- package/dist/components/organisms/PageHeader/components/page-header-simple.cjs +14 -0
- package/dist/components/organisms/PageHeader/components/page-header-simple.cjs.map +1 -0
- package/dist/components/organisms/PageHeader/components/page-header-simple.d.ts +24 -0
- package/dist/components/organisms/PageHeader/components/page-header-simple.d.ts.map +1 -0
- package/dist/components/organisms/PageHeader/components/page-header-simple.js +12 -0
- package/dist/components/organisms/PageHeader/components/page-header-simple.js.map +1 -0
- package/dist/components/organisms/PageHeader/index.cjs +8 -0
- package/dist/components/organisms/PageHeader/index.cjs.map +1 -0
- package/dist/components/organisms/PageHeader/index.d.ts +7 -0
- package/dist/components/organisms/PageHeader/index.d.ts.map +1 -0
- package/dist/components/organisms/PageHeader/index.js +2 -0
- package/dist/components/organisms/PageHeader/index.js.map +1 -0
- package/dist/components/templates/NotFoundPage/index.cjs +19 -0
- package/dist/components/templates/NotFoundPage/index.cjs.map +1 -0
- package/dist/components/templates/NotFoundPage/index.d.ts +25 -0
- package/dist/components/templates/NotFoundPage/index.d.ts.map +1 -0
- package/dist/components/templates/NotFoundPage/index.js +17 -0
- package/dist/components/templates/NotFoundPage/index.js.map +1 -0
- package/dist/components/templates/PageLayout/index.cjs +30 -0
- package/dist/components/templates/PageLayout/index.cjs.map +1 -0
- package/dist/components/templates/PageLayout/index.d.ts +43 -0
- package/dist/components/templates/PageLayout/index.d.ts.map +1 -0
- package/dist/components/templates/PageLayout/index.js +28 -0
- package/dist/components/templates/PageLayout/index.js.map +1 -0
- package/dist/hooks/useResizeObserver/index.cjs +47 -0
- package/dist/hooks/useResizeObserver/index.cjs.map +1 -0
- package/dist/hooks/useResizeObserver/index.d.ts +25 -0
- package/dist/hooks/useResizeObserver/index.d.ts.map +1 -0
- package/dist/hooks/useResizeObserver/index.js +45 -0
- package/dist/hooks/useResizeObserver/index.js.map +1 -0
- package/dist/providers/ErrorBoundary/index.cjs +36 -0
- package/dist/providers/ErrorBoundary/index.cjs.map +1 -0
- package/dist/providers/ErrorBoundary/index.d.ts +32 -0
- package/dist/providers/ErrorBoundary/index.d.ts.map +1 -0
- package/dist/providers/ErrorBoundary/index.js +34 -0
- package/dist/providers/ErrorBoundary/index.js.map +1 -0
- package/dist/src/components/atoms/Avatar/avatar.utils.d.ts +10 -0
- package/dist/src/components/atoms/Avatar/avatar.utils.d.ts.map +1 -0
- package/dist/src/components/atoms/Avatar/components/avatar-add-button.d.ts +9 -0
- package/dist/src/components/atoms/Avatar/components/avatar-add-button.d.ts.map +1 -0
- package/dist/src/components/atoms/Avatar/components/avatar-company-icon.d.ts +8 -0
- package/dist/src/components/atoms/Avatar/components/avatar-company-icon.d.ts.map +1 -0
- package/dist/src/components/atoms/Avatar/components/avatar-count.d.ts +7 -0
- package/dist/src/components/atoms/Avatar/components/avatar-count.d.ts.map +1 -0
- package/dist/src/components/atoms/Avatar/components/avatar-online-indicator.d.ts +8 -0
- package/dist/src/components/atoms/Avatar/components/avatar-online-indicator.d.ts.map +1 -0
- package/dist/src/components/atoms/Avatar/components/verified-tick.d.ts +7 -0
- package/dist/src/components/atoms/Avatar/components/verified-tick.d.ts.map +1 -0
- package/dist/src/components/atoms/Avatar/index.d.ts +65 -0
- package/dist/src/components/atoms/Avatar/index.d.ts.map +1 -0
- package/dist/src/components/atoms/Badge/badge.types.d.ts +22 -0
- package/dist/src/components/atoms/Badge/badge.types.d.ts.map +1 -0
- package/dist/src/components/atoms/Badge/index.d.ts +129 -0
- package/dist/src/components/atoms/Badge/index.d.ts.map +1 -0
- package/dist/src/components/atoms/Button/index.d.ts +111 -0
- package/dist/src/components/atoms/Button/index.d.ts.map +1 -0
- package/dist/src/components/atoms/Checkbox/index.d.ts +26 -0
- package/dist/src/components/atoms/Checkbox/index.d.ts.map +1 -0
- package/dist/src/components/atoms/Divider/index.d.ts +17 -0
- package/dist/src/components/atoms/Divider/index.d.ts.map +1 -0
- package/dist/src/components/atoms/Dot/index.d.ts +5 -0
- package/dist/src/components/atoms/Dot/index.d.ts.map +1 -0
- package/dist/src/components/atoms/FeaturedIcon/index.d.ts +15 -0
- package/dist/src/components/atoms/FeaturedIcon/index.d.ts.map +1 -0
- package/dist/src/components/atoms/Input/components/hint-text.d.ts +15 -0
- package/dist/src/components/atoms/Input/components/hint-text.d.ts.map +1 -0
- package/dist/src/components/atoms/Input/components/label.d.ts +16 -0
- package/dist/src/components/atoms/Input/components/label.d.ts.map +1 -0
- package/dist/src/components/atoms/Input/index.d.ts +60 -0
- package/dist/src/components/atoms/Input/index.d.ts.map +1 -0
- package/dist/src/components/atoms/LoadingIndicator/index.d.ts +19 -0
- package/dist/src/components/atoms/LoadingIndicator/index.d.ts.map +1 -0
- package/dist/src/components/atoms/RadioButton/index.d.ts +33 -0
- package/dist/src/components/atoms/RadioButton/index.d.ts.map +1 -0
- package/dist/src/components/atoms/Toggle/index.d.ts +21 -0
- package/dist/src/components/atoms/Toggle/index.d.ts.map +1 -0
- package/dist/src/components/atoms/Tooltip/index.d.ts +30 -0
- package/dist/src/components/atoms/Tooltip/index.d.ts.map +1 -0
- package/dist/src/components/molecules/Breadcrumbs/components/breadcrumb-account-item.d.ts +13 -0
- package/dist/src/components/molecules/Breadcrumbs/components/breadcrumb-account-item.d.ts.map +1 -0
- package/dist/src/components/molecules/Breadcrumbs/components/breadcrumb-item.d.ts +19 -0
- package/dist/src/components/molecules/Breadcrumbs/components/breadcrumb-item.d.ts.map +1 -0
- package/dist/src/components/molecules/Breadcrumbs/index.d.ts +25 -0
- package/dist/src/components/molecules/Breadcrumbs/index.d.ts.map +1 -0
- package/dist/src/components/molecules/ButtonGroup/index.d.ts +41 -0
- package/dist/src/components/molecules/ButtonGroup/index.d.ts.map +1 -0
- package/dist/src/components/molecules/Dropdown/index.d.ts +35 -0
- package/dist/src/components/molecules/Dropdown/index.d.ts.map +1 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-avatar.d.ts +16 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-avatar.d.ts.map +1 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-checkbox.d.ts +9 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-checkbox.d.ts.map +1 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-icon-card.d.ts +21 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-icon-card.d.ts.map +1 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-icon-simple.d.ts +19 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-icon-simple.d.ts.map +1 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-payment-icon.d.ts +16 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-payment-icon.d.ts.map +1 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-radio-button.d.ts +9 -0
- package/dist/src/components/molecules/RadioGroup/components/radio-group-radio-button.d.ts.map +1 -0
- package/dist/src/components/molecules/RadioGroup/index.d.ts +7 -0
- package/dist/src/components/molecules/RadioGroup/index.d.ts.map +1 -0
- package/dist/src/components/molecules/RadioGroup/radioGroup.types.d.ts +12 -0
- package/dist/src/components/molecules/RadioGroup/radioGroup.types.d.ts.map +1 -0
- package/dist/src/components/molecules/SectionHeader/index.d.ts +9 -0
- package/dist/src/components/molecules/SectionHeader/index.d.ts.map +1 -0
- package/dist/src/components/molecules/Select/components/combobox.d.ts +15 -0
- package/dist/src/components/molecules/Select/components/combobox.d.ts.map +1 -0
- package/dist/src/components/molecules/Select/components/popover.d.ts +8 -0
- package/dist/src/components/molecules/Select/components/popover.d.ts.map +1 -0
- package/dist/src/components/molecules/Select/components/select-item.d.ts +11 -0
- package/dist/src/components/molecules/Select/components/select-item.d.ts.map +1 -0
- package/dist/src/components/molecules/Select/components/select-shared.d.ts +59 -0
- package/dist/src/components/molecules/Select/components/select-shared.d.ts.map +1 -0
- package/dist/src/components/molecules/Select/index.d.ts +19 -0
- package/dist/src/components/molecules/Select/index.d.ts.map +1 -0
- package/dist/src/components/organisms/PageHeader/components/page-header-simple.d.ts +24 -0
- package/dist/src/components/organisms/PageHeader/components/page-header-simple.d.ts.map +1 -0
- package/dist/src/components/organisms/PageHeader/index.d.ts +2 -0
- package/dist/src/components/organisms/PageHeader/index.d.ts.map +1 -0
- package/dist/src/components/templates/NotFoundPage/index.d.ts +25 -0
- package/dist/src/components/templates/NotFoundPage/index.d.ts.map +1 -0
- package/dist/src/components/templates/PageLayout/index.d.ts +43 -0
- package/dist/src/components/templates/PageLayout/index.d.ts.map +1 -0
- package/dist/src/hooks/useResizeObserver/index.d.ts +25 -0
- package/dist/src/hooks/useResizeObserver/index.d.ts.map +1 -0
- package/dist/src/providers/ErrorBoundary/index.d.ts +32 -0
- package/dist/src/providers/ErrorBoundary/index.d.ts.map +1 -0
- package/dist/src/utilities/cx/index.d.ts +22 -0
- package/dist/src/utilities/cx/index.d.ts.map +1 -0
- package/dist/src/utilities/isReactComponent/index.d.ts +24 -0
- package/dist/src/utilities/isReactComponent/index.d.ts.map +1 -0
- package/dist/src/utilities/renderUtils/index.d.ts +56 -0
- package/dist/src/utilities/renderUtils/index.d.ts.map +1 -0
- package/dist/styles.css +101 -0
- package/dist/utilities/cx/index.cjs +41 -0
- package/dist/utilities/cx/index.cjs.map +1 -0
- package/dist/utilities/cx/index.d.ts +22 -0
- package/dist/utilities/cx/index.d.ts.map +1 -0
- package/dist/utilities/cx/index.js +38 -0
- package/dist/utilities/cx/index.js.map +1 -0
- package/dist/utilities/isReactComponent/index.cjs +40 -0
- package/dist/utilities/isReactComponent/index.cjs.map +1 -0
- package/dist/utilities/isReactComponent/index.d.ts +24 -0
- package/dist/utilities/isReactComponent/index.d.ts.map +1 -0
- package/dist/utilities/isReactComponent/index.js +35 -0
- package/dist/utilities/isReactComponent/index.js.map +1 -0
- package/dist/utilities/renderUtils/index.cjs +122 -0
- package/dist/utilities/renderUtils/index.cjs.map +1 -0
- package/dist/utilities/renderUtils/index.d.ts +56 -0
- package/dist/utilities/renderUtils/index.d.ts.map +1 -0
- package/dist/utilities/renderUtils/index.js +114 -0
- package/dist/utilities/renderUtils/index.js.map +1 -0
- package/package.json +135 -0
package/README.md
ADDED
|
@@ -0,0 +1,338 @@
|
|
|
1
|
+
# `@flipdish/ui-library`
|
|
2
|
+
|
|
3
|
+
Atomic-design component library for the property-service MFE. Built on Tailwind v4 + Untitled UI primitives, consumed by `packages/frontend`.
|
|
4
|
+
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
## TODO: future extraction to a standalone repo
|
|
8
|
+
|
|
9
|
+
This package already uses its final name, `@flipdish/ui-library`. Inside this monorepo it resolves to source via `workspace:*` (no build step); the import paths below are the public API today and stay identical after extraction.
|
|
10
|
+
|
|
11
|
+
**Why call out a future extraction:**
|
|
12
|
+
|
|
13
|
+
- This package is currently one MFE's POC; the published library will be a curated, org-wide system maintained by the design-system team.
|
|
14
|
+
- Keeping the name and import surface stable now means the move to a standalone repo + published npm package is a mechanical change, not an API break.
|
|
15
|
+
|
|
16
|
+
**When to extract:**
|
|
17
|
+
|
|
18
|
+
When the design system team is ready to move this library to its own repo and publish to internal npm. At that point:
|
|
19
|
+
|
|
20
|
+
1. Move source out to a new `flipdish/ui-library` (or equivalent) repo.
|
|
21
|
+
2. Keep `name` in `package.json` as `@flipdish/ui-library` (already set).
|
|
22
|
+
3. Add a build pipeline (Vite/Rollup → `dist/`). Then expand each entry in `exports` from the source-only shorthand:
|
|
23
|
+
```jsonc
|
|
24
|
+
"./atoms/*": "./src/components/atoms/*/index.tsx"
|
|
25
|
+
```
|
|
26
|
+
to the conditional shape used by `@flipdish/portal-library`:
|
|
27
|
+
```jsonc
|
|
28
|
+
"./atoms/*": {
|
|
29
|
+
"types": "./dist/components/atoms/*/index.d.ts",
|
|
30
|
+
"import": "./dist/components/atoms/*/index.js",
|
|
31
|
+
"node": "./dist/components/atoms/*/index.cjs.js"
|
|
32
|
+
}
|
|
33
|
+
```
|
|
34
|
+
The keys (`./atoms/*` etc.) stay identical, so consumer import paths don't change.
|
|
35
|
+
4. Add `tailwindcss`, `@tailwindcss/vite`, `postcss-prefix-selector`, `vite-plugin-css-injected-by-js` to the new repo's `devDependencies` (needed at that point for Storybook + the lib's own build).
|
|
36
|
+
5. In the consuming repo, replace `"@flipdish/ui-library": "workspace:*"` with `"@flipdish/ui-library": "^<version>"`.
|
|
37
|
+
6. Import sites need no changes — the package name and subpaths are unchanged.
|
|
38
|
+
7. Delete `packages/ui-library/` from this repo.
|
|
39
|
+
8. Renovate (already wired in `renovate.json`) auto-updates minor/patch versions thereafter.
|
|
40
|
+
|
|
41
|
+
The rename is a single mechanical PR — the API shape (`peerDependencies`, exports keys, atomic folder structure) stays the same. Naming today is therefore a _placeholder_, not a contract.
|
|
42
|
+
|
|
43
|
+
The same pattern applies to the planned design-tokens package: scaffolded as `@flipdish/ui-tokens` locally, will extract to `@flipdish/ui-tokens` later.
|
|
44
|
+
|
|
45
|
+
---
|
|
46
|
+
|
|
47
|
+
## Layout
|
|
48
|
+
|
|
49
|
+
```text
|
|
50
|
+
src/
|
|
51
|
+
├── styles.css # shared Tailwind runtime (plugins, variants, @utility, base resets) → `@flipdish/ui-library/styles`
|
|
52
|
+
├── components/
|
|
53
|
+
│ ├── atoms/ # paste target — smallest building blocks (Button, Input, Badge …)
|
|
54
|
+
│ ├── molecules/ # paste target — compose atoms (FormField, RadioGroup …)
|
|
55
|
+
│ ├── organisms/ # paste target — compose atoms + molecules (Modal, Toaster …)
|
|
56
|
+
│ └── templates/ # page-shaped layouts (NotFoundPage, PageLayout, MfeShell)
|
|
57
|
+
│ └── NotFoundPage/
|
|
58
|
+
│ ├── index.tsx # component implementation (not a barrel)
|
|
59
|
+
│ └── NotFoundPage.test.tsx # co-located test (greppable name)
|
|
60
|
+
├── providers/ # cross-cutting behavioural wrappers, NOT on the visual atomic ladder (ErrorBoundary …)
|
|
61
|
+
│ └── ErrorBoundary/ # wraps react-error-boundary behind a stable seam → `@flipdish/ui-library/providers/ErrorBoundary`
|
|
62
|
+
│ └── index.tsx
|
|
63
|
+
├── hooks/ # layer-agnostic hooks (useMediaQuery …) — paste target
|
|
64
|
+
├── utilities/ # layer-agnostic helpers
|
|
65
|
+
│ ├── cx/
|
|
66
|
+
│ │ └── index.ts # cx (extendTailwindMerge wrapper) + sortCx — shared, pure JS
|
|
67
|
+
│ └── renderUtils/
|
|
68
|
+
│ ├── index.ts # getMicroFrontendAttribute, lazyWithRetry, getAppId, ... (web-only MFE runtime)
|
|
69
|
+
│ └── renderUtils.test.ts # co-located test (planned)
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
Empty atomic layers carry a `.gitkeep` until the first component is pasted. The
|
|
73
|
+
class-merge helper is `cx`/`sortCx` (Untitled UI naming), living under
|
|
74
|
+
`utilities/` — there is no separate `utils/cn`.
|
|
75
|
+
|
|
76
|
+
**Single convention across the lib — folder-as-module everywhere:**
|
|
77
|
+
|
|
78
|
+
- Every module lives in its own folder named after the export (`Button/`, `NotFoundPage/`, `renderUtils/`, `cx/`).
|
|
79
|
+
- The folder contains `index.ts` (or `index.tsx` for components) — this is the **implementation**, not a barrel re-export.
|
|
80
|
+
- Co-located files use the explicit name to stay greppable: `Button/Button.test.tsx`, `renderUtils/renderUtils.test.ts`, `Button/Button.variants.ts`.
|
|
81
|
+
- No barrel files anywhere — every export comes from the folder's own `index.ts`.
|
|
82
|
+
|
|
83
|
+
Why one convention instead of two? The lib's import paths are its public API; a single folder-as-module pattern produces consistently short, predictable paths (`@flipdish/ui-library/utilities/renderUtils`) and matches how the components are organised. The `packages/frontend/.cursor/rules/flipdish/ui-folder-structure.mdc` rule that uses `<name>/<name>.utils.ts` is scoped to `packages/frontend/**` only — frontend feature code follows it, ui-library doesn't.
|
|
84
|
+
|
|
85
|
+
**Public consumption** is via wildcard entries in the `exports` field — one per atomic layer (under `components/`) plus `providers`, `hooks` and `utilities`. Component import paths mirror the on-disk folder structure (`components/<layer>/<Name>`). Every wildcard resolves to `<name>/index.{ts,tsx}`:
|
|
86
|
+
|
|
87
|
+
```ts
|
|
88
|
+
// Components
|
|
89
|
+
import { Button } from "@flipdish/ui-library/components/atoms/Button";
|
|
90
|
+
import { NotFoundPage } from "@flipdish/ui-library/components/templates/NotFoundPage";
|
|
91
|
+
|
|
92
|
+
// Providers — cross-cutting behavioural wrappers
|
|
93
|
+
import { ErrorBoundary } from "@flipdish/ui-library/providers/ErrorBoundary";
|
|
94
|
+
|
|
95
|
+
// Hooks
|
|
96
|
+
import { useMediaQuery } from "@flipdish/ui-library/hooks/useMediaQuery";
|
|
97
|
+
|
|
98
|
+
// Utilities — class-merge helper + MFE runtime helpers
|
|
99
|
+
import { cx, sortCx } from "@flipdish/ui-library/utilities/cx";
|
|
100
|
+
import {
|
|
101
|
+
getMicroFrontendAttribute,
|
|
102
|
+
lazyWithRetry,
|
|
103
|
+
} from "@flipdish/ui-library/utilities/renderUtils";
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
Adding a new module (anywhere) is **zero `package.json` changes** — create `src/<area>/<name>/index.ts` and it's importable as `@flipdish/ui-library/<area>/<name>` (e.g. `src/components/atoms/Button/index.tsx` → `@flipdish/ui-library/components/atoms/Button`).
|
|
107
|
+
|
|
108
|
+
The wildcards point straight at `.tsx`/`.ts` source (no build step); the consumer's bundler compiles ui-library as part of its own pipeline.
|
|
109
|
+
|
|
110
|
+
## Shared Tailwind runtime (`./styles`)
|
|
111
|
+
|
|
112
|
+
Everything pasted Untitled UI components depend on at the CSS level — the Tailwind
|
|
113
|
+
plugins, custom variants, `@utility` definitions, base resets — plus the `@source`
|
|
114
|
+
that scans this library for class names, is centralised in `src/styles.css` and
|
|
115
|
+
exported as `@flipdish/ui-library/styles`. Consumers import it from their
|
|
116
|
+
Tailwind entry CSS so each MFE/app doesn't re-declare it:
|
|
117
|
+
|
|
118
|
+
```css
|
|
119
|
+
@layer theme, base, components, utilities;
|
|
120
|
+
|
|
121
|
+
@import "tailwindcss/theme.css" layer(theme);
|
|
122
|
+
@import "@flipdish/ui-tokens/css" layer(theme); /* tokens + [data-theme="dark"] */
|
|
123
|
+
@import "tailwindcss/preflight.css" layer(base);
|
|
124
|
+
@import "@flipdish/ui-library/styles"; /* plugins, variants, @utility, resets, @source */
|
|
125
|
+
@import "tailwindcss/utilities.css" layer(utilities);
|
|
126
|
+
```
|
|
127
|
+
|
|
128
|
+
What stays in the **consumer's** entry CSS (app/bundler concerns, not library
|
|
129
|
+
concerns): the `@layer` order, the `tailwindcss` theme/preflight/utilities imports,
|
|
130
|
+
and any PostCSS scoping (e.g. property-service's `#flipdish-micro-frontend` prefix
|
|
131
|
+
pipeline). `styles.css` declares `@plugin`s, so the plugin packages are ui-library
|
|
132
|
+
`dependencies` (see below) — `@plugin` resolves relative to the file declaring it.
|
|
133
|
+
|
|
134
|
+
## Design tokens
|
|
135
|
+
|
|
136
|
+
Tokens (brand colors, type scale, spacing overrides) do **not** live in this package — they live in the separate `@flipdish/ui-tokens` workspace package (also planned for future extraction to `@flipdish/ui-tokens`). See Phase 2.5 of the migration plan.
|
|
137
|
+
|
|
138
|
+
## Dependency conventions
|
|
139
|
+
|
|
140
|
+
Mirrors the `@flipdish/portal-library` shape so the eventual extraction is a clean rename, not a dep-graph restructure.
|
|
141
|
+
|
|
142
|
+
### Runtime deps → `peerDependencies` (with matching `devDependencies` for typecheck)
|
|
143
|
+
|
|
144
|
+
Peers are split into three buckets: **shared** (every consumer needs them, on any
|
|
145
|
+
platform) and two **platform-specific** buckets (`web-only` / `app-only`) that are
|
|
146
|
+
marked `optional` so a consumer is never warned about the other platform's stack.
|
|
147
|
+
|
|
148
|
+
**Shared — required on every platform:**
|
|
149
|
+
|
|
150
|
+
| Package | Why peer | Version |
|
|
151
|
+
| ------------------- | -------------------------------------------------------------------------------------- | --------- |
|
|
152
|
+
| `react` | Hooks need a singleton React; shared by web + RN | `^19.0.0` |
|
|
153
|
+
| `clsx` | Consumer feature code imports it directly; available for conditional class composition | `^2.1.1` |
|
|
154
|
+
| `tailwind-merge` | Used by the `cx()` helper; sharing one version avoids divergent Tailwind merge configs | `^3.6.0` |
|
|
155
|
+
| `tailwind-variants` | Variant/slot config for component class strings — identical strings resolve on both | `^3.2.2` |
|
|
156
|
+
|
|
157
|
+
**Web-only — `optional` peers (a web consumer provides them; RN never does):**
|
|
158
|
+
|
|
159
|
+
| Package | Why peer | Version |
|
|
160
|
+
| ----------------------- | ------------------------------------------------------------------------------------------------------------------ | --------- |
|
|
161
|
+
| `react-dom` | Web React renderer; no RN equivalent | `^19.0.0` |
|
|
162
|
+
| `react-aria-components` | Web-only a11y primitives Untitled UI is built on (quarantined — see cross-platform rule) | `^1.18.0` |
|
|
163
|
+
| `react-router` | Web routing — `providers/RouteProvider` feeds it into RAC's `RouterProvider`; RN uses react-navigation, never this | `^7.0.0` |
|
|
164
|
+
|
|
165
|
+
**App-only (React Native) — `optional` peers (an RN consumer provides them; web never does):**
|
|
166
|
+
|
|
167
|
+
| Package | Why peer | Version |
|
|
168
|
+
| --------------------------------- | ------------------------------------------------------------------------ | ---------- |
|
|
169
|
+
| `react-native` | RN primitives (`View`, `Pressable`, `TextInput`) used by `.native.tsx` | `>=0.79.0` |
|
|
170
|
+
| `nativewind` | Resolves the shared Tailwind class strings to RN styles at build time | `^4.1.0` |
|
|
171
|
+
| `@react-native-aria/interactions` | RN a11y/interaction hooks — the `react-aria-components` equivalent on RN | `>=0.2.7` |
|
|
172
|
+
| `@react-native-aria/focus` | RN focus management hooks (composed by `.native.tsx` overlay components) | `>=0.2.7` |
|
|
173
|
+
|
|
174
|
+
> **Mirrored in `package.json`.** The same `shared` / `web` / `app` split is encoded
|
|
175
|
+
> as the `x-peer-platforms` field (an `x-`-prefixed field npm/pnpm ignore at install
|
|
176
|
+
> time, since `package.json` allows no comments — purely self-documenting). Nothing
|
|
177
|
+
> enforces consistency, so when you add, rename, or move a peer, update **all three** in
|
|
178
|
+
> lock-step: `peerDependencies`, `peerDependenciesMeta` (the `optional` flag for platform
|
|
179
|
+
> peers), and `x-peer-platforms` — plus the table above.
|
|
180
|
+
|
|
181
|
+
#### Why `optional` instead of required
|
|
182
|
+
|
|
183
|
+
All platform-specific peers are listed in `peerDependenciesMeta` as
|
|
184
|
+
`{ "optional": true }`. `peerDependenciesMeta` is **global** (not per-platform), so
|
|
185
|
+
optional is the only setting that lets a web consumer install without `react-native`
|
|
186
|
+
**and** an RN consumer install without `react-aria-components` — neither gets a
|
|
187
|
+
spurious "missing peer" warning, and **no consumer-side suppression** (`ignoreMissing`,
|
|
188
|
+
`auto-install-peers=false`, `legacy-peer-deps`) is needed. The version ranges still
|
|
189
|
+
apply when a peer **is** present, so a mismatched version is still flagged.
|
|
190
|
+
|
|
191
|
+
**Trade-off (deliberate):** optional peers drop the install-time guarantee that a web
|
|
192
|
+
consumer has `react-aria-components`. That enforcement instead happens where it's
|
|
193
|
+
unambiguous about platform: the **bundler** (a web build importing a RAC-based
|
|
194
|
+
component fails to resolve the missing module) and the **Cursor rules**
|
|
195
|
+
(`cross-platform-components.mdc` quarantines RAC to web `index.tsx`). This keeps the
|
|
196
|
+
single shared package honest for both platforms without forcing either consumer to
|
|
197
|
+
carry the other's dependencies.
|
|
198
|
+
|
|
199
|
+
#### `devDependencies` mirror (local typecheck only — never shipped)
|
|
200
|
+
|
|
201
|
+
Each peer the source actually imports is mirrored in `devDependencies` so the lib's
|
|
202
|
+
own typecheck resolves it:
|
|
203
|
+
|
|
204
|
+
- **Web** (`pnpm typecheck`): `@types/react`, `@types/react-dom`, `react-aria-components`, `react-router`, `clsx`, `tailwind-merge`, `tailwind-variants`.
|
|
205
|
+
- **App** (`pnpm typecheck:native`): `react-native` + `nativewind` (RN module/`className` types). `@react-native-aria/*` are **not** dev-installed yet — they're added per-component when the first overlay `index.native.tsx` (Modal, Select, RadioGroup, …) is written; until then they exist only as optional peers for the RN consumer to provide.
|
|
206
|
+
|
|
207
|
+
`@types/react-native` is intentionally **omitted** — it's deprecated and React Native
|
|
208
|
+
ships its own types since 0.71; adding the DefinitelyTyped package causes duplicate
|
|
209
|
+
global definitions.
|
|
210
|
+
|
|
211
|
+
The class-merge helper is `cx` (`extendTailwindMerge` wrapper, per Untitled UI's Vite
|
|
212
|
+
guide) — not a `cn`/`clsx` wrapper.
|
|
213
|
+
|
|
214
|
+
#### Platform-split typecheck (`tsconfig.json` vs `tsconfig.native.json`)
|
|
215
|
+
|
|
216
|
+
The two platforms have conflicting global types (web has the `DOM` lib; RN does not),
|
|
217
|
+
so they typecheck under separate configs:
|
|
218
|
+
|
|
219
|
+
- `tsconfig.json` → web. Has `lib: ["DOM", …]`; **excludes** `**/*.native.ts(x)` so RN
|
|
220
|
+
files (which import `react-native`) never get checked under the DOM lib.
|
|
221
|
+
- `tsconfig.native.json` → app. Drops the `DOM` lib (`lib: ["ES2020"]`) so any
|
|
222
|
+
accidental `window`/`document`/DOM usage in RN-bound code is a compile error rather
|
|
223
|
+
than a runtime Metro-bundle break. RN module types resolve via normal imports, so no
|
|
224
|
+
`types` override is needed.
|
|
225
|
+
|
|
226
|
+
Because the package currently ships web-only, `tsconfig.native.json` anchors its
|
|
227
|
+
program on the shared, DOM-free utilities (`utilities/cx`, `utilities/isReactComponent`)
|
|
228
|
+
so `typecheck:native` has inputs (no `TS18003`) before any `.native.tsx` exists. New
|
|
229
|
+
`*.native.ts(x)` files are picked up automatically by its include globs.
|
|
230
|
+
|
|
231
|
+
### Tailwind plugins declared by `styles.css` → ui-library `dependencies`
|
|
232
|
+
|
|
233
|
+
| Package | Why |
|
|
234
|
+
| ----------------------------------- | ------------------------------------------------------------------ |
|
|
235
|
+
| `tailwindcss-animate` | `@plugin` declared in `styles.css`; must resolve from this package |
|
|
236
|
+
| `tailwindcss-react-aria-components` | `@plugin` declared in `styles.css`; powers RAC-aware variants |
|
|
237
|
+
|
|
238
|
+
Because `@flipdish/ui-library/styles` declares these via `@plugin`, and
|
|
239
|
+
`@plugin` resolves relative to the file declaring it, the plugins are real
|
|
240
|
+
`dependencies` of ui-library (installed transitively wherever ui-library is) — the
|
|
241
|
+
consumer no longer lists them.
|
|
242
|
+
|
|
243
|
+
### Encapsulated runtime libs → ui-library `dependencies`
|
|
244
|
+
|
|
245
|
+
| Package | Why |
|
|
246
|
+
| ---------------------- | ---------------------------------------------------------------------------------------------- |
|
|
247
|
+
| `react-error-boundary` | Wrapped behind `providers/ErrorBoundary`; consumers use that seam and never import it directly |
|
|
248
|
+
|
|
249
|
+
Unlike the runtime **peers** above (which the consumer also imports), this is an
|
|
250
|
+
implementation detail of `providers/ErrorBoundary`. It's a plain `dependency` so it
|
|
251
|
+
resolves from this package and ships transitively — the consumer imports
|
|
252
|
+
`@flipdish/ui-library/providers/ErrorBoundary`, not `react-error-boundary`.
|
|
253
|
+
It's RN-safe, so it stays a regular dep rather than a web-only one.
|
|
254
|
+
|
|
255
|
+
### App build tools → NOT in ui-library deps
|
|
256
|
+
|
|
257
|
+
`tailwindcss`, `@tailwindcss/vite`, `postcss-prefix-selector`, `vite-plugin-css-injected-by-js` are **build tools for the consuming app**. ui-library never imports them in source — Tailwind classes are plain strings. They stay in `packages/frontend/devDependencies` only.
|
|
258
|
+
|
|
259
|
+
Add them to ui-library's `devDependencies` ONLY when this package gains its own build pipeline (Storybook, Vitest with real CSS rendering, standalone preview app, etc.). Until then, keeping ui-library minimal avoids dead-weight installs.
|
|
260
|
+
|
|
261
|
+
### Atomic design dependency direction
|
|
262
|
+
|
|
263
|
+
Import direction is enforced via the package Cursor rules + code review (this repo
|
|
264
|
+
lints TS with Biome, which can't express wildcard atomic-layer import bans):
|
|
265
|
+
|
|
266
|
+
- atoms → no internal deps
|
|
267
|
+
- molecules → may import atoms
|
|
268
|
+
- organisms → may import atoms + molecules
|
|
269
|
+
- templates → may import atoms + molecules + organisms
|
|
270
|
+
|
|
271
|
+
Hooks and utilities are layer-agnostic and may be imported anywhere (but must not
|
|
272
|
+
import components).
|
|
273
|
+
|
|
274
|
+
## Pasting Untitled UI components
|
|
275
|
+
|
|
276
|
+
Untitled UI source uses a `@/` alias that does NOT resolve inside this package
|
|
277
|
+
(the frontend already owns `@/`). When pasting a component, rewrite its imports to
|
|
278
|
+
package paths and drop the file into the right atomic layer:
|
|
279
|
+
|
|
280
|
+
| Untitled UI import | Rewrite to |
|
|
281
|
+
| ---------------------------------- | --------------------------------------------------------------- |
|
|
282
|
+
| `@/utils/cx` | `@flipdish/ui-library/utilities/cx` |
|
|
283
|
+
| `@/components/base/buttons/button` | `@flipdish/ui-library/components/atoms/Button` (classify layer) |
|
|
284
|
+
| `@/hooks/use-x` | `@flipdish/ui-library/hooks/useX` |
|
|
285
|
+
| `@untitledui/icons` | `@flipdish/ui-icons` (same named exports) |
|
|
286
|
+
|
|
287
|
+
**Icons are out of scope for this library.** `@untitledui/icons` is intentionally
|
|
288
|
+
NOT a dependency. Icons live in the separate `@flipdish/ui-icons` package,
|
|
289
|
+
which re-exports `@untitledui/icons` behind a stable seam. When pasting a component
|
|
290
|
+
that imports `@untitledui/icons`, rewrite the import to `@flipdish/ui-icons`
|
|
291
|
+
(the named exports are identical) — never import `@untitledui/icons` directly here.
|
|
292
|
+
|
|
293
|
+
Use SEMANTIC token utilities only (`bg-primary`, `text-secondary`, …) — never raw
|
|
294
|
+
ramp utilities (`bg-blue-500`). This package's `styles.css`
|
|
295
|
+
(`@flipdish/ui-library/styles`) provides the Tailwind plugins, `dark`
|
|
296
|
+
variant (mapped to `[data-theme="dark"]`), and `@utility` definitions
|
|
297
|
+
(`transition-inherit-all`, `scrollbar-hide`) these components expect — the consumer
|
|
298
|
+
just imports it. See `.cursor/rules/atomic-design.mdc`.
|
|
299
|
+
|
|
300
|
+
## Platform support (web + React Native)
|
|
301
|
+
|
|
302
|
+
This library targets web AND React Native (via NativeWind). Tokens, the component
|
|
303
|
+
API, `tailwind-variants` configs, and `cx`/`sortCx` are shared; primitives and a11y
|
|
304
|
+
libraries diverge via a `.tsx` (web) + `.native.tsx` (RN) file split. See
|
|
305
|
+
`.cursor/rules/cross-platform-components.mdc`.
|
|
306
|
+
|
|
307
|
+
`react-aria-components` (which Untitled UI is built on) is **web-only**. A pasted
|
|
308
|
+
component is web-only until an `index.native.tsx` sibling is written. Metro falls
|
|
309
|
+
back to `index.tsx` when no native sibling exists, so RN consumers must only import
|
|
310
|
+
components marked RN-ready below.
|
|
311
|
+
|
|
312
|
+
| Component | Layer | RN status |
|
|
313
|
+
| ---------------- | -------- | ------------------------------------------------------- |
|
|
314
|
+
| Avatar | atom | TODO(RN) (web markup; no `.native.tsx` yet) |
|
|
315
|
+
| Badge | atom | TODO(RN) (web markup; no `.native.tsx` yet) |
|
|
316
|
+
| Button | atom | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
317
|
+
| Checkbox | atom | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
318
|
+
| Divider | atom | TODO(RN) (web markup; no `.native.tsx` yet) |
|
|
319
|
+
| Dot | atom | TODO(RN) (web markup; no `.native.tsx` yet) |
|
|
320
|
+
| FeaturedIcon | atom | TODO(RN) (web markup; no `.native.tsx` yet) |
|
|
321
|
+
| Input | atom | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
322
|
+
| LoadingIndicator | atom | TODO(RN) (web markup; no `.native.tsx` yet) |
|
|
323
|
+
| RadioButton | atom | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
324
|
+
| Toggle | atom | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
325
|
+
| Tooltip | atom | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
326
|
+
| Breadcrumbs | molecule | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
327
|
+
| ButtonGroup | molecule | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
328
|
+
| Dropdown | molecule | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
329
|
+
| RadioGroup | molecule | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
330
|
+
| SectionHeader | molecule | TODO(RN) (web markup; no `.native.tsx` yet) |
|
|
331
|
+
| Select | molecule | TODO(RN) (RAC-based; web-only until `.native.tsx`) |
|
|
332
|
+
| PageHeader | organism | TODO(RN) (web markup; composes Button + Input) |
|
|
333
|
+
| NotFoundPage | template | No (web-only template) |
|
|
334
|
+
| PageLayout | template | No (web-only template; renders `<main>`) |
|
|
335
|
+
| ErrorBoundary | provider | TODO(RN) (logic RN-safe; default fallback is a `<div>`) |
|
|
336
|
+
|
|
337
|
+
_(Table grows as components are added. `Yes` = has `.native.tsx`; `No` = web-only by
|
|
338
|
+
design; `TODO(RN)` = web ships, RN sibling pending.)_
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Extracts the initials from a full name.
|
|
3
|
+
*
|
|
4
|
+
* @param name - The full name from which to extract initials.
|
|
5
|
+
* @returns The initials of the provided name. If the name contains only one word,
|
|
6
|
+
* it returns the first character of that word. If the name contains two words,
|
|
7
|
+
* it returns the first character of each word.
|
|
8
|
+
*/
|
|
9
|
+
export declare const getInitials: (name: string) => string;
|
|
10
|
+
//# sourceMappingURL=avatar.utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/Avatar/avatar.utils.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,GAAI,MAAM,MAAM,WAGvC,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { ButtonProps as AriaButtonProps } from 'react-aria-components';
|
|
2
|
+
interface AvatarAddButtonProps extends AriaButtonProps {
|
|
3
|
+
size: 'xs' | 'sm' | 'md';
|
|
4
|
+
title?: string;
|
|
5
|
+
className?: string;
|
|
6
|
+
}
|
|
7
|
+
export declare const AvatarAddButton: ({ size, className, title, ...props }: AvatarAddButtonProps) => import("react").JSX.Element;
|
|
8
|
+
export {};
|
|
9
|
+
//# sourceMappingURL=avatar-add-button.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-add-button.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/Avatar/components/avatar-add-button.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAQ5E,UAAU,oBAAqB,SAAQ,eAAe;IACpD,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,eAAe,GAAI,sCAAmD,oBAAoB,gCActG,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
interface AvatarCompanyIconProps {
|
|
2
|
+
size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
|
|
3
|
+
src: string;
|
|
4
|
+
alt?: string;
|
|
5
|
+
}
|
|
6
|
+
export declare const AvatarCompanyIcon: ({ size, src, alt }: AvatarCompanyIconProps) => import("react").JSX.Element;
|
|
7
|
+
export {};
|
|
8
|
+
//# sourceMappingURL=avatar-company-icon.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-company-icon.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/Avatar/components/avatar-company-icon.tsx"],"names":[],"mappings":"AAaA,UAAU,sBAAsB;IAC9B,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;IAC/C,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,eAAO,MAAM,iBAAiB,GAAI,oBAAoB,sBAAsB,gCAM3E,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
5
|
+
|
|
6
|
+
const AvatarCount = ({ count, className }) => (jsxRuntime.jsx("div", { className: cx.cx('absolute right-0 bottom-0 p-px', className), children: jsxRuntime.jsx("div", { className: "flex size-3.5 items-center justify-center rounded-full bg-fg-error-primary text-center text-[10px] leading-[13px] font-bold text-white", children: count }) }));
|
|
7
|
+
|
|
8
|
+
exports.AvatarCount = AvatarCount;
|
|
9
|
+
//# sourceMappingURL=avatar-count.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-count.cjs","sources":["../../../../../src/components/atoms/Avatar/components/avatar-count.tsx"],"sourcesContent":[null],"names":["_jsx","cx"],"mappings":";;;;;AASO,MAAM,WAAW,GAAG,CAAC,EAAE,KAAK,EAAE,SAAS,EAAoB,MAChEA,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEC,KAAE,CAAC,gCAAgC,EAAE,SAAS,CAAC,EAAA,QAAA,EAC7DD,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,wIAAwI,EAAA,QAAA,EACpJ,KAAK,EAAA,CACF,EAAA,CACF;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-count.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/Avatar/components/avatar-count.tsx"],"names":[],"mappings":"AAIA,UAAU,gBAAgB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,WAAW,GAAI,sBAAsB,gBAAgB,gCAMjE,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
3
|
+
|
|
4
|
+
const AvatarCount = ({ count, className }) => (jsx("div", { className: cx('absolute right-0 bottom-0 p-px', className), children: jsx("div", { className: "flex size-3.5 items-center justify-center rounded-full bg-fg-error-primary text-center text-[10px] leading-[13px] font-bold text-white", children: count }) }));
|
|
5
|
+
|
|
6
|
+
export { AvatarCount };
|
|
7
|
+
//# sourceMappingURL=avatar-count.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-count.js","sources":["../../../../../src/components/atoms/Avatar/components/avatar-count.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":";;;AASO,MAAM,WAAW,GAAG,CAAC,EAAE,KAAK,EAAE,SAAS,EAAoB,MAChEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,gCAAgC,EAAE,SAAS,CAAC,EAAA,QAAA,EAC7DA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,wIAAwI,EAAA,QAAA,EACpJ,KAAK,EAAA,CACF,EAAA,CACF;;;;"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
5
|
+
|
|
6
|
+
const sizes = {
|
|
7
|
+
xs: 'size-1.5',
|
|
8
|
+
sm: 'size-2',
|
|
9
|
+
md: 'size-2.5',
|
|
10
|
+
lg: 'size-3',
|
|
11
|
+
xl: 'size-3.5',
|
|
12
|
+
'2xl': 'size-4',
|
|
13
|
+
'3xl': 'size-4.5',
|
|
14
|
+
'4xl': 'size-5',
|
|
15
|
+
};
|
|
16
|
+
const AvatarOnlineIndicator = ({ size, status, className }) => (jsxRuntime.jsx("span", { className: cx.cx('absolute right-0 bottom-0 flex justify-center rounded-full ring-[1.5px] ring-bg-primary', status === 'online' ? 'bg-fg-success-secondary' : 'bg-utility-neutral-300', sizes[size], className), style: {
|
|
17
|
+
backgroundImage: 'radial-gradient(43.75% 43.75% at 50% 28.75%, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.00) 100%), radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0.00) 74.66%, rgba(255, 255, 255, 0.18) 100%), radial-gradient(75% 75% at 50% 0%, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.00) 50%, rgba(255, 255, 255, 0.08) 99%, rgba(255, 255, 255, 0.00) 100%)',
|
|
18
|
+
}, children: jsxRuntime.jsxs("svg", { viewBox: "0 0 7.2 2.85", fill: "none", className: "mt-[10%] h-[20%] w-[60%]", children: [jsxRuntime.jsx("path", { d: "M7.2 1.83107C7.2 2.84235 5.58823 2.19729 3.6 2.19729C1.61177 2.19729 0 2.84235 0 1.83107C0 0.8198 1.61177 0 3.6 0C5.58823 0 7.2 0.8198 7.2 1.83107Z", fill: "url(#reflection-gradient)", fillOpacity: "0.4" }), jsxRuntime.jsx("defs", { children: jsxRuntime.jsxs("linearGradient", { id: "reflection-gradient", x1: "3.6", y1: "0", x2: "3.6", y2: "2.4", gradientUnits: "userSpaceOnUse", children: [jsxRuntime.jsx("stop", { stopColor: "white" }), jsxRuntime.jsx("stop", { offset: "1", stopColor: "white", stopOpacity: "0.1" })] }) })] }) }));
|
|
19
|
+
|
|
20
|
+
exports.AvatarOnlineIndicator = AvatarOnlineIndicator;
|
|
21
|
+
//# sourceMappingURL=avatar-online-indicator.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-online-indicator.cjs","sources":["../../../../../src/components/atoms/Avatar/components/avatar-online-indicator.tsx"],"sourcesContent":[null],"names":["_jsx","cx","_jsxs"],"mappings":";;;;;AAIA,MAAM,KAAK,GAAG;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,UAAU;AACjB,IAAA,KAAK,EAAE,QAAQ;CAChB;MAQY,qBAAqB,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAA8B,MAC3FA,yBACE,SAAS,EAAEC,KAAE,CACX,yFAAyF,EACzF,MAAM,KAAK,QAAQ,GAAG,yBAAyB,GAAG,wBAAwB,EAC1E,KAAK,CAAC,IAAI,CAAC,EACX,SAAS,CACV,EACD,KAAK,EAAE;AACL,QAAA,eAAe,EACb,mXAAmX;AACtX,KAAA,EAAA,QAAA,EAIDC,yBAAK,OAAO,EAAC,cAAc,EAAC,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,0BAA0B,EAAA,QAAA,EAAA,CAC1EF,cAAA,CAAA,MAAA,EAAA,EACE,CAAC,EAAC,qJAAqJ,EACvJ,IAAI,EAAC,2BAA2B,EAChC,WAAW,EAAC,KAAK,GACjB,EACFA,cAAA,CAAA,MAAA,EAAA,EAAA,QAAA,EACEE,eAAA,CAAA,gBAAA,EAAA,EAAgB,EAAE,EAAC,qBAAqB,EAAC,EAAE,EAAC,KAAK,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,KAAK,EAAC,EAAE,EAAC,KAAK,EAAC,aAAa,EAAC,gBAAgB,EAAA,QAAA,EAAA,CACvGF,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,OAAO,EAAA,CAAG,EAC1BA,cAAA,CAAA,MAAA,EAAA,EAAM,MAAM,EAAC,GAAG,EAAC,SAAS,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAA,CAAG,CAAA,EAAA,CACxC,GACZ,CAAA,EAAA,CACH,EAAA,CACD;;;;"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
interface AvatarOnlineIndicatorProps {
|
|
2
|
+
size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl';
|
|
3
|
+
status: 'online' | 'offline';
|
|
4
|
+
className?: string;
|
|
5
|
+
}
|
|
6
|
+
export declare const AvatarOnlineIndicator: ({ size, status, className }: AvatarOnlineIndicatorProps) => import("react").JSX.Element;
|
|
7
|
+
export {};
|
|
8
|
+
//# sourceMappingURL=avatar-online-indicator.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-online-indicator.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/Avatar/components/avatar-online-indicator.tsx"],"names":[],"mappings":"AAeA,UAAU,0BAA0B;IAClC,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;IAC/D,MAAM,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,qBAAqB,GAAI,6BAA6B,0BAA0B,gCA6B5F,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
3
|
+
|
|
4
|
+
const sizes = {
|
|
5
|
+
xs: 'size-1.5',
|
|
6
|
+
sm: 'size-2',
|
|
7
|
+
md: 'size-2.5',
|
|
8
|
+
lg: 'size-3',
|
|
9
|
+
xl: 'size-3.5',
|
|
10
|
+
'2xl': 'size-4',
|
|
11
|
+
'3xl': 'size-4.5',
|
|
12
|
+
'4xl': 'size-5',
|
|
13
|
+
};
|
|
14
|
+
const AvatarOnlineIndicator = ({ size, status, className }) => (jsx("span", { className: cx('absolute right-0 bottom-0 flex justify-center rounded-full ring-[1.5px] ring-bg-primary', status === 'online' ? 'bg-fg-success-secondary' : 'bg-utility-neutral-300', sizes[size], className), style: {
|
|
15
|
+
backgroundImage: 'radial-gradient(43.75% 43.75% at 50% 28.75%, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.00) 100%), radial-gradient(50% 50% at 50% 50%, rgba(255, 255, 255, 0.00) 74.66%, rgba(255, 255, 255, 0.18) 100%), radial-gradient(75% 75% at 50% 0%, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.00) 50%, rgba(255, 255, 255, 0.08) 99%, rgba(255, 255, 255, 0.00) 100%)',
|
|
16
|
+
}, children: jsxs("svg", { viewBox: "0 0 7.2 2.85", fill: "none", className: "mt-[10%] h-[20%] w-[60%]", children: [jsx("path", { d: "M7.2 1.83107C7.2 2.84235 5.58823 2.19729 3.6 2.19729C1.61177 2.19729 0 2.84235 0 1.83107C0 0.8198 1.61177 0 3.6 0C5.58823 0 7.2 0.8198 7.2 1.83107Z", fill: "url(#reflection-gradient)", fillOpacity: "0.4" }), jsx("defs", { children: jsxs("linearGradient", { id: "reflection-gradient", x1: "3.6", y1: "0", x2: "3.6", y2: "2.4", gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "white" }), jsx("stop", { offset: "1", stopColor: "white", stopOpacity: "0.1" })] }) })] }) }));
|
|
17
|
+
|
|
18
|
+
export { AvatarOnlineIndicator };
|
|
19
|
+
//# sourceMappingURL=avatar-online-indicator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"avatar-online-indicator.js","sources":["../../../../../src/components/atoms/Avatar/components/avatar-online-indicator.tsx"],"sourcesContent":[null],"names":["_jsx","_jsxs"],"mappings":";;;AAIA,MAAM,KAAK,GAAG;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,UAAU;AACjB,IAAA,KAAK,EAAE,QAAQ;CAChB;MAQY,qBAAqB,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAA8B,MAC3FA,cACE,SAAS,EAAE,EAAE,CACX,yFAAyF,EACzF,MAAM,KAAK,QAAQ,GAAG,yBAAyB,GAAG,wBAAwB,EAC1E,KAAK,CAAC,IAAI,CAAC,EACX,SAAS,CACV,EACD,KAAK,EAAE;AACL,QAAA,eAAe,EACb,mXAAmX;AACtX,KAAA,EAAA,QAAA,EAIDC,cAAK,OAAO,EAAC,cAAc,EAAC,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,0BAA0B,EAAA,QAAA,EAAA,CAC1ED,GAAA,CAAA,MAAA,EAAA,EACE,CAAC,EAAC,qJAAqJ,EACvJ,IAAI,EAAC,2BAA2B,EAChC,WAAW,EAAC,KAAK,GACjB,EACFA,GAAA,CAAA,MAAA,EAAA,EAAA,QAAA,EACEC,IAAA,CAAA,gBAAA,EAAA,EAAgB,EAAE,EAAC,qBAAqB,EAAC,EAAE,EAAC,KAAK,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,KAAK,EAAC,EAAE,EAAC,KAAK,EAAC,aAAa,EAAC,gBAAgB,EAAA,QAAA,EAAA,CACvGD,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,OAAO,EAAA,CAAG,EAC1BA,GAAA,CAAA,MAAA,EAAA,EAAM,MAAM,EAAC,GAAG,EAAC,SAAS,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAA,CAAG,CAAA,EAAA,CACxC,GACZ,CAAA,EAAA,CACH,EAAA,CACD;;;;"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var cx = require('@flipdish/ui-library/utilities/cx');
|
|
5
|
+
|
|
6
|
+
const sizes = {
|
|
7
|
+
xs: 'size-2.5',
|
|
8
|
+
sm: 'size-3',
|
|
9
|
+
md: 'size-3.5',
|
|
10
|
+
lg: 'size-4',
|
|
11
|
+
xl: 'size-4.5',
|
|
12
|
+
'2xl': 'size-5',
|
|
13
|
+
'3xl': 'size-6',
|
|
14
|
+
'4xl': 'size-8',
|
|
15
|
+
};
|
|
16
|
+
const VerifiedTick = ({ size, className }) => (
|
|
17
|
+
// biome-ignore lint/a11y/noSvgWithoutTitle: this is an icon
|
|
18
|
+
jsxRuntime.jsxs("svg", { className: cx.cx('z-10 text-utility-blue-500', sizes[size], className), viewBox: "0 0 10 10", fill: "none", children: [jsxRuntime.jsx("path", { d: "M7.72237 1.77098C7.81734 2.00068 7.99965 2.18326 8.2292 2.27858L9.03413 2.61199C9.26384 2.70714 9.44635 2.88965 9.5415 3.11936C9.63665 3.34908 9.63665 3.60718 9.5415 3.83689L9.20833 4.64125C9.11313 4.87106 9.113 5.12943 9.20863 5.35913L9.54122 6.16325C9.58839 6.27702 9.61268 6.39897 9.6127 6.52214C9.61272 6.6453 9.58847 6.76726 9.54134 6.88105C9.4942 6.99484 9.42511 7.09823 9.33801 7.18531C9.2509 7.27238 9.14749 7.34144 9.03369 7.38854L8.22934 7.72171C7.99964 7.81669 7.81706 7.99899 7.72174 8.22855L7.38833 9.03348C7.29318 9.26319 7.11067 9.4457 6.88096 9.54085C6.65124 9.636 6.39314 9.636 6.16343 9.54085L5.35907 9.20767C5.12935 9.11276 4.87134 9.11295 4.64177 9.20821L3.83684 9.54115C3.60725 9.63608 3.34937 9.636 3.11984 9.54092C2.89032 9.44585 2.70791 9.26356 2.6127 9.03409L2.27918 8.22892C2.18421 7.99923 2.0019 7.81665 1.77235 7.72133L0.967421 7.38792C0.737807 7.29281 0.555355 7.11041 0.460169 6.88083C0.364983 6.65125 0.364854 6.39327 0.45981 6.16359L0.792984 5.35924C0.8879 5.12952 0.887707 4.87151 0.792445 4.64193L0.459749 3.83642C0.41258 3.72265 0.388291 3.60069 0.388272 3.47753C0.388252 3.35436 0.412501 3.2324 0.459634 3.11861C0.506767 3.00482 0.57586 2.90144 0.662965 2.81436C0.75007 2.72728 0.853479 2.65822 0.967283 2.61113L1.77164 2.27795C2.00113 2.18306 2.1836 2.00099 2.27899 1.7717L2.6124 0.966768C2.70755 0.737054 2.89006 0.554547 3.11978 0.459397C3.34949 0.364246 3.60759 0.364246 3.83731 0.459397L4.64166 0.792571C4.87138 0.887487 5.12939 0.887293 5.35897 0.792031L6.16424 0.459913C6.39392 0.364816 6.65197 0.364836 6.88164 0.459968C7.11131 0.555099 7.29379 0.737554 7.38895 0.967208L7.72247 1.77238L7.72237 1.77098Z", className: "fill-current" }), jsxRuntime.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.95829 3.68932C7.02509 3.58439 7.04747 3.45723 7.02051 3.3358C6.99356 3.21437 6.91946 3.10862 6.81454 3.04182C6.70961 2.97502 6.58245 2.95264 6.46102 2.97959C6.33959 3.00655 6.23384 3.08064 6.16704 3.18557L4.33141 6.06995L3.49141 5.01995C3.41375 4.92281 3.30069 4.8605 3.17709 4.84673C3.05349 4.83296 2.92949 4.86885 2.83235 4.94651C2.73522 5.02417 2.67291 5.13723 2.65914 5.26083C2.64536 5.38443 2.68125 5.50843 2.75891 5.60557L4.00891 7.16807C4.0555 7.22638 4.11533 7.27271 4.18344 7.30323C4.25154 7.33375 4.32595 7.34757 4.40047 7.34353C4.47499 7.3395 4.54747 7.31773 4.61188 7.28004C4.67629 7.24234 4.73077 7.18981 4.77079 7.12682L6.95829 3.68932Z", fill: "white" })] }));
|
|
19
|
+
|
|
20
|
+
exports.VerifiedTick = VerifiedTick;
|
|
21
|
+
//# sourceMappingURL=verified-tick.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"verified-tick.cjs","sources":["../../../../../src/components/atoms/Avatar/components/verified-tick.tsx"],"sourcesContent":[null],"names":["_jsxs","cx","_jsx"],"mappings":";;;;;AAIA,MAAM,KAAK,GAAG;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,QAAQ;CAChB;AAOM,MAAM,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,SAAS,EAAqB;AACjE;AACAA,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEC,KAAE,CAAC,4BAA4B,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,EAAE,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAA,QAAA,EAAA,CACvGC,cAAA,CAAA,MAAA,EAAA,EACE,CAAC,EAAC,inDAAinD,EACnnD,SAAS,EAAC,cAAc,EAAA,CACxB,EACFA,yBACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,+oBAA+oB,EACjpB,IAAI,EAAC,OAAO,EAAA,CACZ,CAAA,EAAA,CACE;;;;"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
interface VerifiedTickProps {
|
|
2
|
+
size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl';
|
|
3
|
+
className?: string;
|
|
4
|
+
}
|
|
5
|
+
export declare const VerifiedTick: ({ size, className }: VerifiedTickProps) => import("react").JSX.Element;
|
|
6
|
+
export {};
|
|
7
|
+
//# sourceMappingURL=verified-tick.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"verified-tick.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/Avatar/components/verified-tick.tsx"],"names":[],"mappings":"AAeA,UAAU,iBAAiB;IACzB,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,YAAY,GAAI,qBAAqB,iBAAiB,gCAclE,CAAC"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { cx } from '@flipdish/ui-library/utilities/cx';
|
|
3
|
+
|
|
4
|
+
const sizes = {
|
|
5
|
+
xs: 'size-2.5',
|
|
6
|
+
sm: 'size-3',
|
|
7
|
+
md: 'size-3.5',
|
|
8
|
+
lg: 'size-4',
|
|
9
|
+
xl: 'size-4.5',
|
|
10
|
+
'2xl': 'size-5',
|
|
11
|
+
'3xl': 'size-6',
|
|
12
|
+
'4xl': 'size-8',
|
|
13
|
+
};
|
|
14
|
+
const VerifiedTick = ({ size, className }) => (
|
|
15
|
+
// biome-ignore lint/a11y/noSvgWithoutTitle: this is an icon
|
|
16
|
+
jsxs("svg", { className: cx('z-10 text-utility-blue-500', sizes[size], className), viewBox: "0 0 10 10", fill: "none", children: [jsx("path", { d: "M7.72237 1.77098C7.81734 2.00068 7.99965 2.18326 8.2292 2.27858L9.03413 2.61199C9.26384 2.70714 9.44635 2.88965 9.5415 3.11936C9.63665 3.34908 9.63665 3.60718 9.5415 3.83689L9.20833 4.64125C9.11313 4.87106 9.113 5.12943 9.20863 5.35913L9.54122 6.16325C9.58839 6.27702 9.61268 6.39897 9.6127 6.52214C9.61272 6.6453 9.58847 6.76726 9.54134 6.88105C9.4942 6.99484 9.42511 7.09823 9.33801 7.18531C9.2509 7.27238 9.14749 7.34144 9.03369 7.38854L8.22934 7.72171C7.99964 7.81669 7.81706 7.99899 7.72174 8.22855L7.38833 9.03348C7.29318 9.26319 7.11067 9.4457 6.88096 9.54085C6.65124 9.636 6.39314 9.636 6.16343 9.54085L5.35907 9.20767C5.12935 9.11276 4.87134 9.11295 4.64177 9.20821L3.83684 9.54115C3.60725 9.63608 3.34937 9.636 3.11984 9.54092C2.89032 9.44585 2.70791 9.26356 2.6127 9.03409L2.27918 8.22892C2.18421 7.99923 2.0019 7.81665 1.77235 7.72133L0.967421 7.38792C0.737807 7.29281 0.555355 7.11041 0.460169 6.88083C0.364983 6.65125 0.364854 6.39327 0.45981 6.16359L0.792984 5.35924C0.8879 5.12952 0.887707 4.87151 0.792445 4.64193L0.459749 3.83642C0.41258 3.72265 0.388291 3.60069 0.388272 3.47753C0.388252 3.35436 0.412501 3.2324 0.459634 3.11861C0.506767 3.00482 0.57586 2.90144 0.662965 2.81436C0.75007 2.72728 0.853479 2.65822 0.967283 2.61113L1.77164 2.27795C2.00113 2.18306 2.1836 2.00099 2.27899 1.7717L2.6124 0.966768C2.70755 0.737054 2.89006 0.554547 3.11978 0.459397C3.34949 0.364246 3.60759 0.364246 3.83731 0.459397L4.64166 0.792571C4.87138 0.887487 5.12939 0.887293 5.35897 0.792031L6.16424 0.459913C6.39392 0.364816 6.65197 0.364836 6.88164 0.459968C7.11131 0.555099 7.29379 0.737554 7.38895 0.967208L7.72247 1.77238L7.72237 1.77098Z", className: "fill-current" }), jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.95829 3.68932C7.02509 3.58439 7.04747 3.45723 7.02051 3.3358C6.99356 3.21437 6.91946 3.10862 6.81454 3.04182C6.70961 2.97502 6.58245 2.95264 6.46102 2.97959C6.33959 3.00655 6.23384 3.08064 6.16704 3.18557L4.33141 6.06995L3.49141 5.01995C3.41375 4.92281 3.30069 4.8605 3.17709 4.84673C3.05349 4.83296 2.92949 4.86885 2.83235 4.94651C2.73522 5.02417 2.67291 5.13723 2.65914 5.26083C2.64536 5.38443 2.68125 5.50843 2.75891 5.60557L4.00891 7.16807C4.0555 7.22638 4.11533 7.27271 4.18344 7.30323C4.25154 7.33375 4.32595 7.34757 4.40047 7.34353C4.47499 7.3395 4.54747 7.31773 4.61188 7.28004C4.67629 7.24234 4.73077 7.18981 4.77079 7.12682L6.95829 3.68932Z", fill: "white" })] }));
|
|
17
|
+
|
|
18
|
+
export { VerifiedTick };
|
|
19
|
+
//# sourceMappingURL=verified-tick.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"verified-tick.js","sources":["../../../../../src/components/atoms/Avatar/components/verified-tick.tsx"],"sourcesContent":[null],"names":["_jsxs","_jsx"],"mappings":";;;AAIA,MAAM,KAAK,GAAG;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,EAAE,EAAE,UAAU;AACd,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,QAAQ;AACf,IAAA,KAAK,EAAE,QAAQ;CAChB;AAOM,MAAM,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,SAAS,EAAqB;AACjE;AACAA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,EAAE,CAAC,4BAA4B,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,EAAE,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAA,QAAA,EAAA,CACvGC,GAAA,CAAA,MAAA,EAAA,EACE,CAAC,EAAC,inDAAinD,EACnnD,SAAS,EAAC,cAAc,EAAA,CACxB,EACFA,cACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,+oBAA+oB,EACjpB,IAAI,EAAC,OAAO,EAAA,CACZ,CAAA,EAAA,CACE;;;;"}
|