@sk-web-gui/core 4.3.3 → 4.5.0

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 (11) hide show
  1. package/dist/cjs/components/file-upload.js +10 -0
  2. package/dist/cjs/components/file-upload.js.map +1 -1
  3. package/dist/cjs/components/text-editor.js +32 -0
  4. package/dist/cjs/components/text-editor.js.map +1 -1
  5. package/dist/esm/components/file-upload.js +10 -0
  6. package/dist/esm/components/file-upload.js.map +1 -1
  7. package/dist/esm/components/text-editor.js +32 -0
  8. package/dist/esm/components/text-editor.js.map +1 -1
  9. package/dist/types/components/file-upload.d.ts +10 -0
  10. package/dist/types/components/text-editor.d.ts +31 -0
  11. package/package.json +2 -2
package/dist/cjs/components/file-upload.js CHANGED
@@ -25,10 +25,20 @@ const FileUpload = ()=>({
25
25
  '&-item': {
26
26
  '@apply self-stretch flex flex-row flex-wrap p-12 rounded-button': {},
27
27
  '@apply gap-y-12': {},
28
+ '@apply transition-transform duration-200 ease-in-out': {},
29
+ '&[data-dragging="true"]': {
30
+ '@apply opacity-50': {}
31
+ },
32
+ '&[data-drag-over="true"]': {
33
+ '@apply translate-x-4': {}
34
+ },
28
35
  '&-innerwrapper': {
29
36
  '@apply w-full': {},
30
37
  '@apply self-stretch items-center list-none flex flex-row gap-y-24 gap-x-12': {}
31
38
  },
39
+ '.sk-form-file-upload-list-item-sort': {
40
+ '@apply flex gap-x-8 items-start': {}
41
+ },
32
42
  '&[data-isedit="true"]': {
33
43
  '.sk-form-file-upload-list-item-innerwrapper': {
34
44
  '@apply flex-col': {},
package/dist/cjs/components/file-upload.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/file-upload.ts"],"sourcesContent":["export const FileUpload = () => ({\r\n '.sk-form-file-upload': {\r\n '&-list': {\r\n '@apply flex flex-col py-4 gap-x-12 items-start': {},\r\n '@apply border-divider border-t-1 border-b-1': {},\r\n\r\n '&[data-border=\"true\"]': {\r\n '@apply border-0 py-0 gap-y-12': {},\r\n\r\n '.sk-form-file-upload-list-item': {\r\n '@apply border-1 border-divider': {},\r\n },\r\n },\r\n\r\n 'li[role=\"separator\"]': {\r\n '@apply h-[1px] mt-3 mb-6 py-0 w-full': {},\r\n },\r\n\r\n '&-item': {\r\n '@apply self-stretch flex flex-row flex-wrap p-12 rounded-button': {},\r\n '@apply gap-y-12': {},\r\n\r\n '&-innerwrapper': {\r\n '@apply w-full': {},\r\n '@apply self-stretch items-center list-none flex flex-row gap-y-24 gap-x-12': {},\r\n },\r\n\r\n '&[data-isedit=\"true\"]': {\r\n '.sk-form-file-upload-list-item-innerwrapper': {\r\n '@apply flex-col': {},\r\n '@apply medium-device:flex-row medium-device:items-center': {},\r\n\r\n '.sk-form-file-upload-list-item-icon': {\r\n '@apply hidden': {},\r\n '@apply medium-device:flex': {},\r\n },\r\n },\r\n },\r\n\r\n '&:hover': {\r\n '@apply bg-background-200': {},\r\n },\r\n\r\n '&[data-border=\"true\"]': {\r\n '@apply border-1 border-divider': {},\r\n },\r\n\r\n '&-icon': {\r\n '@apply flex justify-center shrink-0 rounded-utility overflow-hidden': {},\r\n '@apply bg-vattjom-surface-accent': {},\r\n\r\n '@apply w-32 h-32': {},\r\n '.sk-icon': {\r\n '@apply w-full h-full p-[.64rem]': {},\r\n },\r\n\r\n '&[data-size=\"sm\"]': {\r\n '@apply w-32 h-32': {},\r\n '.sk-icon': {\r\n '@apply p-[.64rem]': {},\r\n },\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply medium-device:w-44 medium-device:h-44': {},\r\n '.sk-icon': {\r\n '@apply medium-device:p-[.88rem]': {},\r\n },\r\n },\r\n },\r\n\r\n '&-content': {\r\n '@apply grow flex flex-col justify-start gap-y-24': {},\r\n '@apply medium-device:grid medium-device:grid-flow-col medium-device:auto-cols-fr medium-device:items-center':\r\n {},\r\n\r\n '& > *': {\r\n '@apply grow shrink basis-auto': {},\r\n },\r\n\r\n '&-name': {\r\n '@apply flex flex-col items-start gap-2': {},\r\n '&[data-size=\"sm\"]': {\r\n '.sk-form-file-upload-list-item-content-name-description': {\r\n '@apply hidden': {},\r\n },\r\n },\r\n\r\n '&-input-wrapper': {\r\n '@apply flex items-center': {},\r\n\r\n '.sk-form-input': {\r\n '@apply grow': {},\r\n },\r\n },\r\n\r\n '&-ending': {\r\n '@apply ml-8': {},\r\n },\r\n\r\n '&-heading': {\r\n '@apply text-base font-bold leading-24': {},\r\n },\r\n\r\n '&-description': {\r\n '@apply text-small': {},\r\n },\r\n },\r\n },\r\n\r\n '&-actions': {\r\n '@apply flex gap-12 items-center': {},\r\n '&-more': {\r\n '&-wrapper': {\r\n '@apply relative': {},\r\n },\r\n },\r\n '&-remove-tooltip': {\r\n '@apply absolute bottom-full mb-6 hidden z-20 left-1/2 -translate-x-1/2 whitespace-nowrap': {},\r\n '.group:hover &': {\r\n '@apply block': {},\r\n },\r\n },\r\n },\r\n\r\n '.sk-form-error-message': {\r\n '@apply text-error': {},\r\n },\r\n\r\n '.sk-form-control': {\r\n '@apply w-full medium-device:w-fit': {},\r\n\r\n '.sk-form-select,.sk-form-input': {\r\n '@apply w-full medium-device:w-fit': {},\r\n },\r\n },\r\n\r\n '&-progress': {\r\n '@apply w-full flex gap-x-md items-center': {},\r\n\r\n '&-bar': {\r\n '@apply w-full h-[0.4rem] bg-background-color-mixin-2 rounded-circular overflow-hidden': {},\r\n\r\n '&-amount': {\r\n '@apply h-full bg-primary-surface w-0 transition-[width_.3s_ease]': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&-area': {\r\n '&[data-relativity=\"viewport\"]': {\r\n '.sk-form-file-upload-area-overlay': {\r\n '@apply fixed': {},\r\n },\r\n },\r\n\r\n '&[data-relativity=\"component\"]': {\r\n '@apply relative inline-flex': {},\r\n '.sk-form-file-upload-area-overlay': {\r\n '@apply absolute': {},\r\n },\r\n },\r\n\r\n '&-overlay': {\r\n '@apply fixed z-overlay': {},\r\n '@apply top-0 bottom-0 left-0 right-0 p-32 rounded-groups': {},\r\n '@apply bg-primitives-overlay-darken-6': {},\r\n '@apply border-2 border-gronsta-text-primary': {},\r\n '@apply hidden': {},\r\n\r\n '&[data-isdragging]': {\r\n '@apply block': {},\r\n },\r\n\r\n '&-content': {\r\n '@apply w-full h-full': {},\r\n '@apply rounded-6 border-dashed border-2 border-gronsta-text-primary': {},\r\n '@apply flex items-center justify-center': {},\r\n '@apply text-gronsta-text-primary': {},\r\n\r\n '&-icon': {\r\n '&-wrapper': {\r\n '@apply rounded-full bg-gronsta-surface-accent p-16 h-40 w-40 md:h-[8rem] md:w-[8rem] xl:h-[12rem] xl:w-[12rem]':\r\n {},\r\n\r\n '.sk-icon': {\r\n '@apply w-full h-full': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&-modal': {\r\n '@apply medium-device:w-[78rem]': {},\r\n\r\n '&-labels': {\r\n '@apply hidden': {},\r\n '@apply medium-device:grid medium-device:grid-cols-2': {},\r\n '@apply text-small font-bold': {},\r\n '@apply mt-12 mb-8': {},\r\n },\r\n\r\n '&-button': {\r\n '&-wrapper': {\r\n '@apply flex items-center gap-8 mb-32': {},\r\n },\r\n },\r\n },\r\n '&-field &-area': {\r\n '@apply w-full h-full': {},\r\n\r\n '&-children': {\r\n '@apply w-full h-full': {},\r\n },\r\n },\r\n '&-field': {\r\n '@apply w-fit': {},\r\n\r\n '&[data-variant=\"horizontal\"] &-button': {\r\n '@apply flex flex-row p-24 justify-center items-center gap-16': {},\r\n },\r\n\r\n '&[data-variant=\"vertical\"] &-button': {\r\n '@apply flex flex-col p-24 justify-center items-center gap-18': {},\r\n\r\n '.sk-form-file-upload-field-button-content': {\r\n '@apply items-center': {},\r\n\r\n '&-restrictions': {\r\n '@apply items-center text-center': {},\r\n\r\n '&-mimetypes': {\r\n '@apply text-center': {},\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&:hover &-button': {\r\n '@apply bg-vattjom-background-200 border-solid': {},\r\n },\r\n\r\n '&[data-invalid=\"true\"] &-button': {\r\n '@apply bg-error-background-100 border-solid border-error': {},\r\n },\r\n\r\n '&-button': {\r\n '@apply w-full h-full grow shrink-0 basis-0 self-stretch': {},\r\n '@apply rounded-groups border-vattjom-surface-primary border-dashed border-1 bg-vattjom-background-100': {},\r\n\r\n '&-icon': {\r\n '.sk-icon': {\r\n '@apply w-32 h-32': {},\r\n },\r\n },\r\n '&-content': {\r\n '@apply flex flex-col items-start gap-y-4': {},\r\n '&-restrictions': {\r\n '@apply flex flex-col items-start': {},\r\n '@apply text-small text-dark-secondary': {},\r\n\r\n '&-mimetypes': {\r\n '@apply text-start line-clamp-1 max-w-[25rem]': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n },\r\n});\r\n"],"names":["FileUpload"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/file-upload.ts"],"sourcesContent":["export const FileUpload = () => ({\r\n '.sk-form-file-upload': {\r\n '&-list': {\r\n '@apply flex flex-col py-4 gap-x-12 items-start': {},\r\n '@apply border-divider border-t-1 border-b-1': {},\r\n\r\n '&[data-border=\"true\"]': {\r\n '@apply border-0 py-0 gap-y-12': {},\r\n\r\n '.sk-form-file-upload-list-item': {\r\n '@apply border-1 border-divider': {},\r\n },\r\n },\r\n\r\n 'li[role=\"separator\"]': {\r\n '@apply h-[1px] mt-3 mb-6 py-0 w-full': {},\r\n },\r\n\r\n '&-item': {\r\n '@apply self-stretch flex flex-row flex-wrap p-12 rounded-button': {},\r\n '@apply gap-y-12': {},\r\n '@apply transition-transform duration-200 ease-in-out': {},\r\n\r\n '&[data-dragging=\"true\"]': {\r\n '@apply opacity-50': {},\r\n },\r\n\r\n '&[data-drag-over=\"true\"]': {\r\n '@apply translate-x-4': {},\r\n },\r\n\r\n\r\n '&-innerwrapper': {\r\n '@apply w-full': {},\r\n '@apply self-stretch items-center list-none flex flex-row gap-y-24 gap-x-12': {},\r\n },\r\n\r\n '.sk-form-file-upload-list-item-sort': {\r\n '@apply flex gap-x-8 items-start': {},\r\n },\r\n\r\n '&[data-isedit=\"true\"]': {\r\n '.sk-form-file-upload-list-item-innerwrapper': {\r\n '@apply flex-col': {},\r\n '@apply medium-device:flex-row medium-device:items-center': {},\r\n\r\n '.sk-form-file-upload-list-item-icon': {\r\n '@apply hidden': {},\r\n '@apply medium-device:flex': {},\r\n },\r\n },\r\n },\r\n\r\n '&:hover': {\r\n '@apply bg-background-200': {},\r\n },\r\n\r\n '&[data-border=\"true\"]': {\r\n '@apply border-1 border-divider': {},\r\n },\r\n\r\n '&-icon': {\r\n '@apply flex justify-center shrink-0 rounded-utility overflow-hidden': {},\r\n '@apply bg-vattjom-surface-accent': {},\r\n\r\n '@apply w-32 h-32': {},\r\n '.sk-icon': {\r\n '@apply w-full h-full p-[.64rem]': {},\r\n },\r\n\r\n '&[data-size=\"sm\"]': {\r\n '@apply w-32 h-32': {},\r\n '.sk-icon': {\r\n '@apply p-[.64rem]': {},\r\n },\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply medium-device:w-44 medium-device:h-44': {},\r\n '.sk-icon': {\r\n '@apply medium-device:p-[.88rem]': {},\r\n },\r\n },\r\n },\r\n\r\n '&-content': {\r\n '@apply grow flex flex-col justify-start gap-y-24': {},\r\n '@apply medium-device:grid medium-device:grid-flow-col medium-device:auto-cols-fr medium-device:items-center':\r\n {},\r\n\r\n '& > *': {\r\n '@apply grow shrink basis-auto': {},\r\n },\r\n\r\n '&-name': {\r\n '@apply flex flex-col items-start gap-2': {},\r\n '&[data-size=\"sm\"]': {\r\n '.sk-form-file-upload-list-item-content-name-description': {\r\n '@apply hidden': {},\r\n },\r\n },\r\n\r\n '&-input-wrapper': {\r\n '@apply flex items-center': {},\r\n\r\n '.sk-form-input': {\r\n '@apply grow': {},\r\n },\r\n },\r\n\r\n '&-ending': {\r\n '@apply ml-8': {},\r\n },\r\n\r\n '&-heading': {\r\n '@apply text-base font-bold leading-24': {},\r\n },\r\n\r\n '&-description': {\r\n '@apply text-small': {},\r\n },\r\n },\r\n },\r\n\r\n '&-actions': {\r\n '@apply flex gap-12 items-center': {},\r\n '&-more': {\r\n '&-wrapper': {\r\n '@apply relative': {},\r\n },\r\n },\r\n '&-remove-tooltip': {\r\n '@apply absolute bottom-full mb-6 hidden z-20 left-1/2 -translate-x-1/2 whitespace-nowrap': {},\r\n '.group:hover &': {\r\n '@apply block': {},\r\n },\r\n },\r\n },\r\n\r\n '.sk-form-error-message': {\r\n '@apply text-error': {},\r\n },\r\n\r\n '.sk-form-control': {\r\n '@apply w-full medium-device:w-fit': {},\r\n\r\n '.sk-form-select,.sk-form-input': {\r\n '@apply w-full medium-device:w-fit': {},\r\n },\r\n },\r\n\r\n '&-progress': {\r\n '@apply w-full flex gap-x-md items-center': {},\r\n\r\n '&-bar': {\r\n '@apply w-full h-[0.4rem] bg-background-color-mixin-2 rounded-circular overflow-hidden': {},\r\n\r\n '&-amount': {\r\n '@apply h-full bg-primary-surface w-0 transition-[width_.3s_ease]': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&-area': {\r\n '&[data-relativity=\"viewport\"]': {\r\n '.sk-form-file-upload-area-overlay': {\r\n '@apply fixed': {},\r\n },\r\n },\r\n\r\n '&[data-relativity=\"component\"]': {\r\n '@apply relative inline-flex': {},\r\n '.sk-form-file-upload-area-overlay': {\r\n '@apply absolute': {},\r\n },\r\n },\r\n\r\n '&-overlay': {\r\n '@apply fixed z-overlay': {},\r\n '@apply top-0 bottom-0 left-0 right-0 p-32 rounded-groups': {},\r\n '@apply bg-primitives-overlay-darken-6': {},\r\n '@apply border-2 border-gronsta-text-primary': {},\r\n '@apply hidden': {},\r\n\r\n '&[data-isdragging]': {\r\n '@apply block': {},\r\n },\r\n\r\n '&-content': {\r\n '@apply w-full h-full': {},\r\n '@apply rounded-6 border-dashed border-2 border-gronsta-text-primary': {},\r\n '@apply flex items-center justify-center': {},\r\n '@apply text-gronsta-text-primary': {},\r\n\r\n '&-icon': {\r\n '&-wrapper': {\r\n '@apply rounded-full bg-gronsta-surface-accent p-16 h-40 w-40 md:h-[8rem] md:w-[8rem] xl:h-[12rem] xl:w-[12rem]':\r\n {},\r\n\r\n '.sk-icon': {\r\n '@apply w-full h-full': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&-modal': {\r\n '@apply medium-device:w-[78rem]': {},\r\n\r\n '&-labels': {\r\n '@apply hidden': {},\r\n '@apply medium-device:grid medium-device:grid-cols-2': {},\r\n '@apply text-small font-bold': {},\r\n '@apply mt-12 mb-8': {},\r\n },\r\n\r\n '&-button': {\r\n '&-wrapper': {\r\n '@apply flex items-center gap-8 mb-32': {},\r\n },\r\n },\r\n },\r\n '&-field &-area': {\r\n '@apply w-full h-full': {},\r\n\r\n '&-children': {\r\n '@apply w-full h-full': {},\r\n },\r\n },\r\n '&-field': {\r\n '@apply w-fit': {},\r\n\r\n '&[data-variant=\"horizontal\"] &-button': {\r\n '@apply flex flex-row p-24 justify-center items-center gap-16': {},\r\n },\r\n\r\n '&[data-variant=\"vertical\"] &-button': {\r\n '@apply flex flex-col p-24 justify-center items-center gap-18': {},\r\n\r\n '.sk-form-file-upload-field-button-content': {\r\n '@apply items-center': {},\r\n\r\n '&-restrictions': {\r\n '@apply items-center text-center': {},\r\n\r\n '&-mimetypes': {\r\n '@apply text-center': {},\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&:hover &-button': {\r\n '@apply bg-vattjom-background-200 border-solid': {},\r\n },\r\n\r\n '&[data-invalid=\"true\"] &-button': {\r\n '@apply bg-error-background-100 border-solid border-error': {},\r\n },\r\n\r\n '&-button': {\r\n '@apply w-full h-full grow shrink-0 basis-0 self-stretch': {},\r\n '@apply rounded-groups border-vattjom-surface-primary border-dashed border-1 bg-vattjom-background-100': {},\r\n\r\n '&-icon': {\r\n '.sk-icon': {\r\n '@apply w-32 h-32': {},\r\n },\r\n },\r\n '&-content': {\r\n '@apply flex flex-col items-start gap-y-4': {},\r\n '&-restrictions': {\r\n '@apply flex flex-col items-start': {},\r\n '@apply text-small text-dark-secondary': {},\r\n\r\n '&-mimetypes': {\r\n '@apply text-start line-clamp-1 max-w-[25rem]': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n },\r\n});\r\n"],"names":["FileUpload"],"mappings":"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"}
package/dist/cjs/components/text-editor.js CHANGED
@@ -10,6 +10,7 @@ Object.defineProperty(exports, "TextEditor", {
10
10
  });
11
11
  const TextEditor = ()=>({
12
12
  '.sk-texteditor': {
13
+ '@apply relative': {},
13
14
  '.ql-toolbar.ql-snow': {
14
15
  '@apply flex items-center bg-background-200 rounded-t-xl border-input-field-outline h-[4rem] pl-4': {},
15
16
  '.ql-stroke': {
@@ -100,6 +101,37 @@ const TextEditor = ()=>({
100
101
  '@apply bg-input-field-surface-disabled border-input-field-outline-disabled': {}
101
102
  }
102
103
  },
104
+ // Scale controls
105
+ '.sk-texteditor-scale': {
106
+ '@apply absolute right-2 top-0 h-[4rem] flex items-center gap-2 z-10': {}
107
+ },
108
+ '.sk-texteditor-scale-button': {
109
+ '@apply h-[3.2rem] w-[3.2rem] rounded-10 text-dark-primary flex items-center justify-center': {},
110
+ '&:hover': {
111
+ '@apply bg-tertiary-surface-hover': {}
112
+ },
113
+ '&:focus-visible': {
114
+ '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 bg-background-content': {}
115
+ },
116
+ '&:disabled': {
117
+ '@apply text-dark-disabled cursor-default': {},
118
+ '&:hover': {
119
+ '@apply bg-transparent': {}
120
+ },
121
+ '&:hover .tooltip-container': {
122
+ '@apply hidden opacity-0': {}
123
+ }
124
+ },
125
+ '.tooltip-container': {
126
+ '@apply absolute z-10 top-full mt-0 left-1/2 -translate-x-1/2 invisible opacity-0 transition-opacity duration-200 ease-in-out whitespace-nowrap': {}
127
+ },
128
+ '&:hover .tooltip-container': {
129
+ '@apply visible opacity-100': {}
130
+ }
131
+ },
132
+ '.sk-texteditor-scale-label': {
133
+ '@apply text-label-small font-thin text-dark-secondary select-none min-w-[3.6rem] text-center': {}
134
+ },
103
135
  // Tooltip-text
104
136
  '.ql-tooltip.ql-editing': {
105
137
  input: {
package/dist/cjs/components/text-editor.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/text-editor.ts"],"sourcesContent":["export const TextEditor = () => ({\r\n '.sk-texteditor': {\r\n '.ql-toolbar.ql-snow': {\r\n '@apply flex items-center bg-background-200 rounded-t-xl border-input-field-outline h-[4rem] pl-4': {},\r\n '.ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n '.ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '.ql-divider': {\r\n '@apply w-[0.1rem] h-[3.2rem] bg-divider mr-[1.2rem]': {},\r\n },\r\n '.tooltip-container': {\r\n '@apply absolute z-10 top-full mt-0 left-1/2 -translate-x-1/2 invisible opacity-0 transition-opacity duration-200 ease-in-out whitespace-nowrap':\r\n {},\r\n },\r\n '.ql-formats': {\r\n '@apply flex gap-4 mr-[1.2rem]': {},\r\n },\r\n\r\n svg: {\r\n '@apply h-[2.0rem] w-[2.0rem]': {},\r\n },\r\n\r\n button: {\r\n '@apply h-[3.2rem] w-[3.2rem] rounded-10 text-dark-primary': {},\r\n '&:hover, &:hover:focus-visible': {\r\n '@apply bg-tertiary-surface-hover': {},\r\n },\r\n '&:focus-visible': {\r\n '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 bg-background-content': {},\r\n },\r\n\r\n '&.ql-active': {\r\n '@apply bg-tertiary-surface-hover': {},\r\n '.ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '.ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n },\r\n '&:hover .ql-fill, &:focus-visible .ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '&:hover .ql-stroke, &:focus-visible .ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n '&:hover .tooltip-container, &:focus-visible .tooltip-container': {\r\n '@apply visible opacity-100': {},\r\n },\r\n },\r\n\r\n '&.ql-disabled': {\r\n '@apply border-input-field-outline-disabled': {},\r\n '.ql-fill': {\r\n '@apply fill-dark-disabled': {},\r\n },\r\n '.ql-stroke': {\r\n '@apply stroke-dark-disabled': {},\r\n },\r\n button: {\r\n '@apply bg-background-200 text-dark-disabled cursor-default': {},\r\n '&.ql-active': {\r\n '@apply bg-background-200 text-dark-disabled': {},\r\n },\r\n '&:hover': {\r\n '@apply bg-background-200 text-dark-disabled': {},\r\n },\r\n '&:hover .ql-fill': {\r\n '@apply fill-dark-disabled': {},\r\n },\r\n '&:hover .ql-stroke': {\r\n '@apply stroke-dark-disabled': {},\r\n },\r\n '&:hover .tooltip-container': {\r\n '@apply hidden opacity-0': {},\r\n },\r\n },\r\n },\r\n },\r\n\r\n '.ql-container.ql-snow': {\r\n '@apply border-input-field-outline rounded-b-xl': {},\r\n ':focus-visible': {\r\n '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 rounded-b-xl': {},\r\n },\r\n '&.disable-toolbar': {\r\n '@apply rounded-t-xl': {},\r\n ':focus-visible': {\r\n '@apply rounded-t-xl': {},\r\n },\r\n },\r\n '&.ql-disabled': {\r\n '@apply bg-input-field-surface-disabled border-input-field-outline-disabled': {},\r\n },\r\n },\r\n\r\n // Tooltip-text\r\n '.ql-tooltip.ql-editing': {\r\n input: {\r\n '@apply rounded-0': {},\r\n '&:focus-visible': {\r\n '@apply rounded-0': {},\r\n },\r\n },\r\n },\r\n '.ql-snow .ql-tooltip.ql-editing a.ql-action::after': {\r\n content: '\"Spara\"',\r\n },\r\n '.ql-snow .ql-tooltip[data-mode=link]::before': {\r\n content: '\"Ange länk:\"',\r\n },\r\n '.ql-snow .ql-tooltip::before': {\r\n content: '\"Besök URL:\"',\r\n },\r\n '.ql-snow .ql-tooltip a.ql-action::after': {\r\n content: '\"Ändra\"',\r\n },\r\n '.ql-snow .ql-tooltip a.ql-remove::before': {\r\n content: '\"Ta bort\"',\r\n },\r\n },\r\n});\r\n"],"names":["TextEditor","svg","button","input","content"],"mappings":";;;;+BAAaA;;;eAAAA;;;AAAN,MAAMA,aAAa,IAAO,CAAA;QAC/B,kBAAkB;YAChB,uBAAuB;gBACrB,oGAAoG,CAAC;gBACrG,cAAc;oBACZ,8BAA8B,CAAC;gBACjC;gBACA,YAAY;oBACV,4BAA4B,CAAC;gBAC/B;gBACA,eAAe;oBACb,uDAAuD,CAAC;gBAC1D;gBACA,sBAAsB;oBACpB,kJACE,CAAC;gBACL;gBACA,eAAe;oBACb,iCAAiC,CAAC;gBACpC;gBAEAC,KAAK;oBACH,gCAAgC,CAAC;gBACnC;gBAEAC,QAAQ;oBACN,6DAA6D,CAAC;oBAC9D,kCAAkC;wBAChC,oCAAoC,CAAC;oBACvC;oBACA,mBAAmB;wBACjB,+EAA+E,CAAC;oBAClF;oBAEA,eAAe;wBACb,oCAAoC,CAAC;wBACrC,YAAY;4BACV,4BAA4B,CAAC;wBAC/B;wBACA,cAAc;4BACZ,8BAA8B,CAAC;wBACjC;oBACF;oBACA,8CAA8C;wBAC5C,4BAA4B,CAAC;oBAC/B;oBACA,kDAAkD;wBAChD,8BAA8B,CAAC;oBACjC;oBACA,kEAAkE;wBAChE,8BAA8B,CAAC;oBACjC;gBACF;gBAEA,iBAAiB;oBACf,8CAA8C,CAAC;oBAC/C,YAAY;wBACV,6BAA6B,CAAC;oBAChC;oBACA,cAAc;wBACZ,+BAA+B,CAAC;oBAClC;oBACAA,QAAQ;wBACN,8DAA8D,CAAC;wBAC/D,eAAe;4BACb,+CAA+C,CAAC;wBAClD;wBACA,WAAW;4BACT,+CAA+C,CAAC;wBAClD;wBACA,oBAAoB;4BAClB,6BAA6B,CAAC;wBAChC;wBACA,sBAAsB;4BACpB,+BAA+B,CAAC;wBAClC;wBACA,8BAA8B;4BAC5B,2BAA2B,CAAC;wBAC9B;oBACF;gBACF;YACF;YAEA,yBAAyB;gBACvB,kDAAkD,CAAC;gBACnD,kBAAkB;oBAChB,sEAAsE,CAAC;gBACzE;gBACA,qBAAqB;oBACnB,uBAAuB,CAAC;oBACxB,kBAAkB;wBAChB,uBAAuB,CAAC;oBAC1B;gBACF;gBACA,iBAAiB;oBACf,8EAA8E,CAAC;gBACjF;YACF;YAEA,eAAe;YACf,0BAA0B;gBACxBC,OAAO;oBACL,oBAAoB,CAAC;oBACrB,mBAAmB;wBACjB,oBAAoB,CAAC;oBACvB;gBACF;YACF;YACA,sDAAsD;gBACpDC,SAAS;YACX;YACA,gDAAgD;gBAC9CA,SAAS;YACX;YACA,gCAAgC;gBAC9BA,SAAS;YACX;YACA,2CAA2C;gBACzCA,SAAS;YACX;YACA,4CAA4C;gBAC1CA,SAAS;YACX;QACF;IACF,CAAA"}
1
+ {"version":3,"sources":["../../../src/components/text-editor.ts"],"sourcesContent":["export const TextEditor = () => ({\r\n '.sk-texteditor': {\r\n '@apply relative': {},\r\n '.ql-toolbar.ql-snow': {\r\n '@apply flex items-center bg-background-200 rounded-t-xl border-input-field-outline h-[4rem] pl-4': {},\r\n '.ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n '.ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '.ql-divider': {\r\n '@apply w-[0.1rem] h-[3.2rem] bg-divider mr-[1.2rem]': {},\r\n },\r\n '.tooltip-container': {\r\n '@apply absolute z-10 top-full mt-0 left-1/2 -translate-x-1/2 invisible opacity-0 transition-opacity duration-200 ease-in-out whitespace-nowrap':\r\n {},\r\n },\r\n '.ql-formats': {\r\n '@apply flex gap-4 mr-[1.2rem]': {},\r\n },\r\n\r\n svg: {\r\n '@apply h-[2.0rem] w-[2.0rem]': {},\r\n },\r\n\r\n button: {\r\n '@apply h-[3.2rem] w-[3.2rem] rounded-10 text-dark-primary': {},\r\n '&:hover, &:hover:focus-visible': {\r\n '@apply bg-tertiary-surface-hover': {},\r\n },\r\n '&:focus-visible': {\r\n '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 bg-background-content': {},\r\n },\r\n\r\n '&.ql-active': {\r\n '@apply bg-tertiary-surface-hover': {},\r\n '.ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '.ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n },\r\n '&:hover .ql-fill, &:focus-visible .ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '&:hover .ql-stroke, &:focus-visible .ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n '&:hover .tooltip-container, &:focus-visible .tooltip-container': {\r\n '@apply visible opacity-100': {},\r\n },\r\n },\r\n\r\n '&.ql-disabled': {\r\n '@apply border-input-field-outline-disabled': {},\r\n '.ql-fill': {\r\n '@apply fill-dark-disabled': {},\r\n },\r\n '.ql-stroke': {\r\n '@apply stroke-dark-disabled': {},\r\n },\r\n button: {\r\n '@apply bg-background-200 text-dark-disabled cursor-default': {},\r\n '&.ql-active': {\r\n '@apply bg-background-200 text-dark-disabled': {},\r\n },\r\n '&:hover': {\r\n '@apply bg-background-200 text-dark-disabled': {},\r\n },\r\n '&:hover .ql-fill': {\r\n '@apply fill-dark-disabled': {},\r\n },\r\n '&:hover .ql-stroke': {\r\n '@apply stroke-dark-disabled': {},\r\n },\r\n '&:hover .tooltip-container': {\r\n '@apply hidden opacity-0': {},\r\n },\r\n },\r\n },\r\n },\r\n\r\n '.ql-container.ql-snow': {\r\n '@apply border-input-field-outline rounded-b-xl': {},\r\n ':focus-visible': {\r\n '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 rounded-b-xl': {},\r\n },\r\n '&.disable-toolbar': {\r\n '@apply rounded-t-xl': {},\r\n ':focus-visible': {\r\n '@apply rounded-t-xl': {},\r\n },\r\n },\r\n '&.ql-disabled': {\r\n '@apply bg-input-field-surface-disabled border-input-field-outline-disabled': {},\r\n },\r\n },\r\n\r\n // Scale controls\r\n '.sk-texteditor-scale': {\r\n '@apply absolute right-2 top-0 h-[4rem] flex items-center gap-2 z-10': {},\r\n },\r\n '.sk-texteditor-scale-button': {\r\n '@apply h-[3.2rem] w-[3.2rem] rounded-10 text-dark-primary flex items-center justify-center': {},\r\n '&:hover': {\r\n '@apply bg-tertiary-surface-hover': {},\r\n },\r\n '&:focus-visible': {\r\n '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 bg-background-content': {},\r\n },\r\n '&:disabled': {\r\n '@apply text-dark-disabled cursor-default': {},\r\n '&:hover': {\r\n '@apply bg-transparent': {},\r\n },\r\n '&:hover .tooltip-container': {\r\n '@apply hidden opacity-0': {},\r\n },\r\n },\r\n '.tooltip-container': {\r\n '@apply absolute z-10 top-full mt-0 left-1/2 -translate-x-1/2 invisible opacity-0 transition-opacity duration-200 ease-in-out whitespace-nowrap':\r\n {},\r\n },\r\n '&:hover .tooltip-container': {\r\n '@apply visible opacity-100': {},\r\n },\r\n },\r\n '.sk-texteditor-scale-label': {\r\n '@apply text-label-small font-thin text-dark-secondary select-none min-w-[3.6rem] text-center': {},\r\n },\r\n\r\n // Tooltip-text\r\n '.ql-tooltip.ql-editing': {\r\n input: {\r\n '@apply rounded-0': {},\r\n '&:focus-visible': {\r\n '@apply rounded-0': {},\r\n },\r\n },\r\n },\r\n '.ql-snow .ql-tooltip.ql-editing a.ql-action::after': {\r\n content: '\"Spara\"',\r\n },\r\n '.ql-snow .ql-tooltip[data-mode=link]::before': {\r\n content: '\"Ange länk:\"',\r\n },\r\n '.ql-snow .ql-tooltip::before': {\r\n content: '\"Besök URL:\"',\r\n },\r\n '.ql-snow .ql-tooltip a.ql-action::after': {\r\n content: '\"Ändra\"',\r\n },\r\n '.ql-snow .ql-tooltip a.ql-remove::before': {\r\n content: '\"Ta bort\"',\r\n },\r\n },\r\n});\r\n"],"names":["TextEditor","svg","button","input","content"],"mappings":";;;;+BAAaA;;;eAAAA;;;AAAN,MAAMA,aAAa,IAAO,CAAA;QAC/B,kBAAkB;YAChB,mBAAmB,CAAC;YACpB,uBAAuB;gBACrB,oGAAoG,CAAC;gBACrG,cAAc;oBACZ,8BAA8B,CAAC;gBACjC;gBACA,YAAY;oBACV,4BAA4B,CAAC;gBAC/B;gBACA,eAAe;oBACb,uDAAuD,CAAC;gBAC1D;gBACA,sBAAsB;oBACpB,kJACE,CAAC;gBACL;gBACA,eAAe;oBACb,iCAAiC,CAAC;gBACpC;gBAEAC,KAAK;oBACH,gCAAgC,CAAC;gBACnC;gBAEAC,QAAQ;oBACN,6DAA6D,CAAC;oBAC9D,kCAAkC;wBAChC,oCAAoC,CAAC;oBACvC;oBACA,mBAAmB;wBACjB,+EAA+E,CAAC;oBAClF;oBAEA,eAAe;wBACb,oCAAoC,CAAC;wBACrC,YAAY;4BACV,4BAA4B,CAAC;wBAC/B;wBACA,cAAc;4BACZ,8BAA8B,CAAC;wBACjC;oBACF;oBACA,8CAA8C;wBAC5C,4BAA4B,CAAC;oBAC/B;oBACA,kDAAkD;wBAChD,8BAA8B,CAAC;oBACjC;oBACA,kEAAkE;wBAChE,8BAA8B,CAAC;oBACjC;gBACF;gBAEA,iBAAiB;oBACf,8CAA8C,CAAC;oBAC/C,YAAY;wBACV,6BAA6B,CAAC;oBAChC;oBACA,cAAc;wBACZ,+BAA+B,CAAC;oBAClC;oBACAA,QAAQ;wBACN,8DAA8D,CAAC;wBAC/D,eAAe;4BACb,+CAA+C,CAAC;wBAClD;wBACA,WAAW;4BACT,+CAA+C,CAAC;wBAClD;wBACA,oBAAoB;4BAClB,6BAA6B,CAAC;wBAChC;wBACA,sBAAsB;4BACpB,+BAA+B,CAAC;wBAClC;wBACA,8BAA8B;4BAC5B,2BAA2B,CAAC;wBAC9B;oBACF;gBACF;YACF;YAEA,yBAAyB;gBACvB,kDAAkD,CAAC;gBACnD,kBAAkB;oBAChB,sEAAsE,CAAC;gBACzE;gBACA,qBAAqB;oBACnB,uBAAuB,CAAC;oBACxB,kBAAkB;wBAChB,uBAAuB,CAAC;oBAC1B;gBACF;gBACA,iBAAiB;oBACf,8EAA8E,CAAC;gBACjF;YACF;YAEA,iBAAiB;YACjB,wBAAwB;gBACtB,uEAAuE,CAAC;YAC1E;YACA,+BAA+B;gBAC7B,8FAA8F,CAAC;gBAC/F,WAAW;oBACT,oCAAoC,CAAC;gBACvC;gBACA,mBAAmB;oBACjB,+EAA+E,CAAC;gBAClF;gBACA,cAAc;oBACZ,4CAA4C,CAAC;oBAC7C,WAAW;wBACT,yBAAyB,CAAC;oBAC5B;oBACA,8BAA8B;wBAC5B,2BAA2B,CAAC;oBAC9B;gBACF;gBACA,sBAAsB;oBACpB,kJACE,CAAC;gBACL;gBACA,8BAA8B;oBAC5B,8BAA8B,CAAC;gBACjC;YACF;YACA,8BAA8B;gBAC5B,gGAAgG,CAAC;YACnG;YAEA,eAAe;YACf,0BAA0B;gBACxBC,OAAO;oBACL,oBAAoB,CAAC;oBACrB,mBAAmB;wBACjB,oBAAoB,CAAC;oBACvB;gBACF;YACF;YACA,sDAAsD;gBACpDC,SAAS;YACX;YACA,gDAAgD;gBAC9CA,SAAS;YACX;YACA,gCAAgC;gBAC9BA,SAAS;YACX;YACA,2CAA2C;gBACzCA,SAAS;YACX;YACA,4CAA4C;gBAC1CA,SAAS;YACX;QACF;IACF,CAAA"}
package/dist/esm/components/file-upload.js CHANGED
@@ -15,10 +15,20 @@ export const FileUpload = ()=>({
15
15
  '&-item': {
16
16
  '@apply self-stretch flex flex-row flex-wrap p-12 rounded-button': {},
17
17
  '@apply gap-y-12': {},
18
+ '@apply transition-transform duration-200 ease-in-out': {},
19
+ '&[data-dragging="true"]': {
20
+ '@apply opacity-50': {}
21
+ },
22
+ '&[data-drag-over="true"]': {
23
+ '@apply translate-x-4': {}
24
+ },
18
25
  '&-innerwrapper': {
19
26
  '@apply w-full': {},
20
27
  '@apply self-stretch items-center list-none flex flex-row gap-y-24 gap-x-12': {}
21
28
  },
29
+ '.sk-form-file-upload-list-item-sort': {
30
+ '@apply flex gap-x-8 items-start': {}
31
+ },
22
32
  '&[data-isedit="true"]': {
23
33
  '.sk-form-file-upload-list-item-innerwrapper': {
24
34
  '@apply flex-col': {},
package/dist/esm/components/file-upload.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/file-upload.ts"],"sourcesContent":["export const FileUpload = () => ({\r\n '.sk-form-file-upload': {\r\n '&-list': {\r\n '@apply flex flex-col py-4 gap-x-12 items-start': {},\r\n '@apply border-divider border-t-1 border-b-1': {},\r\n\r\n '&[data-border=\"true\"]': {\r\n '@apply border-0 py-0 gap-y-12': {},\r\n\r\n '.sk-form-file-upload-list-item': {\r\n '@apply border-1 border-divider': {},\r\n },\r\n },\r\n\r\n 'li[role=\"separator\"]': {\r\n '@apply h-[1px] mt-3 mb-6 py-0 w-full': {},\r\n },\r\n\r\n '&-item': {\r\n '@apply self-stretch flex flex-row flex-wrap p-12 rounded-button': {},\r\n '@apply gap-y-12': {},\r\n\r\n '&-innerwrapper': {\r\n '@apply w-full': {},\r\n '@apply self-stretch items-center list-none flex flex-row gap-y-24 gap-x-12': {},\r\n },\r\n\r\n '&[data-isedit=\"true\"]': {\r\n '.sk-form-file-upload-list-item-innerwrapper': {\r\n '@apply flex-col': {},\r\n '@apply medium-device:flex-row medium-device:items-center': {},\r\n\r\n '.sk-form-file-upload-list-item-icon': {\r\n '@apply hidden': {},\r\n '@apply medium-device:flex': {},\r\n },\r\n },\r\n },\r\n\r\n '&:hover': {\r\n '@apply bg-background-200': {},\r\n },\r\n\r\n '&[data-border=\"true\"]': {\r\n '@apply border-1 border-divider': {},\r\n },\r\n\r\n '&-icon': {\r\n '@apply flex justify-center shrink-0 rounded-utility overflow-hidden': {},\r\n '@apply bg-vattjom-surface-accent': {},\r\n\r\n '@apply w-32 h-32': {},\r\n '.sk-icon': {\r\n '@apply w-full h-full p-[.64rem]': {},\r\n },\r\n\r\n '&[data-size=\"sm\"]': {\r\n '@apply w-32 h-32': {},\r\n '.sk-icon': {\r\n '@apply p-[.64rem]': {},\r\n },\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply medium-device:w-44 medium-device:h-44': {},\r\n '.sk-icon': {\r\n '@apply medium-device:p-[.88rem]': {},\r\n },\r\n },\r\n },\r\n\r\n '&-content': {\r\n '@apply grow flex flex-col justify-start gap-y-24': {},\r\n '@apply medium-device:grid medium-device:grid-flow-col medium-device:auto-cols-fr medium-device:items-center':\r\n {},\r\n\r\n '& > *': {\r\n '@apply grow shrink basis-auto': {},\r\n },\r\n\r\n '&-name': {\r\n '@apply flex flex-col items-start gap-2': {},\r\n '&[data-size=\"sm\"]': {\r\n '.sk-form-file-upload-list-item-content-name-description': {\r\n '@apply hidden': {},\r\n },\r\n },\r\n\r\n '&-input-wrapper': {\r\n '@apply flex items-center': {},\r\n\r\n '.sk-form-input': {\r\n '@apply grow': {},\r\n },\r\n },\r\n\r\n '&-ending': {\r\n '@apply ml-8': {},\r\n },\r\n\r\n '&-heading': {\r\n '@apply text-base font-bold leading-24': {},\r\n },\r\n\r\n '&-description': {\r\n '@apply text-small': {},\r\n },\r\n },\r\n },\r\n\r\n '&-actions': {\r\n '@apply flex gap-12 items-center': {},\r\n '&-more': {\r\n '&-wrapper': {\r\n '@apply relative': {},\r\n },\r\n },\r\n '&-remove-tooltip': {\r\n '@apply absolute bottom-full mb-6 hidden z-20 left-1/2 -translate-x-1/2 whitespace-nowrap': {},\r\n '.group:hover &': {\r\n '@apply block': {},\r\n },\r\n },\r\n },\r\n\r\n '.sk-form-error-message': {\r\n '@apply text-error': {},\r\n },\r\n\r\n '.sk-form-control': {\r\n '@apply w-full medium-device:w-fit': {},\r\n\r\n '.sk-form-select,.sk-form-input': {\r\n '@apply w-full medium-device:w-fit': {},\r\n },\r\n },\r\n\r\n '&-progress': {\r\n '@apply w-full flex gap-x-md items-center': {},\r\n\r\n '&-bar': {\r\n '@apply w-full h-[0.4rem] bg-background-color-mixin-2 rounded-circular overflow-hidden': {},\r\n\r\n '&-amount': {\r\n '@apply h-full bg-primary-surface w-0 transition-[width_.3s_ease]': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&-area': {\r\n '&[data-relativity=\"viewport\"]': {\r\n '.sk-form-file-upload-area-overlay': {\r\n '@apply fixed': {},\r\n },\r\n },\r\n\r\n '&[data-relativity=\"component\"]': {\r\n '@apply relative inline-flex': {},\r\n '.sk-form-file-upload-area-overlay': {\r\n '@apply absolute': {},\r\n },\r\n },\r\n\r\n '&-overlay': {\r\n '@apply fixed z-overlay': {},\r\n '@apply top-0 bottom-0 left-0 right-0 p-32 rounded-groups': {},\r\n '@apply bg-primitives-overlay-darken-6': {},\r\n '@apply border-2 border-gronsta-text-primary': {},\r\n '@apply hidden': {},\r\n\r\n '&[data-isdragging]': {\r\n '@apply block': {},\r\n },\r\n\r\n '&-content': {\r\n '@apply w-full h-full': {},\r\n '@apply rounded-6 border-dashed border-2 border-gronsta-text-primary': {},\r\n '@apply flex items-center justify-center': {},\r\n '@apply text-gronsta-text-primary': {},\r\n\r\n '&-icon': {\r\n '&-wrapper': {\r\n '@apply rounded-full bg-gronsta-surface-accent p-16 h-40 w-40 md:h-[8rem] md:w-[8rem] xl:h-[12rem] xl:w-[12rem]':\r\n {},\r\n\r\n '.sk-icon': {\r\n '@apply w-full h-full': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&-modal': {\r\n '@apply medium-device:w-[78rem]': {},\r\n\r\n '&-labels': {\r\n '@apply hidden': {},\r\n '@apply medium-device:grid medium-device:grid-cols-2': {},\r\n '@apply text-small font-bold': {},\r\n '@apply mt-12 mb-8': {},\r\n },\r\n\r\n '&-button': {\r\n '&-wrapper': {\r\n '@apply flex items-center gap-8 mb-32': {},\r\n },\r\n },\r\n },\r\n '&-field &-area': {\r\n '@apply w-full h-full': {},\r\n\r\n '&-children': {\r\n '@apply w-full h-full': {},\r\n },\r\n },\r\n '&-field': {\r\n '@apply w-fit': {},\r\n\r\n '&[data-variant=\"horizontal\"] &-button': {\r\n '@apply flex flex-row p-24 justify-center items-center gap-16': {},\r\n },\r\n\r\n '&[data-variant=\"vertical\"] &-button': {\r\n '@apply flex flex-col p-24 justify-center items-center gap-18': {},\r\n\r\n '.sk-form-file-upload-field-button-content': {\r\n '@apply items-center': {},\r\n\r\n '&-restrictions': {\r\n '@apply items-center text-center': {},\r\n\r\n '&-mimetypes': {\r\n '@apply text-center': {},\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&:hover &-button': {\r\n '@apply bg-vattjom-background-200 border-solid': {},\r\n },\r\n\r\n '&[data-invalid=\"true\"] &-button': {\r\n '@apply bg-error-background-100 border-solid border-error': {},\r\n },\r\n\r\n '&-button': {\r\n '@apply w-full h-full grow shrink-0 basis-0 self-stretch': {},\r\n '@apply rounded-groups border-vattjom-surface-primary border-dashed border-1 bg-vattjom-background-100': {},\r\n\r\n '&-icon': {\r\n '.sk-icon': {\r\n '@apply w-32 h-32': {},\r\n },\r\n },\r\n '&-content': {\r\n '@apply flex flex-col items-start gap-y-4': {},\r\n '&-restrictions': {\r\n '@apply flex flex-col items-start': {},\r\n '@apply text-small text-dark-secondary': {},\r\n\r\n '&-mimetypes': {\r\n '@apply text-start line-clamp-1 max-w-[25rem]': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n },\r\n});\r\n"],"names":["FileUpload"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/components/file-upload.ts"],"sourcesContent":["export const FileUpload = () => ({\r\n '.sk-form-file-upload': {\r\n '&-list': {\r\n '@apply flex flex-col py-4 gap-x-12 items-start': {},\r\n '@apply border-divider border-t-1 border-b-1': {},\r\n\r\n '&[data-border=\"true\"]': {\r\n '@apply border-0 py-0 gap-y-12': {},\r\n\r\n '.sk-form-file-upload-list-item': {\r\n '@apply border-1 border-divider': {},\r\n },\r\n },\r\n\r\n 'li[role=\"separator\"]': {\r\n '@apply h-[1px] mt-3 mb-6 py-0 w-full': {},\r\n },\r\n\r\n '&-item': {\r\n '@apply self-stretch flex flex-row flex-wrap p-12 rounded-button': {},\r\n '@apply gap-y-12': {},\r\n '@apply transition-transform duration-200 ease-in-out': {},\r\n\r\n '&[data-dragging=\"true\"]': {\r\n '@apply opacity-50': {},\r\n },\r\n\r\n '&[data-drag-over=\"true\"]': {\r\n '@apply translate-x-4': {},\r\n },\r\n\r\n\r\n '&-innerwrapper': {\r\n '@apply w-full': {},\r\n '@apply self-stretch items-center list-none flex flex-row gap-y-24 gap-x-12': {},\r\n },\r\n\r\n '.sk-form-file-upload-list-item-sort': {\r\n '@apply flex gap-x-8 items-start': {},\r\n },\r\n\r\n '&[data-isedit=\"true\"]': {\r\n '.sk-form-file-upload-list-item-innerwrapper': {\r\n '@apply flex-col': {},\r\n '@apply medium-device:flex-row medium-device:items-center': {},\r\n\r\n '.sk-form-file-upload-list-item-icon': {\r\n '@apply hidden': {},\r\n '@apply medium-device:flex': {},\r\n },\r\n },\r\n },\r\n\r\n '&:hover': {\r\n '@apply bg-background-200': {},\r\n },\r\n\r\n '&[data-border=\"true\"]': {\r\n '@apply border-1 border-divider': {},\r\n },\r\n\r\n '&-icon': {\r\n '@apply flex justify-center shrink-0 rounded-utility overflow-hidden': {},\r\n '@apply bg-vattjom-surface-accent': {},\r\n\r\n '@apply w-32 h-32': {},\r\n '.sk-icon': {\r\n '@apply w-full h-full p-[.64rem]': {},\r\n },\r\n\r\n '&[data-size=\"sm\"]': {\r\n '@apply w-32 h-32': {},\r\n '.sk-icon': {\r\n '@apply p-[.64rem]': {},\r\n },\r\n },\r\n '&[data-size=\"md\"]': {\r\n '@apply medium-device:w-44 medium-device:h-44': {},\r\n '.sk-icon': {\r\n '@apply medium-device:p-[.88rem]': {},\r\n },\r\n },\r\n },\r\n\r\n '&-content': {\r\n '@apply grow flex flex-col justify-start gap-y-24': {},\r\n '@apply medium-device:grid medium-device:grid-flow-col medium-device:auto-cols-fr medium-device:items-center':\r\n {},\r\n\r\n '& > *': {\r\n '@apply grow shrink basis-auto': {},\r\n },\r\n\r\n '&-name': {\r\n '@apply flex flex-col items-start gap-2': {},\r\n '&[data-size=\"sm\"]': {\r\n '.sk-form-file-upload-list-item-content-name-description': {\r\n '@apply hidden': {},\r\n },\r\n },\r\n\r\n '&-input-wrapper': {\r\n '@apply flex items-center': {},\r\n\r\n '.sk-form-input': {\r\n '@apply grow': {},\r\n },\r\n },\r\n\r\n '&-ending': {\r\n '@apply ml-8': {},\r\n },\r\n\r\n '&-heading': {\r\n '@apply text-base font-bold leading-24': {},\r\n },\r\n\r\n '&-description': {\r\n '@apply text-small': {},\r\n },\r\n },\r\n },\r\n\r\n '&-actions': {\r\n '@apply flex gap-12 items-center': {},\r\n '&-more': {\r\n '&-wrapper': {\r\n '@apply relative': {},\r\n },\r\n },\r\n '&-remove-tooltip': {\r\n '@apply absolute bottom-full mb-6 hidden z-20 left-1/2 -translate-x-1/2 whitespace-nowrap': {},\r\n '.group:hover &': {\r\n '@apply block': {},\r\n },\r\n },\r\n },\r\n\r\n '.sk-form-error-message': {\r\n '@apply text-error': {},\r\n },\r\n\r\n '.sk-form-control': {\r\n '@apply w-full medium-device:w-fit': {},\r\n\r\n '.sk-form-select,.sk-form-input': {\r\n '@apply w-full medium-device:w-fit': {},\r\n },\r\n },\r\n\r\n '&-progress': {\r\n '@apply w-full flex gap-x-md items-center': {},\r\n\r\n '&-bar': {\r\n '@apply w-full h-[0.4rem] bg-background-color-mixin-2 rounded-circular overflow-hidden': {},\r\n\r\n '&-amount': {\r\n '@apply h-full bg-primary-surface w-0 transition-[width_.3s_ease]': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&-area': {\r\n '&[data-relativity=\"viewport\"]': {\r\n '.sk-form-file-upload-area-overlay': {\r\n '@apply fixed': {},\r\n },\r\n },\r\n\r\n '&[data-relativity=\"component\"]': {\r\n '@apply relative inline-flex': {},\r\n '.sk-form-file-upload-area-overlay': {\r\n '@apply absolute': {},\r\n },\r\n },\r\n\r\n '&-overlay': {\r\n '@apply fixed z-overlay': {},\r\n '@apply top-0 bottom-0 left-0 right-0 p-32 rounded-groups': {},\r\n '@apply bg-primitives-overlay-darken-6': {},\r\n '@apply border-2 border-gronsta-text-primary': {},\r\n '@apply hidden': {},\r\n\r\n '&[data-isdragging]': {\r\n '@apply block': {},\r\n },\r\n\r\n '&-content': {\r\n '@apply w-full h-full': {},\r\n '@apply rounded-6 border-dashed border-2 border-gronsta-text-primary': {},\r\n '@apply flex items-center justify-center': {},\r\n '@apply text-gronsta-text-primary': {},\r\n\r\n '&-icon': {\r\n '&-wrapper': {\r\n '@apply rounded-full bg-gronsta-surface-accent p-16 h-40 w-40 md:h-[8rem] md:w-[8rem] xl:h-[12rem] xl:w-[12rem]':\r\n {},\r\n\r\n '.sk-icon': {\r\n '@apply w-full h-full': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&-modal': {\r\n '@apply medium-device:w-[78rem]': {},\r\n\r\n '&-labels': {\r\n '@apply hidden': {},\r\n '@apply medium-device:grid medium-device:grid-cols-2': {},\r\n '@apply text-small font-bold': {},\r\n '@apply mt-12 mb-8': {},\r\n },\r\n\r\n '&-button': {\r\n '&-wrapper': {\r\n '@apply flex items-center gap-8 mb-32': {},\r\n },\r\n },\r\n },\r\n '&-field &-area': {\r\n '@apply w-full h-full': {},\r\n\r\n '&-children': {\r\n '@apply w-full h-full': {},\r\n },\r\n },\r\n '&-field': {\r\n '@apply w-fit': {},\r\n\r\n '&[data-variant=\"horizontal\"] &-button': {\r\n '@apply flex flex-row p-24 justify-center items-center gap-16': {},\r\n },\r\n\r\n '&[data-variant=\"vertical\"] &-button': {\r\n '@apply flex flex-col p-24 justify-center items-center gap-18': {},\r\n\r\n '.sk-form-file-upload-field-button-content': {\r\n '@apply items-center': {},\r\n\r\n '&-restrictions': {\r\n '@apply items-center text-center': {},\r\n\r\n '&-mimetypes': {\r\n '@apply text-center': {},\r\n },\r\n },\r\n },\r\n },\r\n\r\n '&:hover &-button': {\r\n '@apply bg-vattjom-background-200 border-solid': {},\r\n },\r\n\r\n '&[data-invalid=\"true\"] &-button': {\r\n '@apply bg-error-background-100 border-solid border-error': {},\r\n },\r\n\r\n '&-button': {\r\n '@apply w-full h-full grow shrink-0 basis-0 self-stretch': {},\r\n '@apply rounded-groups border-vattjom-surface-primary border-dashed border-1 bg-vattjom-background-100': {},\r\n\r\n '&-icon': {\r\n '.sk-icon': {\r\n '@apply w-32 h-32': {},\r\n },\r\n },\r\n '&-content': {\r\n '@apply flex flex-col items-start gap-y-4': {},\r\n '&-restrictions': {\r\n '@apply flex flex-col items-start': {},\r\n '@apply text-small text-dark-secondary': {},\r\n\r\n '&-mimetypes': {\r\n '@apply text-start line-clamp-1 max-w-[25rem]': {},\r\n },\r\n },\r\n },\r\n },\r\n },\r\n },\r\n});\r\n"],"names":["FileUpload"],"mappings":"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"}
package/dist/esm/components/text-editor.js CHANGED
@@ -1,5 +1,6 @@
1
1
  export const TextEditor = ()=>({
2
2
  '.sk-texteditor': {
3
+ '@apply relative': {},
3
4
  '.ql-toolbar.ql-snow': {
4
5
  '@apply flex items-center bg-background-200 rounded-t-xl border-input-field-outline h-[4rem] pl-4': {},
5
6
  '.ql-stroke': {
@@ -90,6 +91,37 @@ export const TextEditor = ()=>({
90
91
  '@apply bg-input-field-surface-disabled border-input-field-outline-disabled': {}
91
92
  }
92
93
  },
94
+ // Scale controls
95
+ '.sk-texteditor-scale': {
96
+ '@apply absolute right-2 top-0 h-[4rem] flex items-center gap-2 z-10': {}
97
+ },
98
+ '.sk-texteditor-scale-button': {
99
+ '@apply h-[3.2rem] w-[3.2rem] rounded-10 text-dark-primary flex items-center justify-center': {},
100
+ '&:hover': {
101
+ '@apply bg-tertiary-surface-hover': {}
102
+ },
103
+ '&:focus-visible': {
104
+ '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 bg-background-content': {}
105
+ },
106
+ '&:disabled': {
107
+ '@apply text-dark-disabled cursor-default': {},
108
+ '&:hover': {
109
+ '@apply bg-transparent': {}
110
+ },
111
+ '&:hover .tooltip-container': {
112
+ '@apply hidden opacity-0': {}
113
+ }
114
+ },
115
+ '.tooltip-container': {
116
+ '@apply absolute z-10 top-full mt-0 left-1/2 -translate-x-1/2 invisible opacity-0 transition-opacity duration-200 ease-in-out whitespace-nowrap': {}
117
+ },
118
+ '&:hover .tooltip-container': {
119
+ '@apply visible opacity-100': {}
120
+ }
121
+ },
122
+ '.sk-texteditor-scale-label': {
123
+ '@apply text-label-small font-thin text-dark-secondary select-none min-w-[3.6rem] text-center': {}
124
+ },
93
125
  // Tooltip-text
94
126
  '.ql-tooltip.ql-editing': {
95
127
  input: {
package/dist/esm/components/text-editor.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/components/text-editor.ts"],"sourcesContent":["export const TextEditor = () => ({\r\n '.sk-texteditor': {\r\n '.ql-toolbar.ql-snow': {\r\n '@apply flex items-center bg-background-200 rounded-t-xl border-input-field-outline h-[4rem] pl-4': {},\r\n '.ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n '.ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '.ql-divider': {\r\n '@apply w-[0.1rem] h-[3.2rem] bg-divider mr-[1.2rem]': {},\r\n },\r\n '.tooltip-container': {\r\n '@apply absolute z-10 top-full mt-0 left-1/2 -translate-x-1/2 invisible opacity-0 transition-opacity duration-200 ease-in-out whitespace-nowrap':\r\n {},\r\n },\r\n '.ql-formats': {\r\n '@apply flex gap-4 mr-[1.2rem]': {},\r\n },\r\n\r\n svg: {\r\n '@apply h-[2.0rem] w-[2.0rem]': {},\r\n },\r\n\r\n button: {\r\n '@apply h-[3.2rem] w-[3.2rem] rounded-10 text-dark-primary': {},\r\n '&:hover, &:hover:focus-visible': {\r\n '@apply bg-tertiary-surface-hover': {},\r\n },\r\n '&:focus-visible': {\r\n '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 bg-background-content': {},\r\n },\r\n\r\n '&.ql-active': {\r\n '@apply bg-tertiary-surface-hover': {},\r\n '.ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '.ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n },\r\n '&:hover .ql-fill, &:focus-visible .ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '&:hover .ql-stroke, &:focus-visible .ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n '&:hover .tooltip-container, &:focus-visible .tooltip-container': {\r\n '@apply visible opacity-100': {},\r\n },\r\n },\r\n\r\n '&.ql-disabled': {\r\n '@apply border-input-field-outline-disabled': {},\r\n '.ql-fill': {\r\n '@apply fill-dark-disabled': {},\r\n },\r\n '.ql-stroke': {\r\n '@apply stroke-dark-disabled': {},\r\n },\r\n button: {\r\n '@apply bg-background-200 text-dark-disabled cursor-default': {},\r\n '&.ql-active': {\r\n '@apply bg-background-200 text-dark-disabled': {},\r\n },\r\n '&:hover': {\r\n '@apply bg-background-200 text-dark-disabled': {},\r\n },\r\n '&:hover .ql-fill': {\r\n '@apply fill-dark-disabled': {},\r\n },\r\n '&:hover .ql-stroke': {\r\n '@apply stroke-dark-disabled': {},\r\n },\r\n '&:hover .tooltip-container': {\r\n '@apply hidden opacity-0': {},\r\n },\r\n },\r\n },\r\n },\r\n\r\n '.ql-container.ql-snow': {\r\n '@apply border-input-field-outline rounded-b-xl': {},\r\n ':focus-visible': {\r\n '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 rounded-b-xl': {},\r\n },\r\n '&.disable-toolbar': {\r\n '@apply rounded-t-xl': {},\r\n ':focus-visible': {\r\n '@apply rounded-t-xl': {},\r\n },\r\n },\r\n '&.ql-disabled': {\r\n '@apply bg-input-field-surface-disabled border-input-field-outline-disabled': {},\r\n },\r\n },\r\n\r\n // Tooltip-text\r\n '.ql-tooltip.ql-editing': {\r\n input: {\r\n '@apply rounded-0': {},\r\n '&:focus-visible': {\r\n '@apply rounded-0': {},\r\n },\r\n },\r\n },\r\n '.ql-snow .ql-tooltip.ql-editing a.ql-action::after': {\r\n content: '\"Spara\"',\r\n },\r\n '.ql-snow .ql-tooltip[data-mode=link]::before': {\r\n content: '\"Ange länk:\"',\r\n },\r\n '.ql-snow .ql-tooltip::before': {\r\n content: '\"Besök URL:\"',\r\n },\r\n '.ql-snow .ql-tooltip a.ql-action::after': {\r\n content: '\"Ändra\"',\r\n },\r\n '.ql-snow .ql-tooltip a.ql-remove::before': {\r\n content: '\"Ta bort\"',\r\n },\r\n },\r\n});\r\n"],"names":["TextEditor","svg","button","input","content"],"mappings":"AAAA,OAAO,MAAMA,aAAa,IAAO,CAAA;QAC/B,kBAAkB;YAChB,uBAAuB;gBACrB,oGAAoG,CAAC;gBACrG,cAAc;oBACZ,8BAA8B,CAAC;gBACjC;gBACA,YAAY;oBACV,4BAA4B,CAAC;gBAC/B;gBACA,eAAe;oBACb,uDAAuD,CAAC;gBAC1D;gBACA,sBAAsB;oBACpB,kJACE,CAAC;gBACL;gBACA,eAAe;oBACb,iCAAiC,CAAC;gBACpC;gBAEAC,KAAK;oBACH,gCAAgC,CAAC;gBACnC;gBAEAC,QAAQ;oBACN,6DAA6D,CAAC;oBAC9D,kCAAkC;wBAChC,oCAAoC,CAAC;oBACvC;oBACA,mBAAmB;wBACjB,+EAA+E,CAAC;oBAClF;oBAEA,eAAe;wBACb,oCAAoC,CAAC;wBACrC,YAAY;4BACV,4BAA4B,CAAC;wBAC/B;wBACA,cAAc;4BACZ,8BAA8B,CAAC;wBACjC;oBACF;oBACA,8CAA8C;wBAC5C,4BAA4B,CAAC;oBAC/B;oBACA,kDAAkD;wBAChD,8BAA8B,CAAC;oBACjC;oBACA,kEAAkE;wBAChE,8BAA8B,CAAC;oBACjC;gBACF;gBAEA,iBAAiB;oBACf,8CAA8C,CAAC;oBAC/C,YAAY;wBACV,6BAA6B,CAAC;oBAChC;oBACA,cAAc;wBACZ,+BAA+B,CAAC;oBAClC;oBACAA,QAAQ;wBACN,8DAA8D,CAAC;wBAC/D,eAAe;4BACb,+CAA+C,CAAC;wBAClD;wBACA,WAAW;4BACT,+CAA+C,CAAC;wBAClD;wBACA,oBAAoB;4BAClB,6BAA6B,CAAC;wBAChC;wBACA,sBAAsB;4BACpB,+BAA+B,CAAC;wBAClC;wBACA,8BAA8B;4BAC5B,2BAA2B,CAAC;wBAC9B;oBACF;gBACF;YACF;YAEA,yBAAyB;gBACvB,kDAAkD,CAAC;gBACnD,kBAAkB;oBAChB,sEAAsE,CAAC;gBACzE;gBACA,qBAAqB;oBACnB,uBAAuB,CAAC;oBACxB,kBAAkB;wBAChB,uBAAuB,CAAC;oBAC1B;gBACF;gBACA,iBAAiB;oBACf,8EAA8E,CAAC;gBACjF;YACF;YAEA,eAAe;YACf,0BAA0B;gBACxBC,OAAO;oBACL,oBAAoB,CAAC;oBACrB,mBAAmB;wBACjB,oBAAoB,CAAC;oBACvB;gBACF;YACF;YACA,sDAAsD;gBACpDC,SAAS;YACX;YACA,gDAAgD;gBAC9CA,SAAS;YACX;YACA,gCAAgC;gBAC9BA,SAAS;YACX;YACA,2CAA2C;gBACzCA,SAAS;YACX;YACA,4CAA4C;gBAC1CA,SAAS;YACX;QACF;IACF,CAAA,EAAG"}
1
+ {"version":3,"sources":["../../../src/components/text-editor.ts"],"sourcesContent":["export const TextEditor = () => ({\r\n '.sk-texteditor': {\r\n '@apply relative': {},\r\n '.ql-toolbar.ql-snow': {\r\n '@apply flex items-center bg-background-200 rounded-t-xl border-input-field-outline h-[4rem] pl-4': {},\r\n '.ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n '.ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '.ql-divider': {\r\n '@apply w-[0.1rem] h-[3.2rem] bg-divider mr-[1.2rem]': {},\r\n },\r\n '.tooltip-container': {\r\n '@apply absolute z-10 top-full mt-0 left-1/2 -translate-x-1/2 invisible opacity-0 transition-opacity duration-200 ease-in-out whitespace-nowrap':\r\n {},\r\n },\r\n '.ql-formats': {\r\n '@apply flex gap-4 mr-[1.2rem]': {},\r\n },\r\n\r\n svg: {\r\n '@apply h-[2.0rem] w-[2.0rem]': {},\r\n },\r\n\r\n button: {\r\n '@apply h-[3.2rem] w-[3.2rem] rounded-10 text-dark-primary': {},\r\n '&:hover, &:hover:focus-visible': {\r\n '@apply bg-tertiary-surface-hover': {},\r\n },\r\n '&:focus-visible': {\r\n '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 bg-background-content': {},\r\n },\r\n\r\n '&.ql-active': {\r\n '@apply bg-tertiary-surface-hover': {},\r\n '.ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '.ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n },\r\n '&:hover .ql-fill, &:focus-visible .ql-fill': {\r\n '@apply fill-dark-primary': {},\r\n },\r\n '&:hover .ql-stroke, &:focus-visible .ql-stroke': {\r\n '@apply stroke-dark-primary': {},\r\n },\r\n '&:hover .tooltip-container, &:focus-visible .tooltip-container': {\r\n '@apply visible opacity-100': {},\r\n },\r\n },\r\n\r\n '&.ql-disabled': {\r\n '@apply border-input-field-outline-disabled': {},\r\n '.ql-fill': {\r\n '@apply fill-dark-disabled': {},\r\n },\r\n '.ql-stroke': {\r\n '@apply stroke-dark-disabled': {},\r\n },\r\n button: {\r\n '@apply bg-background-200 text-dark-disabled cursor-default': {},\r\n '&.ql-active': {\r\n '@apply bg-background-200 text-dark-disabled': {},\r\n },\r\n '&:hover': {\r\n '@apply bg-background-200 text-dark-disabled': {},\r\n },\r\n '&:hover .ql-fill': {\r\n '@apply fill-dark-disabled': {},\r\n },\r\n '&:hover .ql-stroke': {\r\n '@apply stroke-dark-disabled': {},\r\n },\r\n '&:hover .tooltip-container': {\r\n '@apply hidden opacity-0': {},\r\n },\r\n },\r\n },\r\n },\r\n\r\n '.ql-container.ql-snow': {\r\n '@apply border-input-field-outline rounded-b-xl': {},\r\n ':focus-visible': {\r\n '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 rounded-b-xl': {},\r\n },\r\n '&.disable-toolbar': {\r\n '@apply rounded-t-xl': {},\r\n ':focus-visible': {\r\n '@apply rounded-t-xl': {},\r\n },\r\n },\r\n '&.ql-disabled': {\r\n '@apply bg-input-field-surface-disabled border-input-field-outline-disabled': {},\r\n },\r\n },\r\n\r\n // Scale controls\r\n '.sk-texteditor-scale': {\r\n '@apply absolute right-2 top-0 h-[4rem] flex items-center gap-2 z-10': {},\r\n },\r\n '.sk-texteditor-scale-button': {\r\n '@apply h-[3.2rem] w-[3.2rem] rounded-10 text-dark-primary flex items-center justify-center': {},\r\n '&:hover': {\r\n '@apply bg-tertiary-surface-hover': {},\r\n },\r\n '&:focus-visible': {\r\n '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 bg-background-content': {},\r\n },\r\n '&:disabled': {\r\n '@apply text-dark-disabled cursor-default': {},\r\n '&:hover': {\r\n '@apply bg-transparent': {},\r\n },\r\n '&:hover .tooltip-container': {\r\n '@apply hidden opacity-0': {},\r\n },\r\n },\r\n '.tooltip-container': {\r\n '@apply absolute z-10 top-full mt-0 left-1/2 -translate-x-1/2 invisible opacity-0 transition-opacity duration-200 ease-in-out whitespace-nowrap':\r\n {},\r\n },\r\n '&:hover .tooltip-container': {\r\n '@apply visible opacity-100': {},\r\n },\r\n },\r\n '.sk-texteditor-scale-label': {\r\n '@apply text-label-small font-thin text-dark-secondary select-none min-w-[3.6rem] text-center': {},\r\n },\r\n\r\n // Tooltip-text\r\n '.ql-tooltip.ql-editing': {\r\n input: {\r\n '@apply rounded-0': {},\r\n '&:focus-visible': {\r\n '@apply rounded-0': {},\r\n },\r\n },\r\n },\r\n '.ql-snow .ql-tooltip.ql-editing a.ql-action::after': {\r\n content: '\"Spara\"',\r\n },\r\n '.ql-snow .ql-tooltip[data-mode=link]::before': {\r\n content: '\"Ange länk:\"',\r\n },\r\n '.ql-snow .ql-tooltip::before': {\r\n content: '\"Besök URL:\"',\r\n },\r\n '.ql-snow .ql-tooltip a.ql-action::after': {\r\n content: '\"Ändra\"',\r\n },\r\n '.ql-snow .ql-tooltip a.ql-remove::before': {\r\n content: '\"Ta bort\"',\r\n },\r\n },\r\n});\r\n"],"names":["TextEditor","svg","button","input","content"],"mappings":"AAAA,OAAO,MAAMA,aAAa,IAAO,CAAA;QAC/B,kBAAkB;YAChB,mBAAmB,CAAC;YACpB,uBAAuB;gBACrB,oGAAoG,CAAC;gBACrG,cAAc;oBACZ,8BAA8B,CAAC;gBACjC;gBACA,YAAY;oBACV,4BAA4B,CAAC;gBAC/B;gBACA,eAAe;oBACb,uDAAuD,CAAC;gBAC1D;gBACA,sBAAsB;oBACpB,kJACE,CAAC;gBACL;gBACA,eAAe;oBACb,iCAAiC,CAAC;gBACpC;gBAEAC,KAAK;oBACH,gCAAgC,CAAC;gBACnC;gBAEAC,QAAQ;oBACN,6DAA6D,CAAC;oBAC9D,kCAAkC;wBAChC,oCAAoC,CAAC;oBACvC;oBACA,mBAAmB;wBACjB,+EAA+E,CAAC;oBAClF;oBAEA,eAAe;wBACb,oCAAoC,CAAC;wBACrC,YAAY;4BACV,4BAA4B,CAAC;wBAC/B;wBACA,cAAc;4BACZ,8BAA8B,CAAC;wBACjC;oBACF;oBACA,8CAA8C;wBAC5C,4BAA4B,CAAC;oBAC/B;oBACA,kDAAkD;wBAChD,8BAA8B,CAAC;oBACjC;oBACA,kEAAkE;wBAChE,8BAA8B,CAAC;oBACjC;gBACF;gBAEA,iBAAiB;oBACf,8CAA8C,CAAC;oBAC/C,YAAY;wBACV,6BAA6B,CAAC;oBAChC;oBACA,cAAc;wBACZ,+BAA+B,CAAC;oBAClC;oBACAA,QAAQ;wBACN,8DAA8D,CAAC;wBAC/D,eAAe;4BACb,+CAA+C,CAAC;wBAClD;wBACA,WAAW;4BACT,+CAA+C,CAAC;wBAClD;wBACA,oBAAoB;4BAClB,6BAA6B,CAAC;wBAChC;wBACA,sBAAsB;4BACpB,+BAA+B,CAAC;wBAClC;wBACA,8BAA8B;4BAC5B,2BAA2B,CAAC;wBAC9B;oBACF;gBACF;YACF;YAEA,yBAAyB;gBACvB,kDAAkD,CAAC;gBACnD,kBAAkB;oBAChB,sEAAsE,CAAC;gBACzE;gBACA,qBAAqB;oBACnB,uBAAuB,CAAC;oBACxB,kBAAkB;wBAChB,uBAAuB,CAAC;oBAC1B;gBACF;gBACA,iBAAiB;oBACf,8EAA8E,CAAC;gBACjF;YACF;YAEA,iBAAiB;YACjB,wBAAwB;gBACtB,uEAAuE,CAAC;YAC1E;YACA,+BAA+B;gBAC7B,8FAA8F,CAAC;gBAC/F,WAAW;oBACT,oCAAoC,CAAC;gBACvC;gBACA,mBAAmB;oBACjB,+EAA+E,CAAC;gBAClF;gBACA,cAAc;oBACZ,4CAA4C,CAAC;oBAC7C,WAAW;wBACT,yBAAyB,CAAC;oBAC5B;oBACA,8BAA8B;wBAC5B,2BAA2B,CAAC;oBAC9B;gBACF;gBACA,sBAAsB;oBACpB,kJACE,CAAC;gBACL;gBACA,8BAA8B;oBAC5B,8BAA8B,CAAC;gBACjC;YACF;YACA,8BAA8B;gBAC5B,gGAAgG,CAAC;YACnG;YAEA,eAAe;YACf,0BAA0B;gBACxBC,OAAO;oBACL,oBAAoB,CAAC;oBACrB,mBAAmB;wBACjB,oBAAoB,CAAC;oBACvB;gBACF;YACF;YACA,sDAAsD;gBACpDC,SAAS;YACX;YACA,gDAAgD;gBAC9CA,SAAS;YACX;YACA,gCAAgC;gBAC9BA,SAAS;YACX;YACA,2CAA2C;gBACzCA,SAAS;YACX;YACA,4CAA4C;gBAC1CA,SAAS;YACX;QACF;IACF,CAAA,EAAG"}
package/dist/types/components/file-upload.d.ts CHANGED
@@ -15,10 +15,20 @@ export declare const FileUpload: () => {
15
15
  '&-item': {
16
16
  '@apply self-stretch flex flex-row flex-wrap p-12 rounded-button': {};
17
17
  '@apply gap-y-12': {};
18
+ '@apply transition-transform duration-200 ease-in-out': {};
19
+ '&[data-dragging="true"]': {
20
+ '@apply opacity-50': {};
21
+ };
22
+ '&[data-drag-over="true"]': {
23
+ '@apply translate-x-4': {};
24
+ };
18
25
  '&-innerwrapper': {
19
26
  '@apply w-full': {};
20
27
  '@apply self-stretch items-center list-none flex flex-row gap-y-24 gap-x-12': {};
21
28
  };
29
+ '.sk-form-file-upload-list-item-sort': {
30
+ '@apply flex gap-x-8 items-start': {};
31
+ };
22
32
  '&[data-isedit="true"]': {
23
33
  '.sk-form-file-upload-list-item-innerwrapper': {
24
34
  '@apply flex-col': {};
package/dist/types/components/text-editor.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  export declare const TextEditor: () => {
2
2
  '.sk-texteditor': {
3
+ '@apply relative': {};
3
4
  '.ql-toolbar.ql-snow': {
4
5
  '@apply flex items-center bg-background-200 rounded-t-xl border-input-field-outline h-[4rem] pl-4': {};
5
6
  '.ql-stroke': {
@@ -90,6 +91,36 @@ export declare const TextEditor: () => {
90
91
  '@apply bg-input-field-surface-disabled border-input-field-outline-disabled': {};
91
92
  };
92
93
  };
94
+ '.sk-texteditor-scale': {
95
+ '@apply absolute right-2 top-0 h-[4rem] flex items-center gap-2 z-10': {};
96
+ };
97
+ '.sk-texteditor-scale-button': {
98
+ '@apply h-[3.2rem] w-[3.2rem] rounded-10 text-dark-primary flex items-center justify-center': {};
99
+ '&:hover': {
100
+ '@apply bg-tertiary-surface-hover': {};
101
+ };
102
+ '&:focus-visible': {
103
+ '@apply ring-[.2rem] ring-ring ring-offset-0 outline-0 bg-background-content': {};
104
+ };
105
+ '&:disabled': {
106
+ '@apply text-dark-disabled cursor-default': {};
107
+ '&:hover': {
108
+ '@apply bg-transparent': {};
109
+ };
110
+ '&:hover .tooltip-container': {
111
+ '@apply hidden opacity-0': {};
112
+ };
113
+ };
114
+ '.tooltip-container': {
115
+ '@apply absolute z-10 top-full mt-0 left-1/2 -translate-x-1/2 invisible opacity-0 transition-opacity duration-200 ease-in-out whitespace-nowrap': {};
116
+ };
117
+ '&:hover .tooltip-container': {
118
+ '@apply visible opacity-100': {};
119
+ };
120
+ };
121
+ '.sk-texteditor-scale-label': {
122
+ '@apply text-label-small font-thin text-dark-secondary select-none min-w-[3.6rem] text-center': {};
123
+ };
93
124
  '.ql-tooltip.ql-editing': {
94
125
  input: {
95
126
  '@apply rounded-0': {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sk-web-gui/core",
3
- "version": "4.3.3",
3
+ "version": "4.5.0",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "main": "./dist/cjs/index.js",
@@ -41,5 +41,5 @@
41
41
  "mini-svg-data-uri": "^1.4.4",
42
42
  "tailwindcss": "^3.4.17"
43
43
  },
44
- "gitHead": "10dd42fac8dd2865644931207cdd50c4c5a51ac2"
44
+ "gitHead": "2dd4a1a6e8ea1a2a63ff3e521c502ba2e956457a"
45
45
  }