@x-plat/design-system 0.7.0 → 0.7.1

package/dist/index.css

@@ -1574,82 +1574,6 @@
   height: 60%;
 }
 
-/* src/components/Badge/badge.scss */
-.lib-xplat-badge {
-  position: relative;
-  display: inline-flex;
-}
-.lib-xplat-badge.sm .badge-indicator {
-  min-width: var(--spacing-space-4);
-  height: var(--spacing-space-4);
-  font-family: var(--semantic-typo-caption-2-r-font);
-  font-size: var(--semantic-typo-caption-2-r-size);
-  line-height: var(--semantic-typo-caption-2-r-lh);
-  font-weight: var(--semantic-typo-caption-2-r-weight);
-  letter-spacing: var(--semantic-typo-caption-2-r-ls);
-  padding: 0 var(--spacing-space-1);
-}
-.lib-xplat-badge.sm .badge-indicator.dot {
-  min-width: var(--spacing-space-2);
-  height: var(--spacing-space-2);
-}
-.lib-xplat-badge.lg .badge-indicator {
-  min-width: var(--spacing-space-6);
-  height: var(--spacing-space-6);
-  font-family: var(--semantic-typo-caption-1-r-font);
-  font-size: var(--semantic-typo-caption-1-r-size);
-  line-height: var(--semantic-typo-caption-1-r-lh);
-  font-weight: var(--semantic-typo-caption-1-r-weight);
-  letter-spacing: var(--semantic-typo-caption-1-r-ls);
-  padding: 0 var(--spacing-space-2);
-}
-.lib-xplat-badge.lg .badge-indicator.dot {
-  min-width: var(--spacing-space-2);
-  height: var(--spacing-space-2);
-}
-.lib-xplat-badge .badge-indicator {
-  position: absolute;
-  top: 0;
-  right: 0;
-  transform: translate(50%, -50%);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: var(--spacing-radius-full);
-  color: var(--semantic-text-inverse);
-  font-family: var(--semantic-typo-caption-2-sb-font);
-  font-size: var(--semantic-typo-caption-2-sb-size);
-  line-height: var(--semantic-typo-caption-2-sb-lh);
-  font-weight: var(--semantic-typo-caption-2-sb-weight);
-  letter-spacing: var(--semantic-typo-caption-2-sb-ls);
-  line-height: 1;
-  min-width: var(--spacing-space-4);
-  height: var(--spacing-space-4);
-  padding: 0 var(--spacing-space-1);
-  box-sizing: border-box;
-}
-.lib-xplat-badge .badge-indicator.dot {
-  min-width: var(--spacing-space-2);
-  height: var(--spacing-space-2);
-  padding: 0;
-}
-.lib-xplat-badge .badge-indicator.error {
-  background-color: var(--semantic-surface-error-default);
-}
-.lib-xplat-badge .badge-indicator.success {
-  background-color: var(--semantic-surface-success-default);
-}
-.lib-xplat-badge .badge-indicator.warning {
-  background-color: var(--semantic-surface-warning-default);
-  color: var(--semantic-text-primary);
-}
-.lib-xplat-badge .badge-indicator.info {
-  background-color: var(--semantic-surface-info-default);
-}
-.lib-xplat-badge .badge-indicator.brand {
-  background-color: var(--semantic-surface-brand-default);
-}
-
 /* src/components/Box/box.scss */
 .lib-xplat-box {
   contain: layout style;
@@ -3878,6 +3802,82 @@
   cursor: pointer;
 }
 
+/* src/components/NotificationBadge/notificationBadge.scss */
+.lib-xplat-notification-badge {
+  position: relative;
+  display: inline-flex;
+}
+.lib-xplat-notification-badge.sm .badge-indicator {
+  min-width: var(--spacing-space-4);
+  height: var(--spacing-space-4);
+  font-family: var(--semantic-typo-caption-2-r-font);
+  font-size: var(--semantic-typo-caption-2-r-size);
+  line-height: var(--semantic-typo-caption-2-r-lh);
+  font-weight: var(--semantic-typo-caption-2-r-weight);
+  letter-spacing: var(--semantic-typo-caption-2-r-ls);
+  padding: 0 var(--spacing-space-1);
+}
+.lib-xplat-notification-badge.sm .badge-indicator.dot {
+  min-width: var(--spacing-space-2);
+  height: var(--spacing-space-2);
+}
+.lib-xplat-notification-badge.lg .badge-indicator {
+  min-width: var(--spacing-space-6);
+  height: var(--spacing-space-6);
+  font-family: var(--semantic-typo-caption-1-r-font);
+  font-size: var(--semantic-typo-caption-1-r-size);
+  line-height: var(--semantic-typo-caption-1-r-lh);
+  font-weight: var(--semantic-typo-caption-1-r-weight);
+  letter-spacing: var(--semantic-typo-caption-1-r-ls);
+  padding: 0 var(--spacing-space-2);
+}
+.lib-xplat-notification-badge.lg .badge-indicator.dot {
+  min-width: var(--spacing-space-2);
+  height: var(--spacing-space-2);
+}
+.lib-xplat-notification-badge .badge-indicator {
+  position: absolute;
+  top: 0;
+  right: 0;
+  transform: translate(50%, -50%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: var(--spacing-radius-full);
+  color: var(--semantic-text-inverse);
+  font-family: var(--semantic-typo-caption-2-sb-font);
+  font-size: var(--semantic-typo-caption-2-sb-size);
+  line-height: var(--semantic-typo-caption-2-sb-lh);
+  font-weight: var(--semantic-typo-caption-2-sb-weight);
+  letter-spacing: var(--semantic-typo-caption-2-sb-ls);
+  line-height: 1;
+  min-width: var(--spacing-space-4);
+  height: var(--spacing-space-4);
+  padding: 0 var(--spacing-space-1);
+  box-sizing: border-box;
+}
+.lib-xplat-notification-badge .badge-indicator.dot {
+  min-width: var(--spacing-space-2);
+  height: var(--spacing-space-2);
+  padding: 0;
+}
+.lib-xplat-notification-badge .badge-indicator.error {
+  background-color: var(--semantic-surface-error-default);
+}
+.lib-xplat-notification-badge .badge-indicator.success {
+  background-color: var(--semantic-surface-success-default);
+}
+.lib-xplat-notification-badge .badge-indicator.warning {
+  background-color: var(--semantic-surface-warning-default);
+  color: var(--semantic-text-primary);
+}
+.lib-xplat-notification-badge .badge-indicator.info {
+  background-color: var(--semantic-surface-info-default);
+}
+.lib-xplat-notification-badge .badge-indicator.brand {
+  background-color: var(--semantic-surface-brand-default);
+}
+
 /* src/components/Pagination/pagination.scss */
 .lib-xplat-pagination {
   display: inline-flex;

package/dist/index.d.cts

@@ -3,7 +3,6 @@ export { Accordion } from './components/Accordion/index.cjs';
 export { Alert } from './components/Alert/index.cjs';
 export { AutoResizeTextArea } from './components/AutoResizeTextArea/index.cjs';
 export { Avatar } from './components/Avatar/index.cjs';
-export { Badge } from './components/Badge/index.cjs';
 export { Box } from './components/Box/index.cjs';
 export { Breadcrumb } from './components/Breadcrumb/index.cjs';
 export { Button } from './components/Button/index.cjs';
@@ -25,6 +24,7 @@ export { IconButton } from './components/IconButton/index.cjs';
 export { ImageSelector } from './components/ImageSelector/index.cjs';
 export { Input, PasswordInput } from './components/Input/index.cjs';
 export { Modal } from './components/Modal/index.cjs';
+export { NotificationBadge as Badge, NotificationBadge } from './components/NotificationBadge/index.cjs';
 export { Pagination } from './components/Pagination/index.cjs';
 export { PopOver } from './components/PopOver/index.cjs';
 export { Progress } from './components/Progress/index.cjs';

package/dist/index.d.ts

@@ -3,7 +3,6 @@ export { Accordion } from './components/Accordion/index.js';
 export { Alert } from './components/Alert/index.js';
 export { AutoResizeTextArea } from './components/AutoResizeTextArea/index.js';
 export { Avatar } from './components/Avatar/index.js';
-export { Badge } from './components/Badge/index.js';
 export { Box } from './components/Box/index.js';
 export { Breadcrumb } from './components/Breadcrumb/index.js';
 export { Button } from './components/Button/index.js';
@@ -25,6 +24,7 @@ export { IconButton } from './components/IconButton/index.js';
 export { ImageSelector } from './components/ImageSelector/index.js';
 export { Input, PasswordInput } from './components/Input/index.js';
 export { Modal } from './components/Modal/index.js';
+export { NotificationBadge as Badge, NotificationBadge } from './components/NotificationBadge/index.js';
 export { Pagination } from './components/Pagination/index.js';
 export { PopOver } from './components/PopOver/index.js';
 export { Progress } from './components/Progress/index.js';