@aotearoan/neon 28.6.0 → 28.7.1
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.
- package/dist/components/layout/card-list/NeonCardList.cjs.js +1 -1
- package/dist/components/layout/card-list/NeonCardList.cjs.js.map +1 -1
- package/dist/components/layout/card-list/NeonCardList.es.js +70 -48
- package/dist/components/layout/card-list/NeonCardList.es.js.map +1 -1
- package/dist/components/layout/card-list/NeonCardList.vue.cjs.js +1 -1
- package/dist/components/layout/card-list/NeonCardList.vue.cjs.js.map +1 -1
- package/dist/components/layout/card-list/NeonCardList.vue.es.js +86 -69
- package/dist/components/layout/card-list/NeonCardList.vue.es.js.map +1 -1
- package/dist/components/layout/card-list/draggable-card/NeonDraggableCard.vue.cjs.js +2 -0
- package/dist/components/layout/card-list/draggable-card/NeonDraggableCard.vue.cjs.js.map +1 -0
- package/dist/components/layout/card-list/draggable-card/NeonDraggableCard.vue.cjs2.js +2 -0
- package/dist/components/layout/card-list/draggable-card/NeonDraggableCard.vue.cjs2.js.map +1 -0
- package/dist/components/layout/card-list/draggable-card/NeonDraggableCard.vue.es.js +78 -0
- package/dist/components/layout/card-list/draggable-card/NeonDraggableCard.vue.es.js.map +1 -0
- package/dist/components/layout/card-list/draggable-card/NeonDraggableCard.vue.es2.js +5 -0
- package/dist/components/layout/card-list/draggable-card/NeonDraggableCard.vue.es2.js.map +1 -0
- package/dist/icons/drag-handle.svg.cjs.js +7 -0
- package/dist/icons/drag-handle.svg.cjs.js.map +1 -0
- package/dist/icons/drag-handle.svg.es.js +10 -0
- package/dist/icons/drag-handle.svg.es.js.map +1 -0
- package/dist/neon.cjs.js +1 -1
- package/dist/neon.es.js +43 -41
- package/dist/neon.es.js.map +1 -1
- package/dist/src/components/layout/card-list/NeonCardList.d.ts +122 -3
- package/dist/src/components/layout/card-list/draggable-card/NeonDraggableCard.vue.d.ts +59 -0
- package/dist/src/components/layout/list-layout/NeonListLayout.d.ts +95 -3
- package/dist/src/neon.d.ts +1 -0
- package/dist/src/utils/common/array/NeonArrayUtils.d.ts +7 -0
- package/dist/utils/common/array/NeonArrayUtils.cjs.js +2 -0
- package/dist/utils/common/array/NeonArrayUtils.cjs.js.map +1 -0
- package/dist/utils/common/array/NeonArrayUtils.es.js +8 -0
- package/dist/utils/common/array/NeonArrayUtils.es.js.map +1 -0
- package/dist/utils/common/icons/RegisterIcons.cjs.js +1 -1
- package/dist/utils/common/icons/RegisterIcons.cjs.js.map +1 -1
- package/dist/utils/common/icons/RegisterIcons.es.js +30 -29
- package/dist/utils/common/icons/RegisterIcons.es.js.map +1 -1
- package/package.json +1 -1
- package/src/sass/components/_button.scss +1 -1
- package/src/sass/components/_card-list.scss +2 -6
- package/src/sass/components/_draggable-card.scss +75 -0
- package/src/sass/components/_label.scss +2 -2
- package/src/sass/components/_slider.scss +1 -1
- package/src/sass/components/components.scss +1 -0
- package/src/sass/includes/_dependencies.scss +2 -1
- package/src/sass/theme.scss +4 -0
- package/src/sass/variables-dark.scss +18 -14
- package/src/sass/variables-light.scss +18 -14
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { NeonIconRegistry as o } from "./NeonIconRegistry.es.js";
|
|
2
2
|
import r from "../../../icons/align-center.svg.es.js";
|
|
3
3
|
import m from "../../../icons/align-left.svg.es.js";
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
4
|
+
import d from "../../../icons/align-right.svg.es.js";
|
|
5
|
+
import i from "../../../icons/at.svg.es.js";
|
|
6
|
+
import n from "../../../icons/calendar.svg.es.js";
|
|
7
|
+
import t from "../../../icons/check.svg.es.js";
|
|
8
8
|
import a from "../../../icons/check-circle.svg.es.js";
|
|
9
9
|
import c from "../../../icons/chevron-down.svg.es.js";
|
|
10
10
|
import e from "../../../icons/chevron-left.svg.es.js";
|
|
@@ -17,19 +17,20 @@ import h from "../../../icons/dash.svg.es.js";
|
|
|
17
17
|
import g from "../../../icons/desktop.svg.es.js";
|
|
18
18
|
import u from "../../../icons/dot.svg.es.js";
|
|
19
19
|
import k from "../../../icons/download.svg.es.js";
|
|
20
|
-
import v from "../../../icons/
|
|
21
|
-
import y from "../../../icons/
|
|
22
|
-
import w from "../../../icons/
|
|
23
|
-
import b from "../../../icons/
|
|
24
|
-
import x from "../../../icons/
|
|
25
|
-
import C from "../../../icons/
|
|
26
|
-
import L from "../../../icons/
|
|
27
|
-
import R from "../../../icons/heart
|
|
28
|
-
import O from "../../../icons/
|
|
29
|
-
import P from "../../../icons/
|
|
30
|
-
import D from "../../../icons/
|
|
31
|
-
import E from "../../../icons/
|
|
32
|
-
import F from "../../../icons/
|
|
20
|
+
import v from "../../../icons/drag-handle.svg.es.js";
|
|
21
|
+
import y from "../../../icons/ellipsis.svg.es.js";
|
|
22
|
+
import w from "../../../icons/exclamation-circle.svg.es.js";
|
|
23
|
+
import b from "../../../icons/feather.svg.es.js";
|
|
24
|
+
import x from "../../../icons/first-page.svg.es.js";
|
|
25
|
+
import C from "../../../icons/github.svg.es.js";
|
|
26
|
+
import L from "../../../icons/hammer.svg.es.js";
|
|
27
|
+
import R from "../../../icons/heart.svg.es.js";
|
|
28
|
+
import O from "../../../icons/heart-outline.svg.es.js";
|
|
29
|
+
import P from "../../../icons/html-logo.svg.es.js";
|
|
30
|
+
import D from "../../../icons/images.svg.es.js";
|
|
31
|
+
import E from "../../../icons/info-circle.svg.es.js";
|
|
32
|
+
import F from "../../../icons/last-page.svg.es.js";
|
|
33
|
+
import H from "../../../icons/light-mode-sunny.svg.es.js";
|
|
33
34
|
import M from "../../../icons/link-external.svg.es.js";
|
|
34
35
|
import N from "../../../icons/loading.svg.es.js";
|
|
35
36
|
import S from "../../../icons/lock.svg.es.js";
|
|
@@ -41,25 +42,25 @@ import z from "../../../icons/neon-logo.svg.es.js";
|
|
|
41
42
|
import A from "../../../icons/neon-wordmark.svg.es.js";
|
|
42
43
|
import B from "../../../icons/palette.svg.es.js";
|
|
43
44
|
import G from "../../../icons/plus.svg.es.js";
|
|
44
|
-
import
|
|
45
|
-
import
|
|
46
|
-
import
|
|
47
|
-
import
|
|
48
|
-
import
|
|
49
|
-
import
|
|
50
|
-
import
|
|
51
|
-
import
|
|
52
|
-
import
|
|
53
|
-
class
|
|
45
|
+
import J from "../../../icons/send.svg.es.js";
|
|
46
|
+
import K from "../../../icons/search.svg.es.js";
|
|
47
|
+
import Q from "../../../icons/sun.svg.es.js";
|
|
48
|
+
import T from "../../../icons/switch.svg.es.js";
|
|
49
|
+
import V from "../../../icons/times.svg.es.js";
|
|
50
|
+
import X from "../../../icons/times-circle.svg.es.js";
|
|
51
|
+
import Y from "../../../icons/user.svg.es.js";
|
|
52
|
+
import Z from "../../../icons/visibility-off.svg.es.js";
|
|
53
|
+
import _ from "../../../icons/visibility-on.svg.es.js";
|
|
54
|
+
class or {
|
|
54
55
|
/**
|
|
55
56
|
* Register all Neon default icons in the NeonIconRegistry. Call this in an app's <em>main.ts</em> to use Neon's
|
|
56
57
|
* provided icons.
|
|
57
58
|
*/
|
|
58
59
|
static register() {
|
|
59
|
-
o.addIcon("align-center", r), o.addIcon("align-left", m), o.addIcon("align-right",
|
|
60
|
+
o.addIcon("align-center", r), o.addIcon("align-left", m), o.addIcon("align-right", d), o.addIcon("at", i), o.addIcon("calendar", n), o.addIcon("check", t), o.addIcon("check-circle", a), o.addIcon("chevron-down", c), o.addIcon("chevron-left", e), o.addIcon("chevron-right", f), o.addIcon("chevron-up", p), o.addIcon("color-filter", l), o.addIcon("contrast", I), o.addIcon("copy", s), o.addIcon("dash", h), o.addIcon("desktop", g), o.addIcon("dot", u), o.addIcon("download", k), o.addIcon("drag-handle", v), o.addIcon("ellipsis", y), o.addIcon("exclamation-circle", w), o.addIcon("feather", b), o.addIcon("first-page", x), o.addIcon("github", C), o.addIcon("hammer", L), o.addIcon("heart", R), o.addIcon("heart-outline", O), o.addIcon("html-logo", P), o.addIcon("images", D), o.addIcon("info-circle", E), o.addIcon("last-page", F), o.addIcon("light-mode-sunny", H), o.addIcon("link-external", M), o.addIcon("loading", N), o.addIcon("lock", S), o.addIcon("mail", U), o.addIcon("menu", W), o.addIcon("minus", j), o.addIcon("moon", q), o.addIcon("neon-logo", z), o.addIcon("neon-wordmark", A), o.addIcon("palette", B), o.addIcon("plus", G), o.addIcon("send", J), o.addIcon("search", K), o.addIcon("sun", Q), o.addIcon("switch", T), o.addIcon("times", V), o.addIcon("times-circle", X), o.addIcon("user", Y), o.addIcon("visibility-off", Z), o.addIcon("visibility-on", _);
|
|
60
61
|
}
|
|
61
62
|
}
|
|
62
63
|
export {
|
|
63
|
-
|
|
64
|
+
or as RegisterIcons
|
|
64
65
|
};
|
|
65
66
|
//# sourceMappingURL=RegisterIcons.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RegisterIcons.es.js","sources":["../../../../src/utils/common/icons/RegisterIcons.ts"],"sourcesContent":["import { NeonIconRegistry } from './NeonIconRegistry';\nimport alignCenter from '@/icons/align-center.svg';\nimport alignLeft from '@/icons/align-left.svg';\nimport alignRight from '@/icons/align-right.svg';\nimport at from '@/icons/at.svg';\nimport calendar from '@/icons/calendar.svg';\nimport check from '@/icons/check.svg';\nimport checkCircle from '@/icons/check-circle.svg';\nimport chevronDown from '@/icons/chevron-down.svg';\nimport chevronLeft from '@/icons/chevron-left.svg';\nimport chevronRight from '@/icons/chevron-right.svg';\nimport chevronUp from '@/icons/chevron-up.svg';\nimport colorFilter from '@/icons/color-filter.svg';\nimport contrast from '@/icons/contrast.svg';\nimport copy from '@/icons/copy.svg';\nimport dash from '@/icons/dash.svg';\nimport desktop from '@/icons/desktop.svg';\nimport dot from '@/icons/dot.svg';\nimport download from '@/icons/download.svg';\nimport ellipsis from '@/icons/ellipsis.svg';\nimport exclamationCircle from '@/icons/exclamation-circle.svg';\nimport feather from '@/icons/feather.svg';\nimport firstPage from '@/icons/first-page.svg';\nimport github from '@/icons/github.svg';\nimport hammer from '@/icons/hammer.svg';\nimport heart from '@/icons/heart.svg';\nimport heartOutline from '@/icons/heart-outline.svg';\nimport htmlLogo from '@/icons/html-logo.svg';\nimport images from '@/icons/images.svg';\nimport infoCircle from '@/icons/info-circle.svg';\nimport lastPage from '@/icons/last-page.svg';\nimport lightModeSunny from '@/icons/light-mode-sunny.svg';\nimport linkExternal from '@/icons/link-external.svg';\nimport loading from '@/icons/loading.svg';\nimport lock from '@/icons/lock.svg';\nimport mail from '@/icons/mail.svg';\nimport menu from '@/icons/menu.svg';\nimport minus from '@/icons/minus.svg';\nimport moon from '@/icons/moon.svg';\nimport neonLogo from '@/icons/neon-logo.svg';\nimport neonWordmark from '@/icons/neon-wordmark.svg';\nimport palette from '@/icons/palette.svg';\nimport plus from '@/icons/plus.svg';\nimport send from '@/icons/send.svg';\nimport search from '@/icons/search.svg';\nimport sun from '@/icons/sun.svg';\nimport switchIcon from '@/icons/switch.svg';\nimport times from '@/icons/times.svg';\nimport timesCircle from '@/icons/times-circle.svg';\nimport user from '@/icons/user.svg';\nimport visibilityOff from '@/icons/visibility-off.svg';\nimport visibilityOn from '@/icons/visibility-on.svg';\n\n/**\n * A helper for initialising the provided set of Neon icons with the\n * <a href=\"/utils/NeonIconRegistry\">NeonIconRegistry</a>.\n */\nexport class RegisterIcons {\n /**\n * Register all Neon default icons in the NeonIconRegistry. Call this in an app's <em>main.ts</em> to use Neon's\n * provided icons.\n */\n public static register() {\n NeonIconRegistry.addIcon('align-center', alignCenter);\n NeonIconRegistry.addIcon('align-left', alignLeft);\n NeonIconRegistry.addIcon('align-right', alignRight);\n NeonIconRegistry.addIcon('at', at);\n NeonIconRegistry.addIcon('calendar', calendar);\n NeonIconRegistry.addIcon('check', check);\n NeonIconRegistry.addIcon('check-circle', checkCircle);\n NeonIconRegistry.addIcon('chevron-down', chevronDown);\n NeonIconRegistry.addIcon('chevron-left', chevronLeft);\n NeonIconRegistry.addIcon('chevron-right', chevronRight);\n NeonIconRegistry.addIcon('chevron-up', chevronUp);\n NeonIconRegistry.addIcon('color-filter', colorFilter);\n NeonIconRegistry.addIcon('contrast', contrast);\n NeonIconRegistry.addIcon('copy', copy);\n NeonIconRegistry.addIcon('dash', dash);\n NeonIconRegistry.addIcon('desktop', desktop);\n NeonIconRegistry.addIcon('dot', dot);\n NeonIconRegistry.addIcon('download', download);\n NeonIconRegistry.addIcon('ellipsis', ellipsis);\n NeonIconRegistry.addIcon('exclamation-circle', exclamationCircle);\n NeonIconRegistry.addIcon('feather', feather);\n NeonIconRegistry.addIcon('first-page', firstPage);\n NeonIconRegistry.addIcon('github', github);\n NeonIconRegistry.addIcon('hammer', hammer);\n NeonIconRegistry.addIcon('heart', heart);\n NeonIconRegistry.addIcon('heart-outline', heartOutline);\n NeonIconRegistry.addIcon('html-logo', htmlLogo);\n NeonIconRegistry.addIcon('images', images);\n NeonIconRegistry.addIcon('info-circle', infoCircle);\n NeonIconRegistry.addIcon('last-page', lastPage);\n NeonIconRegistry.addIcon('light-mode-sunny', lightModeSunny);\n NeonIconRegistry.addIcon('link-external', linkExternal);\n NeonIconRegistry.addIcon('loading', loading);\n NeonIconRegistry.addIcon('lock', lock);\n NeonIconRegistry.addIcon('mail', mail);\n NeonIconRegistry.addIcon('menu', menu);\n NeonIconRegistry.addIcon('minus', minus);\n NeonIconRegistry.addIcon('moon', moon);\n NeonIconRegistry.addIcon('neon-logo', neonLogo);\n NeonIconRegistry.addIcon('neon-wordmark', neonWordmark);\n NeonIconRegistry.addIcon('palette', palette);\n NeonIconRegistry.addIcon('plus', plus);\n NeonIconRegistry.addIcon('send', send);\n NeonIconRegistry.addIcon('search', search);\n NeonIconRegistry.addIcon('sun', sun);\n NeonIconRegistry.addIcon('switch', switchIcon);\n NeonIconRegistry.addIcon('times', times);\n NeonIconRegistry.addIcon('times-circle', timesCircle);\n NeonIconRegistry.addIcon('user', user);\n NeonIconRegistry.addIcon('visibility-off', visibilityOff);\n NeonIconRegistry.addIcon('visibility-on', visibilityOn);\n }\n}\n"],"names":["RegisterIcons","NeonIconRegistry","alignCenter","alignLeft","alignRight","at","calendar","check","checkCircle","chevronDown","chevronLeft","chevronRight","chevronUp","colorFilter","contrast","copy","dash","desktop","dot","download","ellipsis","exclamationCircle","feather","firstPage","github","hammer","heart","heartOutline","htmlLogo","images","infoCircle","lastPage","lightModeSunny","linkExternal","loading","lock","mail","menu","minus","moon","neonLogo","neonWordmark","palette","plus","send","search","sun","switchIcon","times","timesCircle","user","visibilityOff","visibilityOn"],"mappings":"
|
|
1
|
+
{"version":3,"file":"RegisterIcons.es.js","sources":["../../../../src/utils/common/icons/RegisterIcons.ts"],"sourcesContent":["import { NeonIconRegistry } from './NeonIconRegistry';\nimport alignCenter from '@/icons/align-center.svg';\nimport alignLeft from '@/icons/align-left.svg';\nimport alignRight from '@/icons/align-right.svg';\nimport at from '@/icons/at.svg';\nimport calendar from '@/icons/calendar.svg';\nimport check from '@/icons/check.svg';\nimport checkCircle from '@/icons/check-circle.svg';\nimport chevronDown from '@/icons/chevron-down.svg';\nimport chevronLeft from '@/icons/chevron-left.svg';\nimport chevronRight from '@/icons/chevron-right.svg';\nimport chevronUp from '@/icons/chevron-up.svg';\nimport colorFilter from '@/icons/color-filter.svg';\nimport contrast from '@/icons/contrast.svg';\nimport copy from '@/icons/copy.svg';\nimport dash from '@/icons/dash.svg';\nimport desktop from '@/icons/desktop.svg';\nimport dot from '@/icons/dot.svg';\nimport download from '@/icons/download.svg';\nimport dragHandle from '@/icons/drag-handle.svg';\nimport ellipsis from '@/icons/ellipsis.svg';\nimport exclamationCircle from '@/icons/exclamation-circle.svg';\nimport feather from '@/icons/feather.svg';\nimport firstPage from '@/icons/first-page.svg';\nimport github from '@/icons/github.svg';\nimport hammer from '@/icons/hammer.svg';\nimport heart from '@/icons/heart.svg';\nimport heartOutline from '@/icons/heart-outline.svg';\nimport htmlLogo from '@/icons/html-logo.svg';\nimport images from '@/icons/images.svg';\nimport infoCircle from '@/icons/info-circle.svg';\nimport lastPage from '@/icons/last-page.svg';\nimport lightModeSunny from '@/icons/light-mode-sunny.svg';\nimport linkExternal from '@/icons/link-external.svg';\nimport loading from '@/icons/loading.svg';\nimport lock from '@/icons/lock.svg';\nimport mail from '@/icons/mail.svg';\nimport menu from '@/icons/menu.svg';\nimport minus from '@/icons/minus.svg';\nimport moon from '@/icons/moon.svg';\nimport neonLogo from '@/icons/neon-logo.svg';\nimport neonWordmark from '@/icons/neon-wordmark.svg';\nimport palette from '@/icons/palette.svg';\nimport plus from '@/icons/plus.svg';\nimport send from '@/icons/send.svg';\nimport search from '@/icons/search.svg';\nimport sun from '@/icons/sun.svg';\nimport switchIcon from '@/icons/switch.svg';\nimport times from '@/icons/times.svg';\nimport timesCircle from '@/icons/times-circle.svg';\nimport user from '@/icons/user.svg';\nimport visibilityOff from '@/icons/visibility-off.svg';\nimport visibilityOn from '@/icons/visibility-on.svg';\n\n/**\n * A helper for initialising the provided set of Neon icons with the\n * <a href=\"/utils/NeonIconRegistry\">NeonIconRegistry</a>.\n */\nexport class RegisterIcons {\n /**\n * Register all Neon default icons in the NeonIconRegistry. Call this in an app's <em>main.ts</em> to use Neon's\n * provided icons.\n */\n public static register() {\n NeonIconRegistry.addIcon('align-center', alignCenter);\n NeonIconRegistry.addIcon('align-left', alignLeft);\n NeonIconRegistry.addIcon('align-right', alignRight);\n NeonIconRegistry.addIcon('at', at);\n NeonIconRegistry.addIcon('calendar', calendar);\n NeonIconRegistry.addIcon('check', check);\n NeonIconRegistry.addIcon('check-circle', checkCircle);\n NeonIconRegistry.addIcon('chevron-down', chevronDown);\n NeonIconRegistry.addIcon('chevron-left', chevronLeft);\n NeonIconRegistry.addIcon('chevron-right', chevronRight);\n NeonIconRegistry.addIcon('chevron-up', chevronUp);\n NeonIconRegistry.addIcon('color-filter', colorFilter);\n NeonIconRegistry.addIcon('contrast', contrast);\n NeonIconRegistry.addIcon('copy', copy);\n NeonIconRegistry.addIcon('dash', dash);\n NeonIconRegistry.addIcon('desktop', desktop);\n NeonIconRegistry.addIcon('dot', dot);\n NeonIconRegistry.addIcon('download', download);\n NeonIconRegistry.addIcon('drag-handle', dragHandle);\n NeonIconRegistry.addIcon('ellipsis', ellipsis);\n NeonIconRegistry.addIcon('exclamation-circle', exclamationCircle);\n NeonIconRegistry.addIcon('feather', feather);\n NeonIconRegistry.addIcon('first-page', firstPage);\n NeonIconRegistry.addIcon('github', github);\n NeonIconRegistry.addIcon('hammer', hammer);\n NeonIconRegistry.addIcon('heart', heart);\n NeonIconRegistry.addIcon('heart-outline', heartOutline);\n NeonIconRegistry.addIcon('html-logo', htmlLogo);\n NeonIconRegistry.addIcon('images', images);\n NeonIconRegistry.addIcon('info-circle', infoCircle);\n NeonIconRegistry.addIcon('last-page', lastPage);\n NeonIconRegistry.addIcon('light-mode-sunny', lightModeSunny);\n NeonIconRegistry.addIcon('link-external', linkExternal);\n NeonIconRegistry.addIcon('loading', loading);\n NeonIconRegistry.addIcon('lock', lock);\n NeonIconRegistry.addIcon('mail', mail);\n NeonIconRegistry.addIcon('menu', menu);\n NeonIconRegistry.addIcon('minus', minus);\n NeonIconRegistry.addIcon('moon', moon);\n NeonIconRegistry.addIcon('neon-logo', neonLogo);\n NeonIconRegistry.addIcon('neon-wordmark', neonWordmark);\n NeonIconRegistry.addIcon('palette', palette);\n NeonIconRegistry.addIcon('plus', plus);\n NeonIconRegistry.addIcon('send', send);\n NeonIconRegistry.addIcon('search', search);\n NeonIconRegistry.addIcon('sun', sun);\n NeonIconRegistry.addIcon('switch', switchIcon);\n NeonIconRegistry.addIcon('times', times);\n NeonIconRegistry.addIcon('times-circle', timesCircle);\n NeonIconRegistry.addIcon('user', user);\n NeonIconRegistry.addIcon('visibility-off', visibilityOff);\n NeonIconRegistry.addIcon('visibility-on', visibilityOn);\n }\n}\n"],"names":["RegisterIcons","NeonIconRegistry","alignCenter","alignLeft","alignRight","at","calendar","check","checkCircle","chevronDown","chevronLeft","chevronRight","chevronUp","colorFilter","contrast","copy","dash","desktop","dot","download","dragHandle","ellipsis","exclamationCircle","feather","firstPage","github","hammer","heart","heartOutline","htmlLogo","images","infoCircle","lastPage","lightModeSunny","linkExternal","loading","lock","mail","menu","minus","moon","neonLogo","neonWordmark","palette","plus","send","search","sun","switchIcon","times","timesCircle","user","visibilityOff","visibilityOn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0DO,MAAMA,GAAc;AAAA;AAAA;AAAA;AAAA;AAAA,EAKzB,OAAc,WAAW;AACvB,IAAAC,EAAiB,QAAQ,gBAAgBC,CAAW,GACpDD,EAAiB,QAAQ,cAAcE,CAAS,GAChDF,EAAiB,QAAQ,eAAeG,CAAU,GAClDH,EAAiB,QAAQ,MAAMI,CAAE,GACjCJ,EAAiB,QAAQ,YAAYK,CAAQ,GAC7CL,EAAiB,QAAQ,SAASM,CAAK,GACvCN,EAAiB,QAAQ,gBAAgBO,CAAW,GACpDP,EAAiB,QAAQ,gBAAgBQ,CAAW,GACpDR,EAAiB,QAAQ,gBAAgBS,CAAW,GACpDT,EAAiB,QAAQ,iBAAiBU,CAAY,GACtDV,EAAiB,QAAQ,cAAcW,CAAS,GAChDX,EAAiB,QAAQ,gBAAgBY,CAAW,GACpDZ,EAAiB,QAAQ,YAAYa,CAAQ,GAC7Cb,EAAiB,QAAQ,QAAQc,CAAI,GACrCd,EAAiB,QAAQ,QAAQe,CAAI,GACrCf,EAAiB,QAAQ,WAAWgB,CAAO,GAC3ChB,EAAiB,QAAQ,OAAOiB,CAAG,GACnCjB,EAAiB,QAAQ,YAAYkB,CAAQ,GAC7ClB,EAAiB,QAAQ,eAAemB,CAAU,GAClDnB,EAAiB,QAAQ,YAAYoB,CAAQ,GAC7CpB,EAAiB,QAAQ,sBAAsBqB,CAAiB,GAChErB,EAAiB,QAAQ,WAAWsB,CAAO,GAC3CtB,EAAiB,QAAQ,cAAcuB,CAAS,GAChDvB,EAAiB,QAAQ,UAAUwB,CAAM,GACzCxB,EAAiB,QAAQ,UAAUyB,CAAM,GACzCzB,EAAiB,QAAQ,SAAS0B,CAAK,GACvC1B,EAAiB,QAAQ,iBAAiB2B,CAAY,GACtD3B,EAAiB,QAAQ,aAAa4B,CAAQ,GAC9C5B,EAAiB,QAAQ,UAAU6B,CAAM,GACzC7B,EAAiB,QAAQ,eAAe8B,CAAU,GAClD9B,EAAiB,QAAQ,aAAa+B,CAAQ,GAC9C/B,EAAiB,QAAQ,oBAAoBgC,CAAc,GAC3DhC,EAAiB,QAAQ,iBAAiBiC,CAAY,GACtDjC,EAAiB,QAAQ,WAAWkC,CAAO,GAC3ClC,EAAiB,QAAQ,QAAQmC,CAAI,GACrCnC,EAAiB,QAAQ,QAAQoC,CAAI,GACrCpC,EAAiB,QAAQ,QAAQqC,CAAI,GACrCrC,EAAiB,QAAQ,SAASsC,CAAK,GACvCtC,EAAiB,QAAQ,QAAQuC,CAAI,GACrCvC,EAAiB,QAAQ,aAAawC,CAAQ,GAC9CxC,EAAiB,QAAQ,iBAAiByC,CAAY,GACtDzC,EAAiB,QAAQ,WAAW0C,CAAO,GAC3C1C,EAAiB,QAAQ,QAAQ2C,CAAI,GACrC3C,EAAiB,QAAQ,QAAQ4C,CAAI,GACrC5C,EAAiB,QAAQ,UAAU6C,CAAM,GACzC7C,EAAiB,QAAQ,OAAO8C,CAAG,GACnC9C,EAAiB,QAAQ,UAAU+C,CAAU,GAC7C/C,EAAiB,QAAQ,SAASgD,CAAK,GACvChD,EAAiB,QAAQ,gBAAgBiD,CAAW,GACpDjD,EAAiB,QAAQ,QAAQkD,CAAI,GACrClD,EAAiB,QAAQ,kBAAkBmD,CAAa,GACxDnD,EAAiB,QAAQ,iBAAiBoD,CAAY;AAAA,EACxD;AACF;"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@aotearoan/neon",
|
|
3
3
|
"description": "Neon is a lightweight design library of Vue 3 components with minimal dependencies.",
|
|
4
|
-
"version": "28.
|
|
4
|
+
"version": "28.7.1",
|
|
5
5
|
"main": "./dist/neon.cjs.js",
|
|
6
6
|
"module": "./dist/neon.es.js",
|
|
7
7
|
"types": "./dist/src/neon.d.ts",
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
|
|
6
6
|
@mixin gradient-button($from-color, $to-color) {
|
|
7
7
|
--neon-gradient-button-c1: var(--neon-color-#{$from-color});
|
|
8
|
-
--neon-gradient-button-c2: var(--neon-
|
|
8
|
+
--neon-gradient-button-c2: var(--neon-color-#{$to-color});
|
|
9
9
|
|
|
10
10
|
background: linear-gradient(
|
|
11
11
|
var(--neon-background-gradient-angle),
|
|
@@ -83,12 +83,8 @@
|
|
|
83
83
|
min-width: 100%;
|
|
84
84
|
@each $color in palettes.$neon-functional-colors {
|
|
85
85
|
&--#{$color} {
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
&:hover,
|
|
89
|
-
&:hover {
|
|
90
|
-
background-color: rgba(var(--neon-rgb-#{$color}), 0.03125);
|
|
91
|
-
}
|
|
86
|
+
&:hover {
|
|
87
|
+
background-color: rgba(var(--neon-rgb-#{$color}), 0.03125);
|
|
92
88
|
}
|
|
93
89
|
}
|
|
94
90
|
}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
@use '../includes/palettes';
|
|
2
|
+
@use '../includes/svg';
|
|
3
|
+
|
|
4
|
+
@mixin draggable-card {
|
|
5
|
+
.neon-draggable-card {
|
|
6
|
+
flex-direction: row;
|
|
7
|
+
position: relative;
|
|
8
|
+
border-bottom: var(--neon-border);
|
|
9
|
+
|
|
10
|
+
& > .neon-card-list__card:not(:focus-visible) {
|
|
11
|
+
border-bottom: none;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
&[draggable='true'] {
|
|
15
|
+
cursor: grab;
|
|
16
|
+
transition: var(--neon-animation-speed-fast) all ease;
|
|
17
|
+
|
|
18
|
+
@each $color in palettes.$neon-functional-colors {
|
|
19
|
+
&.neon-draggable-card--#{$color} {
|
|
20
|
+
&:hover {
|
|
21
|
+
background-color: rgba(var(--neon-rgb-#{$color}), 0.03125);
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
&:hover {
|
|
27
|
+
.neon-draggable-card__handle-icon {
|
|
28
|
+
@include svg.color-with-svg(var(--neon-color-high-contrast));
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
&.neon-draggable-card--drag-in-progress {
|
|
33
|
+
/* add transparent overlay when dragging over all items. This prevents onDragLeave firing on child elements */
|
|
34
|
+
&:after {
|
|
35
|
+
content: '';
|
|
36
|
+
position: absolute;
|
|
37
|
+
top: 0;
|
|
38
|
+
left: 0;
|
|
39
|
+
width: 100%;
|
|
40
|
+
height: 100%;
|
|
41
|
+
background-color: transparent;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
&.neon-draggable-card--active {
|
|
45
|
+
&:after {
|
|
46
|
+
background-color: var(--neon-background-color-draggable-card-hover);
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
&__handle-icon {
|
|
53
|
+
align-self: center;
|
|
54
|
+
margin-left: var(--neon-space-6);
|
|
55
|
+
margin-right: var(--neon-space-4);
|
|
56
|
+
width: 16rem;
|
|
57
|
+
height: 16rem;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.neon-drag-handle-transition {
|
|
61
|
+
&-enter-active,
|
|
62
|
+
&-leave-active {
|
|
63
|
+
transition: all ease-in-out var(--neon-animation-speed-fast) var(--neon-animation-speed-fast) allow-discrete;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
&-enter-from,
|
|
67
|
+
&-leave-to {
|
|
68
|
+
opacity: 0;
|
|
69
|
+
width: 0;
|
|
70
|
+
margin-left: 0;
|
|
71
|
+
margin-right: 0;
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
}
|
|
@@ -22,11 +22,11 @@
|
|
|
22
22
|
@each $color in palettes.$neon-functional-colors {
|
|
23
23
|
&--#{$color} {
|
|
24
24
|
@include svg.color-with-svg(var(--neon-color-#{$color}));
|
|
25
|
-
background:
|
|
25
|
+
background: var(--neon-background-color-#{$color});
|
|
26
26
|
|
|
27
27
|
@each $alternateColor in palettes.$neon-functional-colors {
|
|
28
28
|
&.neon-label--alternate-color-#{$alternateColor} {
|
|
29
|
-
background: linear-gradient(90deg,
|
|
29
|
+
background: linear-gradient(90deg, var(--neon-background-color-#{$color}), var(--neon-background-color-#{$alternateColor}));
|
|
30
30
|
|
|
31
31
|
.neon-label__label {
|
|
32
32
|
@include gradient.neon-gradient-text($color, $alternateColor);
|
|
@@ -153,7 +153,7 @@ $neon-width-slider-tooltip: 201rem;
|
|
|
153
153
|
outline: none;
|
|
154
154
|
|
|
155
155
|
&:focus {
|
|
156
|
-
$neon-box-shadow-slider-thumb-focus: 0 0 0 4rem rgba(var(--neon-
|
|
156
|
+
$neon-box-shadow-slider-thumb-focus: 0 0 0 4rem rgba(var(--neon-rgb-low-contrast), 0.3);
|
|
157
157
|
|
|
158
158
|
&::-webkit-slider-thumb {
|
|
159
159
|
box-shadow: $neon-box-shadow-slider-thumb-focus;
|
|
@@ -127,7 +127,7 @@
|
|
|
127
127
|
NeonField: [],
|
|
128
128
|
NeonStack: [],
|
|
129
129
|
NeonInline: [],
|
|
130
|
-
NeonCardList: [NeonSelectableCard, NeonSwitch, NeonIcon, NeonButton, NeonExpansionIndicator, NeonIcon, NeonLink, NeonCard, NeonCardHeader, NeonCardBody, NeonInline, NeonStack, NeonPagination, NeonLoadingStateCard, NeonSkeletonLoader],
|
|
130
|
+
NeonCardList: [NeonSelectableCard, NeonSwitch, NeonIcon, NeonButton, NeonExpansionIndicator, NeonIcon, NeonLink, NeonCard, NeonCardHeader, NeonCardBody, NeonInline, NeonStack, NeonPagination, NeonLoadingStateCard, NeonSkeletonLoader, NeonDraggableCard],
|
|
131
131
|
NeonImageCarousel: [NeonButton, NeonLink],
|
|
132
132
|
NeonSwiper: [],
|
|
133
133
|
NeonMobileMenu: [NeonIcon, NeonLink],
|
|
@@ -144,6 +144,7 @@
|
|
|
144
144
|
NeonListLayout: [NeonBreadcrumbs, NeonButton, NeonCard, NeonCardBody, NeonCardHeader, NeonCardList, NeonEmptyState, NeonExpansionIndicator, NeonHeader, NeonIcon, NeonInline, NeonLink, NeonNote, NeonPagination, NeonSelectableCard, NeonSwiper, NeonSwitch],
|
|
145
145
|
NeonLoadingStateCard: [NeonInline, NeonStack, NeonSkeletonLoader],
|
|
146
146
|
NeonBasicLayout: [NeonHeader, NeonBreadcrumbs, NeonButton, NeonExpansionIndicator, NeonIcon, NeonInline, NeonLink, NeonNote, NeonSwiper, NeonStack],
|
|
147
|
+
NeonDraggableCard: [NeonInline, NeonIcon],
|
|
147
148
|
);
|
|
148
149
|
|
|
149
150
|
$neon-flattened-components: [];
|
package/src/sass/theme.scss
CHANGED
|
@@ -324,4 +324,8 @@ $neon-components: null !default;
|
|
|
324
324
|
@if index($neon-flattened-components, NeonBasicLayout) {
|
|
325
325
|
@include components.basic-layout;
|
|
326
326
|
}
|
|
327
|
+
|
|
328
|
+
@if index($neon-flattened-components, NeonDraggableCard) {
|
|
329
|
+
@include components.draggable-card;
|
|
330
|
+
}
|
|
327
331
|
}
|
|
@@ -136,50 +136,46 @@
|
|
|
136
136
|
--neon-color-error: var(--neon-color-error-l1);
|
|
137
137
|
|
|
138
138
|
|
|
139
|
-
/**
|
|
140
|
-
* background low contrast color RGB values
|
|
141
|
-
*/
|
|
142
|
-
--neon-background-rgb-low-contrast: var(--neon-rgb-low-contrast-d1);
|
|
143
139
|
/**
|
|
144
140
|
* background low contrast color variable
|
|
145
141
|
*/
|
|
146
|
-
--neon-background-color-low-contrast: var(--neon-color-low-contrast-
|
|
142
|
+
--neon-background-color-low-contrast: var(--neon-color-low-contrast-d5);
|
|
147
143
|
/**
|
|
148
144
|
* background neutral color variable
|
|
149
145
|
*/
|
|
150
|
-
--neon-background-color-neutral: var(--neon-color-neutral-
|
|
146
|
+
--neon-background-color-neutral: var(--neon-color-neutral-d5);
|
|
151
147
|
/**
|
|
152
148
|
* background high contrast color variable
|
|
153
149
|
*/
|
|
154
|
-
--neon-background-color-high-contrast: var(--neon-color-high-contrast-
|
|
150
|
+
--neon-background-color-high-contrast: var(--neon-color-high-contrast-d5);
|
|
155
151
|
/**
|
|
156
152
|
* background brand color variable
|
|
157
153
|
*/
|
|
158
|
-
--neon-background-color-brand: var(--neon-color-brand-
|
|
154
|
+
--neon-background-color-brand: var(--neon-color-brand-d5);
|
|
159
155
|
/**
|
|
160
156
|
* background accent color variable
|
|
161
157
|
*/
|
|
162
|
-
--neon-background-color-accent: var(--neon-color-accent-
|
|
158
|
+
--neon-background-color-accent: var(--neon-color-accent-d5);
|
|
163
159
|
/**
|
|
164
160
|
* background primary color variable
|
|
165
161
|
*/
|
|
166
|
-
--neon-background-color-primary: var(--neon-color-primary-
|
|
162
|
+
--neon-background-color-primary: var(--neon-color-primary-d5);
|
|
167
163
|
/**
|
|
168
164
|
* background info color variable
|
|
169
165
|
*/
|
|
170
|
-
--neon-background-color-info: var(--neon-color-info-
|
|
166
|
+
--neon-background-color-info: var(--neon-color-info-d5);
|
|
171
167
|
/**
|
|
172
168
|
* background success color variable
|
|
173
169
|
*/
|
|
174
|
-
--neon-background-color-success: var(--neon-color-success-
|
|
170
|
+
--neon-background-color-success: var(--neon-color-success-d5);
|
|
175
171
|
/**
|
|
176
172
|
* background warning color variable
|
|
177
173
|
*/
|
|
178
|
-
--neon-background-color-warn: var(--neon-color-warn-
|
|
174
|
+
--neon-background-color-warn: var(--neon-color-warn-d5);
|
|
179
175
|
/**
|
|
180
176
|
* background error color variable
|
|
181
177
|
*/
|
|
182
|
-
--neon-background-color-error: var(--neon-color-error-
|
|
178
|
+
--neon-background-color-error: var(--neon-color-error-d5);
|
|
183
179
|
|
|
184
180
|
|
|
185
181
|
/**
|
|
@@ -1344,4 +1340,12 @@
|
|
|
1344
1340
|
* Color of the header component subtitle
|
|
1345
1341
|
*/
|
|
1346
1342
|
--neon-color-header-subtitle: var(--neon-color-text-secondary);
|
|
1343
|
+
|
|
1344
|
+
|
|
1345
|
+
/* draggable-card */
|
|
1346
|
+
/**
|
|
1347
|
+
* @component NeonCardList,NeonDraggableCard
|
|
1348
|
+
* Background color of the hover state of the draggable card
|
|
1349
|
+
*/
|
|
1350
|
+
--neon-background-color-draggable-card-hover: var(--neon-color-brand-d5);
|
|
1347
1351
|
}
|
|
@@ -136,50 +136,46 @@
|
|
|
136
136
|
--neon-color-error: var(--neon-color-error-d1);
|
|
137
137
|
|
|
138
138
|
|
|
139
|
-
/**
|
|
140
|
-
* background low contrast color RGB values
|
|
141
|
-
*/
|
|
142
|
-
--neon-background-rgb-low-contrast: var(--neon-rgb-low-contrast-l1);
|
|
143
139
|
/**
|
|
144
140
|
* background low contrast color variable
|
|
145
141
|
*/
|
|
146
|
-
--neon-background-color-low-contrast: var(--neon-color-low-contrast-
|
|
142
|
+
--neon-background-color-low-contrast: var(--neon-color-low-contrast-l5);
|
|
147
143
|
/**
|
|
148
144
|
* background neutral color variable
|
|
149
145
|
*/
|
|
150
|
-
--neon-background-color-neutral: var(--neon-color-neutral-
|
|
146
|
+
--neon-background-color-neutral: var(--neon-color-neutral-l5);
|
|
151
147
|
/**
|
|
152
148
|
* background high contrast color variable
|
|
153
149
|
*/
|
|
154
|
-
--neon-background-color-high-contrast: var(--neon-color-high-contrast-
|
|
150
|
+
--neon-background-color-high-contrast: var(--neon-color-high-contrast-l5);
|
|
155
151
|
/**
|
|
156
152
|
* background brand color variable
|
|
157
153
|
*/
|
|
158
|
-
--neon-background-color-brand: var(--neon-color-brand-
|
|
154
|
+
--neon-background-color-brand: var(--neon-color-brand-l5);
|
|
159
155
|
/**
|
|
160
156
|
* background accent color variable
|
|
161
157
|
*/
|
|
162
|
-
--neon-background-color-accent: var(--neon-color-accent-
|
|
158
|
+
--neon-background-color-accent: var(--neon-color-accent-l5);
|
|
163
159
|
/**
|
|
164
160
|
* background primary color variable
|
|
165
161
|
*/
|
|
166
|
-
--neon-background-color-primary: var(--neon-color-primary-
|
|
162
|
+
--neon-background-color-primary: var(--neon-color-primary-l5);
|
|
167
163
|
/**
|
|
168
164
|
* background info color variable
|
|
169
165
|
*/
|
|
170
|
-
--neon-background-color-info: var(--neon-color-info-
|
|
166
|
+
--neon-background-color-info: var(--neon-color-info-l5);
|
|
171
167
|
/**
|
|
172
168
|
* background success color variable
|
|
173
169
|
*/
|
|
174
|
-
--neon-background-color-success: var(--neon-color-success-
|
|
170
|
+
--neon-background-color-success: var(--neon-color-success-l5);
|
|
175
171
|
/**
|
|
176
172
|
* background warning color variable
|
|
177
173
|
*/
|
|
178
|
-
--neon-background-color-warn: var(--neon-color-warn-
|
|
174
|
+
--neon-background-color-warn: var(--neon-color-warn-l5);
|
|
179
175
|
/**
|
|
180
176
|
* background error color variable
|
|
181
177
|
*/
|
|
182
|
-
--neon-background-color-error: var(--neon-color-error-
|
|
178
|
+
--neon-background-color-error: var(--neon-color-error-l5);
|
|
183
179
|
|
|
184
180
|
|
|
185
181
|
/**
|
|
@@ -1344,4 +1340,12 @@
|
|
|
1344
1340
|
* Color of the header component subtitle
|
|
1345
1341
|
*/
|
|
1346
1342
|
--neon-color-header-subtitle: var(--neon-color-text-secondary);
|
|
1343
|
+
|
|
1344
|
+
|
|
1345
|
+
/* draggable-card */
|
|
1346
|
+
/**
|
|
1347
|
+
* @component NeonCardList,NeonDraggableCard
|
|
1348
|
+
* Background color of the hover state of the draggable card
|
|
1349
|
+
*/
|
|
1350
|
+
--neon-background-color-draggable-card-hover: var(--neon-color-brand-l5);
|
|
1347
1351
|
}
|