@sk-web-gui/core 3.9.1 → 3.11.0

package/dist/cjs/components/callout.js

@@ -1,40 +1,97 @@
 "use strict";
-
-exports.__esModule = true;
-exports.Callout = void 0;
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-var Callout = exports.Callout = function Callout(colors) {
-  return {
-    '.sk-callout': _extends({
-      '@apply inline-flex': {},
-      '@apply p-4': {}
-    }, colors.reduce(function (styles, color) {
-      var _skCalloutContent, _skCalloutContent2, _extends2;
-      return _extends({}, styles, (_extends2 = {}, _extends2["&[data-color=\"" + color + "\"]"] = {
-        '.sk-callout-content': (_skCalloutContent = {}, _skCalloutContent["@apply bg-" + color + "-surface-primary  text-" + color + "-text-secondary"] = {}, _skCalloutContent),
-        '&[data-inverted="true"]': {
-          '.sk-callout-content': (_skCalloutContent2 = {
-            '@apply text-inverted-light-primary': {}
-          }, _skCalloutContent2["@apply bg-inverted-" + color + "-surface-primary text-inverted-" + color + "-text-secondary"] = {}, _skCalloutContent2)
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Callout", {
+    enumerable: true,
+    get: function() {
+        return Callout;
+    }
+});
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
         }
-      }, _extends2));
-    }, {}), {
-      "&[data-color='tertiary']": {
-        '.sk-callout-content': {
-          '@apply bg-primary-surface': {}
-        },
-        '&[data-inverted="true"]': {
-          '.sk-callout-content': {
-            '@apply text-inverted-light-primary': {},
-            '@apply bg-tertiary-surface dark:bg-inverted-primary-surface': {}
-          }
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
         }
-      },
-      '&-content': {
-        '@apply rounded-full': {},
-        '@apply h-8 w-8': {}
-      }
-    })
-  };
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+var Callout = function(colors) {
+    return {
+        '.sk-callout': _object_spread_props(_object_spread({
+            '@apply inline-flex': {},
+            '@apply p-4': {}
+        }, colors.reduce(function(styles, color) {
+            return _object_spread_props(_object_spread({}, styles), _define_property({}, '&[data-color="'.concat(color, '"]'), {
+                '.sk-callout-content': _define_property({}, "@apply bg-".concat(color, "-surface-primary  text-").concat(color, "-text-secondary"), {}),
+                '&[data-inverted="true"]': {
+                    '.sk-callout-content': _define_property({
+                        '@apply text-inverted-light-primary': {}
+                    }, "@apply bg-inverted-".concat(color, "-surface-primary text-inverted-").concat(color, "-text-secondary"), {})
+                }
+            }));
+        }, {})), {
+            "&[data-color='tertiary']": {
+                '.sk-callout-content': {
+                    '@apply bg-primary-surface': {}
+                },
+                '&[data-inverted="true"]': {
+                    '.sk-callout-content': {
+                        '@apply text-inverted-light-primary': {},
+                        '@apply bg-tertiary-surface dark:bg-inverted-primary-surface': {}
+                    }
+                }
+            },
+            '&-content': {
+                '@apply rounded-full': {},
+                '@apply h-8 w-8': {}
+            }
+        })
+    };
 };
+
 //# sourceMappingURL=callout.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"callout.js","names":["Callout","exports","colors","_extends","reduce","styles","color","_skCalloutContent","_skCalloutContent2","_extends2"],"sources":["../../../src/components/callout.ts"],"sourcesContent":["export const Callout = (colors: string[]) => ({\r\n  '.sk-callout': {\r\n    '@apply inline-flex': {},\r\n    '@apply p-4': {},\r\n\r\n    ...colors.reduce(\r\n      (styles, color) => ({\r\n        ...styles,\r\n        [`&[data-color=\"${color}\"]`]: {\r\n          '.sk-callout-content': {\r\n            [`@apply bg-${color}-surface-primary  text-${color}-text-secondary`]: {},\r\n          },\r\n\r\n          '&[data-inverted=\"true\"]': {\r\n            '.sk-callout-content': {\r\n              '@apply text-inverted-light-primary': {},\r\n              [`@apply bg-inverted-${color}-surface-primary text-inverted-${color}-text-secondary`]: {},\r\n            },\r\n          },\r\n        },\r\n      }),\r\n      {}\r\n    ),\r\n\r\n    \"&[data-color='tertiary']\": {\r\n      '.sk-callout-content': {\r\n        '@apply bg-primary-surface': {},\r\n      },\r\n      '&[data-inverted=\"true\"]': {\r\n        '.sk-callout-content': {\r\n          '@apply text-inverted-light-primary': {},\r\n          '@apply bg-tertiary-surface dark:bg-inverted-primary-surface': {},\r\n        },\r\n      },\r\n    },\r\n\r\n    '&-content': {\r\n      '@apply rounded-full': {},\r\n      '@apply h-8 w-8': {},\r\n    },\r\n  },\r\n});\r\n"],"mappings":";;;;;AAAO,IAAMA,OAAO,GAAAC,OAAA,CAAAD,OAAA,GAAG,SAAVA,OAAOA,CAAIE,MAAgB;EAAA,OAAM;IAC5C,aAAa,EAAAC,QAAA;MACX,oBAAoB,EAAE,CAAC,CAAC;MACxB,YAAY,EAAE,CAAC;IAAC,GAEbD,MAAM,CAACE,MAAM,CACd,UAACC,MAAM,EAAEC,KAAK;MAAA,IAAAC,iBAAA,EAAAC,kBAAA,EAAAC,SAAA;MAAA,OAAAN,QAAA,KACTE,MAAM,GAAAI,SAAA,OAAAA,SAAA,qBACSH,KAAK,YAAO;QAC5B,qBAAqB,GAAAC,iBAAA,OAAAA,iBAAA,gBACLD,KAAK,+BAA0BA,KAAK,wBAAoB,CAAC,CAAC,EAAAC,iBAAA,CACzE;QAED,yBAAyB,EAAE;UACzB,qBAAqB,GAAAC,kBAAA;YACnB,oCAAoC,EAAE,CAAC;UAAC,GAAAA,kBAAA,yBACjBF,KAAK,uCAAkCA,KAAK,wBAAoB,CAAC,CAAC,EAAAE,kBAAA;QAE7F;MACF,CAAC,EAAAC,SAAA;IAAA,CACD,EACF,CAAC,CACH,CAAC;MAED,0BAA0B,EAAE;QAC1B,qBAAqB,EAAE;UACrB,2BAA2B,EAAE,CAAC;QAChC,CAAC;QACD,yBAAyB,EAAE;UACzB,qBAAqB,EAAE;YACrB,oCAAoC,EAAE,CAAC,CAAC;YACxC,6DAA6D,EAAE,CAAC;UAClE;QACF;MACF,CAAC;MAED,WAAW,EAAE;QACX,qBAAqB,EAAE,CAAC,CAAC;QACzB,gBAAgB,EAAE,CAAC;MACrB;IAAC;EAEL,CAAC;AAAA,CAAC","ignoreList":[]}
+{"version":3,"sources":["../../../src/components/callout.ts"],"sourcesContent":["export const Callout = (colors: string[]) => ({\r\n  '.sk-callout': {\r\n    '@apply inline-flex': {},\r\n    '@apply p-4': {},\r\n\r\n    ...colors.reduce(\r\n      (styles, color) => ({\r\n        ...styles,\r\n        [`&[data-color=\"${color}\"]`]: {\r\n          '.sk-callout-content': {\r\n            [`@apply bg-${color}-surface-primary  text-${color}-text-secondary`]: {},\r\n          },\r\n\r\n          '&[data-inverted=\"true\"]': {\r\n            '.sk-callout-content': {\r\n              '@apply text-inverted-light-primary': {},\r\n              [`@apply bg-inverted-${color}-surface-primary text-inverted-${color}-text-secondary`]: {},\r\n            },\r\n          },\r\n        },\r\n      }),\r\n      {}\r\n    ),\r\n\r\n    \"&[data-color='tertiary']\": {\r\n      '.sk-callout-content': {\r\n        '@apply bg-primary-surface': {},\r\n      },\r\n      '&[data-inverted=\"true\"]': {\r\n        '.sk-callout-content': {\r\n          '@apply text-inverted-light-primary': {},\r\n          '@apply bg-tertiary-surface dark:bg-inverted-primary-surface': {},\r\n        },\r\n      },\r\n    },\r\n\r\n    '&-content': {\r\n      '@apply rounded-full': {},\r\n      '@apply h-8 w-8': {},\r\n    },\r\n  },\r\n});\r\n"],"names":["Callout","colors","reduce","styles","color"],"mappings":";;;;+BAAaA;;;eAAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAN,IAAMA,UAAU,SAACC;WAAsB;QAC5C,eAAe;YACb,sBAAsB,CAAC;YACvB,cAAc,CAAC;WAEZA,OAAOC,MAAM,CACd,SAACC,QAAQC;mBAAW,wCACfD,SACH,qBAAC,AAAC,iBAAsB,OAANC,OAAM,OAAM;gBAC5B,uBACE,qBAAC,AAAC,aAA2CA,OAA/BA,OAAM,2BAA+B,OAANA,OAAM,oBAAmB,CAAC;gBAGzE,2BAA2B;oBACzB,uBAEE;wBADA,sCAAsC,CAAC;uBACtC,AAAC,sBAA4DA,OAAvCA,OAAM,mCAAuC,OAANA,OAAM,oBAAmB,CAAC;gBAE5F;YACF;WAEF,CAAC;YAGH,4BAA4B;gBAC1B,uBAAuB;oBACrB,6BAA6B,CAAC;gBAChC;gBACA,2BAA2B;oBACzB,uBAAuB;wBACrB,sCAAsC,CAAC;wBACvC,+DAA+D,CAAC;oBAClE;gBACF;YACF;YAEA,aAAa;gBACX,uBAAuB,CAAC;gBACxB,kBAAkB,CAAC;YACrB;;IAEJ"}

package/dist/cjs/components/card.js

@@ -1,219 +1,283 @@
 "use strict";
-
-exports.__esModule = true;
-exports.Card = void 0;
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-var Card = exports.Card = function Card(colors) {
-  var _extends3;
-  return {
-    '.sk-card': _extends({
-      '@apply text-base': {},
-      '@apply bg-white relative rounded-b-cards rounded-cards': {},
-      '@apply flex flex-col': {},
-      '@apply no-underline hover:no-underline': {},
-      '@apply h-full': {},
-      '&-wrapper': {
-        '@apply grid': {}
-      },
-      '&-image': {
-        '@apply object-cover grow': {},
-        '@apply rounded-t-cards': {}
-      },
-      '&-body': {
-        '@apply px-24 pb-24 pt-16 rounded-b-cards': {},
-        '@apply shrink': {},
-        '&-wrapper': {
-          '@apply flex': {}
-        },
-        '&-meta': {
-          '@apply flex space-x-12 mt-16 text-base': {},
-          span: {
-            '@apply flex space-x-4 items-center': {},
-            time: {
-              '@apply h-24': {}
-            }
-          },
-          '&.sk-card-image': {
-            '@apply min-h-[12.5em] max-h-[20em]': {}
-          }
-        },
-        '&-header': {
-          'h1, h2, h3, h4, h5, h6, h7, a': {
-            '@apply line-clamp-1 text-h3-md text-dark-primary mt-16': {}
-          },
-          span: {
-            '@apply pl-12': {}
-          }
-        },
-        '&-content': {
-          '@apply w-full': {},
-          'p, a': {
-            '@apply line-clamp-3 m-0 pt-8 text-base text-body': {}
-          }
-        },
-        '&-icon': {
-          '@apply hidden': {}
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Card", {
+    enumerable: true,
+    get: function() {
+        return Card;
+    }
+});
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
         }
-      }
-    }, colors.reduce(function (styles, color) {
-      var _h1H2H3H4H, _pA, _dataColorMono, _skCardUseHover, _h1H2H3H4H2, _pA2, _skCardUseHover2, _h1H2H3H4H3, _pA3, _dataInvertedTru, _ref, _extends2;
-      return _extends({}, styles, (_extends2 = {
-        '&[data-color="mono"], &[data-color="tertiary"]': (_dataColorMono = {
-          '@apply border-solid border-1': {},
-          '@apply border-primitives-overlay-darken-5 dark:border-primitives-overlay-lighten-5': {},
-          '@apply bg-primitives-gray-lightest dark:bg-primitives-gray-800': {},
-          '.sk-card-body-meta': {
-            '@apply text-dark-secondary': {}
-          },
-          '.sk-card-body-icon': {
-            '@apply bg-primitives-overlay-darken-9 dark:bg-primitives-overlay-lighten-10': {},
-            '@apply text-primitives-gray-lightest dark:text-primitives-overlay-darken-9': {},
-            '@apply hover:bg-primitives-overlay-darken-10 dark:hover:bg-primitives-gray-lightest': {}
-          }
-        }, _dataColorMono["&[data-inverted=\"true\"]"] = {
-          '@apply bg-primitives-gray-800': {},
-          '.sk-card-body': {
-            // Meta
-            '&-meta': {
-              span: {
-                '@apply text-light-secondary': {}
-              }
-            },
-            // header
-            '&-header': {
-              'h1, h2, h3, h4, h5, h6, h7, a': (_h1H2H3H4H = {}, _h1H2H3H4H["@apply text-light-primary"] = {}, _h1H2H3H4H)
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+var Card = function(colors) {
+    return {
+        '.sk-card': _object_spread_props(_object_spread({
+            '@apply text-base': {},
+            '@apply bg-white relative rounded-b-cards rounded-cards': {},
+            '@apply flex flex-col': {},
+            '@apply no-underline hover:no-underline': {},
+            '@apply h-full': {},
+            '&-wrapper': {
+                '@apply grid': {}
             },
-            // Content
-            '&-content': {
-              'p, a': (_pA = {}, _pA["@apply text-light-secondary"] = {}, _pA)
+            '&-image': {
+                '@apply object-cover grow': {},
+                '@apply rounded-t-cards': {}
             },
-            '.sk-card-body-icon': {
-              '@apply bg-primitives-overlay-lighten-10 text-primitives-gray-900': {},
-              '@apply hover:bg-primitives-gray-lightest': {}
+            '&-body': {
+                '@apply px-24 pb-24 pt-16 rounded-b-cards': {},
+                '@apply shrink': {},
+                '&-wrapper': {
+                    '@apply flex': {}
+                },
+                '&-meta': {
+                    '@apply flex space-x-12 mt-16 text-base': {},
+                    span: {
+                        '@apply flex space-x-4 items-center': {},
+                        time: {
+                            '@apply h-24': {}
+                        }
+                    },
+                    '&.sk-card-image': {
+                        '@apply min-h-[12.5em] max-h-[20em]': {}
+                    }
+                },
+                '&-header': {
+                    'h1, h2, h3, h4, h5, h6, h7, a': {
+                        '@apply line-clamp-1 text-h3-md text-dark-primary mt-16': {}
+                    },
+                    span: {
+                        '@apply pl-12': {}
+                    }
+                },
+                '&-content': {
+                    '@apply w-full': {},
+                    'p, a': {
+                        '@apply line-clamp-3 m-0 pt-8 text-base text-body': {}
+                    }
+                },
+                '&-icon': {
+                    '@apply hidden': {}
+                }
             }
-          }
-        }, _dataColorMono),
-        '&[data-color="tertiary"]': {
-          '@apply border-solid border-1': {},
-          '@apply border-primitives-overlay-darken-5 dark:border-primitives-overlay-lighten-5': {},
-          '@apply bg-primitives-gray-50 dark:bg-primitives-gray-700': {}
-        }
-      }, _extends2["&[data-color=\"" + color + "\"]"] = (_ref = {}, _ref["@apply bg-" + color + "-surface-primary-hover"] = {}, _ref['&.sk-card-use-hover-effect'] = (_skCardUseHover = {}, _skCardUseHover["@apply hover:cursor-pointer hover:bg-" + color + "-surface-primary"] = {}, _skCardUseHover), _ref['.sk-card-body'] = {
-        '&-meta': {
-          span: {
-            '@apply text-light-secondary': {}
-          }
-        },
-        // header
-        '&-header': {
-          'h1, h2, h3, h4, h5, h6, h7, a': (_h1H2H3H4H2 = {}, _h1H2H3H4H2["@apply text-light-primary"] = {}, _h1H2H3H4H2)
-        },
-        // Content
-        '&-content': {
-          'p, a': (_pA2 = {}, _pA2["@apply text-light-secondary"] = {}, _pA2)
-        }
-      }, _ref["&[data-inverted=\"true\"]"] = (_dataInvertedTru = {}, _dataInvertedTru["@apply bg-" + color + "-surface-accent-hover"] = {}, _dataInvertedTru['&.sk-card-use-hover-effect'] = (_skCardUseHover2 = {}, _skCardUseHover2["@apply hover:cursor-pointer hover:bg-" + color + "-surface-accent"] = {}, _skCardUseHover2), _dataInvertedTru['.sk-card-body'] = {
-        // Meta
-        '&-meta': {
-          span: {
-            '@apply text-dark-secondary': {}
-          }
-        },
-        // header
-        '&-header': {
-          'h1, h2, h3, h4, h5, h6, h7, a': (_h1H2H3H4H3 = {}, _h1H2H3H4H3["@apply text-dark-primary"] = {}, _h1H2H3H4H3)
-        },
-        // Content
-        '&-content': {
-          'p, a': (_pA3 = {}, _pA3["@apply text-dark-secondary"] = {}, _pA3)
-        }
-      }, _dataInvertedTru), _ref), _extends2));
-    }, {}), (_extends3 = {
-      // clickable
-      '&.sk-card-use-hover-effect': {
-        //Hide and show of icon
-        '.sk-card-body-icon': {
-          '@apply inline-flex': {},
-          '@apply mt-auto mb-auto mr-24': {}
-        }
-      }
-    }, _extends3["&[data-layout=\"horizontal\"]"] = {
-      '@apply flex-row h-full': {},
-      '.sk-card': {
-        '&-image': {
-          '@apply h-full w-[8em]': {},
-          '@apply float-left': {},
-          '@apply rounded-none rounded-l-cards grow-0': {}
-        },
-        '&-body': {
-          '@apply w-full': {},
-          '@apply border-none': {},
-          '&-wrapper': {
-            '@apply w-full': {}
-          },
-          '&-content': {
-            'p, a': {
-              '@apply text-small': {}
+        }, colors.reduce(function(styles, color) {
+            var _obj, _obj1;
+            return _object_spread_props(_object_spread({}, styles), _define_property({
+                '&[data-color="mono"], &[data-color="tertiary"]': // inverted.
+                _define_property({
+                    '@apply border-solid border-1': {},
+                    '@apply border-primitives-overlay-darken-5 dark:border-primitives-overlay-lighten-5': {},
+                    '@apply bg-primitives-gray-lightest dark:bg-primitives-gray-800': {},
+                    '.sk-card-body-meta': {
+                        '@apply text-dark-secondary': {}
+                    },
+                    '.sk-card-body-icon': {
+                        '@apply bg-primitives-overlay-darken-9 dark:bg-primitives-overlay-lighten-10': {},
+                        '@apply text-primitives-gray-lightest dark:text-primitives-overlay-darken-9': {},
+                        '@apply hover:bg-primitives-overlay-darken-10 dark:hover:bg-primitives-gray-lightest': {}
+                    }
+                }, '&[data-inverted="true"]', {
+                    '@apply bg-primitives-gray-800': {},
+                    '.sk-card-body': {
+                        // Meta
+                        '&-meta': {
+                            span: {
+                                '@apply text-light-secondary': {}
+                            }
+                        },
+                        // header
+                        '&-header': {
+                            'h1, h2, h3, h4, h5, h6, h7, a': _define_property({}, "@apply text-light-primary", {})
+                        },
+                        // Content
+                        '&-content': {
+                            'p, a': _define_property({}, "@apply text-light-secondary", {})
+                        },
+                        '.sk-card-body-icon': {
+                            '@apply bg-primitives-overlay-lighten-10 text-primitives-gray-900': {},
+                            '@apply hover:bg-primitives-gray-lightest': {}
+                        }
+                    }
+                }),
+                '&[data-color="tertiary"]': {
+                    '@apply border-solid border-1': {},
+                    '@apply border-primitives-overlay-darken-5 dark:border-primitives-overlay-lighten-5': {},
+                    '@apply bg-primitives-gray-50 dark:bg-primitives-gray-700': {}
+                }
+            }, '&[data-color="'.concat(color, '"]'), (_obj1 = {}, // card
+            _define_property(_obj1, "@apply bg-".concat(color, "-surface-primary-hover"), {}), // clickable
+            _define_property(_obj1, '&.sk-card-use-hover-effect', // hover
+            _define_property({}, "@apply hover:cursor-pointer hover:bg-".concat(color, "-surface-primary"), {})), // Meta
+            _define_property(_obj1, '.sk-card-body', {
+                '&-meta': {
+                    span: {
+                        '@apply text-light-secondary': {}
+                    }
+                },
+                // header
+                '&-header': {
+                    'h1, h2, h3, h4, h5, h6, h7, a': _define_property({}, "@apply text-light-primary", {})
+                },
+                // Content
+                '&-content': {
+                    'p, a': _define_property({}, "@apply text-light-secondary", {})
+                }
+            }), _define_property(_obj1, '&[data-inverted="true"]', (_obj = {}, // card
+            _define_property(_obj, "@apply bg-".concat(color, "-surface-accent-hover"), {}), // clickable
+            _define_property(_obj, '&.sk-card-use-hover-effect', // hover
+            _define_property({}, "@apply hover:cursor-pointer hover:bg-".concat(color, "-surface-accent"), {})), _define_property(_obj, '.sk-card-body', {
+                // Meta
+                '&-meta': {
+                    span: {
+                        '@apply text-dark-secondary': {}
+                    }
+                },
+                // header
+                '&-header': {
+                    'h1, h2, h3, h4, h5, h6, h7, a': _define_property({}, "@apply text-dark-primary", {})
+                },
+                // Content
+                '&-content': {
+                    'p, a': _define_property({}, "@apply text-dark-secondary", {})
+                }
+            }), _obj)), _obj1)));
+        }, {})), _define_property({
+            // clickable
+            '&.sk-card-use-hover-effect': {
+                //Hide and show of icon
+                '.sk-card-body-icon': {
+                    '@apply inline-flex': {},
+                    '@apply mt-auto mb-auto mr-24': {}
+                }
+            }
+        }, '&[data-layout="horizontal"]', {
+            '@apply flex-row h-full': {},
+            '.sk-card': {
+                '&-image': {
+                    '@apply h-full w-[8em]': {},
+                    '@apply float-left': {},
+                    '@apply rounded-none rounded-l-cards grow-0': {}
+                },
+                '&-body': {
+                    '@apply w-full': {},
+                    '@apply border-none': {},
+                    '&-wrapper': {
+                        '@apply w-full': {}
+                    },
+                    '&-content': {
+                        'p, a': {
+                            '@apply text-small': {}
+                        }
+                    },
+                    '&-meta': {
+                        '@apply hidden': {}
+                    }
+                }
+            }
+        })),
+        '.sk-card-link': {
+            '@apply hover:cursor-pointer': {},
+            '&::after': {
+                content: "''",
+                position: 'absolute',
+                left: '0',
+                top: '0',
+                right: '0',
+                bottom: '0'
             }
-          },
-          '&-meta': {
-            '@apply hidden': {}
-          }
-        }
-      }
-    }, _extends3)),
-    '.sk-card-link': {
-      '@apply hover:cursor-pointer': {},
-      '&::after': {
-        content: "''",
-        position: 'absolute',
-        left: '0',
-        top: '0',
-        right: '0',
-        bottom: '0'
-      }
-    },
-    /**
-     * Meta card
-     */
-    '.sk-meta-card': {
-      '@apply no-underline hover:no-underline': {},
-      '@apply flex bg-vattjom-surface-accent': {},
-      '@apply p-14 rounded-groups': {},
-      '&[data-color="mono"]': {
-        '@apply bg-primitives-overlay-darken-1 dark:bg-primitives-overlay-lighten-1': {}
-      },
-      '&[data-color="vattjom"]': {
-        '@apply bg-vattjom-background-200': {}
-      },
-      '&-text-icon': {
-        '@apply mr-12 rounded-12 p-8': {},
-        '@apply bg-primitives-gray-lightest dark:bg-primitives-gray-800': {},
-        '@apply text-dark': {},
-        svg: {
-          height: 'unset',
-          width: 'unset'
-        }
-      },
-      '&-body': {
-        '&-header': {
-          'h1, h2, h3, h4, h5, h6, h7, a, p': {
-            '@apply mt-6 text-base line-clamp-1': {},
-            '@apply text-dark-primary': {}
-          }
         },
-        '&-content': {
-          'p, a': {
-            '@apply text-primitives-gray-700 dark:text-primitives-gray-200 text-small': {},
-            '@apply text-dark-secondary line-clamp-1': {}
-          }
+        /**
+   * Meta card
+   */ '.sk-meta-card': {
+            '@apply no-underline hover:no-underline': {},
+            '@apply flex bg-vattjom-surface-accent': {},
+            '@apply p-14 rounded-groups': {},
+            '&[data-color="mono"]': {
+                '@apply bg-primitives-overlay-darken-1 dark:bg-primitives-overlay-lighten-1': {}
+            },
+            '&[data-color="vattjom"]': {
+                '@apply bg-vattjom-background-200': {}
+            },
+            '&-text-icon': {
+                '@apply mr-12 rounded-12 p-8': {},
+                '@apply bg-primitives-gray-lightest dark:bg-primitives-gray-800': {},
+                '@apply text-dark': {},
+                svg: {
+                    height: 'unset',
+                    width: 'unset'
+                }
+            },
+            '&-body': {
+                '&-header': {
+                    'h1, h2, h3, h4, h5, h6, h7, a, p': {
+                        '@apply mt-6 text-base line-clamp-1': {},
+                        '@apply text-dark-primary': {}
+                    }
+                },
+                '&-content': {
+                    'p, a': {
+                        '@apply text-primitives-gray-700 dark:text-primitives-gray-200 text-small': {},
+                        '@apply text-dark-secondary line-clamp-1': {}
+                    }
+                }
+            },
+            '&-external-link-icon': {
+                '@apply ml-auto h-32 w-32': {},
+                '@apply p-6 text-dark': {}
+            }
         }
-      },
-      '&-external-link-icon': {
-        '@apply ml-auto h-32 w-32': {},
-        '@apply p-6 text-dark': {}
-      }
-    }
-  };
+    };
 };
+
 //# sourceMappingURL=card.js.map