@flux-ui/components 3.0.0-next.74 → 3.0.0-next.75

package/dist/component/index.d.ts

@@ -92,7 +92,6 @@ export { default as FluxItemMedia } from './FluxItemMedia.vue';
 export { default as FluxItemStack } from './FluxItemStack.vue';
 export { default as FluxLayerPane } from './FluxLayerPane.vue';
 export { default as FluxLayerPaneSecondary } from './FluxLayerPaneSecondary.vue';
-export { default as FluxLegend } from './FluxLegend.vue';
 export { default as FluxLink } from './FluxLink.vue';
 export { default as FluxMenu } from './FluxMenu.vue';
 export { default as FluxMenuCollapsible } from './FluxMenuCollapsible.vue';
@@ -115,7 +114,6 @@ export { default as FluxPaneGroup } from './FluxPaneGroup.vue';
 export { default as FluxPaneHeader } from './FluxPaneHeader.vue';
 export { default as FluxPaneIllustration } from './FluxPaneIllustration.vue';
 export { default as FluxPaneMedia } from './FluxPaneMedia.vue';
-export { default as FluxPercentageBar } from './FluxPercentageBar.vue';
 export { default as FluxPersona } from './FluxPersona.vue';
 export { default as FluxPlaceholder } from './FluxPlaceholder.vue';
 export { default as FluxPressable } from './FluxPressable.vue';
@@ -141,7 +139,6 @@ export { default as FluxSpinner } from './FluxSpinner.vue';
 export { default as FluxSplitButton } from './FluxSplitButton.vue';
 export { default as FluxSplitView } from './FluxSplitView.vue';
 export { default as FluxSplitViewPane } from './FluxSplitViewPane.vue';
-export { default as FluxStatistic } from './FluxStatistic.vue';
 export { default as FluxStepper } from './FluxStepper.vue';
 export { default as FluxStepperStep } from './FluxStepperStep.vue';
 export { default as FluxStepperSteps } from './FluxStepperSteps.vue';

package/dist/index.css

@@ -5908,33 +5908,6 @@ tfoot .table-cell {
 
 .base-pane-structure:is(a, button):hover:has(> .item) {
   background-color: color-mix(in srgb, rgb(from var(--surface-hover) r g b/0.125), var(--surface));
-}.legend-horizontal {
-  display: flex;
-  gap: 12px 18px;
-}
-
-.legend-vertical {
-  display: flex;
-  flex-flow: column;
-  gap: 12px;
-}
-
-.legend-item {
-  display: flex;
-  flex-flow: row nowrap;
-  gap: 6px;
-  font-size: 14px;
-  line-height: 1;
-}
-.legend-item::before {
-  display: block;
-  margin-top: 1px;
-  height: 12px;
-  width: 12px;
-  content: "";
-  flex: 0 0 12px;
-  background: var(--color);
-  border-radius: var(--radius-full);
 }.notice {
   display: flex;
   padding: 12px 15px;
@@ -6161,35 +6134,6 @@ tfoot .table-cell {
 .base-pane > .notice {
   padding-left: 18px;
   padding-right: 18px;
-}.percentage-bar {
-  display: flex;
-  flex-flow: column;
-  gap: 12px;
-}
-
-.percentage-bar-segment {
-  height: 12px;
-  border-radius: calc(var(--radius) / 3);
-  transition: var(--transition-default);
-  transition-property: height, margin, flex-grow;
-}
-.percentage-bar-segment:hover {
-  height: 16px;
-  margin-top: -2px;
-  margin-bottom: -2px;
-}
-
-.percentage-bar-tooltip {
-  display: flex;
-  align-items: center;
-  flex-flow: row nowrap;
-  gap: 9px;
-}
-
-.percentage-bar-track {
-  display: flex;
-  flex-flow: row nowrap;
-  gap: 3px;
 }.progress-bar {
   position: relative;
 }
@@ -6649,7 +6593,7 @@ tfoot .table-cell {
   padding: 3px;
   background: var(--gray-50);
   border: 1px solid var(--surface-stroke);
-  border-radius: var(--radius-full);
+  border-radius: var(--radius);
 }
 
 .segmented-control-fill {
@@ -6666,7 +6610,7 @@ tfoot .table-cell {
   top: 3px;
   bottom: 3px;
   background: var(--surface);
-  border-radius: var(--radius-full);
+  border-radius: calc(var(--radius) - 3px);
   box-shadow: var(--shadow-md);
   outline: 1px solid var(--surface-stroke);
   pointer-events: none;
@@ -6721,8 +6665,9 @@ tfoot .table-cell {
   top: 50%;
   left: -2px;
   height: 15px;
-  width: 1px;
-  background: var(--surface-stroke);
+  width: 2px;
+  background: var(--gray-100);
+  border-radius: 1px;
   transition: opacity 300ms var(--swift-out);
   translate: 0 -50%;
 }
@@ -6809,82 +6754,6 @@ tfoot .table-cell {
   left: 0;
   height: 2px;
   width: 100%;
-}.statistic {
-  padding: 18px;
-  flex-basis: 0;
-  flex-grow: 1;
-  gap: 18px;
-}
-
-.statistic-change {
-  display: flex;
-  align-items: center;
-  align-self: flex-end;
-  gap: 6px;
-  font-size: 12px;
-  font-weight: 600;
-  line-height: 1;
-}
-.statistic-change.is-gray {
-  color: var(--foreground-prominent);
-}
-.statistic-change.is-primary {
-  color: var(--primary-600);
-}
-.statistic-change.is-danger {
-  color: var(--danger-600);
-}
-.statistic-change.is-info {
-  color: var(--info-600);
-}
-.statistic-change.is-success {
-  color: var(--success-600);
-}
-.statistic-change.is-warning {
-  color: var(--warning-600);
-}
-
-.statistic-data {
-  display: flex;
-  flex-flow: column;
-  flex-grow: 1;
-  gap: 9px;
-  line-height: 1;
-}
-.statistic-data :is(span) {
-  color: var(--foreground-secondary);
-}
-.statistic-data :is(strong) {
-  color: var(--foreground-prominent);
-  font-size: 24px;
-  font-weight: 700;
-}
-
-.statistic-icon .icon {
-  font-size: 0.45em;
-}
-
-.statistic-image {
-  height: 48px;
-  width: 48px;
-  border-radius: var(--radius);
-}
-
-.statistic-horizontal {
-  display: flex;
-}
-
-.statistic-vertical {
-  display: flex;
-  align-items: center;
-  flex-flow: column;
-  text-align: center;
-}
-.statistic-vertical .statistic-change {
-  align-self: center;
-}
-.statistic-vertical .statistic-data {
-  align-items: center;
 }.sparkles-container {
   z-index: 0;
 }