@sk-web-gui/core 0.1.83 → 0.1.84

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/dist/cjs/components/accordion.js +16 -1
  2. package/dist/cjs/components/accordion.js.map +1 -1
  3. package/dist/cjs/components/tab-menu.js.map +1 -1
  4. package/dist/cjs/components/tabs.js.map +1 -1
  5. package/dist/esm/components/accordion.js +16 -1
  6. package/dist/esm/components/accordion.js.map +1 -1
  7. package/dist/esm/components/tab-menu.js.map +1 -1
  8. package/dist/esm/components/tabs.js.map +1 -1
  9. package/package.json +2 -2
  10. package/src/components/accordion.js +18 -1
  11. package/src/components/tab-menu.js +58 -58
  12. package/src/components/tabs.js +64 -64
package/dist/cjs/components/accordion.js CHANGED
@@ -62,6 +62,15 @@ module.exports = Accordion = function Accordion(colors) {
62
62
  }
63
63
  }
64
64
  },
65
+ '&-error': {
66
+ '@apply border border-error': {},
67
+ '.accordion-header': {
68
+ '@apply bg-error-light text-error': {},
69
+ '[aria-expanded="true"] &': {
70
+ '@apply bg-error-light': {}
71
+ }
72
+ }
73
+ },
65
74
  '&-is-open': {
66
75
  '@apply border border-gray-stroke': {},
67
76
  '& .accordion-header': {
@@ -74,7 +83,13 @@ module.exports = Accordion = function Accordion(colors) {
74
83
  '@apply border-b border-warning': {}
75
84
  }
76
85
  },
77
- '&-is-open &-body, &-is-open-alert &-body': {
86
+ '&-is-open-error': {
87
+ '@apply border border-error': {},
88
+ '& .accordion-header': {
89
+ '@apply border-b border-error': {}
90
+ }
91
+ },
92
+ '&-is-open &-body, &-is-open-alert &-body, &-is-open-error &-body': {
78
93
  '@apply overflow-visible animate-reset-overflow': {}
79
94
  },
80
95
  '&-outline': {
package/dist/cjs/components/accordion.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"accordion.js","names":["module","exports","Accordion","colors","fontWeight","boxShadow","outline","transitionProperty","transitionTimingFunction","transitionDuration"],"sources":["../../../src/components/accordion.js"],"sourcesContent":["module.exports = Accordion = (colors) => ({\r\n '.accordion': {\r\n '&-header': {\r\n '@apply flex flex-col text-left': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n\r\n '&-icon': {\r\n '@apply ml-auto !text-2xl': {},\r\n },\r\n },\r\n\r\n '&-is-open &-header': {\r\n '@apply bg-hover': {},\r\n },\r\n\r\n '&-toggle': {\r\n '@apply flex items-center inline-block text-lg leading-lg text-left text-lg mx-md sm:mx-lg my-md': {},\r\n fontWeight: 'bold',\r\n //\"@apply focus-visible:shadow shadow-lg\": {},\r\n '&:focus-visible': {\r\n boxShadow: '0 0 0 0.4rem #fff!important',\r\n outline: '0',\r\n //\"@apply border-4\": {},\r\n },\r\n '.accordion-title': {\r\n '@apply mr-md text-base leading-base md:text-lg md:leading-lg': {},\r\n },\r\n '.accordion-subtitle': {\r\n '@apply m-0 mr-md text-sm font-normal': {},\r\n },\r\n },\r\n\r\n '&-body': {\r\n '@apply h-0 overflow-hidden': {},\r\n transitionProperty: 'visibility, height, padding, margin',\r\n transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',\r\n transitionDuration: '180ms',\r\n\r\n '&[aria-hidden=\"true\"], &[data-hidden=\"true\"]': {\r\n '@apply my-0 invisible': {},\r\n },\r\n\r\n '&[aria-hidden=\"false\"], &[data-hidden=\"false\"]': {\r\n '@apply block h-auto visible': {},\r\n },\r\n },\r\n\r\n '&-solid': {\r\n '@apply border border-primary': {},\r\n '.accordion-header': {\r\n '@apply bg-primary text-white': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n },\r\n },\r\n\r\n '&-alert': {\r\n '@apply border border-warning': {},\r\n '.accordion-header': {\r\n '@apply bg-warning-light text-warning': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-warning-light': {},\r\n },\r\n },\r\n },\r\n\r\n '&-is-open': {\r\n '@apply border border-gray-stroke': {},\r\n '& .accordion-header': {\r\n '@apply bg-hover text-white': {},\r\n },\r\n },\r\n\r\n '&-is-open-alert': {\r\n '@apply border border-warning': {},\r\n '& .accordion-header': {\r\n '@apply border-b border-warning': {},\r\n },\r\n },\r\n\r\n '&-is-open &-body, &-is-open-alert &-body': {\r\n '@apply overflow-visible animate-reset-overflow': {},\r\n },\r\n\r\n '&-outline': {\r\n '@apply border border-gray-stroke': {},\r\n '.accordion-body': {\r\n '@apply mt-0': {},\r\n },\r\n '.accordion-toggle': {\r\n '&:focus-visible': {\r\n boxShadow: '0 0 0 0.4rem #4b4b4b!important',\r\n outline: '0',\r\n },\r\n },\r\n '.accordion-header': {\r\n '@apply bg-transparent text-body': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n },\r\n },\r\n\r\n '&-disabled, &-disabled button': {\r\n '@apply disabled:cursor-not-allowed cursor-not-allowed': {},\r\n },\r\n\r\n '&-disabled &-header': {\r\n '@apply bg-gray-lighter text-gray': {},\r\n },\r\n\r\n '&-disabled, &&-disabled': {\r\n '@apply border-gray': {},\r\n },\r\n },\r\n});\r\n"],"mappings":";;AAAAA,MAAM,CAACC,OAAO,GAAGC,SAAS,GAAG,SAAAA,UAACC,MAAM;EAAA,OAAM;IACxC,YAAY,EAAE;MACZ,UAAU,EAAE;QACV,gCAAgC,EAAE,CAAC,CAAC;QAEpC,0BAA0B,EAAE;UAC1B,iBAAiB,EAAE,CAAC;QACtB,CAAC;QAED,QAAQ,EAAE;UACR,0BAA0B,EAAE,CAAC;QAC/B;MACF,CAAC;MAED,oBAAoB,EAAE;QACpB,iBAAiB,EAAE,CAAC;MACtB,CAAC;MAED,UAAU,EAAE;QACV,iGAAiG,EAAE,CAAC,CAAC;QACrGC,UAAU,EAAE,MAAM;QAClB;QACA,iBAAiB,EAAE;UACjBC,SAAS,EAAE,6BAA6B;UACxCC,OAAO,EAAE;UACT;QACF,CAAC;;QACD,kBAAkB,EAAE;UAClB,8DAA8D,EAAE,CAAC;QACnE,CAAC;QACD,qBAAqB,EAAE;UACrB,sCAAsC,EAAE,CAAC;QAC3C;MACF,CAAC;MAED,QAAQ,EAAE;QACR,4BAA4B,EAAE,CAAC,CAAC;QAChCC,kBAAkB,EAAE,qCAAqC;QACzDC,wBAAwB,EAAE,8BAA8B;QACxDC,kBAAkB,EAAE,OAAO;QAE3B,8CAA8C,EAAE;UAC9C,uBAAuB,EAAE,CAAC;QAC5B,CAAC;QAED,gDAAgD,EAAE;UAChD,6BAA6B,EAAE,CAAC;QAClC;MACF,CAAC;MAED,SAAS,EAAE;QACT,8BAA8B,EAAE,CAAC,CAAC;QAClC,mBAAmB,EAAE;UACnB,8BAA8B,EAAE,CAAC,CAAC;UAElC,0BAA0B,EAAE;YAC1B,iBAAiB,EAAE,CAAC;UACtB;QACF;MACF,CAAC;MAED,SAAS,EAAE;QACT,8BAA8B,EAAE,CAAC,CAAC;QAClC,mBAAmB,EAAE;UACnB,sCAAsC,EAAE,CAAC,CAAC;UAE1C,0BAA0B,EAAE;YAC1B,yBAAyB,EAAE,CAAC;UAC9B;QACF;MACF,CAAC;MAED,WAAW,EAAE;QACX,kCAAkC,EAAE,CAAC,CAAC;QACtC,qBAAqB,EAAE;UACrB,4BAA4B,EAAE,CAAC;QACjC;MACF,CAAC;MAED,iBAAiB,EAAE;QACjB,8BAA8B,EAAE,CAAC,CAAC;QAClC,qBAAqB,EAAE;UACrB,gCAAgC,EAAE,CAAC;QACrC;MACF,CAAC;MAED,0CAA0C,EAAE;QAC1C,gDAAgD,EAAE,CAAC;MACrD,CAAC;MAED,WAAW,EAAE;QACX,kCAAkC,EAAE,CAAC,CAAC;QACtC,iBAAiB,EAAE;UACjB,aAAa,EAAE,CAAC;QAClB,CAAC;QACD,mBAAmB,EAAE;UACnB,iBAAiB,EAAE;YACjBJ,SAAS,EAAE,gCAAgC;YAC3CC,OAAO,EAAE;UACX;QACF,CAAC;QACD,mBAAmB,EAAE;UACnB,iCAAiC,EAAE,CAAC,CAAC;UAErC,0BAA0B,EAAE;YAC1B,iBAAiB,EAAE,CAAC;UACtB;QACF;MACF,CAAC;MAED,+BAA+B,EAAE;QAC/B,uDAAuD,EAAE,CAAC;MAC5D,CAAC;MAED,qBAAqB,EAAE;QACrB,kCAAkC,EAAE,CAAC;MACvC,CAAC;MAED,yBAAyB,EAAE;QACzB,oBAAoB,EAAE,CAAC;MACzB;IACF;EACF,CAAC;AAAA,CAAC"}
1
+ {"version":3,"file":"accordion.js","names":["module","exports","Accordion","colors","fontWeight","boxShadow","outline","transitionProperty","transitionTimingFunction","transitionDuration"],"sources":["../../../src/components/accordion.js"],"sourcesContent":["module.exports = Accordion = (colors) => ({\r\n '.accordion': {\r\n '&-header': {\r\n '@apply flex flex-col text-left': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n\r\n '&-icon': {\r\n '@apply ml-auto !text-2xl': {},\r\n },\r\n },\r\n\r\n '&-is-open &-header': {\r\n '@apply bg-hover': {},\r\n },\r\n\r\n '&-toggle': {\r\n '@apply flex items-center inline-block text-lg leading-lg text-left text-lg mx-md sm:mx-lg my-md': {},\r\n fontWeight: 'bold',\r\n //\"@apply focus-visible:shadow shadow-lg\": {},\r\n '&:focus-visible': {\r\n boxShadow: '0 0 0 0.4rem #fff!important',\r\n outline: '0',\r\n //\"@apply border-4\": {},\r\n },\r\n '.accordion-title': {\r\n '@apply mr-md text-base leading-base md:text-lg md:leading-lg': {},\r\n },\r\n '.accordion-subtitle': {\r\n '@apply m-0 mr-md text-sm font-normal': {},\r\n },\r\n },\r\n\r\n '&-body': {\r\n '@apply h-0 overflow-hidden': {},\r\n transitionProperty: 'visibility, height, padding, margin',\r\n transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',\r\n transitionDuration: '180ms',\r\n\r\n '&[aria-hidden=\"true\"], &[data-hidden=\"true\"]': {\r\n '@apply my-0 invisible': {},\r\n },\r\n\r\n '&[aria-hidden=\"false\"], &[data-hidden=\"false\"]': {\r\n '@apply block h-auto visible': {},\r\n },\r\n },\r\n\r\n '&-solid': {\r\n '@apply border border-primary': {},\r\n '.accordion-header': {\r\n '@apply bg-primary text-white': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n },\r\n },\r\n\r\n '&-alert': {\r\n '@apply border border-warning': {},\r\n '.accordion-header': {\r\n '@apply bg-warning-light text-warning': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-warning-light': {},\r\n },\r\n },\r\n },\r\n '&-error': {\r\n '@apply border border-error': {},\r\n '.accordion-header': {\r\n '@apply bg-error-light text-error': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-error-light': {},\r\n },\r\n },\r\n },\r\n\r\n '&-is-open': {\r\n '@apply border border-gray-stroke': {},\r\n '& .accordion-header': {\r\n '@apply bg-hover text-white': {},\r\n },\r\n },\r\n\r\n '&-is-open-alert': {\r\n '@apply border border-warning': {},\r\n '& .accordion-header': {\r\n '@apply border-b border-warning': {},\r\n },\r\n },\r\n\r\n '&-is-open-error': {\r\n '@apply border border-error': {},\r\n '& .accordion-header': {\r\n '@apply border-b border-error': {},\r\n },\r\n },\r\n\r\n '&-is-open &-body, &-is-open-alert &-body, &-is-open-error &-body': {\r\n '@apply overflow-visible animate-reset-overflow': {},\r\n },\r\n\r\n '&-outline': {\r\n '@apply border border-gray-stroke': {},\r\n '.accordion-body': {\r\n '@apply mt-0': {},\r\n },\r\n '.accordion-toggle': {\r\n '&:focus-visible': {\r\n boxShadow: '0 0 0 0.4rem #4b4b4b!important',\r\n outline: '0',\r\n },\r\n },\r\n '.accordion-header': {\r\n '@apply bg-transparent text-body': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n },\r\n },\r\n\r\n '&-disabled, &-disabled button': {\r\n '@apply disabled:cursor-not-allowed cursor-not-allowed': {},\r\n },\r\n\r\n '&-disabled &-header': {\r\n '@apply bg-gray-lighter text-gray': {},\r\n },\r\n\r\n '&-disabled, &&-disabled': {\r\n '@apply border-gray': {},\r\n },\r\n },\r\n});\r\n"],"mappings":"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"}
package/dist/cjs/components/tab-menu.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tab-menu.js","names":["module","exports","TabMenu","display","flexDirection","margin","all","width","height","padding","marginRight","alignItems","position","cursor","content","top","left"],"sources":["../../../src/components/tab-menu.js"],"sourcesContent":["module.exports = TabMenu = () => ({\n '.sk-tab-menu': {\n '&-wrapper': {\n display: 'flex',\n flexDirection: 'row',\n margin: 'auto',\n },\n '&-right': {\n '@apply justify-end': {},\n },\n '&-center': {\n '@apply justify-center': {},\n },\n '&-list': {\n all: 'unset',\n display: 'flex',\n '&-stretch': {\n '@apply w-full justify-between': {},\n },\n },\n\n '&-underline': {\n width: '100%',\n height: 6,\n '@apply bg-gray-light': {},\n },\n '&-item': {\n all: 'unset',\n height: 65,\n display: 'flex',\n padding: '0 1rem',\n marginRight: '5rem',\n alignItems: 'center',\n position: 'relative',\n cursor: 'pointer',\n '&-stretch': {\n '@apply mr-0': {},\n },\n '&-right': {\n '@apply mr-0 ml-[5rem]': {},\n },\n '&-center:last-of-type': {\n '@apply mr-0': {},\n },\n\n '&.active::after': {\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n width: '100%',\n height: 6,\n top: '100%',\n left: 0,\n '@apply bg-primary': {},\n },\n },\n },\n});\n"],"mappings":";;AAAAA,MAAM,CAACC,OAAO,GAAGC,OAAO,GAAG,SAAAA,QAAA;EAAA,OAAO;IAChC,cAAc,EAAE;MACd,WAAW,EAAE;QACXC,OAAO,EAAE,MAAM;QACfC,aAAa,EAAE,KAAK;QACpBC,MAAM,EAAE;MACV,CAAC;MACD,SAAS,EAAE;QACT,oBAAoB,EAAE,CAAC;MACzB,CAAC;MACD,UAAU,EAAE;QACV,uBAAuB,EAAE,CAAC;MAC5B,CAAC;MACD,QAAQ,EAAE;QACRC,GAAG,EAAE,OAAO;QACZH,OAAO,EAAE,MAAM;QACf,WAAW,EAAE;UACX,+BAA+B,EAAE,CAAC;QACpC;MACF,CAAC;MAED,aAAa,EAAE;QACbI,KAAK,EAAE,MAAM;QACbC,MAAM,EAAE,CAAC;QACT,sBAAsB,EAAE,CAAC;MAC3B,CAAC;MACD,QAAQ,EAAE;QACRF,GAAG,EAAE,OAAO;QACZE,MAAM,EAAE,EAAE;QACVL,OAAO,EAAE,MAAM;QACfM,OAAO,EAAE,QAAQ;QACjBC,WAAW,EAAE,MAAM;QACnBC,UAAU,EAAE,QAAQ;QACpBC,QAAQ,EAAE,UAAU;QACpBC,MAAM,EAAE,SAAS;QACjB,WAAW,EAAE;UACX,aAAa,EAAE,CAAC;QAClB,CAAC;QACD,SAAS,EAAE;UACT,uBAAuB,EAAE,CAAC;QAC5B,CAAC;QACD,uBAAuB,EAAE;UACvB,aAAa,EAAE,CAAC;QAClB,CAAC;QAED,iBAAiB,EAAE;UACjBC,OAAO,EAAE,IAAI;UACbX,OAAO,EAAE,OAAO;UAChBS,QAAQ,EAAE,UAAU;UACpBL,KAAK,EAAE,MAAM;UACbC,MAAM,EAAE,CAAC;UACTO,GAAG,EAAE,MAAM;UACXC,IAAI,EAAE,CAAC;UACP,mBAAmB,EAAE,CAAC;QACxB;MACF;IACF;EACF,CAAC;AAAA,CAAC"}
1
+ {"version":3,"file":"tab-menu.js","names":["module","exports","TabMenu","display","flexDirection","margin","all","width","height","padding","marginRight","alignItems","position","cursor","content","top","left"],"sources":["../../../src/components/tab-menu.js"],"sourcesContent":["module.exports = TabMenu = () => ({\r\n '.sk-tab-menu': {\r\n '&-wrapper': {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n margin: 'auto',\r\n },\r\n '&-right': {\r\n '@apply justify-end': {},\r\n },\r\n '&-center': {\r\n '@apply justify-center': {},\r\n },\r\n '&-list': {\r\n all: 'unset',\r\n display: 'flex',\r\n '&-stretch': {\r\n '@apply w-full justify-between': {},\r\n },\r\n },\r\n\r\n '&-underline': {\r\n width: '100%',\r\n height: 6,\r\n '@apply bg-gray-light': {},\r\n },\r\n '&-item': {\r\n all: 'unset',\r\n height: 65,\r\n display: 'flex',\r\n padding: '0 1rem',\r\n marginRight: '5rem',\r\n alignItems: 'center',\r\n position: 'relative',\r\n cursor: 'pointer',\r\n '&-stretch': {\r\n '@apply mr-0': {},\r\n },\r\n '&-right': {\r\n '@apply mr-0 ml-[5rem]': {},\r\n },\r\n '&-center:last-of-type': {\r\n '@apply mr-0': {},\r\n },\r\n\r\n '&.active::after': {\r\n content: '\"\"',\r\n display: 'block',\r\n position: 'absolute',\r\n width: '100%',\r\n height: 6,\r\n top: '100%',\r\n left: 0,\r\n '@apply bg-primary': {},\r\n },\r\n },\r\n },\r\n});\r\n"],"mappings":";;AAAAA,MAAM,CAACC,OAAO,GAAGC,OAAO,GAAG,SAAAA,QAAA;EAAA,OAAO;IAChC,cAAc,EAAE;MACd,WAAW,EAAE;QACXC,OAAO,EAAE,MAAM;QACfC,aAAa,EAAE,KAAK;QACpBC,MAAM,EAAE;MACV,CAAC;MACD,SAAS,EAAE;QACT,oBAAoB,EAAE,CAAC;MACzB,CAAC;MACD,UAAU,EAAE;QACV,uBAAuB,EAAE,CAAC;MAC5B,CAAC;MACD,QAAQ,EAAE;QACRC,GAAG,EAAE,OAAO;QACZH,OAAO,EAAE,MAAM;QACf,WAAW,EAAE;UACX,+BAA+B,EAAE,CAAC;QACpC;MACF,CAAC;MAED,aAAa,EAAE;QACbI,KAAK,EAAE,MAAM;QACbC,MAAM,EAAE,CAAC;QACT,sBAAsB,EAAE,CAAC;MAC3B,CAAC;MACD,QAAQ,EAAE;QACRF,GAAG,EAAE,OAAO;QACZE,MAAM,EAAE,EAAE;QACVL,OAAO,EAAE,MAAM;QACfM,OAAO,EAAE,QAAQ;QACjBC,WAAW,EAAE,MAAM;QACnBC,UAAU,EAAE,QAAQ;QACpBC,QAAQ,EAAE,UAAU;QACpBC,MAAM,EAAE,SAAS;QACjB,WAAW,EAAE;UACX,aAAa,EAAE,CAAC;QAClB,CAAC;QACD,SAAS,EAAE;UACT,uBAAuB,EAAE,CAAC;QAC5B,CAAC;QACD,uBAAuB,EAAE;UACvB,aAAa,EAAE,CAAC;QAClB,CAAC;QAED,iBAAiB,EAAE;UACjBC,OAAO,EAAE,IAAI;UACbX,OAAO,EAAE,OAAO;UAChBS,QAAQ,EAAE,UAAU;UACpBL,KAAK,EAAE,MAAM;UACbC,MAAM,EAAE,CAAC;UACTO,GAAG,EAAE,MAAM;UACXC,IAAI,EAAE,CAAC;UACP,mBAAmB,EAAE,CAAC;QACxB;MACF;IACF;EACF,CAAC;AAAA,CAAC"}
package/dist/cjs/components/tabs.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.js","names":["module","exports","Tabs","content","display","hidden"],"sources":["../../../src/components/tabs.js"],"sourcesContent":["module.exports = Tabs = () => ({\n '.sk-tabs': {\n '&-stretch': {\n '@apply w-full': {},\n },\n '&-list': {\n '@apply block relative w-full h-[3rem]': {},\n '&-stretch': {\n '@apply flex justify-between': {},\n },\n '&-right': {\n '@apply text-right': {},\n },\n '&-center': {\n '@apply text-center': {},\n },\n\n '&-line::after': {\n content: '\"\"',\n '@apply bg-gray-middle w-full h-[2px] absolute left-0 right-0 bottom-0': {},\n },\n },\n '&-tab': {\n '@apply relative mr-[3.2rem] text-base font-bold p-0 relative h-[2.8rem] inline-block': {},\n '@apply text-gray': {},\n '@apply cursor-pointer': {},\n '&.disabled': {\n '@apply cursor-not-allowed': {},\n '@apply text-gray-stroke': {},\n },\n '&.active': {\n '@apply text-body': {},\n '&::after': {\n content: '\"\"',\n '@apply bg-primary w-full h-[2px] absolute left-0 right-0 top-[100%] z-[1]': {},\n },\n },\n '&-stretch': {\n '@apply mr-0': {},\n },\n '&-header': {\n '@apply text-lg font-normal': {},\n },\n '&-right': {\n '@apply mr-0 ml-lg': {},\n },\n '&:last-of-type': {\n '@apply mr-0': {},\n },\n '&-icon': {\n '&-with-label': {\n '@apply mr-sm': {},\n },\n },\n },\n '&-panel': {\n '@apply mt-lg': {},\n '&:not(.active)': {\n display: 'none',\n hidden: true,\n },\n },\n },\n});\n"],"mappings":";;AAAAA,MAAM,CAACC,OAAO,GAAGC,IAAI,GAAG,SAAAA,KAAA;EAAA,OAAO;IAC7B,UAAU,EAAE;MACV,WAAW,EAAE;QACX,eAAe,EAAE,CAAC;MACpB,CAAC;MACD,QAAQ,EAAE;QACR,wCAAwC,EAAE,CAAC,CAAC;QAC5C,WAAW,EAAE;UACX,6BAA6B,EAAE,CAAC;QAClC,CAAC;QACD,SAAS,EAAE;UACT,mBAAmB,EAAE,CAAC;QACxB,CAAC;QACD,UAAU,EAAE;UACV,oBAAoB,EAAE,CAAC;QACzB,CAAC;QAED,eAAe,EAAE;UACfC,OAAO,EAAE,IAAI;UACb,uEAAuE,EAAE,CAAC;QAC5E;MACF,CAAC;MACD,OAAO,EAAE;QACP,uFAAuF,EAAE,CAAC,CAAC;QAC3F,kBAAkB,EAAE,CAAC,CAAC;QACtB,uBAAuB,EAAE,CAAC,CAAC;QAC3B,YAAY,EAAE;UACZ,2BAA2B,EAAE,CAAC,CAAC;UAC/B,yBAAyB,EAAE,CAAC;QAC9B,CAAC;QACD,UAAU,EAAE;UACV,kBAAkB,EAAE,CAAC,CAAC;UACtB,UAAU,EAAE;YACVA,OAAO,EAAE,IAAI;YACb,2EAA2E,EAAE,CAAC;UAChF;QACF,CAAC;QACD,WAAW,EAAE;UACX,aAAa,EAAE,CAAC;QAClB,CAAC;QACD,UAAU,EAAE;UACV,4BAA4B,EAAE,CAAC;QACjC,CAAC;QACD,SAAS,EAAE;UACT,mBAAmB,EAAE,CAAC;QACxB,CAAC;QACD,gBAAgB,EAAE;UAChB,aAAa,EAAE,CAAC;QAClB,CAAC;QACD,QAAQ,EAAE;UACR,cAAc,EAAE;YACd,cAAc,EAAE,CAAC;UACnB;QACF;MACF,CAAC;MACD,SAAS,EAAE;QACT,cAAc,EAAE,CAAC,CAAC;QAClB,gBAAgB,EAAE;UAChBC,OAAO,EAAE,MAAM;UACfC,MAAM,EAAE;QACV;MACF;IACF;EACF,CAAC;AAAA,CAAC"}
1
+ {"version":3,"file":"tabs.js","names":["module","exports","Tabs","content","display","hidden"],"sources":["../../../src/components/tabs.js"],"sourcesContent":["module.exports = Tabs = () => ({\r\n '.sk-tabs': {\r\n '&-stretch': {\r\n '@apply w-full': {},\r\n },\r\n '&-list': {\r\n '@apply block relative w-full h-[3rem]': {},\r\n '&-stretch': {\r\n '@apply flex justify-between': {},\r\n },\r\n '&-right': {\r\n '@apply text-right': {},\r\n },\r\n '&-center': {\r\n '@apply text-center': {},\r\n },\r\n\r\n '&-line::after': {\r\n content: '\"\"',\r\n '@apply bg-gray-middle w-full h-[2px] absolute left-0 right-0 bottom-0': {},\r\n },\r\n },\r\n '&-tab': {\r\n '@apply relative mr-[3.2rem] text-base font-bold p-0 relative h-[2.8rem] inline-block': {},\r\n '@apply text-gray': {},\r\n '@apply cursor-pointer': {},\r\n '&.disabled': {\r\n '@apply cursor-not-allowed': {},\r\n '@apply text-gray-stroke': {},\r\n },\r\n '&.active': {\r\n '@apply text-body': {},\r\n '&::after': {\r\n content: '\"\"',\r\n '@apply bg-primary w-full h-[2px] absolute left-0 right-0 top-[100%] z-[1]': {},\r\n },\r\n },\r\n '&-stretch': {\r\n '@apply mr-0': {},\r\n },\r\n '&-header': {\r\n '@apply text-lg font-normal': {},\r\n },\r\n '&-right': {\r\n '@apply mr-0 ml-lg': {},\r\n },\r\n '&:last-of-type': {\r\n '@apply mr-0': {},\r\n },\r\n '&-icon': {\r\n '&-with-label': {\r\n '@apply mr-sm': {},\r\n },\r\n },\r\n },\r\n '&-panel': {\r\n '@apply mt-lg': {},\r\n '&:not(.active)': {\r\n display: 'none',\r\n hidden: true,\r\n },\r\n },\r\n },\r\n});\r\n"],"mappings":";;AAAAA,MAAM,CAACC,OAAO,GAAGC,IAAI,GAAG,SAAAA,KAAA;EAAA,OAAO;IAC7B,UAAU,EAAE;MACV,WAAW,EAAE;QACX,eAAe,EAAE,CAAC;MACpB,CAAC;MACD,QAAQ,EAAE;QACR,wCAAwC,EAAE,CAAC,CAAC;QAC5C,WAAW,EAAE;UACX,6BAA6B,EAAE,CAAC;QAClC,CAAC;QACD,SAAS,EAAE;UACT,mBAAmB,EAAE,CAAC;QACxB,CAAC;QACD,UAAU,EAAE;UACV,oBAAoB,EAAE,CAAC;QACzB,CAAC;QAED,eAAe,EAAE;UACfC,OAAO,EAAE,IAAI;UACb,uEAAuE,EAAE,CAAC;QAC5E;MACF,CAAC;MACD,OAAO,EAAE;QACP,uFAAuF,EAAE,CAAC,CAAC;QAC3F,kBAAkB,EAAE,CAAC,CAAC;QACtB,uBAAuB,EAAE,CAAC,CAAC;QAC3B,YAAY,EAAE;UACZ,2BAA2B,EAAE,CAAC,CAAC;UAC/B,yBAAyB,EAAE,CAAC;QAC9B,CAAC;QACD,UAAU,EAAE;UACV,kBAAkB,EAAE,CAAC,CAAC;UACtB,UAAU,EAAE;YACVA,OAAO,EAAE,IAAI;YACb,2EAA2E,EAAE,CAAC;UAChF;QACF,CAAC;QACD,WAAW,EAAE;UACX,aAAa,EAAE,CAAC;QAClB,CAAC;QACD,UAAU,EAAE;UACV,4BAA4B,EAAE,CAAC;QACjC,CAAC;QACD,SAAS,EAAE;UACT,mBAAmB,EAAE,CAAC;QACxB,CAAC;QACD,gBAAgB,EAAE;UAChB,aAAa,EAAE,CAAC;QAClB,CAAC;QACD,QAAQ,EAAE;UACR,cAAc,EAAE;YACd,cAAc,EAAE,CAAC;UACnB;QACF;MACF,CAAC;MACD,SAAS,EAAE;QACT,cAAc,EAAE,CAAC,CAAC;QAClB,gBAAgB,EAAE;UAChBC,OAAO,EAAE,MAAM;UACfC,MAAM,EAAE;QACV;MACF;IACF;EACF,CAAC;AAAA,CAAC"}
package/dist/esm/components/accordion.js CHANGED
@@ -59,6 +59,15 @@ module.exports = Accordion = colors => ({
59
59
  }
60
60
  }
61
61
  },
62
+ '&-error': {
63
+ '@apply border border-error': {},
64
+ '.accordion-header': {
65
+ '@apply bg-error-light text-error': {},
66
+ '[aria-expanded="true"] &': {
67
+ '@apply bg-error-light': {}
68
+ }
69
+ }
70
+ },
62
71
  '&-is-open': {
63
72
  '@apply border border-gray-stroke': {},
64
73
  '& .accordion-header': {
@@ -71,7 +80,13 @@ module.exports = Accordion = colors => ({
71
80
  '@apply border-b border-warning': {}
72
81
  }
73
82
  },
74
- '&-is-open &-body, &-is-open-alert &-body': {
83
+ '&-is-open-error': {
84
+ '@apply border border-error': {},
85
+ '& .accordion-header': {
86
+ '@apply border-b border-error': {}
87
+ }
88
+ },
89
+ '&-is-open &-body, &-is-open-alert &-body, &-is-open-error &-body': {
75
90
  '@apply overflow-visible animate-reset-overflow': {}
76
91
  },
77
92
  '&-outline': {
package/dist/esm/components/accordion.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"accordion.js","names":["module","exports","Accordion","colors","fontWeight","boxShadow","outline","transitionProperty","transitionTimingFunction","transitionDuration"],"sources":["../../../src/components/accordion.js"],"sourcesContent":["module.exports = Accordion = (colors) => ({\r\n '.accordion': {\r\n '&-header': {\r\n '@apply flex flex-col text-left': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n\r\n '&-icon': {\r\n '@apply ml-auto !text-2xl': {},\r\n },\r\n },\r\n\r\n '&-is-open &-header': {\r\n '@apply bg-hover': {},\r\n },\r\n\r\n '&-toggle': {\r\n '@apply flex items-center inline-block text-lg leading-lg text-left text-lg mx-md sm:mx-lg my-md': {},\r\n fontWeight: 'bold',\r\n //\"@apply focus-visible:shadow shadow-lg\": {},\r\n '&:focus-visible': {\r\n boxShadow: '0 0 0 0.4rem #fff!important',\r\n outline: '0',\r\n //\"@apply border-4\": {},\r\n },\r\n '.accordion-title': {\r\n '@apply mr-md text-base leading-base md:text-lg md:leading-lg': {},\r\n },\r\n '.accordion-subtitle': {\r\n '@apply m-0 mr-md text-sm font-normal': {},\r\n },\r\n },\r\n\r\n '&-body': {\r\n '@apply h-0 overflow-hidden': {},\r\n transitionProperty: 'visibility, height, padding, margin',\r\n transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',\r\n transitionDuration: '180ms',\r\n\r\n '&[aria-hidden=\"true\"], &[data-hidden=\"true\"]': {\r\n '@apply my-0 invisible': {},\r\n },\r\n\r\n '&[aria-hidden=\"false\"], &[data-hidden=\"false\"]': {\r\n '@apply block h-auto visible': {},\r\n },\r\n },\r\n\r\n '&-solid': {\r\n '@apply border border-primary': {},\r\n '.accordion-header': {\r\n '@apply bg-primary text-white': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n },\r\n },\r\n\r\n '&-alert': {\r\n '@apply border border-warning': {},\r\n '.accordion-header': {\r\n '@apply bg-warning-light text-warning': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-warning-light': {},\r\n },\r\n },\r\n },\r\n\r\n '&-is-open': {\r\n '@apply border border-gray-stroke': {},\r\n '& .accordion-header': {\r\n '@apply bg-hover text-white': {},\r\n },\r\n },\r\n\r\n '&-is-open-alert': {\r\n '@apply border border-warning': {},\r\n '& .accordion-header': {\r\n '@apply border-b border-warning': {},\r\n },\r\n },\r\n\r\n '&-is-open &-body, &-is-open-alert &-body': {\r\n '@apply overflow-visible animate-reset-overflow': {},\r\n },\r\n\r\n '&-outline': {\r\n '@apply border border-gray-stroke': {},\r\n '.accordion-body': {\r\n '@apply mt-0': {},\r\n },\r\n '.accordion-toggle': {\r\n '&:focus-visible': {\r\n boxShadow: '0 0 0 0.4rem #4b4b4b!important',\r\n outline: '0',\r\n },\r\n },\r\n '.accordion-header': {\r\n '@apply bg-transparent text-body': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n },\r\n },\r\n\r\n '&-disabled, &-disabled button': {\r\n '@apply disabled:cursor-not-allowed cursor-not-allowed': {},\r\n },\r\n\r\n '&-disabled &-header': {\r\n '@apply bg-gray-lighter text-gray': {},\r\n },\r\n\r\n '&-disabled, &&-disabled': {\r\n '@apply border-gray': {},\r\n },\r\n },\r\n});\r\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,SAAS,GAAIC,MAAM,KAAM;EACxC,YAAY,EAAE;IACZ,UAAU,EAAE;MACV,gCAAgC,EAAE,CAAC,CAAC;MAEpC,0BAA0B,EAAE;QAC1B,iBAAiB,EAAE,CAAC;MACtB,CAAC;MAED,QAAQ,EAAE;QACR,0BAA0B,EAAE,CAAC;MAC/B;IACF,CAAC;IAED,oBAAoB,EAAE;MACpB,iBAAiB,EAAE,CAAC;IACtB,CAAC;IAED,UAAU,EAAE;MACV,iGAAiG,EAAE,CAAC,CAAC;MACrGC,UAAU,EAAE,MAAM;MAClB;MACA,iBAAiB,EAAE;QACjBC,SAAS,EAAE,6BAA6B;QACxCC,OAAO,EAAE;QACT;MACF,CAAC;;MACD,kBAAkB,EAAE;QAClB,8DAA8D,EAAE,CAAC;MACnE,CAAC;MACD,qBAAqB,EAAE;QACrB,sCAAsC,EAAE,CAAC;MAC3C;IACF,CAAC;IAED,QAAQ,EAAE;MACR,4BAA4B,EAAE,CAAC,CAAC;MAChCC,kBAAkB,EAAE,qCAAqC;MACzDC,wBAAwB,EAAE,8BAA8B;MACxDC,kBAAkB,EAAE,OAAO;MAE3B,8CAA8C,EAAE;QAC9C,uBAAuB,EAAE,CAAC;MAC5B,CAAC;MAED,gDAAgD,EAAE;QAChD,6BAA6B,EAAE,CAAC;MAClC;IACF,CAAC;IAED,SAAS,EAAE;MACT,8BAA8B,EAAE,CAAC,CAAC;MAClC,mBAAmB,EAAE;QACnB,8BAA8B,EAAE,CAAC,CAAC;QAElC,0BAA0B,EAAE;UAC1B,iBAAiB,EAAE,CAAC;QACtB;MACF;IACF,CAAC;IAED,SAAS,EAAE;MACT,8BAA8B,EAAE,CAAC,CAAC;MAClC,mBAAmB,EAAE;QACnB,sCAAsC,EAAE,CAAC,CAAC;QAE1C,0BAA0B,EAAE;UAC1B,yBAAyB,EAAE,CAAC;QAC9B;MACF;IACF,CAAC;IAED,WAAW,EAAE;MACX,kCAAkC,EAAE,CAAC,CAAC;MACtC,qBAAqB,EAAE;QACrB,4BAA4B,EAAE,CAAC;MACjC;IACF,CAAC;IAED,iBAAiB,EAAE;MACjB,8BAA8B,EAAE,CAAC,CAAC;MAClC,qBAAqB,EAAE;QACrB,gCAAgC,EAAE,CAAC;MACrC;IACF,CAAC;IAED,0CAA0C,EAAE;MAC1C,gDAAgD,EAAE,CAAC;IACrD,CAAC;IAED,WAAW,EAAE;MACX,kCAAkC,EAAE,CAAC,CAAC;MACtC,iBAAiB,EAAE;QACjB,aAAa,EAAE,CAAC;MAClB,CAAC;MACD,mBAAmB,EAAE;QACnB,iBAAiB,EAAE;UACjBJ,SAAS,EAAE,gCAAgC;UAC3CC,OAAO,EAAE;QACX;MACF,CAAC;MACD,mBAAmB,EAAE;QACnB,iCAAiC,EAAE,CAAC,CAAC;QAErC,0BAA0B,EAAE;UAC1B,iBAAiB,EAAE,CAAC;QACtB;MACF;IACF,CAAC;IAED,+BAA+B,EAAE;MAC/B,uDAAuD,EAAE,CAAC;IAC5D,CAAC;IAED,qBAAqB,EAAE;MACrB,kCAAkC,EAAE,CAAC;IACvC,CAAC;IAED,yBAAyB,EAAE;MACzB,oBAAoB,EAAE,CAAC;IACzB;EACF;AACF,CAAC,CAAC"}
1
+ {"version":3,"file":"accordion.js","names":["module","exports","Accordion","colors","fontWeight","boxShadow","outline","transitionProperty","transitionTimingFunction","transitionDuration"],"sources":["../../../src/components/accordion.js"],"sourcesContent":["module.exports = Accordion = (colors) => ({\r\n '.accordion': {\r\n '&-header': {\r\n '@apply flex flex-col text-left': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n\r\n '&-icon': {\r\n '@apply ml-auto !text-2xl': {},\r\n },\r\n },\r\n\r\n '&-is-open &-header': {\r\n '@apply bg-hover': {},\r\n },\r\n\r\n '&-toggle': {\r\n '@apply flex items-center inline-block text-lg leading-lg text-left text-lg mx-md sm:mx-lg my-md': {},\r\n fontWeight: 'bold',\r\n //\"@apply focus-visible:shadow shadow-lg\": {},\r\n '&:focus-visible': {\r\n boxShadow: '0 0 0 0.4rem #fff!important',\r\n outline: '0',\r\n //\"@apply border-4\": {},\r\n },\r\n '.accordion-title': {\r\n '@apply mr-md text-base leading-base md:text-lg md:leading-lg': {},\r\n },\r\n '.accordion-subtitle': {\r\n '@apply m-0 mr-md text-sm font-normal': {},\r\n },\r\n },\r\n\r\n '&-body': {\r\n '@apply h-0 overflow-hidden': {},\r\n transitionProperty: 'visibility, height, padding, margin',\r\n transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',\r\n transitionDuration: '180ms',\r\n\r\n '&[aria-hidden=\"true\"], &[data-hidden=\"true\"]': {\r\n '@apply my-0 invisible': {},\r\n },\r\n\r\n '&[aria-hidden=\"false\"], &[data-hidden=\"false\"]': {\r\n '@apply block h-auto visible': {},\r\n },\r\n },\r\n\r\n '&-solid': {\r\n '@apply border border-primary': {},\r\n '.accordion-header': {\r\n '@apply bg-primary text-white': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n },\r\n },\r\n\r\n '&-alert': {\r\n '@apply border border-warning': {},\r\n '.accordion-header': {\r\n '@apply bg-warning-light text-warning': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-warning-light': {},\r\n },\r\n },\r\n },\r\n '&-error': {\r\n '@apply border border-error': {},\r\n '.accordion-header': {\r\n '@apply bg-error-light text-error': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-error-light': {},\r\n },\r\n },\r\n },\r\n\r\n '&-is-open': {\r\n '@apply border border-gray-stroke': {},\r\n '& .accordion-header': {\r\n '@apply bg-hover text-white': {},\r\n },\r\n },\r\n\r\n '&-is-open-alert': {\r\n '@apply border border-warning': {},\r\n '& .accordion-header': {\r\n '@apply border-b border-warning': {},\r\n },\r\n },\r\n\r\n '&-is-open-error': {\r\n '@apply border border-error': {},\r\n '& .accordion-header': {\r\n '@apply border-b border-error': {},\r\n },\r\n },\r\n\r\n '&-is-open &-body, &-is-open-alert &-body, &-is-open-error &-body': {\r\n '@apply overflow-visible animate-reset-overflow': {},\r\n },\r\n\r\n '&-outline': {\r\n '@apply border border-gray-stroke': {},\r\n '.accordion-body': {\r\n '@apply mt-0': {},\r\n },\r\n '.accordion-toggle': {\r\n '&:focus-visible': {\r\n boxShadow: '0 0 0 0.4rem #4b4b4b!important',\r\n outline: '0',\r\n },\r\n },\r\n '.accordion-header': {\r\n '@apply bg-transparent text-body': {},\r\n\r\n '[aria-expanded=\"true\"] &': {\r\n '@apply bg-hover': {},\r\n },\r\n },\r\n },\r\n\r\n '&-disabled, &-disabled button': {\r\n '@apply disabled:cursor-not-allowed cursor-not-allowed': {},\r\n },\r\n\r\n '&-disabled &-header': {\r\n '@apply bg-gray-lighter text-gray': {},\r\n },\r\n\r\n '&-disabled, &&-disabled': {\r\n '@apply border-gray': {},\r\n },\r\n },\r\n});\r\n"],"mappings":"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"}
package/dist/esm/components/tab-menu.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tab-menu.js","names":["module","exports","TabMenu","display","flexDirection","margin","all","width","height","padding","marginRight","alignItems","position","cursor","content","top","left"],"sources":["../../../src/components/tab-menu.js"],"sourcesContent":["module.exports = TabMenu = () => ({\n '.sk-tab-menu': {\n '&-wrapper': {\n display: 'flex',\n flexDirection: 'row',\n margin: 'auto',\n },\n '&-right': {\n '@apply justify-end': {},\n },\n '&-center': {\n '@apply justify-center': {},\n },\n '&-list': {\n all: 'unset',\n display: 'flex',\n '&-stretch': {\n '@apply w-full justify-between': {},\n },\n },\n\n '&-underline': {\n width: '100%',\n height: 6,\n '@apply bg-gray-light': {},\n },\n '&-item': {\n all: 'unset',\n height: 65,\n display: 'flex',\n padding: '0 1rem',\n marginRight: '5rem',\n alignItems: 'center',\n position: 'relative',\n cursor: 'pointer',\n '&-stretch': {\n '@apply mr-0': {},\n },\n '&-right': {\n '@apply mr-0 ml-[5rem]': {},\n },\n '&-center:last-of-type': {\n '@apply mr-0': {},\n },\n\n '&.active::after': {\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n width: '100%',\n height: 6,\n top: '100%',\n left: 0,\n '@apply bg-primary': {},\n },\n },\n },\n});\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,OAAO,GAAGA,CAAA,MAAO;EAChC,cAAc,EAAE;IACd,WAAW,EAAE;MACXC,OAAO,EAAE,MAAM;MACfC,aAAa,EAAE,KAAK;MACpBC,MAAM,EAAE;IACV,CAAC;IACD,SAAS,EAAE;MACT,oBAAoB,EAAE,CAAC;IACzB,CAAC;IACD,UAAU,EAAE;MACV,uBAAuB,EAAE,CAAC;IAC5B,CAAC;IACD,QAAQ,EAAE;MACRC,GAAG,EAAE,OAAO;MACZH,OAAO,EAAE,MAAM;MACf,WAAW,EAAE;QACX,+BAA+B,EAAE,CAAC;MACpC;IACF,CAAC;IAED,aAAa,EAAE;MACbI,KAAK,EAAE,MAAM;MACbC,MAAM,EAAE,CAAC;MACT,sBAAsB,EAAE,CAAC;IAC3B,CAAC;IACD,QAAQ,EAAE;MACRF,GAAG,EAAE,OAAO;MACZE,MAAM,EAAE,EAAE;MACVL,OAAO,EAAE,MAAM;MACfM,OAAO,EAAE,QAAQ;MACjBC,WAAW,EAAE,MAAM;MACnBC,UAAU,EAAE,QAAQ;MACpBC,QAAQ,EAAE,UAAU;MACpBC,MAAM,EAAE,SAAS;MACjB,WAAW,EAAE;QACX,aAAa,EAAE,CAAC;MAClB,CAAC;MACD,SAAS,EAAE;QACT,uBAAuB,EAAE,CAAC;MAC5B,CAAC;MACD,uBAAuB,EAAE;QACvB,aAAa,EAAE,CAAC;MAClB,CAAC;MAED,iBAAiB,EAAE;QACjBC,OAAO,EAAE,IAAI;QACbX,OAAO,EAAE,OAAO;QAChBS,QAAQ,EAAE,UAAU;QACpBL,KAAK,EAAE,MAAM;QACbC,MAAM,EAAE,CAAC;QACTO,GAAG,EAAE,MAAM;QACXC,IAAI,EAAE,CAAC;QACP,mBAAmB,EAAE,CAAC;MACxB;IACF;EACF;AACF,CAAC,CAAC"}
1
+ {"version":3,"file":"tab-menu.js","names":["module","exports","TabMenu","display","flexDirection","margin","all","width","height","padding","marginRight","alignItems","position","cursor","content","top","left"],"sources":["../../../src/components/tab-menu.js"],"sourcesContent":["module.exports = TabMenu = () => ({\r\n '.sk-tab-menu': {\r\n '&-wrapper': {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n margin: 'auto',\r\n },\r\n '&-right': {\r\n '@apply justify-end': {},\r\n },\r\n '&-center': {\r\n '@apply justify-center': {},\r\n },\r\n '&-list': {\r\n all: 'unset',\r\n display: 'flex',\r\n '&-stretch': {\r\n '@apply w-full justify-between': {},\r\n },\r\n },\r\n\r\n '&-underline': {\r\n width: '100%',\r\n height: 6,\r\n '@apply bg-gray-light': {},\r\n },\r\n '&-item': {\r\n all: 'unset',\r\n height: 65,\r\n display: 'flex',\r\n padding: '0 1rem',\r\n marginRight: '5rem',\r\n alignItems: 'center',\r\n position: 'relative',\r\n cursor: 'pointer',\r\n '&-stretch': {\r\n '@apply mr-0': {},\r\n },\r\n '&-right': {\r\n '@apply mr-0 ml-[5rem]': {},\r\n },\r\n '&-center:last-of-type': {\r\n '@apply mr-0': {},\r\n },\r\n\r\n '&.active::after': {\r\n content: '\"\"',\r\n display: 'block',\r\n position: 'absolute',\r\n width: '100%',\r\n height: 6,\r\n top: '100%',\r\n left: 0,\r\n '@apply bg-primary': {},\r\n },\r\n },\r\n },\r\n});\r\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,OAAO,GAAGA,CAAA,MAAO;EAChC,cAAc,EAAE;IACd,WAAW,EAAE;MACXC,OAAO,EAAE,MAAM;MACfC,aAAa,EAAE,KAAK;MACpBC,MAAM,EAAE;IACV,CAAC;IACD,SAAS,EAAE;MACT,oBAAoB,EAAE,CAAC;IACzB,CAAC;IACD,UAAU,EAAE;MACV,uBAAuB,EAAE,CAAC;IAC5B,CAAC;IACD,QAAQ,EAAE;MACRC,GAAG,EAAE,OAAO;MACZH,OAAO,EAAE,MAAM;MACf,WAAW,EAAE;QACX,+BAA+B,EAAE,CAAC;MACpC;IACF,CAAC;IAED,aAAa,EAAE;MACbI,KAAK,EAAE,MAAM;MACbC,MAAM,EAAE,CAAC;MACT,sBAAsB,EAAE,CAAC;IAC3B,CAAC;IACD,QAAQ,EAAE;MACRF,GAAG,EAAE,OAAO;MACZE,MAAM,EAAE,EAAE;MACVL,OAAO,EAAE,MAAM;MACfM,OAAO,EAAE,QAAQ;MACjBC,WAAW,EAAE,MAAM;MACnBC,UAAU,EAAE,QAAQ;MACpBC,QAAQ,EAAE,UAAU;MACpBC,MAAM,EAAE,SAAS;MACjB,WAAW,EAAE;QACX,aAAa,EAAE,CAAC;MAClB,CAAC;MACD,SAAS,EAAE;QACT,uBAAuB,EAAE,CAAC;MAC5B,CAAC;MACD,uBAAuB,EAAE;QACvB,aAAa,EAAE,CAAC;MAClB,CAAC;MAED,iBAAiB,EAAE;QACjBC,OAAO,EAAE,IAAI;QACbX,OAAO,EAAE,OAAO;QAChBS,QAAQ,EAAE,UAAU;QACpBL,KAAK,EAAE,MAAM;QACbC,MAAM,EAAE,CAAC;QACTO,GAAG,EAAE,MAAM;QACXC,IAAI,EAAE,CAAC;QACP,mBAAmB,EAAE,CAAC;MACxB;IACF;EACF;AACF,CAAC,CAAC"}
package/dist/esm/components/tabs.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.js","names":["module","exports","Tabs","content","display","hidden"],"sources":["../../../src/components/tabs.js"],"sourcesContent":["module.exports = Tabs = () => ({\n '.sk-tabs': {\n '&-stretch': {\n '@apply w-full': {},\n },\n '&-list': {\n '@apply block relative w-full h-[3rem]': {},\n '&-stretch': {\n '@apply flex justify-between': {},\n },\n '&-right': {\n '@apply text-right': {},\n },\n '&-center': {\n '@apply text-center': {},\n },\n\n '&-line::after': {\n content: '\"\"',\n '@apply bg-gray-middle w-full h-[2px] absolute left-0 right-0 bottom-0': {},\n },\n },\n '&-tab': {\n '@apply relative mr-[3.2rem] text-base font-bold p-0 relative h-[2.8rem] inline-block': {},\n '@apply text-gray': {},\n '@apply cursor-pointer': {},\n '&.disabled': {\n '@apply cursor-not-allowed': {},\n '@apply text-gray-stroke': {},\n },\n '&.active': {\n '@apply text-body': {},\n '&::after': {\n content: '\"\"',\n '@apply bg-primary w-full h-[2px] absolute left-0 right-0 top-[100%] z-[1]': {},\n },\n },\n '&-stretch': {\n '@apply mr-0': {},\n },\n '&-header': {\n '@apply text-lg font-normal': {},\n },\n '&-right': {\n '@apply mr-0 ml-lg': {},\n },\n '&:last-of-type': {\n '@apply mr-0': {},\n },\n '&-icon': {\n '&-with-label': {\n '@apply mr-sm': {},\n },\n },\n },\n '&-panel': {\n '@apply mt-lg': {},\n '&:not(.active)': {\n display: 'none',\n hidden: true,\n },\n },\n },\n});\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,IAAI,GAAGA,CAAA,MAAO;EAC7B,UAAU,EAAE;IACV,WAAW,EAAE;MACX,eAAe,EAAE,CAAC;IACpB,CAAC;IACD,QAAQ,EAAE;MACR,wCAAwC,EAAE,CAAC,CAAC;MAC5C,WAAW,EAAE;QACX,6BAA6B,EAAE,CAAC;MAClC,CAAC;MACD,SAAS,EAAE;QACT,mBAAmB,EAAE,CAAC;MACxB,CAAC;MACD,UAAU,EAAE;QACV,oBAAoB,EAAE,CAAC;MACzB,CAAC;MAED,eAAe,EAAE;QACfC,OAAO,EAAE,IAAI;QACb,uEAAuE,EAAE,CAAC;MAC5E;IACF,CAAC;IACD,OAAO,EAAE;MACP,uFAAuF,EAAE,CAAC,CAAC;MAC3F,kBAAkB,EAAE,CAAC,CAAC;MACtB,uBAAuB,EAAE,CAAC,CAAC;MAC3B,YAAY,EAAE;QACZ,2BAA2B,EAAE,CAAC,CAAC;QAC/B,yBAAyB,EAAE,CAAC;MAC9B,CAAC;MACD,UAAU,EAAE;QACV,kBAAkB,EAAE,CAAC,CAAC;QACtB,UAAU,EAAE;UACVA,OAAO,EAAE,IAAI;UACb,2EAA2E,EAAE,CAAC;QAChF;MACF,CAAC;MACD,WAAW,EAAE;QACX,aAAa,EAAE,CAAC;MAClB,CAAC;MACD,UAAU,EAAE;QACV,4BAA4B,EAAE,CAAC;MACjC,CAAC;MACD,SAAS,EAAE;QACT,mBAAmB,EAAE,CAAC;MACxB,CAAC;MACD,gBAAgB,EAAE;QAChB,aAAa,EAAE,CAAC;MAClB,CAAC;MACD,QAAQ,EAAE;QACR,cAAc,EAAE;UACd,cAAc,EAAE,CAAC;QACnB;MACF;IACF,CAAC;IACD,SAAS,EAAE;MACT,cAAc,EAAE,CAAC,CAAC;MAClB,gBAAgB,EAAE;QAChBC,OAAO,EAAE,MAAM;QACfC,MAAM,EAAE;MACV;IACF;EACF;AACF,CAAC,CAAC"}
1
+ {"version":3,"file":"tabs.js","names":["module","exports","Tabs","content","display","hidden"],"sources":["../../../src/components/tabs.js"],"sourcesContent":["module.exports = Tabs = () => ({\r\n '.sk-tabs': {\r\n '&-stretch': {\r\n '@apply w-full': {},\r\n },\r\n '&-list': {\r\n '@apply block relative w-full h-[3rem]': {},\r\n '&-stretch': {\r\n '@apply flex justify-between': {},\r\n },\r\n '&-right': {\r\n '@apply text-right': {},\r\n },\r\n '&-center': {\r\n '@apply text-center': {},\r\n },\r\n\r\n '&-line::after': {\r\n content: '\"\"',\r\n '@apply bg-gray-middle w-full h-[2px] absolute left-0 right-0 bottom-0': {},\r\n },\r\n },\r\n '&-tab': {\r\n '@apply relative mr-[3.2rem] text-base font-bold p-0 relative h-[2.8rem] inline-block': {},\r\n '@apply text-gray': {},\r\n '@apply cursor-pointer': {},\r\n '&.disabled': {\r\n '@apply cursor-not-allowed': {},\r\n '@apply text-gray-stroke': {},\r\n },\r\n '&.active': {\r\n '@apply text-body': {},\r\n '&::after': {\r\n content: '\"\"',\r\n '@apply bg-primary w-full h-[2px] absolute left-0 right-0 top-[100%] z-[1]': {},\r\n },\r\n },\r\n '&-stretch': {\r\n '@apply mr-0': {},\r\n },\r\n '&-header': {\r\n '@apply text-lg font-normal': {},\r\n },\r\n '&-right': {\r\n '@apply mr-0 ml-lg': {},\r\n },\r\n '&:last-of-type': {\r\n '@apply mr-0': {},\r\n },\r\n '&-icon': {\r\n '&-with-label': {\r\n '@apply mr-sm': {},\r\n },\r\n },\r\n },\r\n '&-panel': {\r\n '@apply mt-lg': {},\r\n '&:not(.active)': {\r\n display: 'none',\r\n hidden: true,\r\n },\r\n },\r\n },\r\n});\r\n"],"mappings":"AAAAA,MAAM,CAACC,OAAO,GAAGC,IAAI,GAAGA,CAAA,MAAO;EAC7B,UAAU,EAAE;IACV,WAAW,EAAE;MACX,eAAe,EAAE,CAAC;IACpB,CAAC;IACD,QAAQ,EAAE;MACR,wCAAwC,EAAE,CAAC,CAAC;MAC5C,WAAW,EAAE;QACX,6BAA6B,EAAE,CAAC;MAClC,CAAC;MACD,SAAS,EAAE;QACT,mBAAmB,EAAE,CAAC;MACxB,CAAC;MACD,UAAU,EAAE;QACV,oBAAoB,EAAE,CAAC;MACzB,CAAC;MAED,eAAe,EAAE;QACfC,OAAO,EAAE,IAAI;QACb,uEAAuE,EAAE,CAAC;MAC5E;IACF,CAAC;IACD,OAAO,EAAE;MACP,uFAAuF,EAAE,CAAC,CAAC;MAC3F,kBAAkB,EAAE,CAAC,CAAC;MACtB,uBAAuB,EAAE,CAAC,CAAC;MAC3B,YAAY,EAAE;QACZ,2BAA2B,EAAE,CAAC,CAAC;QAC/B,yBAAyB,EAAE,CAAC;MAC9B,CAAC;MACD,UAAU,EAAE;QACV,kBAAkB,EAAE,CAAC,CAAC;QACtB,UAAU,EAAE;UACVA,OAAO,EAAE,IAAI;UACb,2EAA2E,EAAE,CAAC;QAChF;MACF,CAAC;MACD,WAAW,EAAE;QACX,aAAa,EAAE,CAAC;MAClB,CAAC;MACD,UAAU,EAAE;QACV,4BAA4B,EAAE,CAAC;MACjC,CAAC;MACD,SAAS,EAAE;QACT,mBAAmB,EAAE,CAAC;MACxB,CAAC;MACD,gBAAgB,EAAE;QAChB,aAAa,EAAE,CAAC;MAClB,CAAC;MACD,QAAQ,EAAE;QACR,cAAc,EAAE;UACd,cAAc,EAAE,CAAC;QACnB;MACF;IACF,CAAC;IACD,SAAS,EAAE;MACT,cAAc,EAAE,CAAC,CAAC;MAClB,gBAAgB,EAAE;QAChBC,OAAO,EAAE,MAAM;QACfC,MAAM,EAAE;MACV;IACF;EACF;AACF,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sk-web-gui/core",
3
- "version": "0.1.83",
3
+ "version": "0.1.84",
4
4
  "license": "MIT",
5
5
  "main": "src/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -40,5 +40,5 @@
40
40
  "@sk-web-gui/theme": "0.1.13",
41
41
  "mini-svg-data-uri": "^1.4.4"
42
42
  },
43
- "gitHead": "208483d0618b03b24e6946239ddfed13fce28dcd"
43
+ "gitHead": "c63b4e0ab442353c98b9dbff8658cc6729e41d12"
44
44
  }
package/src/components/accordion.js CHANGED
@@ -69,6 +69,16 @@ module.exports = Accordion = (colors) => ({
69
69
  },
70
70
  },
71
71
  },
72
+ '&-error': {
73
+ '@apply border border-error': {},
74
+ '.accordion-header': {
75
+ '@apply bg-error-light text-error': {},
76
+
77
+ '[aria-expanded="true"] &': {
78
+ '@apply bg-error-light': {},
79
+ },
80
+ },
81
+ },
72
82
 
73
83
  '&-is-open': {
74
84
  '@apply border border-gray-stroke': {},
@@ -84,7 +94,14 @@ module.exports = Accordion = (colors) => ({
84
94
  },
85
95
  },
86
96
 
87
- '&-is-open &-body, &-is-open-alert &-body': {
97
+ '&-is-open-error': {
98
+ '@apply border border-error': {},
99
+ '& .accordion-header': {
100
+ '@apply border-b border-error': {},
101
+ },
102
+ },
103
+
104
+ '&-is-open &-body, &-is-open-alert &-body, &-is-open-error &-body': {
88
105
  '@apply overflow-visible animate-reset-overflow': {},
89
106
  },
90
107
 
package/src/components/tab-menu.js CHANGED
@@ -1,58 +1,58 @@
1
- module.exports = TabMenu = () => ({
2
- '.sk-tab-menu': {
3
- '&-wrapper': {
4
- display: 'flex',
5
- flexDirection: 'row',
6
- margin: 'auto',
7
- },
8
- '&-right': {
9
- '@apply justify-end': {},
10
- },
11
- '&-center': {
12
- '@apply justify-center': {},
13
- },
14
- '&-list': {
15
- all: 'unset',
16
- display: 'flex',
17
- '&-stretch': {
18
- '@apply w-full justify-between': {},
19
- },
20
- },
21
-
22
- '&-underline': {
23
- width: '100%',
24
- height: 6,
25
- '@apply bg-gray-light': {},
26
- },
27
- '&-item': {
28
- all: 'unset',
29
- height: 65,
30
- display: 'flex',
31
- padding: '0 1rem',
32
- marginRight: '5rem',
33
- alignItems: 'center',
34
- position: 'relative',
35
- cursor: 'pointer',
36
- '&-stretch': {
37
- '@apply mr-0': {},
38
- },
39
- '&-right': {
40
- '@apply mr-0 ml-[5rem]': {},
41
- },
42
- '&-center:last-of-type': {
43
- '@apply mr-0': {},
44
- },
45
-
46
- '&.active::after': {
47
- content: '""',
48
- display: 'block',
49
- position: 'absolute',
50
- width: '100%',
51
- height: 6,
52
- top: '100%',
53
- left: 0,
54
- '@apply bg-primary': {},
55
- },
56
- },
57
- },
58
- });
1
+ module.exports = TabMenu = () => ({
2
+ '.sk-tab-menu': {
3
+ '&-wrapper': {
4
+ display: 'flex',
5
+ flexDirection: 'row',
6
+ margin: 'auto',
7
+ },
8
+ '&-right': {
9
+ '@apply justify-end': {},
10
+ },
11
+ '&-center': {
12
+ '@apply justify-center': {},
13
+ },
14
+ '&-list': {
15
+ all: 'unset',
16
+ display: 'flex',
17
+ '&-stretch': {
18
+ '@apply w-full justify-between': {},
19
+ },
20
+ },
21
+
22
+ '&-underline': {
23
+ width: '100%',
24
+ height: 6,
25
+ '@apply bg-gray-light': {},
26
+ },
27
+ '&-item': {
28
+ all: 'unset',
29
+ height: 65,
30
+ display: 'flex',
31
+ padding: '0 1rem',
32
+ marginRight: '5rem',
33
+ alignItems: 'center',
34
+ position: 'relative',
35
+ cursor: 'pointer',
36
+ '&-stretch': {
37
+ '@apply mr-0': {},
38
+ },
39
+ '&-right': {
40
+ '@apply mr-0 ml-[5rem]': {},
41
+ },
42
+ '&-center:last-of-type': {
43
+ '@apply mr-0': {},
44
+ },
45
+
46
+ '&.active::after': {
47
+ content: '""',
48
+ display: 'block',
49
+ position: 'absolute',
50
+ width: '100%',
51
+ height: 6,
52
+ top: '100%',
53
+ left: 0,
54
+ '@apply bg-primary': {},
55
+ },
56
+ },
57
+ },
58
+ });
package/src/components/tabs.js CHANGED
@@ -1,64 +1,64 @@
1
- module.exports = Tabs = () => ({
2
- '.sk-tabs': {
3
- '&-stretch': {
4
- '@apply w-full': {},
5
- },
6
- '&-list': {
7
- '@apply block relative w-full h-[3rem]': {},
8
- '&-stretch': {
9
- '@apply flex justify-between': {},
10
- },
11
- '&-right': {
12
- '@apply text-right': {},
13
- },
14
- '&-center': {
15
- '@apply text-center': {},
16
- },
17
-
18
- '&-line::after': {
19
- content: '""',
20
- '@apply bg-gray-middle w-full h-[2px] absolute left-0 right-0 bottom-0': {},
21
- },
22
- },
23
- '&-tab': {
24
- '@apply relative mr-[3.2rem] text-base font-bold p-0 relative h-[2.8rem] inline-block': {},
25
- '@apply text-gray': {},
26
- '@apply cursor-pointer': {},
27
- '&.disabled': {
28
- '@apply cursor-not-allowed': {},
29
- '@apply text-gray-stroke': {},
30
- },
31
- '&.active': {
32
- '@apply text-body': {},
33
- '&::after': {
34
- content: '""',
35
- '@apply bg-primary w-full h-[2px] absolute left-0 right-0 top-[100%] z-[1]': {},
36
- },
37
- },
38
- '&-stretch': {
39
- '@apply mr-0': {},
40
- },
41
- '&-header': {
42
- '@apply text-lg font-normal': {},
43
- },
44
- '&-right': {
45
- '@apply mr-0 ml-lg': {},
46
- },
47
- '&:last-of-type': {
48
- '@apply mr-0': {},
49
- },
50
- '&-icon': {
51
- '&-with-label': {
52
- '@apply mr-sm': {},
53
- },
54
- },
55
- },
56
- '&-panel': {
57
- '@apply mt-lg': {},
58
- '&:not(.active)': {
59
- display: 'none',
60
- hidden: true,
61
- },
62
- },
63
- },
64
- });
1
+ module.exports = Tabs = () => ({
2
+ '.sk-tabs': {
3
+ '&-stretch': {
4
+ '@apply w-full': {},
5
+ },
6
+ '&-list': {
7
+ '@apply block relative w-full h-[3rem]': {},
8
+ '&-stretch': {
9
+ '@apply flex justify-between': {},
10
+ },
11
+ '&-right': {
12
+ '@apply text-right': {},
13
+ },
14
+ '&-center': {
15
+ '@apply text-center': {},
16
+ },
17
+
18
+ '&-line::after': {
19
+ content: '""',
20
+ '@apply bg-gray-middle w-full h-[2px] absolute left-0 right-0 bottom-0': {},
21
+ },
22
+ },
23
+ '&-tab': {
24
+ '@apply relative mr-[3.2rem] text-base font-bold p-0 relative h-[2.8rem] inline-block': {},
25
+ '@apply text-gray': {},
26
+ '@apply cursor-pointer': {},
27
+ '&.disabled': {
28
+ '@apply cursor-not-allowed': {},
29
+ '@apply text-gray-stroke': {},
30
+ },
31
+ '&.active': {
32
+ '@apply text-body': {},
33
+ '&::after': {
34
+ content: '""',
35
+ '@apply bg-primary w-full h-[2px] absolute left-0 right-0 top-[100%] z-[1]': {},
36
+ },
37
+ },
38
+ '&-stretch': {
39
+ '@apply mr-0': {},
40
+ },
41
+ '&-header': {
42
+ '@apply text-lg font-normal': {},
43
+ },
44
+ '&-right': {
45
+ '@apply mr-0 ml-lg': {},
46
+ },
47
+ '&:last-of-type': {
48
+ '@apply mr-0': {},
49
+ },
50
+ '&-icon': {
51
+ '&-with-label': {
52
+ '@apply mr-sm': {},
53
+ },
54
+ },
55
+ },
56
+ '&-panel': {
57
+ '@apply mt-lg': {},
58
+ '&:not(.active)': {
59
+ display: 'none',
60
+ hidden: true,
61
+ },
62
+ },
63
+ },
64
+ });