@aotearoan/neon 10.0.3 → 10.0.4
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/user-input/input/NeonInput.ts_vue_type_script_src_5fee2d86_lang.cjs.js +1 -1
- package/dist/components/user-input/input/NeonInput.ts_vue_type_script_src_5fee2d86_lang.cjs.js.map +1 -1
- package/dist/components/user-input/input/NeonInput.ts_vue_type_script_src_5fee2d86_lang.es.js +1 -1
- package/dist/components/user-input/input/NeonInput.ts_vue_type_script_src_5fee2d86_lang.es.js.map +1 -1
- package/dist/neon.cjs.js +1 -1
- package/dist/neon.es.js +1 -0
- package/dist/neon.es.js.map +1 -1
- package/dist/src/components/user-input/input/NeonInput.d.ts +6 -4
- package/dist/src/neon.d.ts +1 -0
- package/package.json +1 -1
package/dist/components/user-input/input/NeonInput.ts_vue_type_script_src_5fee2d86_lang.cjs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var n=require("vue"),a=require("../../../common/enums/NeonInputType.cjs.js"),o=require("../../../common/enums/NeonState.cjs.js"),w=require("../../../common/enums/NeonSize.cjs.js"),c=require("../../../common/enums/NeonFunctionalColor.cjs.js"),x=require("../../presentation/icon/NeonIcon.cjs.js"),B=require("../../../common/utils/NeonDebounceUtils.cjs.js"),F=n.defineComponent({name:"NeonInput",components:{NeonIcon:x},props:{id:{type:String,default:null},modelValue:{type:String,default:null},type:{type:String,default:a.NeonInputType.Text},placeholder:{type:String,default:null},size:{type:String,default:w.NeonSize.Medium},color:{type:String,default:c.NeonFunctionalColor.LowContrast},state:{type:String,default:o.NeonState.Ready},rows:{type:Number,default:null},icon:{type:String,default:null},iconReadonly:{type:Boolean,default:!1},hideIcon:{type:Boolean,default:!1},tabindex:{type:Number,default:0},disabled:{type:Boolean,default:!1},stateHighlight:{type:Boolean,default:!0},stateIcon:{type:Boolean,default:!0},maxlength:{type:Number,default:null},debounce:{type:Number,default:
|
|
1
|
+
"use strict";var n=require("vue"),a=require("../../../common/enums/NeonInputType.cjs.js"),o=require("../../../common/enums/NeonState.cjs.js"),w=require("../../../common/enums/NeonSize.cjs.js"),c=require("../../../common/enums/NeonFunctionalColor.cjs.js"),x=require("../../presentation/icon/NeonIcon.cjs.js"),B=require("../../../common/utils/NeonDebounceUtils.cjs.js"),F=n.defineComponent({name:"NeonInput",components:{NeonIcon:x},props:{id:{type:String,default:null},modelValue:{type:String,default:null},type:{type:String,default:a.NeonInputType.Text},placeholder:{type:String,default:null},size:{type:String,default:w.NeonSize.Medium},color:{type:String,default:c.NeonFunctionalColor.LowContrast},state:{type:String,default:o.NeonState.Ready},rows:{type:Number,default:null},icon:{type:String,default:null},iconReadonly:{type:Boolean,default:!1},hideIcon:{type:Boolean,default:!1},tabindex:{type:Number,default:0},disabled:{type:Boolean,default:!1},stateHighlight:{type:Boolean,default:!0},stateIcon:{type:Boolean,default:!0},maxlength:{type:Number,default:null},debounce:{type:Number,default:void 0}},emits:["focus","blur","icon-click","update:modelValue"],setup(e,{emit:l}){const f=n.useAttrs(),i=n.ref(null),r=n.ref(!1),N=n.computed(()=>{const{onBlur:t,onFocus:u,onIconClick:s,...k}=f;return k}),d=B.NeonDebounceUtils.debounce(t=>{l("update:modelValue",t)},e.debounce),m=n.computed(()=>{switch(e.state){case o.NeonState.Loading:return"loading";case o.NeonState.Success:return e.stateIcon?"check":void 0;case o.NeonState.Error:return e.stateIcon?"times":void 0;default:return e.icon?e.icon:e.modelValue&&e.modelValue.length>0?"times":void 0}}),y=n.computed(()=>m.value&&!e.hideIcon&&(e.state!=="ready"||e.icon||e.modelValue&&!e.disabled&&e.modelValue.length>0)),g=n.computed(()=>{switch(e.state){case o.NeonState.Success:return c.NeonFunctionalColor.Success;case o.NeonState.Error:return c.NeonFunctionalColor.Error;case o.NeonState.Loading:return e.color;default:return c.NeonFunctionalColor.LowContrast}}),h=()=>{var t;(t=i.value)==null||t.focus()},S=()=>{var t;(t=i.value)==null||t.click()},v=()=>{r.value=!0,l("focus")},b=()=>{r.value=!1,l("blur")},I=t=>{e.disabled||(e.icon?l("icon-click"):d(""),t.preventDefault(),t.stopPropagation())},V=t=>{const u=t.target.value,s=e.maxlength&&u.length>e.maxlength?u.substring(0,e.maxlength):u;e.modelValue!==s&&d(s)},j=t=>{t.key!=="Backspace"&&e.maxlength&&e.modelValue&&e.modelValue.length>=e.maxlength&&t.preventDefault()},C=n.computed(()=>{if(e.placeholder)return e.placeholder;switch(e.type){case a.NeonInputType.Email:return"gbelson@hooli.com";case a.NeonInputType.Tel:return"+41785551234";case a.NeonInputType.Url:return"http://www.getskeleton.com";default:return""}});return{neonInput:i,focused:r,sanitizedAttributes:N,iconVisible:y,iconName:m,iconColor:g,computedPlaceholder:C,focus:h,click:S,onFocus:v,onBlur:b,iconClicked:I,changeValue:V,onKeyDown:j}}});module.exports=F;
|
|
2
2
|
//# sourceMappingURL=NeonInput.ts_vue_type_script_src_5fee2d86_lang.cjs.js.map
|
package/dist/components/user-input/input/NeonInput.ts_vue_type_script_src_5fee2d86_lang.cjs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NeonInput.ts_vue_type_script_src_5fee2d86_lang.cjs.js","sources":["../../../../src/components/user-input/input/NeonInput.ts?vue&type=script&src=5fee2d86&lang.ts"],"sourcesContent":["import { computed, defineComponent, ref, useAttrs } from 'vue';\nimport { NeonInputType } from '@/common/enums/NeonInputType';\nimport { NeonState } from '@/common/enums/NeonState';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonDebounceUtils } from '@/common/utils/NeonDebounceUtils';\n\n/**\n * Equivalent of, and wrapper around, an HTML input. Also supports <strong>textarea</strong>.\n */\nexport default defineComponent({\n name: 'NeonInput',\n components: {\n NeonIcon,\n },\n props: {\n /**\n * The id the input\n */\n id: { type: String, default: null },\n /**\n * The value of the input\n */\n modelValue: { type: String, default: null },\n /**\n * The type of input this is. NOTE: Neon provides custom components as alternatives in the following cases:\n * * file (use <a href=\"/user-input/file\">NeonFile</a>)\n * * password (use <a href=\"/user-input/password\">NeonPassword</a>)\n */\n type: { type: String as () => NeonInputType, default: NeonInputType.Text },\n /**\n * Placeholder text to display in the input\n */\n placeholder: { type: String, default: null },\n /**\n * Size of the input\n */\n size: { type: String as () => NeonSize, default: NeonSize.Medium },\n /**\n * Color of the input\n */\n color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.LowContrast },\n /**\n * The state of the input\n */\n state: { type: String as () => NeonState, default: NeonState.Ready },\n /**\n * The number of rows to display in the case of a textarea\n */\n rows: { type: Number, default: null },\n /**\n * The name of a clickable icon to display inside the input. This is used for clearing contents or e.g. in the case of\n * NeonPassword toggle showing/hiding the password. Defaults to <em>times</em> (for clearing the input's contents).\n */\n icon: { type: String, default: null },\n /**\n * Make the input field icon read-only, i.e. it will not emit events or be treated as a focusable button.\n */\n iconReadonly: { type: Boolean, default: false },\n /**\n * Hide the icon button, e.g. the X button to clear the input's contents.\n */\n hideIcon: { type: Boolean, default: false },\n /**\n * Tabindex to assign to the input.\n */\n tabindex: { type: Number, default: 0 },\n /**\n * The disabled state of the input\n */\n disabled: { type: Boolean, default: false },\n /**\n * When the state is success or error, display the field with the state color indicator, e.g. border or background\n * color.\n */\n stateHighlight: { type: Boolean, default: true },\n /**\n * When the state is success or error, display the state icon.\n */\n stateIcon: { type: Boolean, default: true },\n /**\n * The character limit for a textarea.\n */\n maxlength: { type: Number, default: null },\n /**\n * Debounce time in ms, set to 0 to disable.\n */\n debounce: { type: Number, default: 300 },\n },\n emits: [\n /**\n * Emitted when the input has gained focus\n * @type {void}\n */\n 'focus',\n /**\n * Emitted when the input has lost focus\n * @type {void}\n */\n 'blur',\n /**\n * Emitted when the icon is clicked\n * @type {void}\n */\n 'icon-click',\n /**\n * Emitted when the input value is changed, NOTE: is not triggered if input is over the textarea length limit\n * @type {string} the contents of the input\n */\n 'update:modelValue',\n ],\n setup(props, { emit }) {\n const attrs = useAttrs();\n const neonInput = ref<HTMLElement | null>(null);\n const focused = ref(false);\n\n const sanitizedAttributes = computed(() => {\n const {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onBlur,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onFocus,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onIconClick,\n ...sanitized\n } = attrs;\n\n return sanitized;\n });\n\n const emitModelValue = NeonDebounceUtils.debounce((value: string) => {\n emit('update:modelValue', value);\n }, props.debounce);\n\n const iconName = computed(() => {\n switch (props.state) {\n case NeonState.Loading:\n return 'loading';\n case NeonState.Success:\n return props.stateIcon ? 'check' : undefined;\n case NeonState.Error:\n return props.stateIcon ? 'times' : undefined;\n default:\n if (props.icon) {\n return props.icon;\n } else if (props.modelValue && props.modelValue.length > 0) {\n return 'times';\n }\n\n return undefined;\n }\n });\n\n const iconVisible = computed(() => {\n return (\n iconName.value &&\n !props.hideIcon &&\n (props.state !== 'ready' || props.icon || (props.modelValue && !props.disabled && props.modelValue.length > 0))\n );\n });\n\n const iconColor = computed(() => {\n switch (props.state) {\n case NeonState.Success:\n return NeonFunctionalColor.Success;\n case NeonState.Error:\n return NeonFunctionalColor.Error;\n case NeonState.Loading:\n return props.color;\n default:\n return NeonFunctionalColor.LowContrast;\n }\n });\n\n const focus = () => {\n neonInput.value?.focus();\n };\n\n const click = () => {\n neonInput.value?.click();\n };\n\n const onFocus = () => {\n focused.value = true;\n emit('focus');\n };\n\n const onBlur = () => {\n focused.value = false;\n emit('blur');\n };\n\n const iconClicked = ($event: Event) => {\n if (!props.disabled) {\n if (props.icon) {\n emit('icon-click');\n } else {\n emitModelValue('');\n }\n $event.preventDefault();\n $event.stopPropagation();\n }\n };\n\n const changeValue = (event: InputEvent) => {\n const val = (event.target as HTMLInputElement).value;\n const v = props.maxlength && val.length > props.maxlength ? val.substring(0, props.maxlength) : val;\n if (props.modelValue !== v) {\n emitModelValue(v);\n }\n };\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (\n event.key !== 'Backspace' &&\n props.maxlength &&\n props.modelValue &&\n props.modelValue.length >= props.maxlength\n ) {\n event.preventDefault();\n }\n };\n\n const computedPlaceholder = computed(() => {\n if (props.placeholder) {\n return props.placeholder;\n } else {\n switch (props.type) {\n case NeonInputType.Email:\n return 'gbelson@hooli.com';\n case NeonInputType.Tel:\n return '+41785551234';\n case NeonInputType.Url:\n return 'http://www.getskeleton.com';\n default:\n return '';\n }\n }\n });\n\n return {\n neonInput,\n focused,\n sanitizedAttributes,\n iconVisible,\n iconName,\n iconColor,\n computedPlaceholder,\n focus,\n click,\n onFocus,\n onBlur,\n iconClicked,\n changeValue,\n onKeyDown,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonInputType","NeonSize","NeonFunctionalColor","NeonState","props","emit","attrs","useAttrs","neonInput","ref","focused","sanitizedAttributes","computed","onBlur","onFocus","onIconClick","sanitized","emitModelValue","NeonDebounceUtils","value","iconName","iconVisible","iconColor","focus","_a","click","iconClicked","$event","changeValue","event","val","v","onKeyDown","computedPlaceholder"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"NeonInput.ts_vue_type_script_src_5fee2d86_lang.cjs.js","sources":["../../../../src/components/user-input/input/NeonInput.ts?vue&type=script&src=5fee2d86&lang.ts"],"sourcesContent":["import { computed, defineComponent, ref, useAttrs } from 'vue';\nimport { NeonInputType } from '@/common/enums/NeonInputType';\nimport { NeonState } from '@/common/enums/NeonState';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonDebounceUtils } from '@/common/utils/NeonDebounceUtils';\n\n/**\n * Equivalent of, and wrapper around, an HTML input. Also supports <strong>textarea</strong>.\n */\nexport default defineComponent({\n name: 'NeonInput',\n components: {\n NeonIcon,\n },\n props: {\n /**\n * The id the input\n */\n id: { type: String, default: null },\n /**\n * The value of the input\n */\n modelValue: { type: String, default: null },\n /**\n * The type of input this is. NOTE: Neon provides custom components as alternatives in the following cases:\n * * file (use <a href=\"/user-input/file\">NeonFile</a>)\n * * password (use <a href=\"/user-input/password\">NeonPassword</a>)\n */\n type: { type: String as () => NeonInputType, default: NeonInputType.Text },\n /**\n * Placeholder text to display in the input\n */\n placeholder: { type: String, default: null },\n /**\n * Size of the input\n */\n size: { type: String as () => NeonSize, default: NeonSize.Medium },\n /**\n * Color of the input\n */\n color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.LowContrast },\n /**\n * The state of the input\n */\n state: { type: String as () => NeonState, default: NeonState.Ready },\n /**\n * The number of rows to display in the case of a textarea\n */\n rows: { type: Number, default: null },\n /**\n * The name of a clickable icon to display inside the input. This is used for clearing contents or e.g. in the case of\n * NeonPassword toggle showing/hiding the password. Defaults to <em>times</em> (for clearing the input's contents).\n */\n icon: { type: String, default: null },\n /**\n * Make the input field icon read-only, i.e. it will not emit events or be treated as a focusable button.\n */\n iconReadonly: { type: Boolean, default: false },\n /**\n * Hide the icon button, e.g. the X button to clear the input's contents.\n */\n hideIcon: { type: Boolean, default: false },\n /**\n * Tabindex to assign to the input.\n */\n tabindex: { type: Number, default: 0 },\n /**\n * The disabled state of the input\n */\n disabled: { type: Boolean, default: false },\n /**\n * When the state is success or error, display the field with the state color indicator, e.g. border or background\n * color.\n */\n stateHighlight: { type: Boolean, default: true },\n /**\n * When the state is success or error, display the state icon.\n */\n stateIcon: { type: Boolean, default: true },\n /**\n * The character limit for a textarea.\n */\n maxlength: { type: Number, default: null },\n /**\n * Debounce time in ms, if no value is provided the default value set in NeonDebounceUtils is used (=300ms).\n * Set to 0 to disable debounce.\n */\n debounce: { type: Number, default: undefined },\n },\n emits: [\n /**\n * Emitted when the input has gained focus\n * @type {void}\n */\n 'focus',\n /**\n * Emitted when the input has lost focus\n * @type {void}\n */\n 'blur',\n /**\n * Emitted when the icon is clicked\n * @type {void}\n */\n 'icon-click',\n /**\n * Emitted when the input value is changed, NOTE: is not triggered if input is over the textarea length limit\n * @type {string} the contents of the input\n */\n 'update:modelValue',\n ],\n setup(props, { emit }) {\n const attrs = useAttrs();\n const neonInput = ref<HTMLElement | null>(null);\n const focused = ref(false);\n\n const sanitizedAttributes = computed(() => {\n const {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onBlur,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onFocus,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onIconClick,\n ...sanitized\n } = attrs;\n\n return sanitized;\n });\n\n const emitModelValue = NeonDebounceUtils.debounce((value: string) => {\n emit('update:modelValue', value);\n }, props.debounce);\n\n const iconName = computed(() => {\n switch (props.state) {\n case NeonState.Loading:\n return 'loading';\n case NeonState.Success:\n return props.stateIcon ? 'check' : undefined;\n case NeonState.Error:\n return props.stateIcon ? 'times' : undefined;\n default:\n if (props.icon) {\n return props.icon;\n } else if (props.modelValue && props.modelValue.length > 0) {\n return 'times';\n }\n\n return undefined;\n }\n });\n\n const iconVisible = computed(() => {\n return (\n iconName.value &&\n !props.hideIcon &&\n (props.state !== 'ready' || props.icon || (props.modelValue && !props.disabled && props.modelValue.length > 0))\n );\n });\n\n const iconColor = computed(() => {\n switch (props.state) {\n case NeonState.Success:\n return NeonFunctionalColor.Success;\n case NeonState.Error:\n return NeonFunctionalColor.Error;\n case NeonState.Loading:\n return props.color;\n default:\n return NeonFunctionalColor.LowContrast;\n }\n });\n\n const focus = () => {\n neonInput.value?.focus();\n };\n\n const click = () => {\n neonInput.value?.click();\n };\n\n const onFocus = () => {\n focused.value = true;\n emit('focus');\n };\n\n const onBlur = () => {\n focused.value = false;\n emit('blur');\n };\n\n const iconClicked = ($event: Event) => {\n if (!props.disabled) {\n if (props.icon) {\n emit('icon-click');\n } else {\n emitModelValue('');\n }\n $event.preventDefault();\n $event.stopPropagation();\n }\n };\n\n const changeValue = (event: InputEvent) => {\n const val = (event.target as HTMLInputElement).value;\n const v = props.maxlength && val.length > props.maxlength ? val.substring(0, props.maxlength) : val;\n if (props.modelValue !== v) {\n emitModelValue(v);\n }\n };\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (\n event.key !== 'Backspace' &&\n props.maxlength &&\n props.modelValue &&\n props.modelValue.length >= props.maxlength\n ) {\n event.preventDefault();\n }\n };\n\n const computedPlaceholder = computed(() => {\n if (props.placeholder) {\n return props.placeholder;\n } else {\n switch (props.type) {\n case NeonInputType.Email:\n return 'gbelson@hooli.com';\n case NeonInputType.Tel:\n return '+41785551234';\n case NeonInputType.Url:\n return 'http://www.getskeleton.com';\n default:\n return '';\n }\n }\n });\n\n return {\n neonInput,\n focused,\n sanitizedAttributes,\n iconVisible,\n iconName,\n iconColor,\n computedPlaceholder,\n focus,\n click,\n onFocus,\n onBlur,\n iconClicked,\n changeValue,\n onKeyDown,\n };\n },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonInputType","NeonSize","NeonFunctionalColor","NeonState","props","emit","attrs","useAttrs","neonInput","ref","focused","sanitizedAttributes","computed","onBlur","onFocus","onIconClick","sanitized","emitModelValue","NeonDebounceUtils","value","iconName","iconVisible","iconColor","focus","_a","click","iconClicked","$event","changeValue","event","val","v","onKeyDown","computedPlaceholder"],"mappings":"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"}
|
package/dist/components/user-input/input/NeonInput.ts_vue_type_script_src_5fee2d86_lang.es.js
CHANGED
|
@@ -27,7 +27,7 @@ var _sfc_main = defineComponent({
|
|
|
27
27
|
stateHighlight: { type: Boolean, default: true },
|
|
28
28
|
stateIcon: { type: Boolean, default: true },
|
|
29
29
|
maxlength: { type: Number, default: null },
|
|
30
|
-
debounce: { type: Number, default:
|
|
30
|
+
debounce: { type: Number, default: void 0 }
|
|
31
31
|
},
|
|
32
32
|
emits: [
|
|
33
33
|
"focus",
|
package/dist/components/user-input/input/NeonInput.ts_vue_type_script_src_5fee2d86_lang.es.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NeonInput.ts_vue_type_script_src_5fee2d86_lang.es.js","sources":["../../../../src/components/user-input/input/NeonInput.ts?vue&type=script&src=5fee2d86&lang.ts"],"sourcesContent":["import { computed, defineComponent, ref, useAttrs } from 'vue';\nimport { NeonInputType } from '@/common/enums/NeonInputType';\nimport { NeonState } from '@/common/enums/NeonState';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonDebounceUtils } from '@/common/utils/NeonDebounceUtils';\n\n/**\n * Equivalent of, and wrapper around, an HTML input. Also supports <strong>textarea</strong>.\n */\nexport default defineComponent({\n name: 'NeonInput',\n components: {\n NeonIcon,\n },\n props: {\n /**\n * The id the input\n */\n id: { type: String, default: null },\n /**\n * The value of the input\n */\n modelValue: { type: String, default: null },\n /**\n * The type of input this is. NOTE: Neon provides custom components as alternatives in the following cases:\n * * file (use <a href=\"/user-input/file\">NeonFile</a>)\n * * password (use <a href=\"/user-input/password\">NeonPassword</a>)\n */\n type: { type: String as () => NeonInputType, default: NeonInputType.Text },\n /**\n * Placeholder text to display in the input\n */\n placeholder: { type: String, default: null },\n /**\n * Size of the input\n */\n size: { type: String as () => NeonSize, default: NeonSize.Medium },\n /**\n * Color of the input\n */\n color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.LowContrast },\n /**\n * The state of the input\n */\n state: { type: String as () => NeonState, default: NeonState.Ready },\n /**\n * The number of rows to display in the case of a textarea\n */\n rows: { type: Number, default: null },\n /**\n * The name of a clickable icon to display inside the input. This is used for clearing contents or e.g. in the case of\n * NeonPassword toggle showing/hiding the password. Defaults to <em>times</em> (for clearing the input's contents).\n */\n icon: { type: String, default: null },\n /**\n * Make the input field icon read-only, i.e. it will not emit events or be treated as a focusable button.\n */\n iconReadonly: { type: Boolean, default: false },\n /**\n * Hide the icon button, e.g. the X button to clear the input's contents.\n */\n hideIcon: { type: Boolean, default: false },\n /**\n * Tabindex to assign to the input.\n */\n tabindex: { type: Number, default: 0 },\n /**\n * The disabled state of the input\n */\n disabled: { type: Boolean, default: false },\n /**\n * When the state is success or error, display the field with the state color indicator, e.g. border or background\n * color.\n */\n stateHighlight: { type: Boolean, default: true },\n /**\n * When the state is success or error, display the state icon.\n */\n stateIcon: { type: Boolean, default: true },\n /**\n * The character limit for a textarea.\n */\n maxlength: { type: Number, default: null },\n /**\n * Debounce time in ms, set to 0 to disable.\n */\n debounce: { type: Number, default: 300 },\n },\n emits: [\n /**\n * Emitted when the input has gained focus\n * @type {void}\n */\n 'focus',\n /**\n * Emitted when the input has lost focus\n * @type {void}\n */\n 'blur',\n /**\n * Emitted when the icon is clicked\n * @type {void}\n */\n 'icon-click',\n /**\n * Emitted when the input value is changed, NOTE: is not triggered if input is over the textarea length limit\n * @type {string} the contents of the input\n */\n 'update:modelValue',\n ],\n setup(props, { emit }) {\n const attrs = useAttrs();\n const neonInput = ref<HTMLElement | null>(null);\n const focused = ref(false);\n\n const sanitizedAttributes = computed(() => {\n const {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onBlur,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onFocus,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onIconClick,\n ...sanitized\n } = attrs;\n\n return sanitized;\n });\n\n const emitModelValue = NeonDebounceUtils.debounce((value: string) => {\n emit('update:modelValue', value);\n }, props.debounce);\n\n const iconName = computed(() => {\n switch (props.state) {\n case NeonState.Loading:\n return 'loading';\n case NeonState.Success:\n return props.stateIcon ? 'check' : undefined;\n case NeonState.Error:\n return props.stateIcon ? 'times' : undefined;\n default:\n if (props.icon) {\n return props.icon;\n } else if (props.modelValue && props.modelValue.length > 0) {\n return 'times';\n }\n\n return undefined;\n }\n });\n\n const iconVisible = computed(() => {\n return (\n iconName.value &&\n !props.hideIcon &&\n (props.state !== 'ready' || props.icon || (props.modelValue && !props.disabled && props.modelValue.length > 0))\n );\n });\n\n const iconColor = computed(() => {\n switch (props.state) {\n case NeonState.Success:\n return NeonFunctionalColor.Success;\n case NeonState.Error:\n return NeonFunctionalColor.Error;\n case NeonState.Loading:\n return props.color;\n default:\n return NeonFunctionalColor.LowContrast;\n }\n });\n\n const focus = () => {\n neonInput.value?.focus();\n };\n\n const click = () => {\n neonInput.value?.click();\n };\n\n const onFocus = () => {\n focused.value = true;\n emit('focus');\n };\n\n const onBlur = () => {\n focused.value = false;\n emit('blur');\n };\n\n const iconClicked = ($event: Event) => {\n if (!props.disabled) {\n if (props.icon) {\n emit('icon-click');\n } else {\n emitModelValue('');\n }\n $event.preventDefault();\n $event.stopPropagation();\n }\n };\n\n const changeValue = (event: InputEvent) => {\n const val = (event.target as HTMLInputElement).value;\n const v = props.maxlength && val.length > props.maxlength ? val.substring(0, props.maxlength) : val;\n if (props.modelValue !== v) {\n emitModelValue(v);\n }\n };\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (\n event.key !== 'Backspace' &&\n props.maxlength &&\n props.modelValue &&\n props.modelValue.length >= props.maxlength\n ) {\n event.preventDefault();\n }\n };\n\n const computedPlaceholder = computed(() => {\n if (props.placeholder) {\n return props.placeholder;\n } else {\n switch (props.type) {\n case NeonInputType.Email:\n return 'gbelson@hooli.com';\n case NeonInputType.Tel:\n return '+41785551234';\n case NeonInputType.Url:\n return 'http://www.getskeleton.com';\n default:\n return '';\n }\n }\n });\n\n return {\n neonInput,\n focused,\n sanitizedAttributes,\n iconVisible,\n iconName,\n iconColor,\n computedPlaceholder,\n focus,\n click,\n onFocus,\n onBlur,\n iconClicked,\n changeValue,\n onKeyDown,\n };\n },\n});\n"],"names":["onBlur","onFocus"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"NeonInput.ts_vue_type_script_src_5fee2d86_lang.es.js","sources":["../../../../src/components/user-input/input/NeonInput.ts?vue&type=script&src=5fee2d86&lang.ts"],"sourcesContent":["import { computed, defineComponent, ref, useAttrs } from 'vue';\nimport { NeonInputType } from '@/common/enums/NeonInputType';\nimport { NeonState } from '@/common/enums/NeonState';\nimport { NeonSize } from '@/common/enums/NeonSize';\nimport { NeonFunctionalColor } from '@/common/enums/NeonFunctionalColor';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { NeonDebounceUtils } from '@/common/utils/NeonDebounceUtils';\n\n/**\n * Equivalent of, and wrapper around, an HTML input. Also supports <strong>textarea</strong>.\n */\nexport default defineComponent({\n name: 'NeonInput',\n components: {\n NeonIcon,\n },\n props: {\n /**\n * The id the input\n */\n id: { type: String, default: null },\n /**\n * The value of the input\n */\n modelValue: { type: String, default: null },\n /**\n * The type of input this is. NOTE: Neon provides custom components as alternatives in the following cases:\n * * file (use <a href=\"/user-input/file\">NeonFile</a>)\n * * password (use <a href=\"/user-input/password\">NeonPassword</a>)\n */\n type: { type: String as () => NeonInputType, default: NeonInputType.Text },\n /**\n * Placeholder text to display in the input\n */\n placeholder: { type: String, default: null },\n /**\n * Size of the input\n */\n size: { type: String as () => NeonSize, default: NeonSize.Medium },\n /**\n * Color of the input\n */\n color: { type: String as () => NeonFunctionalColor, default: NeonFunctionalColor.LowContrast },\n /**\n * The state of the input\n */\n state: { type: String as () => NeonState, default: NeonState.Ready },\n /**\n * The number of rows to display in the case of a textarea\n */\n rows: { type: Number, default: null },\n /**\n * The name of a clickable icon to display inside the input. This is used for clearing contents or e.g. in the case of\n * NeonPassword toggle showing/hiding the password. Defaults to <em>times</em> (for clearing the input's contents).\n */\n icon: { type: String, default: null },\n /**\n * Make the input field icon read-only, i.e. it will not emit events or be treated as a focusable button.\n */\n iconReadonly: { type: Boolean, default: false },\n /**\n * Hide the icon button, e.g. the X button to clear the input's contents.\n */\n hideIcon: { type: Boolean, default: false },\n /**\n * Tabindex to assign to the input.\n */\n tabindex: { type: Number, default: 0 },\n /**\n * The disabled state of the input\n */\n disabled: { type: Boolean, default: false },\n /**\n * When the state is success or error, display the field with the state color indicator, e.g. border or background\n * color.\n */\n stateHighlight: { type: Boolean, default: true },\n /**\n * When the state is success or error, display the state icon.\n */\n stateIcon: { type: Boolean, default: true },\n /**\n * The character limit for a textarea.\n */\n maxlength: { type: Number, default: null },\n /**\n * Debounce time in ms, if no value is provided the default value set in NeonDebounceUtils is used (=300ms).\n * Set to 0 to disable debounce.\n */\n debounce: { type: Number, default: undefined },\n },\n emits: [\n /**\n * Emitted when the input has gained focus\n * @type {void}\n */\n 'focus',\n /**\n * Emitted when the input has lost focus\n * @type {void}\n */\n 'blur',\n /**\n * Emitted when the icon is clicked\n * @type {void}\n */\n 'icon-click',\n /**\n * Emitted when the input value is changed, NOTE: is not triggered if input is over the textarea length limit\n * @type {string} the contents of the input\n */\n 'update:modelValue',\n ],\n setup(props, { emit }) {\n const attrs = useAttrs();\n const neonInput = ref<HTMLElement | null>(null);\n const focused = ref(false);\n\n const sanitizedAttributes = computed(() => {\n const {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onBlur,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onFocus,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n onIconClick,\n ...sanitized\n } = attrs;\n\n return sanitized;\n });\n\n const emitModelValue = NeonDebounceUtils.debounce((value: string) => {\n emit('update:modelValue', value);\n }, props.debounce);\n\n const iconName = computed(() => {\n switch (props.state) {\n case NeonState.Loading:\n return 'loading';\n case NeonState.Success:\n return props.stateIcon ? 'check' : undefined;\n case NeonState.Error:\n return props.stateIcon ? 'times' : undefined;\n default:\n if (props.icon) {\n return props.icon;\n } else if (props.modelValue && props.modelValue.length > 0) {\n return 'times';\n }\n\n return undefined;\n }\n });\n\n const iconVisible = computed(() => {\n return (\n iconName.value &&\n !props.hideIcon &&\n (props.state !== 'ready' || props.icon || (props.modelValue && !props.disabled && props.modelValue.length > 0))\n );\n });\n\n const iconColor = computed(() => {\n switch (props.state) {\n case NeonState.Success:\n return NeonFunctionalColor.Success;\n case NeonState.Error:\n return NeonFunctionalColor.Error;\n case NeonState.Loading:\n return props.color;\n default:\n return NeonFunctionalColor.LowContrast;\n }\n });\n\n const focus = () => {\n neonInput.value?.focus();\n };\n\n const click = () => {\n neonInput.value?.click();\n };\n\n const onFocus = () => {\n focused.value = true;\n emit('focus');\n };\n\n const onBlur = () => {\n focused.value = false;\n emit('blur');\n };\n\n const iconClicked = ($event: Event) => {\n if (!props.disabled) {\n if (props.icon) {\n emit('icon-click');\n } else {\n emitModelValue('');\n }\n $event.preventDefault();\n $event.stopPropagation();\n }\n };\n\n const changeValue = (event: InputEvent) => {\n const val = (event.target as HTMLInputElement).value;\n const v = props.maxlength && val.length > props.maxlength ? val.substring(0, props.maxlength) : val;\n if (props.modelValue !== v) {\n emitModelValue(v);\n }\n };\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (\n event.key !== 'Backspace' &&\n props.maxlength &&\n props.modelValue &&\n props.modelValue.length >= props.maxlength\n ) {\n event.preventDefault();\n }\n };\n\n const computedPlaceholder = computed(() => {\n if (props.placeholder) {\n return props.placeholder;\n } else {\n switch (props.type) {\n case NeonInputType.Email:\n return 'gbelson@hooli.com';\n case NeonInputType.Tel:\n return '+41785551234';\n case NeonInputType.Url:\n return 'http://www.getskeleton.com';\n default:\n return '';\n }\n }\n });\n\n return {\n neonInput,\n focused,\n sanitizedAttributes,\n iconVisible,\n iconName,\n iconColor,\n computedPlaceholder,\n focus,\n click,\n onFocus,\n onBlur,\n iconClicked,\n changeValue,\n onKeyDown,\n };\n },\n});\n"],"names":["onBlur","onFocus"],"mappings":"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"}
|
package/dist/neon.cjs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var o=require("./components/navigation/action-menu/NeonActionMenu.cjs.js"),n=require("./components/feedback/alert/NeonAlert.cjs.js"),r=require("./components/feedback/alert/container/NeonAlertContainer.cjs.js"),s=require("./components/navigation/anchor/NeonAnchor.cjs.js"),t=require("./components/presentation/badge/NeonBadge.cjs.js"),i=require("./components/user-input/button/NeonButton.cjs.js"),a=require("./components/layout/card/NeonCard.cjs.js"),N=require("./components/layout/card/body/NeonCardBody.cjs.js"),c=require("./components/layout/card/footer/NeonCardFooter.cjs.js"),l=require("./components/layout/card/header/NeonCardHeader.cjs.js"),u=require("./components/user-input/chip/NeonChip.cjs.js"),p=require("./components/user-input/color/NeonColor.cjs.js"),m=require("./components/user-input/date-picker/NeonDatePicker.cjs.js"),j=require("./components/feedback/dialog/NeonDialog.cjs.js"),d=require("./components/layout/drawer/NeonDrawer.cjs.js"),v=require("./components/presentation/dropdown/NeonDropdown.cjs.js"),S=require("./components/navigation/dropdown-menu/NeonDropdownMenu.cjs.js"),q=require("./components/user-input/drop-zone/NeonDropZone.cjs.js"),g=require("./components/presentation/expansion-indicator/NeonExpansionIndicator.cjs.js"),b=require("./components/presentation/expansion-panel/NeonExpansionPanel.cjs.js"),P=require("./components/user-input/field-group/NeonFieldGroup.cjs.js"),C=require("./components/user-input/field/NeonField.cjs.js"),y=require("./components/user-input/file/NeonFile.cjs.js"),T=require("./components/user-input/filter-list/NeonFilterList.cjs.js"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var o=require("./components/navigation/action-menu/NeonActionMenu.cjs.js"),n=require("./components/feedback/alert/NeonAlert.cjs.js"),r=require("./components/feedback/alert/container/NeonAlertContainer.cjs.js"),s=require("./components/navigation/anchor/NeonAnchor.cjs.js"),t=require("./components/presentation/badge/NeonBadge.cjs.js"),i=require("./components/user-input/button/NeonButton.cjs.js"),a=require("./components/layout/card/NeonCard.cjs.js"),N=require("./components/layout/card/body/NeonCardBody.cjs.js"),c=require("./components/layout/card/footer/NeonCardFooter.cjs.js"),l=require("./components/layout/card/header/NeonCardHeader.cjs.js"),u=require("./components/user-input/chip/NeonChip.cjs.js"),p=require("./components/user-input/color/NeonColor.cjs.js"),m=require("./components/user-input/date-picker/NeonDatePicker.cjs.js"),j=require("./components/feedback/dialog/NeonDialog.cjs.js"),d=require("./components/layout/drawer/NeonDrawer.cjs.js"),v=require("./components/presentation/dropdown/NeonDropdown.cjs.js"),S=require("./components/navigation/dropdown-menu/NeonDropdownMenu.cjs.js"),q=require("./components/user-input/drop-zone/NeonDropZone.cjs.js"),g=require("./components/presentation/expansion-indicator/NeonExpansionIndicator.cjs.js"),b=require("./components/presentation/expansion-panel/NeonExpansionPanel.cjs.js"),P=require("./components/user-input/field-group/NeonFieldGroup.cjs.js"),C=require("./components/user-input/field/NeonField.cjs.js"),y=require("./components/user-input/file/NeonFile.cjs.js"),T=require("./components/user-input/filter-list/NeonFilterList.cjs.js"),U=require("./components/layout/footer/NeonFooter.cjs.js"),D=require("./components/layout/grid/NeonGrid.cjs.js"),h=require("./components/layout/grid/grid-area/NeonGridArea.cjs.js"),w=require("./components/presentation/icon/NeonIcon.cjs.js"),L=require("./components/user-input/input/NeonInput.cjs.js"),A=require("./components/user-input/input-indicator/NeonInputIndicator.cjs.js"),I=require("./components/presentation/label/NeonLabel.cjs.js"),M=require("./components/feedback/linear-progress/NeonLinearProgress.cjs.js"),k=require("./components/navigation/link/NeonLink.cjs.js"),F=require("./components/user-input/list/NeonList.cjs.js"),f=require("./components/navigation/menu/NeonMenu.cjs.js"),z=require("./components/layout/modal/NeonModal.cjs.js"),B=require("./components/feedback/note/NeonNote.cjs.js"),R=require("./components/feedback/notification-counter/NeonNotificationCounter.cjs.js"),E=require("./components/user-input/number/NeonNumber.cjs.js"),G=require("./components/layout/page/NeonPage.cjs.js"),O=require("./components/user-input/password/NeonPassword.cjs.js"),x=require("./components/user-input/range-slider/NeonRangeSlider.cjs.js"),H=require("./components/layout/side-nav/NeonSideNav.cjs.js"),V=require("./components/user-input/search/NeonSearch.cjs.js"),Z=require("./components/user-input/select/NeonSelect.cjs.js"),_=require("./components/user-input/selectable-card/NeonSelectableCard.cjs.js"),J=require("./components/feedback/skeleton-loader/NeonSkeletonLoader.cjs.js"),K=require("./components/user-input/slider/NeonSlider.cjs.js"),Q=require("./components/feedback/splash-loader/NeonSplashLoader.cjs.js"),W=require("./components/navigation/stepper/NeonStepper.cjs.js"),X=require("./components/user-input/switch/NeonSwitch.cjs.js"),Y=require("./components/presentation/tabs/tab/NeonTab.cjs.js"),$=require("./components/presentation/tabs/NeonTabs.cjs.js"),ee=require("./components/feedback/alert/container/NeonToastContainer.cjs.js"),oe=require("./components/user-input/toggle/NeonToggle.cjs.js"),ne=require("./components/user-input/toggle-chip/NeonToggleChip.cjs.js"),re=require("./components/feedback/tooltip/NeonTooltip.cjs.js"),se=require("./components/layout/top-nav/NeonTopNav.cjs.js"),te=require("./components/navigation/tree-menu/NeonTreeMenu.cjs.js"),ie=require("./common/enums/NeonAlertLevel.cjs.js"),ae=require("./common/enums/NeonAlertPlacement.cjs.js"),Ne=require("./common/enums/NeonButtonSize.cjs.js"),ce=require("./common/enums/NeonButtonStyle.cjs.js"),le=require("./common/enums/NeonChipAction.cjs.js"),ue=require("./common/enums/NeonDropdownPlacement.cjs.js"),pe=require("./common/enums/NeonDropdownStyle.cjs.js"),me=require("./common/enums/NeonFunctionalColor.cjs.js"),je=require("./common/enums/NeonHorizontalPosition.cjs.js"),de=require("./common/enums/NeonInputMode.cjs.js"),ve=require("./common/enums/NeonInputType.cjs.js"),Se=require("./common/enums/NeonLabelSize.cjs.js"),qe=require("./common/enums/NeonMode.cjs.js"),ge=require("./common/enums/NeonOrientation.cjs.js"),be=require("./common/enums/NeonOutlineStyle.cjs.js"),Pe=require("./common/enums/NeonPlacement.cjs.js"),Ce=require("./common/enums/NeonPosition.cjs.js"),ye=require("./common/enums/NeonResponsive.cjs.js"),Te=require("./common/enums/NeonSize.cjs.js"),Ue=require("./common/enums/NeonSplashLoaderSize.cjs.js"),De=require("./common/enums/NeonState.cjs.js"),he=require("./common/enums/NeonSwitchStyle.cjs.js"),we=require("./common/enums/NeonToggleStyle.cjs.js"),Le=require("./common/enums/NeonTooltipStyle.cjs.js"),Ae=require("./common/enums/NeonVerticalPosition.cjs.js"),Ie=require("./common/utils/NeonAlertService.cjs.js"),e=require("./common/utils/NeonClipboardService.cjs.js"),Me=require("./common/utils/NeonClosableUtils.cjs.js"),ke=require("./common/utils/NeonDateUtils.cjs.js"),Fe=require("./common/utils/NeonDebounceUtils.cjs.js"),fe=require("./common/utils/NeonDropdownPlacementUtils.cjs.js"),ze=require("./common/utils/NeonEventBus.cjs.js"),Be=require("./common/utils/NeonIconRegistry.cjs.js"),Re=require("./common/utils/NeonModeUtils.cjs.js"),Ee=require("./common/utils/NeonNumberUtils.cjs.js"),Ge=require("./common/utils/NeonPlacementUtils.cjs.js"),Oe=require("./common/utils/NeonResponsiveUtils.cjs.js"),xe=require("./common/utils/NeonScrollUtils.cjs.js"),He=require("./common/utils/NeonToastService.cjs.js"),Ve=require("./common/utils/NeonTooltipPlacementUtils.cjs.js"),Ze=require("./common/utils/RegisterIcons.cjs.js");exports.NeonActionMenu=o;exports.NeonAlert=n;exports.NeonAlertContainer=r;exports.NeonAnchor=s;exports.NeonBadge=t;exports.NeonButton=i;exports.NeonCard=a;exports.NeonCardBody=N;exports.NeonCardFooter=c;exports.NeonCardHeader=l;exports.NeonChip=u;exports.NeonColor=p;exports.NeonDatePicker=m;exports.NeonDialog=j;exports.NeonDrawer=d;exports.NeonDropdown=v;exports.NeonDropdownMenu=S;exports.NeonDropZone=q;exports.NeonExpansionIndicator=g;exports.NeonExpansionPanel=b;exports.NeonFieldGroup=P;exports.NeonField=C;exports.NeonFile=y;exports.NeonFilterList=T;exports.NeonFooter=U;exports.NeonGrid=D;exports.NeonGridArea=h;exports.NeonIcon=w;exports.NeonInput=L;exports.NeonInputIndicator=A;exports.NeonLabel=I;exports.NeonLinearProgress=M;exports.NeonLink=k;exports.NeonList=F;exports.NeonMenu=f;exports.NeonModal=z;exports.NeonNote=B;exports.NeonNotificationCounter=R;exports.NeonNumber=E;exports.NeonPage=G;exports.NeonPassword=O;exports.NeonRangeSlider=x;exports.NeonSideNav=H;exports.NeonSearch=V;exports.NeonSelect=Z;exports.NeonSelectableCard=_;exports.NeonSkeletonLoader=J;exports.NeonSlider=K;exports.NeonSplashLoader=Q;exports.NeonStepper=W;exports.NeonSwitch=X;exports.NeonTab=Y;exports.NeonTabs=$;exports.NeonToastContainer=ee;exports.NeonToggle=oe;exports.NeonToggleChip=ne;exports.NeonTooltip=re;exports.NeonTopNav=se;exports.NeonTreeMenu=te;exports.NeonAlertLevel=ie.NeonAlertLevel;exports.NeonAlertPlacement=ae.NeonAlertPlacement;exports.NeonButtonSize=Ne.NeonButtonSize;exports.NeonButtonStyle=ce.NeonButtonStyle;exports.NeonChipAction=le.NeonChipAction;exports.NeonDropdownPlacement=ue.NeonDropdownPlacement;exports.NeonDropdownStyle=pe.NeonDropdownStyle;exports.NeonFunctionalColor=me.NeonFunctionalColor;exports.NeonHorizontalPosition=je.NeonHorizontalPosition;exports.NeonInputMode=de.NeonInputMode;exports.NeonInputType=ve.NeonInputType;exports.NeonLabelSize=Se.NeonLabelSize;exports.NeonMode=qe.NeonMode;exports.NeonOrientation=ge.NeonOrientation;exports.NeonOutlineStyle=be.NeonOutlineStyle;exports.NeonPlacement=Pe.NeonPlacement;exports.NeonPosition=Ce.NeonPosition;exports.NeonResponsive=ye.NeonResponsive;exports.NeonSize=Te.NeonSize;exports.NeonSplashLoaderSize=Ue.NeonSplashLoaderSize;exports.NeonState=De.NeonState;exports.NeonSwitchStyle=he.NeonSwitchStyle;exports.NeonToggleStyle=we.NeonToggleStyle;exports.NeonTooltipStyle=Le.NeonTooltipStyle;exports.NeonVerticalPosition=Ae.NeonVerticalPosition;exports.NeonAlertService=Ie.NeonAlertService;exports.NeonClipboardService=e.NeonClipboardService;exports.NeonClipboardSupport=e.NeonClipboardSupport;exports.NeonClosableUtils=Me.NeonClosableUtils;exports.NeonDateUtils=ke.NeonDateUtils;exports.NeonDebounceUtils=Fe.NeonDebounceUtils;exports.NeonDropdownPlacementUtils=fe.NeonDropdownPlacementUtils;exports.NeonEventBus=ze.NeonEventBus;exports.NeonIconRegistry=Be.NeonIconRegistry;exports.NeonModeUtils=Re.NeonModeUtils;exports.NeonNumberUtils=Ee.NeonNumberUtils;exports.NeonPlacementUtils=Ge.NeonPlacementUtils;exports.NeonResponsiveUtils=Oe.NeonResponsiveUtils;exports.NeonScrollUtils=xe.NeonScrollUtils;exports.NeonToastService=He.NeonToastService;exports.NeonTooltipPlacementUtils=Ve.NeonTooltipPlacementUtils;exports.RegisterIcons=Ze.RegisterIcons;
|
|
2
2
|
//# sourceMappingURL=neon.cjs.js.map
|
package/dist/neon.es.js
CHANGED
|
@@ -86,6 +86,7 @@ export { NeonAlertService } from "./common/utils/NeonAlertService.es.js";
|
|
|
86
86
|
export { NeonClipboardService, NeonClipboardSupport } from "./common/utils/NeonClipboardService.es.js";
|
|
87
87
|
export { NeonClosableUtils } from "./common/utils/NeonClosableUtils.es.js";
|
|
88
88
|
export { NeonDateUtils } from "./common/utils/NeonDateUtils.es.js";
|
|
89
|
+
export { NeonDebounceUtils } from "./common/utils/NeonDebounceUtils.es.js";
|
|
89
90
|
export { NeonDropdownPlacementUtils } from "./common/utils/NeonDropdownPlacementUtils.es.js";
|
|
90
91
|
export { NeonEventBus } from "./common/utils/NeonEventBus.es.js";
|
|
91
92
|
export { NeonIconRegistry } from "./common/utils/NeonIconRegistry.es.js";
|
package/dist/neon.es.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"neon.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"neon.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -123,11 +123,12 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
123
123
|
default: null;
|
|
124
124
|
};
|
|
125
125
|
/**
|
|
126
|
-
* Debounce time in ms, set
|
|
126
|
+
* Debounce time in ms, if no value is provided the default value set in NeonDebounceUtils is used (=300ms).
|
|
127
|
+
* Set to 0 to disable debounce.
|
|
127
128
|
*/
|
|
128
129
|
debounce: {
|
|
129
130
|
type: NumberConstructor;
|
|
130
|
-
default:
|
|
131
|
+
default: undefined;
|
|
131
132
|
};
|
|
132
133
|
}, {
|
|
133
134
|
neonInput: import("vue").Ref<HTMLElement | null>;
|
|
@@ -264,11 +265,12 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
264
265
|
default: null;
|
|
265
266
|
};
|
|
266
267
|
/**
|
|
267
|
-
* Debounce time in ms, set
|
|
268
|
+
* Debounce time in ms, if no value is provided the default value set in NeonDebounceUtils is used (=300ms).
|
|
269
|
+
* Set to 0 to disable debounce.
|
|
268
270
|
*/
|
|
269
271
|
debounce: {
|
|
270
272
|
type: NumberConstructor;
|
|
271
|
-
default:
|
|
273
|
+
default: undefined;
|
|
272
274
|
};
|
|
273
275
|
}>> & {
|
|
274
276
|
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
package/dist/src/neon.d.ts
CHANGED
|
@@ -111,6 +111,7 @@ export { NeonAlertService } from './common/utils/NeonAlertService';
|
|
|
111
111
|
export { NeonClipboardService, NeonClipboardSupport } from './common/utils/NeonClipboardService';
|
|
112
112
|
export { NeonClosableUtils } from './common/utils/NeonClosableUtils';
|
|
113
113
|
export { NeonDateUtils } from './common/utils/NeonDateUtils';
|
|
114
|
+
export { NeonDebounceUtils } from './common/utils/NeonDebounceUtils';
|
|
114
115
|
export { NeonDropdownPlacementUtils } from './common/utils/NeonDropdownPlacementUtils';
|
|
115
116
|
export { NeonEventBus } from './common/utils/NeonEventBus';
|
|
116
117
|
export { NeonIconRegistry } from './common/utils/NeonIconRegistry';
|
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": "10.0.
|
|
4
|
+
"version": "10.0.4",
|
|
5
5
|
"main": "./dist/neon.cjs.js",
|
|
6
6
|
"module": "./dist/neon.es.js",
|
|
7
7
|
"types": "./dist/src/neon.d.ts",
|