@kaizen/components 1.4.19 → 1.4.20-canary.3469

package/dist/esm/index.js

@@ -19,65 +19,12 @@ import {
 
 // src/index.ts
 export * from "@kaizen/a11y";
-export * from "@kaizen/brand";
-export * from "@kaizen/brand-moment";
-export * from "@kaizen/button";
-export * from "@kaizen/component-base";
-import { Icon, Box, Spacing } from "@kaizen/component-library";
-export * from "@kaizen/date-picker";
-export * from "@kaizen/draft-avatar";
-export * from "@kaizen/draft-badge";
-export * from "@kaizen/draft-card";
-export * from "@kaizen/draft-collapsible";
-export * from "@kaizen/draft-divider";
-export * from "@kaizen/draft-empty-state";
-export * from "@kaizen/draft-filter-menu-button";
-export * from "@kaizen/draft-form";
-export * from "@kaizen/draft-guidance-block";
-export * from "@kaizen/draft-hero-card";
-export * from "@kaizen/draft-illustration";
-export * from "@kaizen/draft-likert-scale-legacy";
-export * from "@kaizen/draft-menu";
-export * from "@kaizen/draft-modal";
-export * from "@kaizen/draft-page-layout";
-export * from "@kaizen/draft-popover";
-export * from "@kaizen/draft-table";
-export * from "@kaizen/draft-tabs";
-export * from "@kaizen/draft-tag";
-export * from "@kaizen/draft-tile";
-export * from "@kaizen/draft-title-block-zen";
-export * from "@kaizen/draft-tooltip";
-export * from "@kaizen/draft-well";
-export * from "@kaizen/hosted-assets";
-export * from "@kaizen/loading-skeleton";
-export * from "@kaizen/loading-spinner";
-export * from "@kaizen/notification";
-export * from "@kaizen/pagination";
-export * from "@kaizen/progress-bar";
-export * from "@kaizen/responsive";
-export * from "@kaizen/rich-text-editor";
-export * from "@kaizen/split-button";
-export * from "@kaizen/typography";
-import {
-  makeCssVariableDefinitionsMap,
-  makeCSSVariableTheme,
-  mapLeafsOfObject
-} from "@kaizen/design-tokens";
-import { Select, AsyncSelect } from "@kaizen/draft-select";
 export {
-  AsyncSelect,
-  Box,
-  Icon,
   KaizenProvider,
-  Select,
-  Spacing,
   ThemeContext,
   ThemeManager,
   ThemeProvider,
   defaultTheme,
   heartTheme,
-  makeCSSVariableTheme,
-  makeCssVariableDefinitionsMap,
-  mapLeafsOfObject,
   useTheme
 };

package/dist/iife/Icon.module-VD7NKLAR-VD7NKLAR.scss

@@ -0,0 +1,72 @@
+@import "~@kaizen/design-tokens/sass/animation";
+@import "./styles";
+
+.icon {
+  @extend %caIcon;
+
+  // Set sensible defaults for icon colours when
+  // windows high-contrast mode is enabled. These
+  // should be overridden by the consumer when the
+  // icon colour conveys information, such as mood.
+  @media screen and (-ms-high-contrast: active) {
+    color: black;
+  }
+
+  @media screen and (-ms-high-contrast: white-on-black) {
+    color: white;
+  }
+
+  @media screen and (-ms-high-contrast: black-on-white) {
+    color: black;
+  }
+}
+
+.inheritSize {
+  @extend %caIconInheritSize;
+}
+
+.interactiveIconWrapper {
+  cursor: pointer;
+  .icon {
+    opacity: 0.7;
+    transition: $animation-duration-fast opacity;
+  }
+  &:disabled,
+  &.disabled {
+    .icon {
+      opacity: 0.3;
+    }
+  }
+  &:not(:disabled):not(.disabled) {
+    &:hover,
+    &:focus,
+    &.hover {
+      .icon {
+        opacity: 1;
+      }
+    }
+    &:active,
+    &.active {
+      .icon {
+        opacity: 1;
+      }
+    }
+  }
+}
+
+// On dark backgrounds, icons are fully opaque by default and half opacity when active.
+// Hover and disabled states are the same.
+.reversedInteractiveIconWrapper {
+  composes: interactiveIconWrapper;
+  .icon {
+    opacity: 1;
+  }
+  &:not(:disabled, .disabled) {
+    &:active,
+    &.active {
+      .icon {
+        opacity: 0.5;
+      }
+    }
+  }
+}