@mohasinac/appkit 2.7.22 → 2.7.24

package/dist/ui/components/ActiveFilterChips.style.css

@@ -1,66 +1,66 @@
-.appkit-active-filter-chips__chip {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.25rem;
-  padding: 0.25rem 0.25rem 0.25rem 0.5rem;
-  border: 1px solid var(--appkit-color-border);
-  border-radius: 0.5rem;
-  background: var(--appkit-color-zinc-50);
-  color: var(--appkit-color-zinc-800);
-  font-size: 0.75rem;
-  font-weight: 500;
-}
-
-.dark .appkit-active-filter-chips__chip {
-  border-color: var(--appkit-color-border);
-  background: var(--appkit-color-slate-800);
-  color: var(--appkit-color-slate-200);
-}
-
-.appkit-active-filter-chips__chip-label {
-  margin-right: 0.125rem;
-  color: var(--appkit-color-zinc-500);
-}
-
-.dark .appkit-active-filter-chips__chip-label {
-  color: var(--appkit-color-slate-400);
-}
-
-.appkit-active-filter-chips__chip-remove {
-  margin-left: 0.25rem;
-  width: 1rem;
-  height: 1rem;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 9999px;
-  transition: background-color 0.2s ease;
-}
-
-.appkit-active-filter-chips__chip-remove:hover {
-  background: var(--appkit-color-zinc-300);
-}
-
-.dark .appkit-active-filter-chips__chip-remove:hover {
-  background: var(--appkit-color-slate-600);
-}
-
-.appkit-active-filter-chips__chip-remove-icon {
-  width: 0.625rem;
-  height: 0.625rem;
-}
-
-.appkit-active-filter-chips__clear {
-  padding: 0.5rem;
-  font-size: 0.75rem;
-  font-weight: 500;
-  color: var(--appkit-color-secondary-600);
-}
-
-.appkit-active-filter-chips__clear:hover {
-  text-decoration: underline;
-}
-
-.dark .appkit-active-filter-chips__clear {
-  color: var(--appkit-color-primary-400);
-}
+.appkit-active-filter-chips__chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  padding: 0.25rem 0.25rem 0.25rem 0.5rem;
+  border: 1px solid var(--appkit-color-border);
+  border-radius: 0.5rem;
+  background: var(--appkit-color-zinc-50);
+  color: var(--appkit-color-zinc-800);
+  font-size: 0.75rem;
+  font-weight: 500;
+}
+
+.dark .appkit-active-filter-chips__chip {
+  border-color: var(--appkit-color-border);
+  background: var(--appkit-color-slate-800);
+  color: var(--appkit-color-slate-200);
+}
+
+.appkit-active-filter-chips__chip-label {
+  margin-right: 0.125rem;
+  color: var(--appkit-color-zinc-500);
+}
+
+.dark .appkit-active-filter-chips__chip-label {
+  color: var(--appkit-color-slate-400);
+}
+
+.appkit-active-filter-chips__chip-remove {
+  margin-left: 0.25rem;
+  width: 1rem;
+  height: 1rem;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 9999px;
+  transition: background-color 0.2s ease;
+}
+
+.appkit-active-filter-chips__chip-remove:hover {
+  background: var(--appkit-color-zinc-300);
+}
+
+.dark .appkit-active-filter-chips__chip-remove:hover {
+  background: var(--appkit-color-slate-600);
+}
+
+.appkit-active-filter-chips__chip-remove-icon {
+  width: 0.625rem;
+  height: 0.625rem;
+}
+
+.appkit-active-filter-chips__clear {
+  padding: 0.5rem;
+  font-size: 0.75rem;
+  font-weight: 500;
+  color: var(--appkit-color-secondary-600);
+}
+
+.appkit-active-filter-chips__clear:hover {
+  text-decoration: underline;
+}
+
+.dark .appkit-active-filter-chips__clear {
+  color: var(--appkit-color-primary-400);
+}

package/dist/ui/components/AvatarDisplay.style.css

@@ -1,46 +1,46 @@
-/* AvatarDisplay — avatar with crop/zoom or initials fallback */
-
-.appkit-avatar-display {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  overflow: hidden;
-  border-radius: 9999px;
-}
-
-/* Sizes */
-.appkit-avatar-display--sm { height: 2rem; width: 2rem; }
-.appkit-avatar-display--md { height: 3rem; width: 3rem; }
-.appkit-avatar-display--lg { height: 4rem; width: 4rem; }
-.appkit-avatar-display--xl { height: 6rem; width: 6rem; }
-.appkit-avatar-display--2xl { height: 8rem; width: 8rem; }
-
-/* Initials fallback */
-.appkit-avatar-display--initials {
-  background: linear-gradient(to bottom right, #3b82f6, #4f46e5);
-}
-
-.appkit-avatar-display__initials {
-  user-select: none;
-  font-weight: 600;
-  color: var(--appkit-color-text-on-primary);
-}
-
-/* Image variant */
-.appkit-avatar-display--image {
-  position: relative;
-  background-color: var(--appkit-color-zinc-100);
-}
-
-:is(.dark) .appkit-avatar-display--image {
-  background-color: var(--appkit-color-slate-800);
-}
-
-.appkit-avatar-display__image {
-  position: absolute;
-  height: 100%;
-  width: 100%;
-  transform: translate(-50%, -50%);
-  background-position: center;
-  background-repeat: no-repeat;
-}
+/* AvatarDisplay — avatar with crop/zoom or initials fallback */
+
+.appkit-avatar-display {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  border-radius: 9999px;
+}
+
+/* Sizes */
+.appkit-avatar-display--sm { height: 2rem; width: 2rem; }
+.appkit-avatar-display--md { height: 3rem; width: 3rem; }
+.appkit-avatar-display--lg { height: 4rem; width: 4rem; }
+.appkit-avatar-display--xl { height: 6rem; width: 6rem; }
+.appkit-avatar-display--2xl { height: 8rem; width: 8rem; }
+
+/* Initials fallback */
+.appkit-avatar-display--initials {
+  background: linear-gradient(to bottom right, #3b82f6, #4f46e5);
+}
+
+.appkit-avatar-display__initials {
+  user-select: none;
+  font-weight: 600;
+  color: var(--appkit-color-text-on-primary);
+}
+
+/* Image variant */
+.appkit-avatar-display--image {
+  position: relative;
+  background-color: var(--appkit-color-zinc-100);
+}
+
+:is(.dark) .appkit-avatar-display--image {
+  background-color: var(--appkit-color-slate-800);
+}
+
+.appkit-avatar-display__image {
+  position: absolute;
+  height: 100%;
+  width: 100%;
+  transform: translate(-50%, -50%);
+  background-position: center;
+  background-repeat: no-repeat;
+}

package/dist/ui/components/BackgroundRenderer.style.css

@@ -1,31 +1,31 @@
-/* BackgroundRenderer — fullscreen background layer with video/overlay support */
-
-.appkit-bg-renderer {
-  position: fixed;
-  inset: 0;
-  z-index: -10;
-  transition: all 0.5s ease;
-}
-
-.appkit-bg-renderer__video {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-  transition: opacity 0.5s ease;
-}
-
-.appkit-bg-renderer__video--loading {
-  opacity: 0;
-}
-
-.appkit-bg-renderer__video--loaded {
-  opacity: 1;
-}
-
-.appkit-bg-renderer__overlay {
-  position: fixed;
-  inset: 0;
-  z-index: -5;
-  transition: all 0.5s ease;
-  pointer-events: none;
-}
+/* BackgroundRenderer — fullscreen background layer with video/overlay support */
+
+.appkit-bg-renderer {
+  position: fixed;
+  inset: 0;
+  z-index: -10;
+  transition: all 0.5s ease;
+}
+
+.appkit-bg-renderer__video {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  transition: opacity 0.5s ease;
+}
+
+.appkit-bg-renderer__video--loading {
+  opacity: 0;
+}
+
+.appkit-bg-renderer__video--loaded {
+  opacity: 1;
+}
+
+.appkit-bg-renderer__overlay {
+  position: fixed;
+  inset: 0;
+  z-index: -5;
+  transition: all 0.5s ease;
+  pointer-events: none;
+}

package/dist/ui/components/Breadcrumb.style.css

@@ -1,60 +1,60 @@
-.appkit-breadcrumb__list {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 0.25rem;
-  font-size: 0.875rem;
-  color: var(--appkit-color-zinc-500);
-}
-
-.dark .appkit-breadcrumb__list {
-  color: var(--appkit-color-text-faint);
-}
-
-.appkit-breadcrumb__item {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.25rem;
-}
-
-.appkit-breadcrumb__separator {
-  width: 0.875rem;
-  height: 0.875rem;
-  flex-shrink: 0;
-  color: var(--appkit-color-text-faint);
-}
-
-.dark .appkit-breadcrumb__separator {
-  color: var(--appkit-color-zinc-500);
-}
-
-.appkit-breadcrumb__text {
-  color: var(--appkit-color-zinc-500);
-}
-
-.dark .appkit-breadcrumb__text {
-  color: var(--appkit-color-text-faint);
-}
-
-.appkit-breadcrumb__current {
-  font-weight: 500;
-  color: var(--appkit-color-text);
-}
-
-.dark .appkit-breadcrumb__current {
-  color: var(--appkit-color-text);
-}
-
-.appkit-breadcrumb__link {
-  color: inherit;
-  text-decoration: none;
-  transition: color 0.2s ease;
-}
-
-.appkit-breadcrumb__link:hover {
-  color: var(--appkit-color-secondary-600);
-}
-
-.dark .appkit-breadcrumb__link:hover {
-  color: var(--appkit-color-primary-400);
-}
+.appkit-breadcrumb__list {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.25rem;
+  font-size: 0.875rem;
+  color: var(--appkit-color-zinc-500);
+}
+
+.dark .appkit-breadcrumb__list {
+  color: var(--appkit-color-text-faint);
+}
+
+.appkit-breadcrumb__item {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+}
+
+.appkit-breadcrumb__separator {
+  width: 0.875rem;
+  height: 0.875rem;
+  flex-shrink: 0;
+  color: var(--appkit-color-text-faint);
+}
+
+.dark .appkit-breadcrumb__separator {
+  color: var(--appkit-color-zinc-500);
+}
+
+.appkit-breadcrumb__text {
+  color: var(--appkit-color-zinc-500);
+}
+
+.dark .appkit-breadcrumb__text {
+  color: var(--appkit-color-text-faint);
+}
+
+.appkit-breadcrumb__current {
+  font-weight: 500;
+  color: var(--appkit-color-text);
+}
+
+.dark .appkit-breadcrumb__current {
+  color: var(--appkit-color-text);
+}
+
+.appkit-breadcrumb__link {
+  color: inherit;
+  text-decoration: none;
+  transition: color 0.2s ease;
+}
+
+.appkit-breadcrumb__link:hover {
+  color: var(--appkit-color-secondary-600);
+}
+
+.dark .appkit-breadcrumb__link:hover {
+  color: var(--appkit-color-primary-400);
+}

package/dist/ui/components/CountdownDisplay.style.css

@@ -1,4 +1,4 @@
-.appkit-countdown {
-  font-variant-numeric: tabular-nums;
-  letter-spacing: 0.01em;
-}
+.appkit-countdown {
+  font-variant-numeric: tabular-nums;
+  letter-spacing: 0.01em;
+}

package/dist/ui/components/Div.style.css

@@ -1,6 +1,6 @@
-/* Div — general-purpose layout container wrapper */
-/* Pure passthrough — no default styles. Exists for style contract compliance. */
-
-.appkit-div {
-  /* Consumer themes may add base styles here */
-}
+/* Div — general-purpose layout container wrapper */
+/* Pure passthrough — no default styles. Exists for style contract compliance. */
+
+.appkit-div {
+  /* Consumer themes may add base styles here */
+}

package/dist/ui/components/EmptyState.style.css

@@ -1,28 +1,28 @@
-/* EmptyState — centered feedback panel with icon, title, description, action */
-
-.appkit-empty-state {
-  text-align: center;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  gap: 0.75rem;
-  min-height: 220px;
-}
-
-.appkit-empty-state__icon {
-  color: var(--appkit-color-text-faint);
-}
-
-.appkit-empty-state__description {
-  max-width: 48ch;
-}
-
-.appkit-empty-state__action {
-  padding-top: 0.25rem;
-}
-
-/* Dark mode */
-.dark .appkit-empty-state__icon {
-  color: var(--appkit-color-slate-500);
-}
+/* EmptyState — centered feedback panel with icon, title, description, action */
+
+.appkit-empty-state {
+  text-align: center;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 0.75rem;
+  min-height: 220px;
+}
+
+.appkit-empty-state__icon {
+  color: var(--appkit-color-text-faint);
+}
+
+.appkit-empty-state__description {
+  max-width: 48ch;
+}
+
+.appkit-empty-state__action {
+  padding-top: 0.25rem;
+}
+
+/* Dark mode */
+.dark .appkit-empty-state__icon {
+  color: var(--appkit-color-slate-500);
+}

package/dist/ui/components/FlowDiagram.style.css

@@ -1,77 +1,77 @@
-/* FlowDiagram — step chain with connectors, badges, and optional note strip */
-
-.appkit-flow-diagram {
-  border-radius: 1rem;
-  border: 1px solid;
-  overflow: hidden;
-}
-
-.appkit-flow-diagram__header {
-  padding: 0.75rem 1.25rem;
-  border-bottom: 1px solid;
-}
-
-.appkit-flow-diagram__body {
-  padding: 1.25rem;
-}
-
-.appkit-flow-diagram__chain {
-  display: flex;
-  align-items: flex-start;
-  gap: 0.375rem;
-  margin-bottom: 1rem;
-}
-
-.appkit-flow-diagram__chain--scroll {
-  overflow-x: auto;
-  padding-bottom: 0.75rem;
-  scroll-behavior: smooth;
-}
-
-.appkit-flow-diagram__chain--centered {
-  justify-content: center;
-}
-
-.appkit-flow-diagram__step {
-  flex-shrink: 0;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  text-align: center;
-  gap: 0.25rem;
-}
-
-.appkit-flow-diagram__circle {
-  width: 3rem;
-  height: 3rem;
-  border-radius: 9999px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 1.25rem;
-}
-
-.appkit-flow-diagram__connector {
-  flex-shrink: 0;
-  align-self: flex-start;
-  height: 0.125rem;
-  width: 1.25rem;
-  margin-top: 1.5rem;
-}
-
-.appkit-flow-diagram__badge {
-  font-size: var(--appkit-text-2xs);
-  font-weight: 700;
-  padding: 0.125rem 0.375rem;
-  border-radius: 9999px;
-}
-
-.appkit-flow-diagram__note {
-  margin-top: 0.75rem;
-  padding-top: 0.75rem;
-  border-top: 1px dashed var(--appkit-color-slate-200);
-}
-
-:is(.dark) .appkit-flow-diagram__note {
-  border-top-color: var(--appkit-color-border);
-}
+/* FlowDiagram — step chain with connectors, badges, and optional note strip */
+
+.appkit-flow-diagram {
+  border-radius: 1rem;
+  border: 1px solid;
+  overflow: hidden;
+}
+
+.appkit-flow-diagram__header {
+  padding: 0.75rem 1.25rem;
+  border-bottom: 1px solid;
+}
+
+.appkit-flow-diagram__body {
+  padding: 1.25rem;
+}
+
+.appkit-flow-diagram__chain {
+  display: flex;
+  align-items: flex-start;
+  gap: 0.375rem;
+  margin-bottom: 1rem;
+}
+
+.appkit-flow-diagram__chain--scroll {
+  overflow-x: auto;
+  padding-bottom: 0.75rem;
+  scroll-behavior: smooth;
+}
+
+.appkit-flow-diagram__chain--centered {
+  justify-content: center;
+}
+
+.appkit-flow-diagram__step {
+  flex-shrink: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  gap: 0.25rem;
+}
+
+.appkit-flow-diagram__circle {
+  width: 3rem;
+  height: 3rem;
+  border-radius: 9999px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 1.25rem;
+}
+
+.appkit-flow-diagram__connector {
+  flex-shrink: 0;
+  align-self: flex-start;
+  height: 0.125rem;
+  width: 1.25rem;
+  margin-top: 1.5rem;
+}
+
+.appkit-flow-diagram__badge {
+  font-size: var(--appkit-text-2xs);
+  font-weight: 700;
+  padding: 0.125rem 0.375rem;
+  border-radius: 9999px;
+}
+
+.appkit-flow-diagram__note {
+  margin-top: 0.75rem;
+  padding-top: 0.75rem;
+  border-top: 1px dashed var(--appkit-color-slate-200);
+}
+
+:is(.dark) .appkit-flow-diagram__note {
+  border-top-color: var(--appkit-color-border);
+}