@fpkit/acss 0.4.19 → 0.5.2

package/src/components/form/select.stories.tsx

@@ -1,6 +1,6 @@
 import { StoryObj, Meta } from '@storybook/react'
-import { within, userEvent, screen } from '@storybook/testing-library'
-import { expect } from '@storybook/jest'
+import { within, userEvent, screen } from '@storybook/test'
+
 
 import Select from './select'
 import React from 'react'

package/src/components/form/select.tsx

@@ -70,41 +70,31 @@ export const Select = ({
 
   const handleOnBlur = (e: React.FocusEvent<HTMLSelectElement>) => {
     if (onBlur && !disabled) onBlur?.(e)
-    const handleOnChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
-      if (onSelectionChange && !disabled) onSelectionChange?.(e)
-    }
-
-    const handlePointerDown = (e: React.PointerEvent<HTMLSelectElement>) => {
-      if (onPointerDown && !disabled) onPointerDown?.(e)
-    }
-
-    const handleOnBlur = (e: React.FocusEvent<HTMLSelectElement>) => {
-      if (onBlur && !disabled) onBlur?.(e)
-    }
-
-    return (
-      <UI
-        as="select"
-        id={id}
-        ref={ref}
-        name={name}
-        className={classes}
-        selected={selected}
-        onChange={handleOnChange}
-        onPointerDown={handlePointerDown}
-        onBlur={handleOnBlur}
-        required={required}
-        aria-required={required} // Accessibility
-        disabled={disabled}
-        aria-disabled={disabled ? true : false}
-        style={styles}
-        {...props} // Accessibility
-      >
-         <option value="" />
-      </UI>
-    )
   }
+
+  return (
+    <UI
+      as="select"
+      id={id}
+      ref={ref}
+      name={name}
+      className={classes}
+      selected={selected}
+      onChange={handleOnChange}
+      onPointerDown={handlePointerDown}
+      onBlur={handleOnBlur}
+      required={required}
+      aria-required={required} // Accessibility
+      disabled={disabled}
+      aria-disabled={disabled ? true : false}
+      style={styles}
+      {...props} // Accessibility
+    >
+      <option value="" />
+    </UI>
+  )
 }
+
 export default Select
 Select.displayName = 'Select' // Remove this line
 Select.Option = Option // Remove this line

package/src/components/fp.test.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import { render, screen } from '@testing-library/react'
 import FP from '../components/fp'
 import jest from 'jest-mock'
-import { userEvent } from '@storybook/testing-library'
+import { userEvent } from '@storybook/test'
 
 describe('FP component', () => {
   it('renders a div by default', () => {

package/src/components/heading/heading.stories.tsx

@@ -1,6 +1,6 @@
 import { StoryObj, Meta } from '@storybook/react'
-import { within, userEvent, screen } from '@storybook/testing-library'
-import { expect } from '@storybook/jest'
+import { within, expect } from '@storybook/test'
+
 
 import Heading from './heading'
 

package/src/components/heading/heading.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import UI from '#components/ui'
-import { type } from 'os'
+
 
 export type TitleProps = {
   children: React.ReactNode
@@ -12,7 +12,7 @@ const Heading = ({
   type = 'h3',
   id,
   styles,
-  ui = 'display',
+  ui,
   children,
   ...props
 }: TitleProps) => {

package/src/components/icons/components/svg.tsx

@@ -6,6 +6,7 @@ const defaultStyes = {
   display: 'inline-flex',
   alignItems: 'center',
   width: 'auto',
+  fontSize: 'inherit',
 }
 
 export const Svg = ({

package/src/components/icons/icon.scss

@@ -5,6 +5,7 @@
   --icon-width: max-content;
   --icon-gap: 0.2rem;
   --icon-height: max-content;
+  --icon-fs: inherit;
 
   display: var(--icon-display);
   flex-direction: var(--icon-direction);
@@ -12,4 +13,5 @@
   place-items: var(--icons-placement);
   width: var(--icon-width);
   height: var(--icon-height);
+  font-size: var(--icon-fs);
 }

package/src/components/icons/icon.stories.tsx

@@ -1,10 +1,11 @@
 import * as React from 'react'
 
-import { Meta, StoryObj } from '@storybook/react'
+import type { Meta, StoryObj } from '@storybook/react'
 
 import { Button } from '#components/buttons/button'
 import { Icon } from './icon'
 import './icon.scss'
+import { I } from "vitest/dist/types-198fd1d9.js"
 
 const meta: Meta<typeof Icon> = {
   component: Icon,
@@ -36,22 +37,41 @@ export const IconSet = {
   },
 }
 
+
+export const IconSizes = {
+  args: {},
+  render: (...args: any) => {
+    return (
+      <Icon>
+        <Icon.ArrowUp size={16} />
+        <Icon.ArrowUp size={24} />
+        <Icon.ArrowUp size={32} />
+        <Icon.ArrowUp size={48} />
+        <Icon.ArrowUp size={64} />
+        <Icon.ArrowUp size={96} />
+        <Icon.ArrowUp size={128} />
+      </Icon>
+    )
+  },
+}
+
 export const IconButton = {
   args: {},
   render: (...args: any) => {
     return (
-      <>
+   
         <Button type="button">
           <Icon>
             <Icon.Code />
           </Icon>
           Click Me
         </Button>
-      </>
+     
     )
   },
 }
 
+
 export const Code: Story = {
   args: {
     children: <Icon.Code role="img" aria-label="code icon" />,

package/src/components/icons/icon.tsx

@@ -48,6 +48,17 @@ const defaultStyles = {
 
 export type IconProps = React.ComponentProps<typeof UI>
 
+/**
+ * A component for rendering icons with consistent styling and behavior.
+ *
+ * @param {object} props - The component props
+ * @param {string} [props.id] - Optional unique identifier for the icon
+ * @param {string} [props.classes] - CSS classes to apply to the icon
+ * @param {React.ReactNode} [props.children] - Child elements to render inside the icon
+ * @param {object} [props.styles] - Custom styles to apply to the icon
+ * @param {...any} [props.props] - Additional props to spread to the underlying UI component
+ * @returns {JSX.Element} The rendered icon component
+ */
 export const Icon = ({
   id,
   classes,

package/src/components/icons/types.ts

@@ -2,7 +2,7 @@ import { ComponentProps } from '#/types'
 
 export interface IconProps extends Partial<ComponentProps> {
   fill?: string
-  size?: number
+  size?: | 16 | 24 | 32 | 48 | 64 | 96 | 128
   strokeColor?: string
   strokeWidth?: string
   role?: string

package/src/components/images/figure.stories.tsx

@@ -1,6 +1,6 @@
 import { StoryObj, Meta } from '@storybook/react'
-import { within, userEvent, screen } from '@storybook/testing-library'
-import { expect } from '@storybook/jest'
+import { within, expect } from '@storybook/test'
+
 
 import Figure from './figure'
 
@@ -25,10 +25,7 @@ export const FigureComponent: Story = {
   args: {},
   play: async ({ canvasElement }) => {
     const canvas = within(canvasElement)
-    expect(
-      canvas.getByText(/caption for the image here.../i),
-    ).toBeInTheDocument()
-    expect(canvas.getByRole('img')).toBeInTheDocument()
+    // await expect(canvas.getByRole('img')).toBeInTheDocument()
     expect(canvas.getByRole('figure')).toBeInTheDocument()
   },
 }

package/src/components/images/img.stories.tsx

@@ -1,6 +1,6 @@
 import { StoryObj, Meta } from '@storybook/react'
-import { within, userEvent, screen } from '@storybook/testing-library'
-import { expect } from '@storybook/jest'
+import { within, expect } from '@storybook/test'
+
 
 import Img from './img'
 
@@ -19,6 +19,6 @@ export const ImgComponent: Story = {
   args: {},
   play: async ({ canvasElement }) => {
     const canvas = within(canvasElement)
-    expect(canvas.getByRole('img')).toBeInTheDocument()
+    await expect(canvas.getByRole('img')).toBeInTheDocument()
   },
 }

package/src/components/layout/footer.stories.tsx

@@ -2,12 +2,12 @@ import { StoryObj, Meta } from '@storybook/react'
 /**
  * Import testing library dependencies
  */
-import { within, userEvent } from '@storybook/testing-library'
+import { within, userEvent } from '@storybook/test'
 
 /**
  * Import jest matchers
  */
-import { expect } from '@storybook/jest'
+
 
 import { Footer } from './landmarks'
 

package/src/components/layout/landmarks.stories.tsx

@@ -2,12 +2,12 @@ import { StoryObj, Meta } from '@storybook/react'
 /**
  * Import testing library dependencies
  */
-import { within, userEvent } from '@storybook/testing-library'
+import { within, expect } from '@storybook/test'
 
 /**
  * Import jest matchers
  */
-import { expect } from '@storybook/jest'
+
 
 import { Header } from './landmarks'
 

package/src/components/layout/main.stories.tsx

@@ -2,12 +2,12 @@ import { StoryObj, Meta } from '@storybook/react'
 /**
  * Import testing library dependencies
  */
-import { within, userEvent } from '@storybook/testing-library'
+import { within, userEvent, expect } from '@storybook/test'
 
 /**
  * Import jest matchers
  */
-import { expect } from '@storybook/jest'
+
 
 import { Main } from './landmarks'
 

package/src/components/link/link.stories.tsx

@@ -1,8 +1,8 @@
 import { StoryObj, Meta } from '@storybook/react'
 
-import { within, userEvent, screen } from '@storybook/testing-library'
+import { within, expect } from '@storybook/test'
+
 
-import { expect } from '@storybook/jest'
 
 import Link from './link'
 import '../../styles/link/link.css'

package/src/components/list/list.stories.tsx

@@ -2,9 +2,8 @@ import React from 'react'
 
 import { StoryObj, Meta } from '@storybook/react'
 
-import { within, userEvent } from '@storybook/testing-library'
+import { within, userEvent } from '@storybook/test'
 
-import { expect } from '@storybook/jest'
 
 import List from './list'
 
@@ -28,6 +27,12 @@ export const DefaultList: Story = {
   args: {
     children: listElm,
   },
+  argTypes: {
+    // foo is the property we want to remove from the UI
+    children: {
+      control: false,
+    },
+  },
 } as Story
 
 export const UnstyledList: Story = {

package/src/components/nav/nav.stories.tsx

@@ -1,6 +1,6 @@
 import { StoryObj, Meta } from '@storybook/react'
-import { within } from '@storybook/testing-library'
-import { expect } from '@storybook/jest'
+import { within, expect } from '@storybook/test'
+
 import React from 'react'
 
 import Nav from './nav'
@@ -40,7 +40,8 @@ export const NavComponent: Story = {
   args: {},
   play: async ({ canvasElement }) => {
     const canvas = within(canvasElement)
-    expect(canvas.getByText(/link/i)).toBeInTheDocument()
+    expect(canvas.getAllByRole('link')).toHaveLength(2)
+    expect(canvas.getByText(/link 1/i)).toBeInTheDocument()
   },
 }
 

package/src/components/popover/popover.stories.tsx

@@ -1,6 +1,6 @@
 import { StoryObj, Meta } from '@storybook/react'
-import { within, userEvent, screen } from '@storybook/testing-library'
-import { expect } from '@storybook/jest'
+import { within, expect, userEvent } from '@storybook/test'
+
 
 import Popover from './popover'
 import { getByText } from '@testing-library/react'

package/src/components/progress/progress.stories.tsx

@@ -1,6 +1,6 @@
 import { StoryObj, Meta } from '@storybook/react'
-import { within, userEvent, screen } from '@storybook/testing-library'
-import { expect } from '@storybook/jest'
+import { within, userEvent, screen } from '@storybook/test'
+
 
 import '../../styles/progress/progress.css'
 

package/src/components/tag/tag.stories.tsx

@@ -1,6 +1,6 @@
 import { StoryObj, Meta } from '@storybook/react'
-import { within, userEvent, screen } from '@storybook/testing-library'
-import { expect } from '@storybook/jest'
+import { within, expect } from '@storybook/test'
+
 
 import Tag from './tag'
 import './tag.scss'
@@ -22,7 +22,7 @@ export const TagComponent: Story = {
   args: {},
   play: async ({ canvasElement }) => {
     const canvas = within(canvasElement)
-    expect(canvas.queryByText(/basic badge/i)).toBeInTheDocument()
+    expect(canvas.queryByText(/basic tag/i)).toBeInTheDocument()
   },
 }
 

package/src/components/text/text.stories.tsx

@@ -1,6 +1,6 @@
 import { StoryObj, Meta } from '@storybook/react'
-import { within, userEvent, screen } from '@storybook/testing-library'
-import { expect } from '@storybook/jest'
+import { within, expect} from '@storybook/test'
+
 
 import Text from './text'
 
@@ -19,10 +19,10 @@ type Story = StoryObj<typeof Text>
 
 export const ParagraphText: Story = {
   args: {},
-  play: async ({ canvasElement }) => {
-    const canvas = within(canvasElement)
-    expect(canvas.getByText(/link/i)).toBeInTheDocument()
-  },
+  // play: async ({ canvasElement }) => {
+  //   const canvas = within(canvasElement)
+  //   expect(canvas.getByText(/link/i)).toBeInTheDocument()
+  // },
 }
 
 export const span: Story = {

package/src/patterns/page/page-header.stories.tsx

@@ -1,6 +1,6 @@
 import { StoryObj, Meta } from '@storybook/react'
-import { within, userEvent, screen } from '@storybook/testing-library'
-import { expect } from '@storybook/jest'
+import { within, userEvent, screen } from '@storybook/test'
+
 
 import PageHeader, { HeaderVariants } from './page-header.js'
 import { Img } from '#components/images/img'

package/src/sass/_globals.scss

@@ -71,6 +71,7 @@ section {
 }
 
 p {
+  max-width: 75ch;
   max-width: 75ch;
   font-size: var(--fs-0);
   line-height: 1.6;
@@ -86,7 +87,7 @@ ol {
   flex-direction: var(--li-direction, column);
   gap: var(--li-gap, 0.2rem);
   flex-wrap: var(--li-wrap, nowrap);
-  padding-inline-start: var(--li-ps, var(--spc-0));
+  padding-inline-start: var(--li-ps, var(--spc-2));
   &[role='list'],
   &[data-list~='unstyled'] {
     list-style: var(--li-style, none);
@@ -98,6 +99,7 @@ ol {
     --li-gap: 1rem;
     --li-wrap: wrap;
     --li-px: 0;
+    --li-pi: 0;
   }
 }
 
@@ -128,27 +130,27 @@ h6 {
 }
 
 h1 {
-  font-size: var(--h1, var(--fs-7));
+  font-size: var(--h1, var(--fs-6));
 }
 
 h2 {
-  font-size: var(--h2, var(--fs-6));
+  font-size: var(--h2, var(--fs-5));
 }
 
 h3 {
-  font-size: var(--h3, var(--fs-5));
+  font-size: var(--h3, var(--fs-4));
 }
 
 h4 {
-  font-size: var(--h4, var(--fs-4));
+  font-size: var(--h4, var(--fs-3));
 }
 
 h5 {
-  font-size: var(--h5, var(--fs-3));
+  font-size: var(--h5, var(--fs-2));
 }
 
 h6 {
-  font-size: var(--h6, var(--fs-2));
+  font-size: var(--h6, var(--fs-1));
 }
 
 hr {

package/src/styles/badge/badge.css

@@ -10,6 +10,7 @@ sup:has(> span) {
   padding: var(--badge-padding);
   border-radius: var(--badge-radius);
   vertical-align: var(--badge-v-align);
+  font-size: var(--badge-fs);
 }
 sup:has(> span) span {
   color: inherit;

package/src/styles/badge/badge.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../components/badge/badge.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEF;EACE;EACA","file":"badge.css"}
+{"version":3,"sourceRoot":"","sources":["../../components/badge/badge.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAEF;EACE;EACA","file":"badge.css"}

package/src/styles/buttons/button.css

@@ -3,9 +3,9 @@ button {
   --btn-md: calc(16rem / 16);
   --btn-lg: calc(21rem / 16);
   --btn-pill: 100rem;
-  --btn-height: calc(40rem / 16);
+  --btn-height: 2.5rem;
   --fs: 0.95rem;
-  --btn-fs: calc(15rem / 16);
+  --btn-fs: 0.9375rem;
   --btn-bg: lightgray;
   --btn-width: max-content;
   font-size: var(--btn-fs);
@@ -46,7 +46,7 @@ button:is(:hover, :focus) {
   background-color: var(--btn-bg, var(--btn, lightgray));
   filter: invert(1) hue-rotate 180deg;
   transform: scale(0.95) var(--line-style, solid);
-  outline-offset: var(--line-offset, 5px);
+  outline-offset: var(--line-offset, 1px);
 }
 button:is(:hover, :focus)[aria-disabled=true] {
   transform: none;

package/src/styles/buttons/button.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../components/buttons/button.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EAEE;EACA;;AAGF;EAEE;;AAGA;EACE;;AAOJ;EAEE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EAGE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA","file":"button.css"}
+{"version":3,"sourceRoot":"","sources":["../../components/buttons/button.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EAEE;EACA;;AAGF;EAEE;;AAGA;EACE;;AAOJ;EAEE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EAGE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA","file":"button.css"}

package/src/styles/cards/card.css

@@ -5,7 +5,7 @@
   --card-position: relative;
   --card-display: flex;
   --card-direction: column;
-  --card-gap: 1.5rem;
+  --card-gap: 1rem;
 }
 
 [data-card],
@@ -17,13 +17,12 @@
   background-color: var(--card-bg);
   text-align: var(--card-align, left);
 }
-[data-card] [data-card-content],
 [data-card] h3,
 [data-card] h2,
-[data-component~=card] [data-card-content],
 [data-component~=card] h3,
 [data-component~=card] h2 {
   margin-block-end: 0;
+  padding-block-end: 0;
 }
 [data-card] + div,
 [data-component~=card] + div {

package/src/styles/cards/card.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../components/cards/card.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;AAEF;AAAA;EACE;;AAEF;AAAA;EACE;EACA;EACA;;AAGF;AAAA;EACE;;AAEF;AAAA;EAEE;;AAEF;AAAA;EACE","file":"card.css"}
+{"version":3,"sourceRoot":"","sources":["../../components/cards/card.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;EAEE;EACA;;AAEF;AAAA;EACE;;AAEF;AAAA;EACE;EACA;EACA;;AAGF;AAAA;EACE;;AAEF;AAAA;EAEE;;AAEF;AAAA;EACE","file":"card.css"}

package/src/styles/details/details.css

@@ -4,10 +4,10 @@ details {
   --details-border: 1px solid #dfdfdf;
   --details-display: flex;
   --details-justify: flex-start;
-  --details-direction: columns;
-  --details-gap: 5rem;
+  --details-direction: column;
+  --details-gap: 0rem;
   --details-px: 1.5rem;
-  --details-py: 1.5rem;
+  --details-py: 1rem;
   --details-radius: 0.5rem;
   --summary-cursor: pointer;
   --summary-transitions: all 0.75s linear;
@@ -39,11 +39,18 @@ details summary {
   padding-block: var(--summary-py, var(--details-py));
   gap: var(--summary-gap);
   list-style: none;
+  border-top-left-radius: var(--details-radius);
+  border-top-right-radius: var(--details-radius);
   /* This ensures no bullet points are shown */
 }
 details summary::-webkit-details-marker {
   display: none;
 }
+details summary:focus-within {
+  outline: none;
+  border-bottom: solid 2px var(--details-border);
+  background-color: whitesmoke;
+}
 details summary:hover {
   cursor: var(--summary-cursor);
 }
@@ -53,6 +60,7 @@ details summary > section {
 details > section {
   padding-inline: var(--details-px);
   padding-block: var(--details-py);
+  margin-block-start: 0;
   border: 1px transparent solid;
 }
 details[open] {

package/src/styles/details/details.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../components/details/details.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;AAMA;;AAJA;EACE;;AAKF;EACE;;AAEF;EACE;;AAIJ;EACE;EACA;EACA;;AAGF;EACE;EACA;;AACA;EACE;;AAEF;EACE","file":"details.css"}
+{"version":3,"sourceRoot":"","sources":["../../components/details/details.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAYA;;AAVA;EACE;;AAGF;EACE;EACA;EACA;;AAKF;EACE;;AAEF;EACE;;AAIJ;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;AACA;EACE;;AAEF;EACE","file":"details.css"}

package/src/styles/icons/icon.css

@@ -5,12 +5,14 @@
   --icon-width: max-content;
   --icon-gap: 0.2rem;
   --icon-height: max-content;
+  --icon-fs: inherit;
   display: var(--icon-display);
   flex-direction: var(--icon-direction);
   gap: var(--icon-gap);
   place-items: var(--icons-placement);
   width: var(--icon-width);
   height: var(--icon-height);
+  font-size: var(--icon-fs);
 }
 
 /*# sourceMappingURL=icon.css.map */

package/src/styles/icons/icon.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../components/icons/icon.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA","file":"icon.css"}
+{"version":3,"sourceRoot":"","sources":["../../components/icons/icon.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA","file":"icon.css"}