@sk-web-gui/core 0.1.46 → 0.1.47

package/dist/esm/components/zebratable.js

@@ -0,0 +1,60 @@
+export var ZebraTable = () => ({
+  '.zebratable': {
+    '@apply w-full text-left table-auto': {},
+    '&-thead': {
+      '&-tr': {
+        '@apply text-sm hidden lg:table-row': {}
+      },
+      '&-th': {
+        '@apply py-sm first-of-type:pl-lg': {},
+        "&[data-isColumnSortable='true']": {
+          '@apply py-sm cursor-pointer': {}
+        }
+      }
+    },
+    '&-sortbutton': {
+      '@apply flex items-center': {},
+      '&-icon': {
+        '@apply inline-flex pl-sm': {},
+        '.MuiSvgIcon-root': {
+          '@apply !text-lg': {}
+        },
+        '&-sort': {
+          '@apply text-black transform': {},
+          "&[data-sortmodeascending='true']": {
+            '@apply -rotate-90': {}
+          },
+          "&[data-sortmodeascending='false']": {
+            '@apply rotate-90': {}
+          }
+        },
+        '&-more': {
+          '@apply text-gray': {}
+        }
+      }
+    },
+    '.material-icons-outlined': {
+      fontSize: '1.25em'
+    },
+    '&-tbody': {
+      '@apply text-body lg:bg-white': {},
+      '&-tr': {
+        '@apply transition-all bg-white lg:even:bg-white lg:odd:bg-gray-100 px-md py-md md:px-lg md:py-lg my-lg first-of-type:mt-0 block shadow-md lg:shadow-none lg:table-row lg:my-0 lg:py-0 lg:px-lg': {},
+        '&.highlighted': {
+          '@apply lg:border-4 lg:border-hover': {}
+        }
+      },
+      '&-td': {
+        '@apply empty:hidden py-4 px-sm lg:px-0 first-of-type:pl-sm lg:first-of-type:pl-lg last-of-type:px-0 lg:last-of-type:pr-lg last-of-type:text-right block lg:table-cell even:bg-white odd:bg-gray-100 last-of-type:bg-transparent lg:even:bg-transparent lg:odd:bg-transparent': {}
+      }
+    },
+    '&-paginationwrapper': {
+      '@apply w-full text-lg flex justify-center lg:justify-start': {}
+    },
+    '&-bottomwrapper': {
+      '@apply mt-lg px-lg flex items-center justify-end': {}
+    }
+  }
+});
+export default ZebraTable;
+//# sourceMappingURL=zebratable.js.map

package/dist/esm/components/zebratable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"zebratable.js","names":["ZebraTable","fontSize"],"sources":["../../../src/components/zebratable.ts"],"sourcesContent":["import { tailwindModuleType } from './types';\n\nexport const ZebraTable: (colors: string[]) => tailwindModuleType = () => ({\n  '.zebratable': {\n    '@apply w-full text-left table-auto': {},\n\n    '&-thead': {\n      '&-tr': {\n        '@apply text-sm hidden lg:table-row': {},\n      },\n\n      '&-th': {\n        '@apply py-sm first-of-type:pl-lg': {},\n\n        \"&[data-isColumnSortable='true']\": {\n          '@apply py-sm cursor-pointer': {},\n        },\n      },\n    },\n\n    '&-sortbutton': {\n      '@apply flex items-center': {},\n\n      '&-icon': {\n        '@apply inline-flex pl-sm': {},\n\n        '.MuiSvgIcon-root': {\n          '@apply !text-lg': {},\n        },\n\n        '&-sort': {\n          '@apply text-black transform': {},\n\n          \"&[data-sortmodeascending='true']\": {\n            '@apply -rotate-90': {},\n          },\n\n          \"&[data-sortmodeascending='false']\": {\n            '@apply rotate-90': {},\n          },\n        },\n\n        '&-more': {\n          '@apply text-gray': {},\n        },\n      },\n    },\n\n    '.material-icons-outlined': {\n      fontSize: '1.25em',\n    },\n\n    '&-tbody': {\n      '@apply text-body lg:bg-white': {},\n\n      '&-tr': {\n        '@apply transition-all bg-white lg:even:bg-white lg:odd:bg-gray-100 px-md py-md md:px-lg md:py-lg my-lg first-of-type:mt-0 block shadow-md lg:shadow-none lg:table-row lg:my-0 lg:py-0 lg:px-lg':\n          {},\n\n        '&.highlighted': {\n          '@apply lg:border-4 lg:border-hover': {},\n        },\n      },\n\n      '&-td': {\n        '@apply empty:hidden py-4 px-sm lg:px-0 first-of-type:pl-sm lg:first-of-type:pl-lg last-of-type:px-0 lg:last-of-type:pr-lg last-of-type:text-right block lg:table-cell even:bg-white odd:bg-gray-100 last-of-type:bg-transparent lg:even:bg-transparent lg:odd:bg-transparent':\n          {},\n      },\n    },\n\n    '&-paginationwrapper': {\n      '@apply w-full text-lg flex justify-center lg:justify-start': {},\n    },\n\n    '&-bottomwrapper': {\n      '@apply mt-lg px-lg flex items-center justify-end': {},\n    },\n  },\n});\nexport default ZebraTable;\n"],"mappings":"AAEA,OAAO,IAAMA,UAAoD,GAAG,OAAO;EACzE,eAAe;IACb,sCAAsC,EADzB;IAGb,WAAW;MACT,QAAQ;QACN,sCAAsC;MADhC,CADC;MAKT,QAAQ;QACN,oCAAoC,EAD9B;QAGN,mCAAmC;UACjC,+BAA+B;QADE;MAH7B;IALC,CAHE;IAiBb,gBAAgB;MACd,4BAA4B,EADd;MAGd,UAAU;QACR,4BAA4B,EADpB;QAGR,oBAAoB;UAClB,mBAAmB;QADD,CAHZ;QAOR,UAAU;UACR,+BAA+B,EADvB;UAGR,oCAAoC;YAClC,qBAAqB;UADa,CAH5B;UAOR,qCAAqC;YACnC,oBAAoB;UADe;QAP7B,CAPF;QAmBR,UAAU;UACR,oBAAoB;QADZ;MAnBF;IAHI,CAjBH;IA6Cb,4BAA4B;MAC1BC,QAAQ,EAAE;IADgB,CA7Cf;IAiDb,WAAW;MACT,gCAAgC,EADvB;MAGT,QAAQ;QACN,kMACE,EAFI;QAIN,iBAAiB;UACf,sCAAsC;QADvB;MAJX,CAHC;MAYT,QAAQ;QACN,gRACE;MAFI;IAZC,CAjDE;IAmEb,uBAAuB;MACrB,8DAA8D;IADzC,CAnEV;IAuEb,mBAAmB;MACjB,oDAAoD;IADnC;EAvEN;AAD0D,CAAP,CAA7D;AA6EP,eAAeD,UAAf"}

package/dist/esm/index.js

@@ -0,0 +1,327 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+// components
+// import Alert from './components/alert';
+// import Breadcrumb from './components/breadcrumb';
+// import ButtonGroup from './components/button-group';
+// import Checkbox from './components/checkbox';
+// import Dot from './components/dot';
+// import Forms from './components/forms';
+// import Calendar from './components/calendar';
+// import IconButton from './components/icon-button';
+// import Icon from './components/icon';
+// import Link from './components/link';
+// import Message from './components/message';
+// import NotificationToast from './components/notification';
+// import Radio from './components/radio';
+// import Switch from './components/switch';
+// import Button from './components/button';
+import Accordion from './components/accordion'; // import Card from './components/card';
+// import Table from './components/table';
+// import ZebraTable from './components/zebratable';
+// import Modal from './components/modal';
+// import CookieConsent from './components/cookie-consent';
+// import Divider from './components/divider';
+// import UserMenu from './components/user-menu';
+// import Tag from './components/tag';
+// import Pagination from './components/pagination';
+// import Footer from './components/footer';
+// import Header from './components/header';
+// const { = require(} from './../../theme/src/colors');
+// import { colors } from '@sk-web-gui/theme';
+
+import { colors } from '@sk-web-gui/theme';
+import { withOpacity } from './with-opacity';
+import plugin from 'tailwindcss/plugin';
+var components = [// Alert,
+// Breadcrumb,
+// ButtonGroup,
+// Button,
+// Checkbox,
+// Dot,
+// Forms,
+// Calendar,
+// IconButton,
+// Icon,
+// Link,
+// Message,
+// NotificationToast,
+// Radio,
+// Switch,
+// Table,
+// ZebraTable,
+// CookieConsent,
+// Modal,
+Accordion // Card,
+// Divider,
+// UserMenu,
+// Tag,
+// Pagination,
+// Footer,
+// Header,
+];
+var defaultColors = ['primary', 'secondary'];
+var themeColors = colors;
+module.exports = plugin.withOptions(function (options) {
+  if (options === void 0) {
+    options = {
+      colors: [],
+      cssBase: true
+    };
+  }
+
+  return function (_ref) {
+    var {
+      addComponents,
+      addVariant,
+      addBase,
+      e
+    } = _ref;
+    var optionColors = [...defaultColors, ...(options.colors || [])];
+    active({
+      addVariant,
+      e
+    });
+    selected({
+      addVariant,
+      e
+    });
+    disabled({
+      addVariant,
+      e
+    });
+    addComponents(components.map(component => {
+      component(optionColors);
+    }), {
+      respectPrefix: false
+    });
+
+    if (options.cssBase) {
+      addBase({
+        html: {
+          '@apply text-foreground antialiased bg-base': {},
+          fontSize: '62.5%',
+          lineHeight: '1.5',
+          textRendering: 'optimizeLegibility',
+          textSizeAdjust: '100%',
+          touchAction: 'manipulation'
+        },
+        body: {
+          '@apply text-base leading-base': {},
+          position: 'relative',
+          minHeight: '100%',
+          fontFeatureSettings: "'kern'"
+        },
+        'h1,h2,h3,h4,h5,h6': {
+          '@apply font-bold': {}
+        },
+        small: {
+          fontSize: '1.4rem'
+        },
+        h1: {
+          '@apply text-3xl leading-3xl': {}
+        },
+        h2: {
+          '@apply text-2xl leading-2xl': {}
+        },
+        h3: {
+          '@apply text-xl leading-xl': {}
+        },
+        h4: {
+          '@apply text-lg leading-lg': {}
+        },
+        h5: {
+          '@apply text-base leading-base': {}
+        },
+        h6: {
+          '@apply text-sm leading-sm': {}
+        },
+        p: {
+          '@apply my-4': {}
+        },
+        '.text-content': {
+          '@apply max-w-[80rem]': {},
+          h1: {
+            '@apply mb-md': {},
+            '+ p': {
+              '@apply mb-[40px] mt-0': {}
+            }
+          },
+          h2: {
+            '@apply mt-lg': {}
+          },
+          h3: {
+            '@apply mt-lg': {}
+          },
+          h4: {
+            '@apply mt-lg': {}
+          },
+          h5: {
+            '@apply mt-lg': {}
+          },
+          h6: {
+            '@apply mt-lg': {}
+          },
+          p: {
+            '@apply mt-sm leading-[1.5]': {}
+          }
+        }
+      });
+    }
+  };
+}, function () {
+  return {
+    content: [''],
+    theme: {
+      fontSize: {
+        tiny: '1rem',
+        xs: '1.2rem',
+        sm: '1.4rem',
+        base: '1.6rem',
+        lg: '1.8rem',
+        xl: '2.0rem',
+        '2xl': '2.4rem',
+        '3xl': '3.2rem',
+        '4xl': '4.0rem',
+        '5xl': '5.2rem'
+      },
+      extend: {
+        colors: _extends({}, themeColors, {
+          current: 'currentColor'
+        }),
+        cursor: {
+          base: 'var(--vc-cursor)'
+        },
+        spacing: {
+          xs: '4px',
+          sm: '8px',
+          md: '16px',
+          lg: '24px',
+          xl: '48px'
+        },
+        lineHeight: {
+          tiny: '1.4rem',
+          xs: '1.6rem',
+          sm: '2rem',
+          base: '2.4rem',
+          lg: '2.4rem',
+          xl: '3.2rem',
+          '2xl': '3.2rem',
+          '3xl': '4rem',
+          '4xl': '4.8rem',
+          '5xl': '5.8rem'
+        },
+        opacity: {
+          15: '0.15'
+        },
+        backgroundColor: {
+          base: withOpacity('--vc-colors-bg-base'),
+          fill: withOpacity('--vc-colors-bg-fill')
+        },
+        textColor: {
+          foreground: withOpacity('--vc-colors-text-foreground'),
+          muted: withOpacity('--vc-colors-text-muted')
+        },
+        borderRadius: {
+          base: 'var(--vc-rounded)'
+        },
+        zIndex: {
+          hide: '-1',
+          none: '0',
+          base: '1',
+          docked: '10',
+          dropdown: '1000',
+          sticky: '1100',
+          banner: '1200',
+          overlay: '1300',
+          modal: '1400',
+          popover: '1500',
+          skipLink: '1600',
+          toast: '1700',
+          tooltip: '1800'
+        }
+      }
+    },
+    variants: {
+      extend: {
+        boxShadow: ['disabled'],
+        cursor: ['disabled'],
+        opacity: ['active', 'disabled'],
+        textColor: ['active', 'disabled:hover'],
+        textDecoration: ['disabled'],
+        backgroundColor: ['disabled'],
+        borderColor: ['disabled']
+      }
+    }
+  };
+});
+
+function active(_ref2) {
+  var {
+    addVariant,
+    e
+  } = _ref2;
+  addVariant('active', _ref3 => {
+    var {
+      modifySelectors,
+      separator
+    } = _ref3;
+    modifySelectors(_ref4 => {
+      var {
+        className
+      } = _ref4;
+      return "." + e("active" + separator + className) + ":active, ." + e("active" + separator + className) + "[data-active=true]";
+    });
+  });
+}
+
+function selected(_ref5) {
+  var {
+    addVariant,
+    e
+  } = _ref5;
+  addVariant('selected', _ref6 => {
+    var {
+      modifySelectors,
+      separator
+    } = _ref6;
+    modifySelectors(_ref7 => {
+      var {
+        className
+      } = _ref7;
+      return "." + e("selected" + separator + className) + "[aria-selected=true]";
+    });
+  });
+}
+
+function disabled(_ref8) {
+  var {
+    addVariant,
+    e
+  } = _ref8;
+  addVariant('disabled', _ref9 => {
+    var {
+      modifySelectors,
+      separator
+    } = _ref9;
+    modifySelectors(_ref10 => {
+      var {
+        className
+      } = _ref10;
+      return "." + e("disabled" + separator + className) + "[aria-disabled=true]";
+    });
+  });
+  addVariant('disabled:hover', _ref11 => {
+    var {
+      modifySelectors,
+      separator
+    } = _ref11;
+    modifySelectors(_ref12 => {
+      var {
+        className
+      } = _ref12;
+      return "." + e("disabled:hover" + separator + className) + "[aria-disabled=true]";
+    });
+  });
+}
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Accordion","colors","withOpacity","plugin","components","defaultColors","themeColors","module","exports","withOptions","options","cssBase","addComponents","addVariant","addBase","e","optionColors","active","selected","disabled","map","component","respectPrefix","html","fontSize","lineHeight","textRendering","textSizeAdjust","touchAction","body","position","minHeight","fontFeatureSettings","small","h1","h2","h3","h4","h5","h6","p","content","theme","tiny","xs","sm","base","lg","xl","extend","current","cursor","spacing","md","opacity","backgroundColor","fill","textColor","foreground","muted","borderRadius","zIndex","hide","none","docked","dropdown","sticky","banner","overlay","modal","popover","skipLink","toast","tooltip","variants","boxShadow","textDecoration","borderColor","modifySelectors","separator","className"],"sources":["../../src/index.ts"],"sourcesContent":["// components\n// import Alert from './components/alert';\n// import Breadcrumb from './components/breadcrumb';\n// import ButtonGroup from './components/button-group';\n\n// import Checkbox from './components/checkbox';\n// import Dot from './components/dot';\n// import Forms from './components/forms';\n// import Calendar from './components/calendar';\n// import IconButton from './components/icon-button';\n// import Icon from './components/icon';\n// import Link from './components/link';\n// import Message from './components/message';\n// import NotificationToast from './components/notification';\n// import Radio from './components/radio';\n// import Switch from './components/switch';\n\n// import Button from './components/button';\nimport Accordion from './components/accordion';\n// import Card from './components/card';\n// import Table from './components/table';\n// import ZebraTable from './components/zebratable';\n\n// import Modal from './components/modal';\n// import CookieConsent from './components/cookie-consent';\n// import Divider from './components/divider';\n\n// import UserMenu from './components/user-menu';\n\n// import Tag from './components/tag';\n// import Pagination from './components/pagination';\n// import Footer from './components/footer';\n// import Header from './components/header';\n\n// const { = require(} from './../../theme/src/colors');\n// import { colors } from '@sk-web-gui/theme';\nimport { colors } from '@sk-web-gui/theme';\nimport { withOpacity } from './with-opacity';\nimport plugin from 'tailwindcss/plugin';\nimport { tailwindModuleType } from './components/types';\nimport { Config } from 'tailwindcss/types/config';\n\nconst components: ((colors: string[]) => tailwindModuleType)[] = [\n  // Alert,\n  // Breadcrumb,\n  // ButtonGroup,\n  // Button,\n  // Checkbox,\n  // Dot,\n  // Forms,\n  // Calendar,\n  // IconButton,\n  // Icon,\n  // Link,\n  // Message,\n  // NotificationToast,\n  // Radio,\n  // Switch,\n\n  // Table,\n  // ZebraTable,\n  // CookieConsent,\n  // Modal,\n\n  Accordion,\n  // Card,\n  // Divider,\n\n  // UserMenu,\n\n  // Tag,\n  // Pagination,\n  // Footer,\n  // Header,\n];\n\nconst defaultColors = ['primary', 'secondary'];\nconst themeColors = colors;\n\ntype AlfaType = (s: { className: string }) => string;\ntype AddVariantType = (\n  s1: string,\n  s2: (s: { modifySelectors: (arg: AlfaType) => void; separator: string }) => void\n) => string;\ntype PluginAPIType = { addVariant: AddVariantType; e: (className: string) => string };\n\nmodule.exports = plugin.withOptions(\n  function (options: { colors: string[]; cssBase: boolean } = { colors: [], cssBase: true }) {\n    return function ({ addComponents, addVariant, addBase, e }) {\n      const optionColors = [...defaultColors, ...(options.colors || [])];\n\n      active({ addVariant, e } as PluginAPIType);\n      selected({ addVariant, e } as PluginAPIType);\n      disabled({ addVariant, e } as PluginAPIType);\n\n      addComponents(\n        components.map((component) => {\n          component(optionColors);\n        }),\n        {\n          respectPrefix: false,\n        }\n      );\n\n      if (options.cssBase) {\n        addBase({\n          html: {\n            '@apply text-foreground antialiased bg-base': {},\n            fontSize: '62.5%',\n            lineHeight: '1.5',\n            textRendering: 'optimizeLegibility',\n            textSizeAdjust: '100%',\n            touchAction: 'manipulation',\n          },\n          body: {\n            '@apply text-base leading-base': {},\n            position: 'relative',\n            minHeight: '100%',\n            fontFeatureSettings: \"'kern'\",\n          },\n          'h1,h2,h3,h4,h5,h6': {\n            '@apply font-bold': {},\n          },\n          small: {\n            fontSize: '1.4rem',\n          },\n          h1: { '@apply text-3xl leading-3xl': {} },\n          h2: { '@apply text-2xl leading-2xl': {} },\n          h3: { '@apply text-xl leading-xl': {} },\n          h4: { '@apply text-lg leading-lg': {} },\n          h5: { '@apply text-base leading-base': {} },\n          h6: { '@apply text-sm leading-sm': {} },\n          p: { '@apply my-4': {} },\n\n          '.text-content': {\n            '@apply max-w-[80rem]': {},\n\n            h1: {\n              '@apply mb-md': {},\n\n              '+ p': {\n                '@apply mb-[40px] mt-0': {},\n              },\n            },\n            h2: { '@apply mt-lg': {} },\n            h3: { '@apply mt-lg': {} },\n            h4: { '@apply mt-lg': {} },\n            h5: { '@apply mt-lg': {} },\n            h6: { '@apply mt-lg': {} },\n            p: { '@apply mt-sm leading-[1.5]': {} },\n          },\n        });\n      }\n    };\n  },\n  function (): Config {\n    return {\n      content: [''],\n      theme: {\n        fontSize: {\n          tiny: '1rem',\n          xs: '1.2rem',\n          sm: '1.4rem',\n          base: '1.6rem',\n          lg: '1.8rem',\n          xl: '2.0rem',\n          '2xl': '2.4rem',\n          '3xl': '3.2rem',\n          '4xl': '4.0rem',\n          '5xl': '5.2rem',\n        },\n        extend: {\n          colors: {\n            ...themeColors,\n            current: 'currentColor',\n          },\n          cursor: {\n            base: 'var(--vc-cursor)',\n          },\n          spacing: {\n            xs: '4px',\n            sm: '8px',\n            md: '16px',\n            lg: '24px',\n            xl: '48px',\n          },\n          lineHeight: {\n            tiny: '1.4rem',\n            xs: '1.6rem',\n            sm: '2rem',\n            base: '2.4rem',\n            lg: '2.4rem',\n            xl: '3.2rem',\n            '2xl': '3.2rem',\n            '3xl': '4rem',\n            '4xl': '4.8rem',\n            '5xl': '5.8rem',\n          },\n          opacity: {\n            15: '0.15',\n          },\n          backgroundColor: {\n            base: withOpacity('--vc-colors-bg-base') as unknown as string,\n            fill: withOpacity('--vc-colors-bg-fill') as unknown as string,\n          },\n          textColor: {\n            foreground: withOpacity('--vc-colors-text-foreground') as unknown as string,\n            muted: withOpacity('--vc-colors-text-muted') as unknown as string,\n          },\n          borderRadius: {\n            base: 'var(--vc-rounded)',\n          },\n          zIndex: {\n            hide: '-1',\n            none: '0',\n            base: '1',\n            docked: '10',\n            dropdown: '1000',\n            sticky: '1100',\n            banner: '1200',\n            overlay: '1300',\n            modal: '1400',\n            popover: '1500',\n            skipLink: '1600',\n            toast: '1700',\n            tooltip: '1800',\n          },\n        },\n      },\n      variants: {\n        extend: {\n          boxShadow: ['disabled'],\n          cursor: ['disabled'],\n          opacity: ['active', 'disabled'],\n          textColor: ['active', 'disabled:hover'],\n          textDecoration: ['disabled'],\n          backgroundColor: ['disabled'],\n          borderColor: ['disabled'],\n        },\n      },\n    };\n  }\n);\n\nfunction active({ addVariant, e }: PluginAPIType) {\n  addVariant('active', ({ modifySelectors, separator }) => {\n    modifySelectors(({ className }) => {\n      return `.${e(`active${separator}${className}`)}:active, .${e(\n        `active${separator}${className}`\n      )}[data-active=true]`;\n    });\n  });\n}\n\nfunction selected({ addVariant, e }: PluginAPIType) {\n  addVariant('selected', ({ modifySelectors, separator }) => {\n    modifySelectors(({ className }) => {\n      return `.${e(`selected${separator}${className}`)}[aria-selected=true]`;\n    });\n  });\n}\n\nfunction disabled({ addVariant, e }: PluginAPIType) {\n  addVariant('disabled', ({ modifySelectors, separator }) => {\n    modifySelectors(({ className }) => {\n      return `.${e(`disabled${separator}${className}`)}[aria-disabled=true]`;\n    });\n  });\n  addVariant('disabled:hover', ({ modifySelectors, separator }) => {\n    modifySelectors(({ className }) => {\n      return `.${e(`disabled:hover${separator}${className}`)}[aria-disabled=true]`;\n    });\n  });\n}\n"],"mappings":"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"}

package/dist/esm/with-opacity.js

@@ -0,0 +1,10 @@
+export var withOpacity = variableName => {
+  return _ref => {
+    var {
+      opacityValue
+    } = _ref;
+    if (opacityValue) return "rgba(var(" + variableName + "), " + opacityValue + ")";
+    return "rgb(var(" + variableName + "))";
+  };
+};
+//# sourceMappingURL=with-opacity.js.map

package/dist/esm/with-opacity.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"with-opacity.js","names":["withOpacity","variableName","opacityValue"],"sources":["../../src/with-opacity.ts"],"sourcesContent":["export const withOpacity = (variableName: string) => {\n  return ({ opacityValue }: { opacityValue: number }): string => {\n    if (opacityValue) return `rgba(var(${variableName}), ${opacityValue})`;\n    return `rgb(var(${variableName}))`;\n  };\n};\n"],"mappings":"AAAA,OAAO,IAAMA,WAAW,GAAIC,YAAD,IAA0B;EACnD,OAAO,QAAwD;IAAA,IAAvD;MAAEC;IAAF,CAAuD;IAC7D,IAAIA,YAAJ,EAAkB,qBAAmBD,YAAnB,WAAqCC,YAArC;IAClB,oBAAkBD,YAAlB;EACD,CAHD;AAID,CALM"}

package/dist/types/accordion/index.d.ts

@@ -0,0 +1 @@
+export * from './src';

package/dist/types/accordion/src/accordion.d.ts

@@ -0,0 +1,17 @@
+import { DefaultProps } from '@sk-web-gui/theme';
+import * as React from 'react';
+interface IAccordionProps extends DefaultProps {
+    initalOpen?: boolean;
+    accordionTitle: string;
+    accordionSubTitle?: string;
+    disabled?: boolean;
+    color?: string;
+    /** Controls accordion appearance */
+    variant?: 'solid' | 'outline';
+    as?: React.ElementType;
+    children?: React.ReactNode;
+}
+export interface AccordionProps extends React.HTMLAttributes<HTMLDivElement>, IAccordionProps {
+}
+export declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/types/accordion/src/index.d.ts

@@ -0,0 +1 @@
+export * from './accordion';

package/dist/types/accordion/src/styles.d.ts

@@ -0,0 +1 @@
+export declare const useAccordionClass: (args?: any) => string;

package/dist/types/accordion/stories/accordion.stories.d.ts

@@ -0,0 +1,40 @@
+/// <reference types="react" />
+import { Meta } from '@storybook/react';
+import { AccordionProps } from '../src';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Template: {
+    (args: AccordionProps): JSX.Element;
+    argTypes: {
+        accordionTitle: {
+            control: string;
+            defaultValue: string;
+        };
+        accordionSubTitle: {
+            control: string;
+            defaultValue: string;
+        };
+        initalOpen: {
+            control: string;
+            defaultValue: boolean;
+        };
+        variant: {
+            type: {
+                name: string;
+                required: boolean;
+            };
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+            options: string[];
+            control: string;
+            defaultValue: string;
+        };
+    };
+    story: {
+        name: string;
+    };
+};

package/dist/types/alert/index.d.ts

@@ -0,0 +1 @@
+export * from './src';

package/dist/types/alert/src/alert.d.ts

@@ -0,0 +1,15 @@
+import { DefaultProps } from '@sk-web-gui/theme';
+import * as React from 'react';
+declare type IAlertCloseButtonProps = DefaultProps;
+export interface AlertCloseButtonProps extends React.HTMLAttributes<HTMLButtonElement>, IAlertCloseButtonProps {
+}
+export declare const AlertCloseButton: React.ForwardRefExoticComponent<AlertCloseButtonProps & React.RefAttributes<HTMLButtonElement>>;
+interface IAlertProps extends DefaultProps {
+    color?: string;
+    /** Controls alert appearance */
+    variant?: 'subtle' | 'solid' | 'left-accent';
+}
+export interface AlertProps extends React.HTMLAttributes<HTMLDivElement>, IAlertProps {
+}
+export declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/types/alert/src/index.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { AlertProps, AlertCloseButton, AlertCloseButtonProps } from './alert';
+interface Alert extends React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>> {
+    CloseButton: typeof AlertCloseButton;
+}
+declare const Alert: Alert;
+export type { AlertProps, AlertCloseButtonProps };
+export { Alert, AlertCloseButton };

package/dist/types/alert/src/styles.d.ts

@@ -0,0 +1,2 @@
+export declare const useAlertCloseButton: (args?: any) => string;
+export declare const useAlertClass: (args?: any) => string;

package/dist/types/breadcrumb/index.d.ts

@@ -0,0 +1 @@
+export * from './src';

package/dist/types/breadcrumb/src/breadcrumb.d.ts

@@ -0,0 +1,34 @@
+import { LinkProps } from '@sk-web-gui/link';
+import { DefaultProps } from '@sk-web-gui/theme';
+import * as React from 'react';
+export interface BreadcrumbSeparatorProps extends DefaultProps, React.HTMLAttributes<HTMLSpanElement> {
+    children?: React.ReactNode;
+}
+declare const BreadcrumbSeparator: React.ForwardRefExoticComponent<BreadcrumbSeparatorProps & React.RefAttributes<HTMLSpanElement>>;
+interface BreadcrumbLinkProps extends LinkProps {
+    /**
+     * If `true`, indicates that the breadcrumb item is active, adds
+     * `aria-current=page` and renders a `span`
+     */
+    currentPage?: boolean;
+}
+export type { BreadcrumbLinkProps };
+declare const BreadcrumbLink: React.ForwardRefExoticComponent<BreadcrumbLinkProps & React.RefAttributes<HTMLAnchorElement | HTMLSpanElement>>;
+export interface BreadcrumbItemProps extends BreadcrumbProps {
+    /**
+     * If `true`, indicates that the breadcrumb item is active, adds
+     * `aria-current=page` and renders a `span`
+     */
+    currentPage?: boolean;
+    lastChild?: boolean;
+}
+declare const BreadcrumbItem: React.ForwardRefExoticComponent<BreadcrumbItemProps & React.RefAttributes<HTMLLIElement>>;
+interface IBreadcrumbProps extends DefaultProps {
+    separator?: string | React.ReactElement;
+    addSeparator?: boolean;
+    children?: React.ReactNode;
+}
+export interface BreadcrumbProps extends React.HTMLAttributes<HTMLElement>, IBreadcrumbProps {
+}
+declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>>;
+export { Breadcrumb, BreadcrumbLink, BreadcrumbItem, BreadcrumbSeparator };

package/dist/types/breadcrumb/src/index.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { BreadcrumbProps, BreadcrumbItem, BreadcrumbItemProps, BreadcrumbLink, BreadcrumbLinkProps, BreadcrumbSeparator, BreadcrumbSeparatorProps } from './breadcrumb';
+interface Breadcrumb extends React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>> {
+    Item: typeof BreadcrumbItem;
+    Link: typeof BreadcrumbLink;
+    Separator: typeof BreadcrumbSeparator;
+}
+declare const Breadcrumb: Breadcrumb;
+export type { BreadcrumbProps, BreadcrumbItemProps, BreadcrumbLinkProps, BreadcrumbSeparatorProps };
+export { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbSeparator };

package/dist/types/breadcrumb/stories/breadcrumb.stories.d.ts

@@ -0,0 +1,28 @@
+/// <reference types="react" />
+import { Breadcrumb } from '../src';
+declare const _default: {
+    title: string;
+    component: Breadcrumb;
+    parameters: {};
+};
+export default _default;
+export declare const Template: {
+    (): JSX.Element;
+    argTypes: {
+        separator: {
+            type: {
+                name: string;
+                required: boolean;
+            };
+            description: string;
+            table: {
+                defaultValue: {
+                    summary: string;
+                };
+            };
+            control: string;
+            defaultValue: string;
+        };
+    };
+    storyName: string;
+};

package/dist/types/button/index.d.ts

@@ -0,0 +1 @@
+export * from './src';

package/dist/types/button/src/button-group.d.ts

@@ -0,0 +1,20 @@
+import { DefaultProps } from '@sk-web-gui/theme';
+import * as React from 'react';
+import { ButtonProps } from './button';
+interface IButtonGroupProps extends DefaultProps {
+    /**
+     * If `true`, the borderRadius of button that are direct children will be altered
+     * to look flushed together
+     */
+    attached?: boolean;
+    disabled?: boolean;
+    size?: ButtonProps['size'];
+    /** Controls all wrapped button appearance */
+    variant?: ButtonProps['variant'];
+    color?: ButtonProps['color'];
+    children?: React.ReactNode;
+}
+export interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement>, IButtonGroupProps {
+}
+export declare const ButtonGroup: React.ForwardRefExoticComponent<ButtonGroupProps & React.RefAttributes<HTMLDivElement>>;
+export {};