@sk-web-gui/core 0.1.93 → 1.0.1

package/dist/cjs/components/forms.js.map

@@ -1 +1 @@
-{"version":3,"file":"forms.js","names":["fieldOutline","colors","_extends","reduce","styles","color","_ref","_extends2","fieldSolid","_ref2","_extends3","formControl","formInputGroup","module","exports","Forms","maxHeight"],"sources":["../../../src/components/forms.js"],"sourcesContent":["function fieldOutline(colors) {\r\n  return {\r\n    '&-outline': {\r\n      '@apply border shadow-sm border-gray-stroke': {},\r\n      '@apply text-gray bg-white': {},\r\n\r\n      ...colors.reduce(\r\n        (styles, color) => ({\r\n          ...styles,\r\n          [`&[data-color=\"${color}\"]`]: {\r\n            [`@apply focus-visible:border-${color} focus-visible:ring-${color}`]: {},\r\n            [`@apply dark:focus-visible:border-${color} dark:focus-visible:ring-${color}`]: {},\r\n          },\r\n        }),\r\n        {}\r\n      ),\r\n\r\n      '&[aria-invalid=true]': {\r\n        '@apply border-error ring-error': {},\r\n\r\n        '&:focus-visible': {\r\n          '@apply border-error ring-error': {},\r\n        },\r\n      },\r\n    },\r\n  };\r\n}\r\n\r\nfunction fieldSolid(colors) {\r\n  return {\r\n    '&-solid': {\r\n      '@apply border border-transparent': {},\r\n      '@apply text-black bg-gray-light': {},\r\n\r\n      ...colors.reduce(\r\n        (styles, color) => ({\r\n          ...styles,\r\n          [`&[data-color=\"${color}\"]`]: {\r\n            [`@apply focus-visible:border-${color} focus-visible:ring-${color}`]: {},\r\n            [`@apply dark:focus-visible:border-${color} dark:focus-visible:ring-${color}`]: {},\r\n          },\r\n        }),\r\n        {}\r\n      ),\r\n\r\n      '&[aria-invalid=true]': {\r\n        '@apply border-error ring-error': {},\r\n\r\n        '&:focus-visible': {\r\n          '@apply border-error ring-error': {},\r\n        },\r\n      },\r\n    },\r\n  };\r\n}\r\n\r\nfunction formControl() {\r\n  return {\r\n    '.form-control': {\r\n      '@apply w-full relative': {},\r\n    },\r\n    '.form-helper-text': {\r\n      '@apply mt-1.5 leading-none text-gray dark:text-white/60': {},\r\n    },\r\n    '.form-error-message': {\r\n      '@apply mt-1.5 leading-none flex items-center text-sm text-error': {},\r\n    },\r\n    '.form-label': {\r\n      '@apply text-sm font-medium text-left align-middle block mb-1.5': {},\r\n    },\r\n    '.form-required-indicator': {\r\n      '@apply ml-1 text-sm': {},\r\n      '--tw-text-opacity': '1',\r\n      color: 'rgba(239, 68, 68, var(--tw-text-opacity))',\r\n      '.dark &': {\r\n        '--tw-text-opacity': '1',\r\n        color: 'rgba(252, 165, 165, var(--tw-text-opacity))',\r\n      },\r\n    },\r\n  };\r\n}\r\n\r\nfunction formInputGroup() {\r\n  return {\r\n    '.form-input-group': {\r\n      '@apply flex relative bg-white h-fit w-full rounded-[0.2rem] border border-gray-stroke': {},\r\n\r\n      '&:focus-within': {\r\n        '@apply border border-primary ring-primary ring-1': {},\r\n      },\r\n\r\n      '> *': {\r\n        '@apply border-0 ring-0 shadow-none': {},\r\n\r\n        '&:focus': {\r\n          '@apply ring-0': {},\r\n        },\r\n      },\r\n\r\n      '&-sm': {\r\n        '@apply min-h-[4rem] max-h-[4rem]': {},\r\n\r\n        '.form-field': {\r\n          '@apply min-h-[3.8rem] max-h-[3.8rem]': {},\r\n        },\r\n      },\r\n\r\n      '&-md': {\r\n        '@apply min-h-[4.4rem] max-h-[4.4rem]': {},\r\n\r\n        '.form-field': {\r\n          '@apply min-h-[4.2rem] max-h-[4.2rem]': {},\r\n        },\r\n      },\r\n\r\n      '&-lg': {\r\n        '@apply min-h-[4.8rem] max-h-[4.8rem]': {},\r\n\r\n        '.form-field': {\r\n          '@apply min-h-[4.6rem] max-h-[4.6rem]': {},\r\n        },\r\n      },\r\n\r\n      \"&[data-rounded='true']\": {\r\n        '@apply rounded-[3.2rem]': {},\r\n\r\n        '> *:first-child': {\r\n          '@apply rounded-[3.2rem]': {},\r\n        },\r\n\r\n        '> *:last-child': {\r\n          '@apply rounded-[3.2rem]': {},\r\n        },\r\n      },\r\n\r\n      '&[aria-invalid=true]': {\r\n        '@apply border-error ring-error': {},\r\n      },\r\n    },\r\n\r\n    '.form-input-element': {\r\n      '@apply flex items-center justify-center absolute z-base top-0': {},\r\n\r\n      '&-sm': {\r\n        '@apply text-xs h-7 w-7': {},\r\n      },\r\n\r\n      '&-md': {\r\n        '@apply text-sm h-8 w-8': {},\r\n      },\r\n\r\n      '&-lg': {\r\n        '@apply text-base h-10 w-10': {},\r\n      },\r\n    },\r\n\r\n    '.form-input-addon': {\r\n      '@apply flex items-center w-auto shadow-sm whitespace-nowrap': {},\r\n      '@apply text-gray bg-neutral-50': {},\r\n      // dark colors\r\n      '@apply dark:border-neutral-700': {},\r\n      '@apply dark:text-neutral-100 dark:bg-white/30': {},\r\n\r\n      '&-sm': {\r\n        '@apply px-3 text-xs': {},\r\n      },\r\n\r\n      '&-md': {\r\n        '@apply px-4 text-sm': {},\r\n      },\r\n\r\n      '&-lg': {\r\n        '@apply px-4 text-base': {},\r\n      },\r\n\r\n      '&-left': {\r\n        '@apply rounded-r-none': {},\r\n      },\r\n\r\n      '&-right': {\r\n        '@apply rounded-l-none': {},\r\n      },\r\n    },\r\n    '.form-input-addin': {\r\n      '@apply flex items-center w-auto whitespace-nowrap': {},\r\n      '@apply text-body': {},\r\n\r\n      '&-sm': {\r\n        '@apply px-[1.44rem] text-xs': {},\r\n      },\r\n\r\n      '&-md': {\r\n        '@apply px-[1.6rem] text-sm': {},\r\n      },\r\n\r\n      '&-lg': {\r\n        '@apply px-[1.76rem] text-base': {},\r\n      },\r\n\r\n      '&-left': {\r\n        '@apply pr-0 rounded-r-none': {},\r\n      },\r\n\r\n      '&-right': {\r\n        '@apply pl-0 rounded-l-none': {},\r\n      },\r\n    },\r\n  };\r\n}\r\n\r\nmodule.exports = Forms = (colors) => ({\r\n  '.form-field': {\r\n    '@apply rounded-[0.2rem] placeholder-gray-stroke': {},\r\n    '@apply relative w-full min-w-0 inline-flex items-center appearance-none focus-visible:outline-none': {},\r\n    '@apply transition-colors\tduration-75 ease-out': {},\r\n\r\n    '&-sm': {\r\n      '@apply text-sm leading-sm': {},\r\n      '@apply py-0 px-[1.44rem] min-h-[4rem] max-h-[4rem]': {},\r\n    },\r\n\r\n    '&-md': {\r\n      '@apply text-base leading-base': {},\r\n      '@apply py-0 px-[1.6rem] min-h-[4.4rem] max-h-[4.4rem]': {},\r\n    },\r\n\r\n    '&-lg': {\r\n      '@apply text-base leading-lg': {},\r\n      '@apply py-0 px-[1.76rem] min-h-[4.8rem] max-h-[4.8rem]': {},\r\n    },\r\n\r\n    '&-disabled, &&-disabled': {\r\n      '@apply disabled:cursor-not-allowed cursor-not-allowed': {},\r\n      '@apply disabled:bg-gray-lighter bg-gray-lighter': {},\r\n    },\r\n\r\n    \"&[data-rounded='true']\": {\r\n      '@apply rounded-[3.2rem]': {},\r\n    },\r\n\r\n    // variants\r\n    ...fieldOutline(colors),\r\n    ...fieldSolid(colors),\r\n  },\r\n\r\n  '.form-button': {\r\n    '@apply text-[1.1433em] border-0 ml-auto text-primary hover:text-white': {},\r\n\r\n    '&[data-icon=true]': {\r\n      '@apply p-[0.2em]': {},\r\n    },\r\n\r\n    '&-icon': {\r\n      '@apply inline-flex': {},\r\n    },\r\n\r\n    '&-wrapper': {\r\n      '@apply flex items-center absolute inset-y-0 right-sm': {},\r\n    },\r\n  },\r\n\r\n  '.form-textarea': {\r\n    maxHeight: 'none',\r\n    '&.form-field': {\r\n      '&-sm': {\r\n        '@apply py-[0.85rem] min-h-[4rem]': {},\r\n      },\r\n\r\n      '&-md': {\r\n        '@apply py-[0.9rem] min-h-[4.4rem]': {},\r\n      },\r\n\r\n      '&-lg': {\r\n        '@apply py-[1.1rem] min-h-[4.8rem]': {},\r\n      },\r\n    },\r\n    '&-counter': {\r\n      '@apply mt-xs text-right': {},\r\n    },\r\n  },\r\n  '.dropdown-search': {\r\n    '@apply block w-full relative': {},\r\n    '&-results': {\r\n      '@apply w-full flex justify-between items-center': {},\r\n      '&-text': {\r\n        '@apply truncate text-left grow': {},\r\n      },\r\n      '&-counter': {\r\n        '@apply grow-0': {},\r\n      },\r\n    },\r\n\r\n    '&[data-expanded=true]': {\r\n      '.form-input-group[data-rounded=true]': {\r\n        '@apply rounded-t-[2rem] rounded-bl-none rounded-br-none': {},\r\n\r\n        '> *:first-child': {\r\n          '@apply rounded-t-[2rem] rounded-bl-none rounded-br-none': {},\r\n        },\r\n\r\n        '> *:last-child': {\r\n          '@apply rounded-t-[2rem] rounded-bl-none rounded-br-none': {},\r\n        },\r\n\r\n        '& ~ #dropdown-search-results': {\r\n          '@apply rounded-b-[1.6rem]': {},\r\n        },\r\n      },\r\n    },\r\n  },\r\n\r\n  '.form-select-list-transition': {\r\n    '@apply absolute z-50 w-full bg-white shadow-lg max-h-60 rounded-md py-1 text-base ring-1 ring-black ring-opacity-5 overflow-auto focus:outline-none sm:text-sm':\r\n      {},\r\n    '&.showabove': {\r\n      '@apply mb-1 bottom-full': {},\r\n    },\r\n    '&:not(.showabove)': {\r\n      '@apply mt-1 top-full': {},\r\n    },\r\n  },\r\n\r\n  '.form-select': {\r\n    '@apply justify-between items-center grow text-body bg-white caret-transparent select-none cursor-pointer border-gray-stroke':\r\n      {},\r\n    'background-image': 'none',\r\n    '&-wrapper': {\r\n      '@apply block w-full relative': {},\r\n    },\r\n    '&-icon': {\r\n      '@apply grow-0': {},\r\n    },\r\n    '&-list': {\r\n      '@apply z-10 absolute overflow-y-auto w-full bg-white mt-0 border border-gray-stroke border-t-0 border-b': {},\r\n      '&.showabove': {\r\n        '@apply border-t border-b-0': {},\r\n      },\r\n    },\r\n    '&-has-multiple-choices': {\r\n      '@apply flex w-full h-full justify-between items-center pr-md': {},\r\n    },\r\n    '&-multiple-chioces': {\r\n      '@apply truncate pr-md': {},\r\n    },\r\n\r\n    '&-option': {\r\n      '@apply text-body rounded-none cursor-default hover:text-white focus-visible:text-white hover:bg-primary focus-visible:bg-primary flex items-center':\r\n        {},\r\n\r\n      '&.multiple.selected': {\r\n        '@apply bg-background-one': {},\r\n      },\r\n      '&.active': {\r\n        '@apply bg-primary text-white': {},\r\n      },\r\n      '&.active.selected': {\r\n        '@apply bg-gray text-white': {},\r\n      },\r\n      '&.disabled': {\r\n        '@apply opacity-75 cursor-not-allowed hover:bg-white hover:text-black': {},\r\n      },\r\n      '&-remove-button': {\r\n        '@apply w-full flex justify-between items-center': {},\r\n        '&-text': {\r\n          '@apply truncate grow text-left': {},\r\n        },\r\n      },\r\n    },\r\n  },\r\n\r\n  ...formInputGroup(),\r\n  ...formControl(),\r\n});\r\n"],"mappings":"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"}
+{"version":3,"file":"forms.js","names":["module","exports","Forms","display"],"sources":["../../../src/components/forms.js"],"sourcesContent":["module.exports = Forms = () => ({\r\n  '.sk-form-control': {\r\n    '@apply flex flex-col gap-8 w-fit': {},\r\n  },\r\n\r\n  '.sk-form-label': {\r\n    '@apply font-bold': {},\r\n    '&-sm': {\r\n      '@apply text-label-small': {},\r\n    },\r\n    '&-md': {\r\n      '@apply text-label-medium': {},\r\n    },\r\n    '&-lg': {\r\n      '@apply text-label-large': {},\r\n    },\r\n  },\r\n\r\n  'legend.sk-form-label': {\r\n    display: 'contents',\r\n  },\r\n\r\n  '.sk-form-helper-text, .sk-form-error-message': {\r\n    '@apply font-normal': {},\r\n    '@apply text-small': {},\r\n  },\r\n});\r\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,KAAK,GAAG,SAAAA,MAAA;EAAA,OAAO;IAC9B,kBAAkB,EAAE;MAClB,kCAAkC,EAAE,CAAC;IACvC,CAAC;IAED,gBAAgB,EAAE;MAChB,kBAAkB,EAAE,CAAC,CAAC;MACtB,MAAM,EAAE;QACN,yBAAyB,EAAE,CAAC;MAC9B,CAAC;MACD,MAAM,EAAE;QACN,0BAA0B,EAAE,CAAC;MAC/B,CAAC;MACD,MAAM,EAAE;QACN,yBAAyB,EAAE,CAAC;MAC9B;IACF,CAAC;IAED,sBAAsB,EAAE;MACtBC,OAAO,EAAE;IACX,CAAC;IAED,8CAA8C,EAAE;MAC9C,oBAAoB,EAAE,CAAC,CAAC;MACxB,mBAAmB,EAAE,CAAC;IACxB;EACF,CAAC;AAAA,CAAC"}

package/dist/cjs/components/header.js

@@ -1,22 +1,27 @@
-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); }
-module.exports = Header = function Header(colors) {
-  var _dataColorNone, _extends3;
+module.exports = Header = function Header() {
   return {
-    '.header': _extends({
-      '@apply lg:border-t-8 lg:border-primary lg:static lg:w-auto lg:h-auto lg:min-h-0': {}
-    }, colors.reduce(function (styles, color) {
-      var _ref, _extends2;
-      return _extends({}, styles, (_extends2 = {}, _extends2["&[data-color=\"" + color + "\"]"] = (_ref = {}, _ref["@apply border-" + color] = {}, _ref), _extends2));
-    }, {}), (_extends3 = {}, _extends3["&[data-color=\"none\"]"] = (_dataColorNone = {}, _dataColorNone["@apply border-none"] = {}, _dataColorNone), _extends3['&-container'] = {
-      '@apply flex lg:h-[112px] shadow-lg relative mx-auto px-7 pt-[22px] pb-[8px] z-10': {}
-    }, _extends3['&-content'] = {
-      '@apply flex items-center w-full justify-between m-auto flex-shrink-0 text-body max-w-[140rem]': {}
-    }, _extends3['&-usermenu'] = {
-      '@apply lg:-mr-lg block flex-shrink lg:flex lg:items-center lg:w-auto': {},
-      '&-content': {
-        '@apply flex flex-grow lg:flex justify-end items-center lg:w-auto': {}
+    '.sk-header': {
+      '@apply bg-background-content p-12 md:px-32 md:pt-24 md:pb-20 xl:pt-32 xl:pb-20 xl:px-80 xl:h-auto xl:min-h-0': {},
+      '@apply shadow-100': {},
+      '&-container': {
+        '@apply flex flex-col gap-20 xl:gap-24': {}
+      },
+      '&-top-content': {
+        '@apply flex items-center w-full justify-between m-auto flex-shrink-0 py-4 gap-20': {}
+      },
+      '&-bottom-content': {
+        '@apply hidden md:flex items-center w-full justify-start p-8 xl:p-0': {}
+      },
+      '&-usermenu': {
+        '@apply hidden xl:flex-shrink md:flex xl:items-center xl:w-auto': {},
+        '&-content': {
+          '@apply relative flex flex-grow justify-end items-center xl:w-auto': {}
+        }
+      },
+      '&-mobilemenu': {
+        '@apply block md:hidden relative': {}
       }
-    }, _extends3))
+    }
   };
 };
 //# sourceMappingURL=header.js.map

package/dist/cjs/components/header.js.map

@@ -1 +1 @@
-{"version":3,"file":"header.js","names":["module","exports","Header","colors","_dataColorNone","_extends3","_extends","reduce","styles","color","_ref","_extends2"],"sources":["../../../src/components/header.js"],"sourcesContent":["module.exports = Header = (colors) => ({\r\n  '.header': {\r\n    '@apply lg:border-t-8 lg:border-primary lg:static lg:w-auto lg:h-auto lg:min-h-0': {},\r\n\r\n    ...colors.reduce(\r\n      (styles, color) => ({\r\n        ...styles,\r\n        [`&[data-color=\"${color}\"]`]: {\r\n          [`@apply border-${color}`]: {},\r\n        },\r\n      }),\r\n      {}\r\n    ),\r\n\r\n    [`&[data-color=\"none\"]`]: {\r\n      [`@apply border-none`]: {},\r\n    },\r\n\r\n    '&-container': {\r\n      '@apply flex lg:h-[112px] shadow-lg relative mx-auto px-7 pt-[22px] pb-[8px] z-10': {},\r\n    },\r\n\r\n    '&-content': {\r\n      '@apply flex items-center w-full justify-between m-auto flex-shrink-0 text-body max-w-[140rem]': {},\r\n    },\r\n\r\n    '&-usermenu': {\r\n      '@apply lg:-mr-lg block flex-shrink lg:flex lg:items-center lg:w-auto': {},\r\n\r\n      '&-content': {\r\n        '@apply flex flex-grow lg:flex justify-end items-center lg:w-auto': {},\r\n      },\r\n    },\r\n  },\r\n});\r\n"],"mappings":";AAAAA,MAAM,CAACC,OAAO,GAAGC,MAAM,GAAG,SAAAA,OAACC,MAAM;EAAA,IAAAC,cAAA,EAAAC,SAAA;EAAA,OAAM;IACrC,SAAS,EAAAC,QAAA;MACP,iFAAiF,EAAE,CAAC;IAAC,GAElFH,MAAM,CAACI,MAAM,CACd,UAACC,MAAM,EAAEC,KAAK;MAAA,IAAAC,IAAA,EAAAC,SAAA;MAAA,OAAAL,QAAA,KACTE,MAAM,GAAAG,SAAA,OAAAA,SAAA,qBACSF,KAAK,aAAAC,IAAA,OAAAA,IAAA,oBACHD,KAAK,IAAK,CAAC,CAAC,EAAAC,IAAA,GAAAC,SAAA;IAAA,CAEhC,EACF,CAAC,CACH,CAAC,GAAAN,SAAA,OAAAA,SAAA,8BAAAD,cAAA,OAAAA,cAAA,yBAGyB,CAAC,CAAC,EAAAA,cAAA,GAAAC,SAAA,CAG5B,aAAa,IAAE;MACb,kFAAkF,EAAE,CAAC;IACvF,CAAC,EAAAA,SAAA,CAED,WAAW,IAAE;MACX,+FAA+F,EAAE,CAAC;IACpG,CAAC,EAAAA,SAAA,CAED,YAAY,IAAE;MACZ,sEAAsE,EAAE,CAAC,CAAC;MAE1E,WAAW,EAAE;QACX,kEAAkE,EAAE,CAAC;MACvE;IACF,CAAC,EAAAA,SAAA;EAEL,CAAC;AAAA,CAAC"}
+{"version":3,"file":"header.js","names":["module","exports","Header"],"sources":["../../../src/components/header.js"],"sourcesContent":["module.exports = Header = () => ({\r\n  '.sk-header': {\r\n    '@apply bg-background-content p-12 md:px-32 md:pt-24 md:pb-20 xl:pt-32 xl:pb-20 xl:px-80 xl:h-auto xl:min-h-0': {},\r\n    '@apply shadow-100': {},\r\n\r\n    '&-container': {\r\n      '@apply flex flex-col gap-20 xl:gap-24': {},\r\n    },\r\n\r\n    '&-top-content': {\r\n      '@apply flex items-center w-full justify-between m-auto flex-shrink-0 py-4 gap-20': {},\r\n    },\r\n    '&-bottom-content': {\r\n      '@apply hidden md:flex items-center w-full justify-start p-8 xl:p-0': {},\r\n    },\r\n\r\n    '&-usermenu': {\r\n      '@apply hidden xl:flex-shrink md:flex xl:items-center xl:w-auto': {},\r\n\r\n      '&-content': {\r\n        '@apply relative flex flex-grow justify-end items-center xl:w-auto': {},\r\n      },\r\n    },\r\n    '&-mobilemenu': {\r\n      '@apply block md:hidden relative': {},\r\n    },\r\n  },\r\n});\r\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,MAAM,GAAG,SAAAA,OAAA;EAAA,OAAO;IAC/B,YAAY,EAAE;MACZ,8GAA8G,EAAE,CAAC,CAAC;MAClH,mBAAmB,EAAE,CAAC,CAAC;MAEvB,aAAa,EAAE;QACb,uCAAuC,EAAE,CAAC;MAC5C,CAAC;MAED,eAAe,EAAE;QACf,kFAAkF,EAAE,CAAC;MACvF,CAAC;MACD,kBAAkB,EAAE;QAClB,oEAAoE,EAAE,CAAC;MACzE,CAAC;MAED,YAAY,EAAE;QACZ,gEAAgE,EAAE,CAAC,CAAC;QAEpE,WAAW,EAAE;UACX,mEAAmE,EAAE,CAAC;QACxE;MACF,CAAC;MACD,cAAc,EAAE;QACd,iCAAiC,EAAE,CAAC;MACtC;IACF;EACF,CAAC;AAAA,CAAC"}

package/dist/cjs/components/icon.js

@@ -1,11 +1,56 @@
-module.exports = Icon = function Icon() {
+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); }
+module.exports = Icon = function Icon(colors) {
   return {
-    '.icon-inline': {
-      '@apply inline-block align-middle': {}
-    },
-    '.icon-block': {
-      '@apply block': {}
-    }
+    '.sk-icon': _extends({
+      '@apply inline-flex items-center justify-center': {},
+      '@apply w-24 h-24': {},
+      svg: {
+        '@apply w-full h-full': {}
+      },
+      '&.sk-icon-padded': _extends({
+        '@apply rounded-utility': {},
+        '@apply text-light-primary fill-light-primary': {},
+        '@apply p-[0.4rem]': {}
+      }, colors.reduce(function (styles, color) {
+        var _dataInvertedTru, _ref, _extends2;
+        return _extends({}, styles, (_extends2 = {}, _extends2["&[data-color=\"" + color + "\"]"] = (_ref = {}, _ref["@apply bg-" + color + "-surface-primary text-" + color + "-text-secondary fill-" + color + "-text-secondary"] = {}, _ref['&[data-inverted="true"]'] = (_dataInvertedTru = {
+          '@apply text-inverted-light-primary': {}
+        }, _dataInvertedTru["@apply bg-inverted-" + color + "-surface-primary text-inverted-" + color + "-text-secondary fill-inverted-" + color + "-text-secondary"] = {}, _dataInvertedTru), _ref), _extends2));
+      }, {}), {
+        "&[data-color='primary'], &[data-color='tertiary']": {
+          '@apply bg-primary-surface text-light-primary fill-light-primary': {},
+          '&[data-inverted="true"]': {
+            '@apply text-inverted-light-primary fill-inverted-light-primary': {},
+            '@apply bg-tertiary-surface': {}
+          }
+        },
+        "&[data-variant='ghost']": {
+          '@apply bg-transparent text-current fill-current': {},
+          '&[data-inverted="true"]': {
+            '@apply bg-transparent text-current fill-current': {}
+          }
+        }
+      }),
+      '&[data-size="fit"]': {
+        '@apply w-fit h-fit': {}
+      },
+      '&[data-rounded="true"]': {
+        '@apply rounded-circular': {}
+      }
+    }, colors.reduce(function (styles, color) {
+      var _dataInvertedTru2, _ref2, _extends3;
+      return _extends({}, styles, (_extends3 = {}, _extends3["&[data-color=\"" + color + "\"]"] = (_ref2 = {
+        '@apply text-inverted-light-primary': {}
+      }, _ref2["@apply text-inverted-" + color + "-text-secondary fill-inverted-" + color + "-text-secondary"] = {}, _ref2['&[data-inverted="true"]'] = (_dataInvertedTru2 = {
+        '@apply text-inverted-light-primary': {}
+      }, _dataInvertedTru2["@apply bg-inverted-" + color + "-surface-primary text-inverted-" + color + "-text-secondary fill-inverted-" + color + "-text-secondary"] = {}, _dataInvertedTru2), _ref2), _extends3));
+    }, {}), {
+      "&[data-color='primary']": {
+        '&[data-inverted="true"]': {
+          '@apply text-light-primary fill-light-primary': {}
+        }
+      }
+    })
   };
 };
 //# sourceMappingURL=icon.js.map

package/dist/cjs/components/icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon.js","names":["module","exports","Icon"],"sources":["../../../src/components/icon.js"],"sourcesContent":["module.exports = Icon = () => ({\r\n  '.icon-inline': {\r\n    '@apply inline-block align-middle': {},\r\n  },\r\n\r\n  '.icon-block': {\r\n    '@apply block': {},\r\n  },\r\n});\r\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,IAAI,GAAG,SAAAA,KAAA;EAAA,OAAO;IAC7B,cAAc,EAAE;MACd,kCAAkC,EAAE,CAAC;IACvC,CAAC;IAED,aAAa,EAAE;MACb,cAAc,EAAE,CAAC;IACnB;EACF,CAAC;AAAA,CAAC"}
+{"version":3,"file":"icon.js","names":["module","exports","Icon","colors","_extends","svg","reduce","styles","color","_dataInvertedTru","_ref","_extends2","_dataInvertedTru2","_ref2","_extends3"],"sources":["../../../src/components/icon.js"],"sourcesContent":["module.exports = Icon = (colors) => ({\r\n  '.sk-icon': {\r\n    '@apply inline-flex items-center justify-center': {},\r\n    '@apply w-24 h-24': {},\r\n    svg: {\r\n      '@apply w-full h-full': {},\r\n    },\r\n\r\n    '&.sk-icon-padded': {\r\n      '@apply rounded-utility': {},\r\n      '@apply text-light-primary fill-light-primary': {},\r\n      '@apply p-[0.4rem]': {},\r\n\r\n      ...colors.reduce(\r\n        (styles, color) => ({\r\n          ...styles,\r\n          [`&[data-color=\"${color}\"]`]: {\r\n            [`@apply bg-${color}-surface-primary text-${color}-text-secondary fill-${color}-text-secondary`]: {},\r\n\r\n            '&[data-inverted=\"true\"]': {\r\n              '@apply text-inverted-light-primary': {},\r\n              [`@apply bg-inverted-${color}-surface-primary text-inverted-${color}-text-secondary fill-inverted-${color}-text-secondary`]:\r\n                {},\r\n            },\r\n          },\r\n        }),\r\n        {}\r\n      ),\r\n\r\n      \"&[data-color='primary'], &[data-color='tertiary']\": {\r\n        '@apply bg-primary-surface text-light-primary fill-light-primary': {},\r\n\r\n        '&[data-inverted=\"true\"]': {\r\n          '@apply text-inverted-light-primary fill-inverted-light-primary': {},\r\n          '@apply bg-tertiary-surface': {},\r\n        },\r\n      },\r\n      \"&[data-variant='ghost']\": {\r\n        '@apply bg-transparent text-current fill-current': {},\r\n\r\n        '&[data-inverted=\"true\"]': {\r\n          '@apply bg-transparent text-current fill-current': {},\r\n        },\r\n      },\r\n    },\r\n\r\n    '&[data-size=\"fit\"]': {\r\n      '@apply w-fit h-fit': {},\r\n    },\r\n\r\n    '&[data-rounded=\"true\"]': {\r\n      '@apply rounded-circular': {},\r\n    },\r\n\r\n    ...colors.reduce(\r\n      (styles, color) => ({\r\n        ...styles,\r\n        [`&[data-color=\"${color}\"]`]: {\r\n          '@apply text-inverted-light-primary': {},\r\n          [`@apply text-inverted-${color}-text-secondary fill-inverted-${color}-text-secondary`]: {},\r\n\r\n          '&[data-inverted=\"true\"]': {\r\n            '@apply text-inverted-light-primary': {},\r\n            [`@apply bg-inverted-${color}-surface-primary text-inverted-${color}-text-secondary fill-inverted-${color}-text-secondary`]:\r\n              {},\r\n          },\r\n        },\r\n      }),\r\n      {}\r\n    ),\r\n\r\n    \"&[data-color='primary']\": {\r\n      '&[data-inverted=\"true\"]': {\r\n        '@apply text-light-primary fill-light-primary': {},\r\n      },\r\n    },\r\n  },\r\n});\r\n"],"mappings":";AAAAA,MAAM,CAACC,OAAO,GAAGC,IAAI,GAAG,SAAAA,KAACC,MAAM;EAAA,OAAM;IACnC,UAAU,EAAAC,QAAA;MACR,gDAAgD,EAAE,CAAC,CAAC;MACpD,kBAAkB,EAAE,CAAC,CAAC;MACtBC,GAAG,EAAE;QACH,sBAAsB,EAAE,CAAC;MAC3B,CAAC;MAED,kBAAkB,EAAAD,QAAA;QAChB,wBAAwB,EAAE,CAAC,CAAC;QAC5B,8CAA8C,EAAE,CAAC,CAAC;QAClD,mBAAmB,EAAE,CAAC;MAAC,GAEpBD,MAAM,CAACG,MAAM,CACd,UAACC,MAAM,EAAEC,KAAK;QAAA,IAAAC,gBAAA,EAAAC,IAAA,EAAAC,SAAA;QAAA,OAAAP,QAAA,KACTG,MAAM,GAAAI,SAAA,OAAAA,SAAA,qBACSH,KAAK,aAAAE,IAAA,OAAAA,IAAA,gBACPF,KAAK,8BAAyBA,KAAK,6BAAwBA,KAAK,wBAAoB,CAAC,CAAC,EAAAE,IAAA,CAEpG,yBAAyB,KAAAD,gBAAA;UACvB,oCAAoC,EAAE,CAAC;QAAC,GAAAA,gBAAA,yBACjBD,KAAK,uCAAkCA,KAAK,sCAAiCA,KAAK,wBACvG,CAAC,CAAC,EAAAC,gBAAA,GAAAC,IAAA,GAAAC,SAAA;MAAA,CAGR,EACF,CAAC,CACH,CAAC;QAED,mDAAmD,EAAE;UACnD,iEAAiE,EAAE,CAAC,CAAC;UAErE,yBAAyB,EAAE;YACzB,gEAAgE,EAAE,CAAC,CAAC;YACpE,4BAA4B,EAAE,CAAC;UACjC;QACF,CAAC;QACD,yBAAyB,EAAE;UACzB,iDAAiD,EAAE,CAAC,CAAC;UAErD,yBAAyB,EAAE;YACzB,iDAAiD,EAAE,CAAC;UACtD;QACF;MAAC,EACF;MAED,oBAAoB,EAAE;QACpB,oBAAoB,EAAE,CAAC;MACzB,CAAC;MAED,wBAAwB,EAAE;QACxB,yBAAyB,EAAE,CAAC;MAC9B;IAAC,GAEER,MAAM,CAACG,MAAM,CACd,UAACC,MAAM,EAAEC,KAAK;MAAA,IAAAI,iBAAA,EAAAC,KAAA,EAAAC,SAAA;MAAA,OAAAV,QAAA,KACTG,MAAM,GAAAO,SAAA,OAAAA,SAAA,qBACSN,KAAK,aAAAK,KAAA;QACrB,oCAAoC,EAAE,CAAC;MAAC,GAAAA,KAAA,2BACfL,KAAK,sCAAiCA,KAAK,wBAAoB,CAAC,CAAC,EAAAK,KAAA,CAE1F,yBAAyB,KAAAD,iBAAA;QACvB,oCAAoC,EAAE,CAAC;MAAC,GAAAA,iBAAA,yBACjBJ,KAAK,uCAAkCA,KAAK,sCAAiCA,KAAK,wBACvG,CAAC,CAAC,EAAAI,iBAAA,GAAAC,KAAA,GAAAC,SAAA;IAAA,CAGR,EACF,CAAC,CACH,CAAC;MAED,yBAAyB,EAAE;QACzB,yBAAyB,EAAE;UACzB,8CAA8C,EAAE,CAAC;QACnD;MACF;IAAC;EAEL,CAAC;AAAA,CAAC"}

package/dist/cjs/components/input.js

@@ -0,0 +1,227 @@
+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); }
+function calendar() {
+  return "<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect width='18' height='18' x='3' y='4' rx='2' ry='2' /><line x1='16' x2='16' y1='2' y2='6' /><line x1='8' x2='8' y1='2' y2='6' /><line x1='3' x2='21' y1='10' y2='10' /></svg>";
+}
+function clock() {
+  return "<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10' /><polyline points='12 6 12 12 16 14' /></svg>";
+}
+function inputStandards() {
+  return {
+    '@apply border-1': {},
+    '@apply border-primitives-overlay-darken-6': {},
+    '@apply dark:border-primitives-overlay-lighten-6': {},
+    '@apply hover:border-primitives-overlay-darken-8': {},
+    '@apply dark:hover:border-primitives-overlay-lighten-4': {},
+    '@apply placeholder:text-dark-placeholder': {},
+    '@apply bg-primitives-overlay-lighten-10': {},
+    '@apply dark:bg-primitives-overlay-darken-6': {},
+    //Invalid
+    '&:invalid, &[aria-invalid="true"]': {
+      '@apply border-2 border-error-surface-primary': {}
+    },
+    //Disabled
+    '&:disabled, &[aria-disabled="true"]': {
+      '@apply bg-primitives-overlay-darken-1': {},
+      '@apply dark:bg-primitives-overlay-lighten-1': {},
+      '@apply border-primitives-overlay-darken-3': {},
+      '@apply dark:border-primitives-overlay-lighten-3': {},
+      '@apply hover:border-primitives-overlay-darken-3': {},
+      '@apply dark:hover:border-primitives-overlay-lighten-3': {},
+      '@apply text-dark-disabled': {}
+    }
+  };
+}
+function addin() {
+  return {
+    '&-addin': {
+      '@apply bg-transparent': {},
+      '@apply flex': {},
+      '@apply justify-start items-center': {},
+      '&-sm': {
+        '@apply px-6 gap-6': {},
+        '&.sk-form-input-addin-left': {
+          '@apply -mr-12': {},
+          '@apply pl-10': {}
+        },
+        '&.sk-form-input-addin-right': {
+          '@apply -ml-12': {},
+          '@apply pr-10': {}
+        },
+        svg: {
+          '@apply w-[1.6rem] h-[1.6rem]': {}
+        }
+      },
+      '&-md': {
+        '@apply md:px-8 md:gap-8': {},
+        '&.sk-form-input-addin-left': {
+          '@apply -mr-16': {},
+          '@apply pl-12': {}
+        },
+        '&.sk-form-input-addin-right': {
+          '@apply -ml-16': {},
+          '@apply pr-12': {}
+        },
+        svg: {
+          '@apply w-[2rem] h-[2rem]': {}
+        }
+      },
+      '&-lg': {
+        '@apply md:px-8 md:gap-8': {},
+        '&.sk-form-input-addin-left': {
+          '@apply -mr-20': {},
+          '@apply pl-16': {}
+        },
+        '&.sk-form-input-addin-right': {
+          '@apply -ml-20': {},
+          '@apply pr-16': {}
+        },
+        svg: {
+          '@apply w-[2.2rem] h-[2.2rem]': {}
+        }
+      }
+    }
+  };
+}
+function inputGroup() {
+  return {
+    '&-group': _extends({
+      '@apply flex relative': {},
+      '@apply items-center': {},
+      '@apply focus-within:ring': {},
+      '@apply focus-within:ring-ring': {},
+      '@apply text-dark-secondary': {},
+      //Focus
+      '@apply focus-within:border-primitives-overlay-lighten-10': {},
+      '@apply dark:focus-within:border-primitives-overlay-darken-6': {},
+      '&:not(:invalid):not([aria-invalid="true"])': {
+        '@apply focus-within:hover:border-primitives-overlay-lighten-10': {},
+        '@apply dark:focus-within:hover:border-primitives-overlay-darken-6': {}
+      },
+      '&:disabled, &[aria-disabled="true"]': {
+        '&::-webkit-inner-spin-button, &::-webkit-calendar-picker-indicator': {
+          '@apply color-black-disabled': {}
+        }
+      },
+      '&&-lg': {
+        '@apply text-input-large': {},
+        '@apply rounded-button-lg': {}
+      },
+      '&&-md': {
+        '@apply text-input-medium': {},
+        '@apply rounded-button-md': {}
+      },
+      '&&-sm': {
+        '@apply text-input-small': {},
+        '@apply rounded-button-sm': {}
+      }
+    }, inputStandards(), {
+      '.sk-form-input': {
+        '@apply rounded-0': {},
+        '@apply border-0': {},
+        '@apply focus:ring-0': {},
+        '@apply focus:ring-offset-0': {},
+        '@apply bg-transparent': {},
+        '@apply dark:bg-transparent': {},
+        '@apply grow': {}
+      }
+    })
+  };
+}
+function timeAndDatePicker() {
+  return {
+    '&::-webkit-inner-spin-button, &::-webkit-calendar-picker-indicator': {
+      '@apply block': {},
+      '@apply p-0': {},
+      '@apply pl-6 md:pl-8': {},
+      '@apply m-0': {},
+      '@apply bg-none': {},
+      '@apply bg-dark-secondary': {},
+      '&.sk-form-input-sm': {
+        '@apply w-[1.6rem] h-[1.6rem]': {},
+        '@apply -mr-2': {}
+      },
+      '&.sk-form-input-md': {
+        '@apply -mr-4': {},
+        '@apply w-[1.8rem] h-[1.8rem]': {}
+      },
+      '&.sk-form-input-lg': {
+        '@apply -mr-6': {},
+        '@apply w-[2rem] h-[2rem]': {}
+      }
+    },
+    '&[type="date"]::-webkit-inner-spin-button, &[type="date"]::-webkit-calendar-picker-indicator': {
+      mask: ["url(\"data:image/svg+xml;utf-8," + calendar() + "\") no-repeat 100% 100%"],
+      '-webkit-mask': ["url(\"data:image/svg+xml;utf-8," + calendar() + "\") no-repeat 100% 100%"],
+      maskSize: 'contain',
+      '-webkit-mask-size': 'contain'
+    },
+    '&[type="datetime-local"]::-webkit-inner-spin-button, &[type="datetime-local"]::-webkit-calendar-picker-indicator': {
+      mask: ["url(\"data:image/svg+xml;utf-8," + calendar() + "\") no-repeat 100% 100%"],
+      '-webkit-mask': ["url(\"data:image/svg+xml;utf-8," + calendar() + "\") no-repeat 100% 100%"],
+      maskSize: 'contain',
+      '-webkit-mask-size': 'contain'
+    },
+    '&[type="time"]::-webkit-inner-spin-button, &[type="time"]::-webkit-calendar-picker-indicator': {
+      mask: ["url(\"data:image/svg+xml;utf-8," + clock() + "\") no-repeat 100% 100%"],
+      '-webkit-mask': ["url(\"data:image/svg+xml;utf-8," + clock() + "\") no-repeat 100% 100%"],
+      maskSize: 'contain',
+      '-webkit-mask-size': 'contain'
+    },
+    '&:disabled, &[aria-disabled="true"]': {
+      '&::-webkit-inner-spin-button, &::-webkit-calendar-picker-indicator': {
+        '@apply color-black-disabled': {}
+      }
+    }
+  };
+}
+module.exports = Input = function Input() {
+  return {
+    '.sk-form-input': _extends({
+      '@apply grow-0': {},
+      '@apply text-dark-primary': {},
+      '&[data-hideextra="true"]': {
+        '&::-webkit-outer-spin-button, &::-webkit-inner-spin-button': {
+          '-webkit-appearance': 'none',
+          display: 'none',
+          margin: 0
+        },
+        '-moz-appearance': 'textfield'
+      },
+      '&&-lg': {
+        '@apply rounded-button-lg': {},
+        '@apply px-20': {},
+        '@apply py-12': {},
+        '@apply gap-8': {},
+        '@apply text-input-large': {},
+        '@apply h-[4.8rem]': {}
+      },
+      '&&-md': {
+        '@apply rounded-button-md': {},
+        '@apply px-16': {},
+        '@apply py-8': {},
+        '@apply gap-8': {},
+        '@apply text-input-medium': {},
+        '@apply h-[4rem]': {}
+      },
+      '&&-sm': {
+        '@apply rounded-button-sm': {},
+        '@apply px-12': {},
+        '@apply py-6': {},
+        '@apply gap-6': {},
+        '@apply text-input-small': {},
+        '@apply h-[3.2rem]': {}
+      },
+      //Focus
+      '@apply focus:ring': {},
+      '@apply focus:ring-ring': {},
+      '@apply focus:ring-offset': {},
+      '@apply focus:border-primitives-overlay-lighten-10': {},
+      '@apply dark:focus:border-primitives-overlay-darken-6': {},
+      '&:not(:invalid):not([aria-invalid="true"])': {
+        '@apply focus:hover:border-primitives-overlay-lighten-10': {},
+        '@apply dark:focus:hover:border-primitives-overlay-darken-6': {}
+      }
+    }, timeAndDatePicker(), inputStandards(), inputGroup(), addin())
+  };
+};
+//# sourceMappingURL=input.js.map

package/dist/cjs/components/input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.js","names":["calendar","clock","inputStandards","addin","svg","inputGroup","_extends","timeAndDatePicker","mask","maskSize","module","exports","Input","display","margin"],"sources":["../../../src/components/input.js"],"sourcesContent":["function calendar() {\r\n  return `<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect width='18' height='18' x='3' y='4' rx='2' ry='2' /><line x1='16' x2='16' y1='2' y2='6' /><line x1='8' x2='8' y1='2' y2='6' /><line x1='3' x2='21' y1='10' y2='10' /></svg>`;\r\n}\r\nfunction clock() {\r\n  return `<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10' /><polyline points='12 6 12 12 16 14' /></svg>`;\r\n}\r\n\r\nfunction inputStandards() {\r\n  return {\r\n    '@apply border-1': {},\r\n    '@apply border-primitives-overlay-darken-6': {},\r\n    '@apply dark:border-primitives-overlay-lighten-6': {},\r\n    '@apply hover:border-primitives-overlay-darken-8': {},\r\n    '@apply dark:hover:border-primitives-overlay-lighten-4': {},\r\n\r\n    '@apply placeholder:text-dark-placeholder': {},\r\n\r\n    '@apply bg-primitives-overlay-lighten-10': {},\r\n    '@apply dark:bg-primitives-overlay-darken-6': {},\r\n\r\n    //Invalid\r\n    '&:invalid, &[aria-invalid=\"true\"]': {\r\n      '@apply border-2 border-error-surface-primary': {},\r\n    },\r\n\r\n    //Disabled\r\n    '&:disabled, &[aria-disabled=\"true\"]': {\r\n      '@apply bg-primitives-overlay-darken-1': {},\r\n      '@apply dark:bg-primitives-overlay-lighten-1': {},\r\n      '@apply border-primitives-overlay-darken-3': {},\r\n      '@apply dark:border-primitives-overlay-lighten-3': {},\r\n      '@apply hover:border-primitives-overlay-darken-3': {},\r\n      '@apply dark:hover:border-primitives-overlay-lighten-3': {},\r\n      '@apply text-dark-disabled': {},\r\n    },\r\n  };\r\n}\r\n\r\nfunction addin() {\r\n  return {\r\n    '&-addin': {\r\n      '@apply bg-transparent': {},\r\n      '@apply flex': {},\r\n      '@apply justify-start items-center': {},\r\n      '&-sm': {\r\n        '@apply px-6 gap-6': {},\r\n        '&.sk-form-input-addin-left': {\r\n          '@apply -mr-12': {},\r\n          '@apply pl-10': {},\r\n        },\r\n        '&.sk-form-input-addin-right': {\r\n          '@apply -ml-12': {},\r\n          '@apply pr-10': {},\r\n        },\r\n        svg: {\r\n          '@apply w-[1.6rem] h-[1.6rem]': {},\r\n        },\r\n      },\r\n      '&-md': {\r\n        '@apply md:px-8 md:gap-8': {},\r\n        '&.sk-form-input-addin-left': {\r\n          '@apply -mr-16': {},\r\n          '@apply pl-12': {},\r\n        },\r\n        '&.sk-form-input-addin-right': {\r\n          '@apply -ml-16': {},\r\n          '@apply pr-12': {},\r\n        },\r\n        svg: {\r\n          '@apply w-[2rem] h-[2rem]': {},\r\n        },\r\n      },\r\n      '&-lg': {\r\n        '@apply md:px-8 md:gap-8': {},\r\n        '&.sk-form-input-addin-left': {\r\n          '@apply -mr-20': {},\r\n          '@apply pl-16': {},\r\n        },\r\n        '&.sk-form-input-addin-right': {\r\n          '@apply -ml-20': {},\r\n          '@apply pr-16': {},\r\n        },\r\n        svg: {\r\n          '@apply w-[2.2rem] h-[2.2rem]': {},\r\n        },\r\n      },\r\n    },\r\n  };\r\n}\r\n\r\nfunction inputGroup() {\r\n  return {\r\n    '&-group': {\r\n      '@apply flex relative': {},\r\n      '@apply items-center': {},\r\n      '@apply focus-within:ring': {},\r\n      '@apply focus-within:ring-ring': {},\r\n      '@apply text-dark-secondary': {},\r\n      //Focus\r\n      '@apply focus-within:border-primitives-overlay-lighten-10': {},\r\n      '@apply dark:focus-within:border-primitives-overlay-darken-6': {},\r\n\r\n      '&:not(:invalid):not([aria-invalid=\"true\"])': {\r\n        '@apply focus-within:hover:border-primitives-overlay-lighten-10': {},\r\n        '@apply dark:focus-within:hover:border-primitives-overlay-darken-6': {},\r\n      },\r\n\r\n      '&:disabled, &[aria-disabled=\"true\"]': {\r\n        '&::-webkit-inner-spin-button, &::-webkit-calendar-picker-indicator': {\r\n          '@apply color-black-disabled': {},\r\n        },\r\n      },\r\n      '&&-lg': {\r\n        '@apply text-input-large': {},\r\n        '@apply rounded-button-lg': {},\r\n      },\r\n      '&&-md': {\r\n        '@apply text-input-medium': {},\r\n        '@apply rounded-button-md': {},\r\n      },\r\n      '&&-sm': {\r\n        '@apply text-input-small': {},\r\n        '@apply rounded-button-sm': {},\r\n      },\r\n      ...inputStandards(),\r\n      '.sk-form-input': {\r\n        '@apply rounded-0': {},\r\n        '@apply border-0': {},\r\n        '@apply focus:ring-0': {},\r\n        '@apply focus:ring-offset-0': {},\r\n        '@apply bg-transparent': {},\r\n        '@apply dark:bg-transparent': {},\r\n        '@apply grow': {},\r\n      },\r\n    },\r\n  };\r\n}\r\n\r\nfunction timeAndDatePicker() {\r\n  return {\r\n    '&::-webkit-inner-spin-button, &::-webkit-calendar-picker-indicator': {\r\n      '@apply block': {},\r\n      '@apply p-0': {},\r\n      '@apply pl-6 md:pl-8': {},\r\n      '@apply m-0': {},\r\n      '@apply bg-none': {},\r\n      '@apply bg-dark-secondary': {},\r\n      '&.sk-form-input-sm': {\r\n        '@apply w-[1.6rem] h-[1.6rem]': {},\r\n        '@apply -mr-2': {},\r\n      },\r\n      '&.sk-form-input-md': {\r\n        '@apply -mr-4': {},\r\n        '@apply w-[1.8rem] h-[1.8rem]': {},\r\n      },\r\n      '&.sk-form-input-lg': {\r\n        '@apply -mr-6': {},\r\n        '@apply w-[2rem] h-[2rem]': {},\r\n      },\r\n    },\r\n\r\n    '&[type=\"date\"]::-webkit-inner-spin-button, &[type=\"date\"]::-webkit-calendar-picker-indicator': {\r\n      mask: [`url(\"data:image/svg+xml;utf-8,${calendar()}\") no-repeat 100% 100%`],\r\n      '-webkit-mask': [`url(\"data:image/svg+xml;utf-8,${calendar()}\") no-repeat 100% 100%`],\r\n      maskSize: 'contain',\r\n      '-webkit-mask-size': 'contain',\r\n    },\r\n    '&[type=\"datetime-local\"]::-webkit-inner-spin-button, &[type=\"datetime-local\"]::-webkit-calendar-picker-indicator':\r\n      {\r\n        mask: [`url(\"data:image/svg+xml;utf-8,${calendar()}\") no-repeat 100% 100%`],\r\n        '-webkit-mask': [`url(\"data:image/svg+xml;utf-8,${calendar()}\") no-repeat 100% 100%`],\r\n        maskSize: 'contain',\r\n        '-webkit-mask-size': 'contain',\r\n      },\r\n    '&[type=\"time\"]::-webkit-inner-spin-button, &[type=\"time\"]::-webkit-calendar-picker-indicator': {\r\n      mask: [`url(\"data:image/svg+xml;utf-8,${clock()}\") no-repeat 100% 100%`],\r\n      '-webkit-mask': [`url(\"data:image/svg+xml;utf-8,${clock()}\") no-repeat 100% 100%`],\r\n      maskSize: 'contain',\r\n      '-webkit-mask-size': 'contain',\r\n    },\r\n\r\n    '&:disabled, &[aria-disabled=\"true\"]': {\r\n      '&::-webkit-inner-spin-button, &::-webkit-calendar-picker-indicator': {\r\n        '@apply color-black-disabled': {},\r\n      },\r\n    },\r\n  };\r\n}\r\n\r\nmodule.exports = Input = () => ({\r\n  '.sk-form-input': {\r\n    '@apply grow-0': {},\r\n    '@apply text-dark-primary': {},\r\n\r\n    '&[data-hideextra=\"true\"]': {\r\n      '&::-webkit-outer-spin-button, &::-webkit-inner-spin-button': {\r\n        '-webkit-appearance': 'none',\r\n        display: 'none',\r\n        margin: 0,\r\n      },\r\n      '-moz-appearance': 'textfield',\r\n    },\r\n\r\n    '&&-lg': {\r\n      '@apply rounded-button-lg': {},\r\n      '@apply px-20': {},\r\n      '@apply py-12': {},\r\n      '@apply gap-8': {},\r\n      '@apply text-input-large': {},\r\n      '@apply h-[4.8rem]': {},\r\n    },\r\n    '&&-md': {\r\n      '@apply rounded-button-md': {},\r\n      '@apply px-16': {},\r\n      '@apply py-8': {},\r\n      '@apply gap-8': {},\r\n      '@apply text-input-medium': {},\r\n      '@apply h-[4rem]': {},\r\n    },\r\n    '&&-sm': {\r\n      '@apply rounded-button-sm': {},\r\n      '@apply px-12': {},\r\n      '@apply py-6': {},\r\n      '@apply gap-6': {},\r\n      '@apply text-input-small': {},\r\n      '@apply h-[3.2rem]': {},\r\n    },\r\n\r\n    //Focus\r\n    '@apply focus:ring': {},\r\n    '@apply focus:ring-ring': {},\r\n    '@apply focus:ring-offset': {},\r\n    '@apply focus:border-primitives-overlay-lighten-10': {},\r\n    '@apply dark:focus:border-primitives-overlay-darken-6': {},\r\n    '&:not(:invalid):not([aria-invalid=\"true\"])': {\r\n      '@apply focus:hover:border-primitives-overlay-lighten-10': {},\r\n      '@apply dark:focus:hover:border-primitives-overlay-darken-6': {},\r\n    },\r\n    ...timeAndDatePicker(),\r\n    ...inputStandards(),\r\n    ...inputGroup(),\r\n    ...addin(),\r\n  },\r\n});\r\n"],"mappings":"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"}

package/dist/cjs/components/kbd.js

@@ -3,9 +3,9 @@ module.exports = Kbd = function Kbd() {
     '.kbd': {
       '@apply inline-flex justify-center items-center capitalize text-xs p-1 rounded h-5 whitespace-nowrap font-sans': {},
       minWidth: '1.25rem',
-      '@apply bg-blackAlpha-100 text-body': {},
+      '@apply bg-blackAlpha-100 text-body': {}
       // dark
-      '@apply dark:bg-white/30 dark:text-neutral-300': {}
+      // '@apply dark:bg-white/30 dark:text-neutral-300': {},
     }
   };
 };

package/dist/cjs/components/kbd.js.map

@@ -1 +1 @@
-{"version":3,"file":"kbd.js","names":["module","exports","Kbd","minWidth"],"sources":["../../../src/components/kbd.js"],"sourcesContent":["module.exports = Kbd = () => ({\r\n  '.kbd': {\r\n    '@apply inline-flex justify-center items-center capitalize text-xs p-1 rounded h-5 whitespace-nowrap font-sans': {},\r\n    minWidth: '1.25rem',\r\n    '@apply bg-blackAlpha-100 text-body': {},\r\n    // dark\r\n    '@apply dark:bg-white/30 dark:text-neutral-300': {},\r\n  },\r\n});\r\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,GAAG,GAAG,SAAAA,IAAA;EAAA,OAAO;IAC5B,MAAM,EAAE;MACN,+GAA+G,EAAE,CAAC,CAAC;MACnHC,QAAQ,EAAE,SAAS;MACnB,oCAAoC,EAAE,CAAC,CAAC;MACxC;MACA,+CAA+C,EAAE,CAAC;IACpD;EACF,CAAC;AAAA,CAAC"}
+{"version":3,"file":"kbd.js","names":["module","exports","Kbd","minWidth"],"sources":["../../../src/components/kbd.js"],"sourcesContent":["module.exports = Kbd = () => ({\r\n  '.kbd': {\r\n    '@apply inline-flex justify-center items-center capitalize text-xs p-1 rounded h-5 whitespace-nowrap font-sans': {},\r\n    minWidth: '1.25rem',\r\n    '@apply bg-blackAlpha-100 text-body': {},\r\n    // dark\r\n    // '@apply dark:bg-white/30 dark:text-neutral-300': {},\r\n  },\r\n});\r\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,GAAG,GAAG,SAAAA,IAAA;EAAA,OAAO;IAC5B,MAAM,EAAE;MACN,+GAA+G,EAAE,CAAC,CAAC;MACnHC,QAAQ,EAAE,SAAS;MACnB,oCAAoC,EAAE,CAAC;MACvC;MACA;IACF;EACF,CAAC;AAAA,CAAC"}

package/dist/cjs/components/label.js

@@ -0,0 +1,26 @@
+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); }
+module.exports = Label = function Label(colors) {
+  return {
+    '.sk-label': _extends({
+      '@apply inline-flex flex-row': {},
+      '@apply justify-center items-center': {},
+      '@apply gap-6 px-10 py-4': {},
+      '@apply h-24 max-h-24': {},
+      '@apply text-label-small': {},
+      '@apply rounded-utility-sm md:rounded-utility-md xl:rounded-utility-lg': {},
+      '@apply bg-primary-surface': {},
+      '@apply text-light-primary': {},
+      '&[data-rounded="true"]': {
+        '@apply rounded-full': {}
+      },
+      '&[data-inverted="true"]': {
+        '@apply bg-inverted-primary-surface': {},
+        '@apply text-inverted-light-primary': {}
+      }
+    }, colors.reduce(function (styles, color) {
+      var _dataInvertedTru, _ref, _extends2;
+      return _extends({}, styles, (_extends2 = {}, _extends2["&[data-color=\"" + color + "\"]"] = (_ref = {}, _ref["@apply bg-" + color + "-surface-primary"] = {}, _ref["@apply text-" + color + "-text-secondary"] = {}, _ref['&[data-inverted="true"]'] = (_dataInvertedTru = {}, _dataInvertedTru["@apply bg-" + color + "-surface-accent"] = {}, _dataInvertedTru["@apply text-" + color + "-text-primary"] = {}, _dataInvertedTru), _ref), _extends2));
+    }, {}))
+  };
+};
+//# sourceMappingURL=label.js.map

package/dist/cjs/components/label.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.js","names":["module","exports","Label","colors","_extends","reduce","styles","color","_dataInvertedTru","_ref","_extends2"],"sources":["../../../src/components/label.js"],"sourcesContent":["module.exports = Label = (colors) => ({\r\n  '.sk-label': {\r\n    '@apply inline-flex flex-row': {},\r\n    '@apply justify-center items-center': {},\r\n    '@apply gap-6 px-10 py-4': {},\r\n    '@apply h-24 max-h-24': {},\r\n    '@apply text-label-small': {},\r\n\r\n    '@apply rounded-utility-sm md:rounded-utility-md xl:rounded-utility-lg': {},\r\n\r\n    '@apply bg-primary-surface': {},\r\n    '@apply text-light-primary': {},\r\n\r\n    '&[data-rounded=\"true\"]': {\r\n      '@apply rounded-full': {},\r\n    },\r\n    '&[data-inverted=\"true\"]': {\r\n      '@apply bg-inverted-primary-surface': {},\r\n      '@apply text-inverted-light-primary': {},\r\n    },\r\n\r\n    ...colors.reduce(\r\n      (styles, color) => ({\r\n        ...styles,\r\n        [`&[data-color=\"${color}\"]`]: {\r\n          [`@apply bg-${color}-surface-primary`]: {},\r\n          [`@apply text-${color}-text-secondary`]: {},\r\n          '&[data-inverted=\"true\"]': {\r\n            [`@apply bg-${color}-surface-accent`]: {},\r\n            [`@apply text-${color}-text-primary`]: {},\r\n          },\r\n        },\r\n      }),\r\n      {}\r\n    ),\r\n  },\r\n});\r\n"],"mappings":";AAAAA,MAAM,CAACC,OAAO,GAAGC,KAAK,GAAG,SAAAA,MAACC,MAAM;EAAA,OAAM;IACpC,WAAW,EAAAC,QAAA;MACT,6BAA6B,EAAE,CAAC,CAAC;MACjC,oCAAoC,EAAE,CAAC,CAAC;MACxC,yBAAyB,EAAE,CAAC,CAAC;MAC7B,sBAAsB,EAAE,CAAC,CAAC;MAC1B,yBAAyB,EAAE,CAAC,CAAC;MAE7B,uEAAuE,EAAE,CAAC,CAAC;MAE3E,2BAA2B,EAAE,CAAC,CAAC;MAC/B,2BAA2B,EAAE,CAAC,CAAC;MAE/B,wBAAwB,EAAE;QACxB,qBAAqB,EAAE,CAAC;MAC1B,CAAC;MACD,yBAAyB,EAAE;QACzB,oCAAoC,EAAE,CAAC,CAAC;QACxC,oCAAoC,EAAE,CAAC;MACzC;IAAC,GAEED,MAAM,CAACE,MAAM,CACd,UAACC,MAAM,EAAEC,KAAK;MAAA,IAAAC,gBAAA,EAAAC,IAAA,EAAAC,SAAA;MAAA,OAAAN,QAAA,KACTE,MAAM,GAAAI,SAAA,OAAAA,SAAA,qBACSH,KAAK,aAAAE,IAAA,OAAAA,IAAA,gBACPF,KAAK,yBAAqB,CAAC,CAAC,EAAAE,IAAA,kBAC1BF,KAAK,wBAAoB,CAAC,CAAC,EAAAE,IAAA,CAC3C,yBAAyB,KAAAD,gBAAA,OAAAA,gBAAA,gBACTD,KAAK,wBAAoB,CAAC,CAAC,EAAAC,gBAAA,kBACzBD,KAAK,sBAAkB,CAAC,CAAC,EAAAC,gBAAA,GAAAC,IAAA,GAAAC,SAAA;IAAA,CAG7C,EACF,CAAC,CACH,CAAC;EAEL,CAAC;AAAA,CAAC"}

package/dist/cjs/components/link.js

@@ -1,24 +1,47 @@
 module.exports = Link = function Link() {
   return {
-    '.link': {
-      '@apply cursor-base underline outline-none hover:underline': {},
-      '@apply text-primary dark:text-primary': {},
-      '@apply focus-visible:ring-4 focus-visible:ring-primary': {},
-      '@apply hover:text-primary-active': {},
+    '.sk-link': {
+      '@apply underline outline-none hover:underline': {},
+      '@apply rounded-utility': {},
+      // focus
+      '@apply focus-visible:ring ring-offset-[.6rem]': {},
+      // sizes
+      '&-sm': {
+        '@apply text-small leading-[2rem]': {}
+      },
+      '&-md': {
+        '@apply text-base': {}
+      },
+      '&-lg': {
+        '@apply text-large': {}
+      },
+      '&-xl': {
+        '@apply text-lead leading-[3.2rem]': {}
+      },
+      // variants
+      '&-primary': {
+        '@apply text-vattjom-surface-primary': {},
+        '&:hover': {
+          '@apply text-vattjom-surface-primary-hover': {}
+        }
+      },
+      '&-tertiary': {
+        '@apply text-dark-secondary': {},
+        '&:hover': {
+          '@apply text-dark-primary': {}
+        }
+      },
       '&.active': {
-        '@apply underline text-primary-active': {}
+        '@apply underline': {}
       },
-      '&-external-icon': {
-        fontSize: '0.875em !important',
-        lineHeight: '1',
-        marginLeft: '.25em',
-        verticalAlign: 'text-top'
+      '& &-external-icon': {
+        '@apply w-[1em] h-[1em] leading-none ml-[.25em] align-text-top': {}
       },
       '&[type="button"]': {
         '@apply inline-flex items-center align-bottom': {}
       },
       '&-disabled': {
-        '@apply disabled:opacity-60 disabled:cursor-not-allowed disabled:no-underline': {}
+        '@apply text-dark-disabled cursor-default': {}
       }
     }
   };

package/dist/cjs/components/link.js.map

@@ -1 +1 @@
-{"version":3,"file":"link.js","names":["module","exports","Link","fontSize","lineHeight","marginLeft","verticalAlign"],"sources":["../../../src/components/link.js"],"sourcesContent":["module.exports = Link = () => ({\r\n  '.link': {\r\n    '@apply cursor-base underline outline-none hover:underline': {},\r\n    '@apply text-primary dark:text-primary': {},\r\n    '@apply focus-visible:ring-4 focus-visible:ring-primary': {},\r\n\r\n    '@apply hover:text-primary-active': {},\r\n\r\n    '&.active': {\r\n      '@apply underline text-primary-active': {},\r\n    },\r\n    '&-external-icon': {\r\n      fontSize: '0.875em !important',\r\n      lineHeight: '1',\r\n      marginLeft: '.25em',\r\n      verticalAlign: 'text-top',\r\n    },\r\n\r\n    '&[type=\"button\"]': {\r\n      '@apply inline-flex items-center align-bottom': {},\r\n    },\r\n\r\n    '&-disabled': {\r\n      '@apply disabled:opacity-60 disabled:cursor-not-allowed disabled:no-underline': {},\r\n    },\r\n  },\r\n});\r\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,IAAI,GAAG,SAAAA,KAAA;EAAA,OAAO;IAC7B,OAAO,EAAE;MACP,2DAA2D,EAAE,CAAC,CAAC;MAC/D,uCAAuC,EAAE,CAAC,CAAC;MAC3C,wDAAwD,EAAE,CAAC,CAAC;MAE5D,kCAAkC,EAAE,CAAC,CAAC;MAEtC,UAAU,EAAE;QACV,sCAAsC,EAAE,CAAC;MAC3C,CAAC;MACD,iBAAiB,EAAE;QACjBC,QAAQ,EAAE,oBAAoB;QAC9BC,UAAU,EAAE,GAAG;QACfC,UAAU,EAAE,OAAO;QACnBC,aAAa,EAAE;MACjB,CAAC;MAED,kBAAkB,EAAE;QAClB,8CAA8C,EAAE,CAAC;MACnD,CAAC;MAED,YAAY,EAAE;QACZ,8EAA8E,EAAE,CAAC;MACnF;IACF;EACF,CAAC;AAAA,CAAC"}
+{"version":3,"file":"link.js","names":["module","exports","Link"],"sources":["../../../src/components/link.js"],"sourcesContent":["module.exports = Link = () => ({\r\n  '.sk-link': {\r\n    '@apply underline outline-none hover:underline': {},\r\n    '@apply rounded-utility': {},\r\n\r\n    // focus\r\n    '@apply focus-visible:ring ring-offset-[.6rem]': {},\r\n\r\n    // sizes\r\n    '&-sm': {\r\n      '@apply text-small leading-[2rem]': {},\r\n    },\r\n    '&-md': {\r\n      '@apply text-base': {},\r\n    },\r\n    '&-lg': {\r\n      '@apply text-large': {},\r\n    },\r\n    '&-xl': {\r\n      '@apply text-lead leading-[3.2rem]': {},\r\n    },\r\n\r\n    // variants\r\n    '&-primary': {\r\n      '@apply text-vattjom-surface-primary': {},\r\n      '&:hover': {\r\n        '@apply text-vattjom-surface-primary-hover': {},\r\n      },\r\n    },\r\n    '&-tertiary': {\r\n      '@apply text-dark-secondary': {},\r\n      '&:hover': {\r\n        '@apply text-dark-primary': {},\r\n      },\r\n    },\r\n\r\n    '&.active': {\r\n      '@apply underline': {},\r\n    },\r\n\r\n    '& &-external-icon': {\r\n      '@apply w-[1em] h-[1em] leading-none ml-[.25em] align-text-top': {},\r\n    },\r\n\r\n    '&[type=\"button\"]': {\r\n      '@apply inline-flex items-center align-bottom': {},\r\n    },\r\n\r\n    '&-disabled': {\r\n      '@apply text-dark-disabled cursor-default': {},\r\n    },\r\n  },\r\n});\r\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,IAAI,GAAG,SAAAA,KAAA;EAAA,OAAO;IAC7B,UAAU,EAAE;MACV,+CAA+C,EAAE,CAAC,CAAC;MACnD,wBAAwB,EAAE,CAAC,CAAC;MAE5B;MACA,+CAA+C,EAAE,CAAC,CAAC;MAEnD;MACA,MAAM,EAAE;QACN,kCAAkC,EAAE,CAAC;MACvC,CAAC;MACD,MAAM,EAAE;QACN,kBAAkB,EAAE,CAAC;MACvB,CAAC;MACD,MAAM,EAAE;QACN,mBAAmB,EAAE,CAAC;MACxB,CAAC;MACD,MAAM,EAAE;QACN,mCAAmC,EAAE,CAAC;MACxC,CAAC;MAED;MACA,WAAW,EAAE;QACX,qCAAqC,EAAE,CAAC,CAAC;QACzC,SAAS,EAAE;UACT,2CAA2C,EAAE,CAAC;QAChD;MACF,CAAC;MACD,YAAY,EAAE;QACZ,4BAA4B,EAAE,CAAC,CAAC;QAChC,SAAS,EAAE;UACT,0BAA0B,EAAE,CAAC;QAC/B;MACF,CAAC;MAED,UAAU,EAAE;QACV,kBAAkB,EAAE,CAAC;MACvB,CAAC;MAED,mBAAmB,EAAE;QACnB,+DAA+D,EAAE,CAAC;MACpE,CAAC;MAED,kBAAkB,EAAE;QAClB,8CAA8C,EAAE,CAAC;MACnD,CAAC;MAED,YAAY,EAAE;QACZ,0CAA0C,EAAE,CAAC;MAC/C;IACF;EACF,CAAC;AAAA,CAAC"}