npm - @apolitical/component-library - Versions diffs - 1.18.0 → 1.18.2 - Mend

@apolitical/component-library 1.18.0 → 1.18.2

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.

Files changed (7) hide show

package/index.js +11 -11
package/index.mjs +813 -788
package/package.json +1 -1
package/style.css +1 -1
package/styles/variables/colors/_colors.scss +52 -62
package/styles/variables/colors/_theme.scss +2 -0
package/text/highlighted-text-box/highlighted-text-box.d.ts +4 -2

package/styles/variables/colors/_colors.scss CHANGED Viewed

@@ -4,66 +4,56 @@
 // names.
 $default-colors: (
-  'white': rgb(255 255 255 / 100%),
-  'black': rgb(0 0 0 / 100%),
-  'sand': rgb(252 250 243 / 100%),
-  'b50': rgb(248 247 255 / 100%),
-  'b100': rgb(222 220 250 / 100%),
-  'b200': rgb(197 194 245 / 100%),
-  'b300': rgb(175 171 239 / 100%),
-  'b500': rgb(124 114 225 / 100%),
-  'b600': rgb(101 89 212 / 100%),
-  'b700': rgb(79 67 186 / 100%),
-  'b800': rgb(57 45 135 / 100%),
-  'b900': rgb(33 24 77 / 100%),
-  'g50': rgb(235 250 246 / 100%),
-  'g100': rgb(195 240 228 / 100%),
-  'g200': rgb(153 219 201),
-  'g300': rgb(124 220 197 / 100%),
-  'g600': rgb(43 137 117 / 100%),
-  'g700': rgb(28 104 88 / 100%),
-  'g900': rgb(10 38 33 / 100%),
-  'n10': rgb(222 226 232 / 100%),
-  'n50': rgb(240 245 255 / 100%),
-  'n100': rgb(215 224 239 / 100%),
-  'n200': rgb(192 203 223 / 100%),
-  'n500': rgb(117 131 160 / 100%),
-  'n600': rgb(89 101 128 / 100%),
-  'n700': rgb(64 74 97 / 100%),
-  'n800': rgb(42 49 65 / 100%),
-  'n900': rgb(21 25 33 / 100%),
-  'p50': rgb(255 242 255 / 100%),
-  'p100': rgb(238 200 237 / 100%),
-  'p300': rgb(203 130 197 / 100%),
-  'p500': rgb(166 55 152 / 100%),
-  'p600': rgb(136 90 189 / 100%),
-  'p900': rgb(66 1 55 / 100%),
-  'y50': rgb(255 248 232 / 100%),
-  'y100': rgb(255 238 193 / 100%),
-  'y300': rgb(255 230 139 / 100%),
-  'y700': rgb(122 81 5 / 100%),
-  'y900': rgb(48 29 0 / 100%),
-  'error50': rgb(255 242 242 / 100%),
-  'error600': rgb(195 65 65 / 100%),
-  'error700': rgb(155 36 36 / 100%),
-  'info50': rgb(240 245 247 / 100%),
-  'info500': rgb(30 117 166 / 100%),
-  'info600': rgb(20 95 139 / 100%),
-  'success50': rgb(235 247 239 / 100%),
-  'success500': rgb(60 124 82 / 100%),
-  'success600': rgb(38 103 60 / 100%),
-  'warning50': rgb(255 242 230 / 100%),
-  'warning500': rgb(220 121 29 / 100%),
-  'warning700': rgb(137 71 11 / 100%),
+'white': rgb(255 255 255 / 100%),
+'black': rgb(0 0 0 / 100%),
+'sand': rgb(252 250 243 / 100%),
+'b50': rgb(248 247 255 / 100%),
+'b100': rgb(222 220 250 / 100%),
+'b200': rgb(197 194 245 / 100%),
+'b300': rgb(175 171 239 / 100%),
+'b500': rgb(124 114 225 / 100%),
+'b600': rgb(101 89 212 / 100%),
+'b700': rgb(79 67 186 / 100%),
+'b800': rgb(57 45 135 / 100%),
+'b900': rgb(33 24 77 / 100%),
+'g50': rgb(235 250 246 / 100%),
+'g100': rgb(195 240 228 / 100%),
+'g200': rgb(153 219 201),
+'g300': rgb(124 220 197 / 100%),
+'g600': rgb(43 137 117 / 100%),
+'g700': rgb(28 104 88 / 100%),
+'g900': rgb(10 38 33 / 100%),
+'n10': rgb(222 226 232 / 100%),
+'n40': rgb(248 248 248 / 100%),
+'n50': rgb(240 245 255 / 100%),
+'n100': rgb(215 224 239 / 100%),
+'n200': rgb(192 203 223 / 100%),
+'n500': rgb(117 131 160 / 100%),
+'n600': rgb(89 101 128 / 100%),
+'n700': rgb(64 74 97 / 100%),
+'n800': rgb(42 49 65 / 100%),
+'n900': rgb(21 25 33 / 100%),
+'p50': rgb(255 242 255 / 100%),
+'p100': rgb(238 200 237 / 100%),
+'p300': rgb(203 130 197 / 100%),
+'p500': rgb(166 55 152 / 100%),
+'p600': rgb(136 90 189 / 100%),
+'p900': rgb(66 1 55 / 100%),
+'y50': rgb(255 248 232 / 100%),
+'y100': rgb(255 238 193 / 100%),
+'y300': rgb(255 230 139 / 100%),
+'y700': rgb(122 81 5 / 100%),
+'y900': rgb(48 29 0 / 100%),
+'error50': rgb(255 242 242 / 100%),
+'error600': rgb(195 65 65 / 100%),
+'error700': rgb(155 36 36 / 100%),
+'info50': rgb(240 245 247 / 100%),
+'info500': rgb(30 117 166 / 100%),
+'info600': rgb(20 95 139 / 100%),
+'success50': rgb(235 247 239 / 100%),
+'success500': rgb(60 124 82 / 100%),
+'success600': rgb(38 103 60 / 100%),
+'warning50': rgb(255 242 230 / 100%),
+'warning500': rgb(220 121 29 / 100%),
+'warning700': rgb(137 71 11 / 100%),
 );

package/styles/variables/colors/_theme.scss CHANGED Viewed

@@ -273,6 +273,8 @@ $theme: (
     linear-gradient(rgba(255 255 255 / 0%), rgba(255 255 255 / 100%)),
   highlighted-text-box_bold_icon: map.get($c, 'b500'),
   highlighted-text-box_subtle_border: map.get($c, 'n100'),
+  highlighted-text-box_muted_bg: map.get($c, 'n40'),
+  highlighted-text-box_muted_icon: map.get($c, 'n600'),
   page-heading_bg: linear-gradient(180deg, map.get($c, 'n50') 0%, rgb(240 245 255 / 0%) 100%),
   page-heading_subtitle: map.get($c, 'n700'),
   pill: map.get($c, 'n900'),

package/text/highlighted-text-box/highlighted-text-box.d.ts CHANGED Viewed

@@ -1,7 +1,9 @@
 import React from 'react';
 interface Props {
     /** The style of box being rendered */
-    variant?: 'primary' | 'secondary' | 'tertiary' | 'subtle' | 'bold';
+    variant?: 'primary' | 'secondary' | 'tertiary' | 'subtle' | 'bold' | 'muted';
+    /** The name of an icon file to display at the top */
+    icon?: string;
     /** Additional classes to add to the box */
     className?: string;
     /** The content to display */
@@ -9,5 +11,5 @@ interface Props {
     /** Additional props to pass to the box */
     style?: React.CSSProperties;
 }
-declare const HighlightedTextBoxWrapper: ({ variant, className, children, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const HighlightedTextBoxWrapper: ({ variant, icon, className, children, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
 export default HighlightedTextBoxWrapper;