fiery-rabbit 0.0.1

package/src/components/tab-view/src/tab-view.vue

@@ -0,0 +1,82 @@
+<template>
+	<TabView
+		:ref="(el) => (tabViewRef = el)"
+		v-model:active-index="activeIndexValue"
+		:lazy="lazy"
+		:scrollable="scrollable"
+		:tabindex="tabindex"
+		:select-on-focus="selectOnFocus"
+		:pt="pt"
+		:pt-options="ptOptions"
+		:unstyled="unstyled"
+		@tab-change="(event) => emits('tab-change', event)"
+		@tab-click="(event) => emits('tab-click', event)"
+	>
+		<slot />
+		<template
+			v-if="!!useSlots().previousicon"
+			#previousicon
+		>
+			<slot name="previousicon" />
+		</template>
+		<template
+			v-if="!!useSlots().nexticon"
+			#nexticon
+		>
+			<slot name="nexticon" />
+		</template>
+	</TabView>
+</template>
+
+<script setup lang="ts">
+import { ref, watch, useSlots } from 'vue';
+import { PassThroughOptions } from 'primevue/passthrough';
+import TabView, { TabViewPassThroughOptions, TabViewChangeEvent, TabViewClickEvent } from 'primevue/tabview';
+
+defineOptions({ name: 'RabbitTabView' });
+
+export declare type PassThrough<T = void> = T | object | undefined;
+
+export interface IProps {
+	activeIndex: number;
+	lazy: boolean;
+	scrollable: boolean;
+	tabindex: number;
+	selectOnFocus: boolean;
+	pt: PassThrough<TabViewPassThroughOptions>;
+	ptOptions: PassThroughOptions;
+	unstyled: boolean;
+}
+
+const props = withDefaults(defineProps<Partial<IProps>>(), {
+	activeIndex: 0,
+	lazy: false,
+	scrollable: false,
+	tabindex: 0,
+	selectOnFocus: false,
+	unstyled: false,
+});
+
+const emits = defineEmits<{
+	(e: 'update:activeIndex', index?: number): void;
+	(e: 'tab-change', event?: TabViewChangeEvent): void;
+	(e: 'tab-click', event?: TabViewClickEvent): void;
+}>();
+
+const tabViewRef = ref();
+const activeIndexValue = ref<number | undefined>(props.activeIndex);
+
+watch(
+	() => props.activeIndex,
+	(val) => (activeIndexValue.value = val),
+	{ deep: true },
+);
+
+watch(activeIndexValue, (val) => emits('update:activeIndex', val), { deep: true });
+
+defineExpose({ tabView: tabViewRef });
+</script>
+
+<style lang="scss" scoped>
+@import '../style/style.scss';
+</style>

package/src/components/tag/src/tag.vue

@@ -0,0 +1,53 @@
+<template>
+	<Tag
+		:ref="(el) => (tagRef = el)"
+		:value="value"
+		:severity="severity"
+		:rounded="rounded"
+		:pt="pt"
+		:pt-options="ptOptions"
+		:unstyled="unstyled"
+	>
+		<slot />
+		<template
+			v-if="!!useSlots().icon"
+			#icon
+		>
+			<slot name="icon" />
+		</template>
+	</Tag>
+</template>
+
+<script setup lang="ts">
+import { ref, useSlots } from 'vue';
+import { PassThroughOptions } from 'primevue/passthrough';
+import Tag, { TagPassThroughOptions } from 'primevue/tag';
+
+defineOptions({ name: 'RabbitTag' });
+
+export declare type HintedString<T extends string> = (string & {}) | T;
+
+export declare type PassThrough<T = void> = T | object | undefined;
+
+export interface IProps {
+	value: any;
+	severity: HintedString<'success' | 'secondary' | 'info' | 'warning' | 'danger' | 'contrast'>;
+	rounded: boolean;
+	pt: PassThrough<TagPassThroughOptions>;
+	ptOptions: PassThroughOptions;
+	unstyled: boolean;
+}
+
+withDefaults(defineProps<Partial<IProps>>(), {
+	rounded: false,
+	unstyled: false,
+});
+
+const tagRef = ref();
+
+defineExpose({ tag: tagRef });
+</script>
+
+<style lang="scss" scoped>
+@import '../style/style.scss';
+</style>

package/src/components/terminal/src/terminal.vue

@@ -0,0 +1,40 @@
+<template>
+	<Terminal
+		:ref="(el) => (terminalRef = el)"
+		:welcome-message="welcomeMessage"
+		:prompt="prompt"
+		:pt="pt"
+		:pt-options="ptOptions"
+		:unstyled="unstyled"
+	/>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import { PassThroughOptions } from 'primevue/passthrough';
+import Terminal, { TerminalPassThroughOptions } from 'primevue/terminal';
+
+defineOptions({ name: 'RabbitTerminal' });
+
+export declare type PassThrough<T = void> = T | object | undefined;
+
+export interface IProps {
+	welcomeMessage: string;
+	prompt: string;
+	pt: PassThrough<TerminalPassThroughOptions>;
+	ptOptions: PassThroughOptions;
+	unstyled: boolean;
+}
+
+withDefaults(defineProps<Partial<IProps>>(), {
+	unstyled: false,
+});
+
+const terminalRef = ref();
+
+defineExpose({ terminal: terminalRef });
+</script>
+
+<style lang="scss" scoped>
+@import '../style/style.scss';
+</style>

package/src/components/textarea/src/textarea.vue

@@ -0,0 +1,86 @@
+<template>
+	<Textarea
+		:ref="(el) => (textareaRef = el)"
+		v-model="value"
+		:auto-resize="autoResize"
+		:placeholder="placeholder"
+		:rows="rows"
+		:cols="cols"
+		:variant="layoutContext?.inputStyle ?? variant"
+		:id="inputId ?? formItemContext?.prop"
+		:aria-describedby="`${formItemContext?.prop}-error`"
+		:disabled="formItemContext?.disabled ?? disabled"
+		:invalid="
+			formItemContext?.formItemValidate !== undefined && formItemContext?.formItemValidate !== null
+				? !formItemContext?.formItemValidate
+				: invalid
+		"
+		:class="inputClass"
+		:pt="pt"
+		:pt-options="ptOptions"
+		:unstyled="unstyled"
+		@input="() => (handleInput(), emits('input', value))"
+		@focus="(event) => emits('focus', event)"
+		@blur="(event) => emits('blur', event)"
+	/>
+</template>
+
+<script setup lang="ts">
+import { ref, watch, inject } from 'vue';
+import { PassThroughOptions } from 'primevue/passthrough';
+import Textarea, { TextareaPassThroughOptions } from 'primevue/textarea';
+
+defineOptions({ name: 'RabbitTextarea' });
+
+export declare type PassThrough<T = void> = T | object | undefined;
+
+export interface IProps {
+	invalid: boolean;
+	modelValue: string;
+	autoResize: boolean;
+	variant: 'filled' | 'outlined';
+	disabled: boolean;
+	placeholder: string;
+	rows: string;
+	cols: string;
+	inputClass: string | object;
+	inputId: string;
+	pt: PassThrough<TextareaPassThroughOptions>;
+	ptOptions: PassThroughOptions;
+	unstyled: boolean;
+}
+
+const props = withDefaults(defineProps<Partial<IProps>>(), {
+	invalid: false,
+	disabled: false,
+	autoResize: false,
+	variant: 'outlined',
+	unstyled: false,
+});
+
+const emits = defineEmits<{
+	(e: 'update:modelValue', params: string | undefined): void;
+	(e: 'input', value?: string | undefined): void;
+	(e: 'focus', event?: Event): void;
+	(e: 'blur', event?: Event): void;
+}>();
+
+const layoutContext: any = inject('layout', undefined);
+const textareaRef = ref();
+const formItemContext: any = inject('rabbitFormItem', undefined);
+const value = ref<string | undefined>(props.modelValue);
+
+watch(
+	() => props.modelValue,
+	(val) => (value.value = val),
+	{ deep: true },
+);
+
+const handleInput = () => emits('update:modelValue', value.value);
+
+defineExpose({ textarea: textareaRef });
+</script>
+
+<style lang="scss" scoped>
+@import '../style/style.scss';
+</style>

package/src/components/tiered-menu/src/tiered-menu.vue

@@ -0,0 +1,122 @@
+<template>
+	<TieredMenu
+		:ref="(el) => (tieredMenuRef = el)"
+		:model="model"
+		:popup="popup"
+		:append-to="appendTo"
+		:auto-z-index="autoZIndex"
+		:base-z-index="baseZIndex"
+		:disabled="disabled"
+		:tabindex="tabindex"
+		:aria-label="ariaLabel"
+		:aria-labelledby="ariaLabelledby"
+		:pt="pt"
+		:pt-options="ptOptions"
+		:unstyled="unstyled"
+		@focus="(event) => emits('focus', event)"
+		@blur="(event) => emits('blur', event)"
+		@before-show="() => emits('before-show')"
+		@before-hide="() => emits('before-hide')"
+		@show="() => emits('show')"
+		@hide="() => emits('hide')"
+	>
+		<template
+			v-if="!!useSlots().item"
+			#item="{ item, label, props, hasSubmenu }"
+		>
+			<slot
+				name="item"
+				:item="item"
+				:label="label"
+				:props="props"
+				:has-submenu="hasSubmenu"
+			/>
+		</template>
+		<template
+			v-if="!!useSlots().submenuicon"
+			#submenuicon="{ active }"
+		>
+			<slot
+				name="submenuicon"
+				:active="active"
+			/>
+		</template>
+		<template
+			v-if="!!useSlots().itemicon"
+			#itemicon="{ item, class: itemiconclass }"
+		>
+			<slot
+				name="itemicon"
+				:item="item"
+				:class="itemiconclass"
+			/>
+		</template>
+		<template
+			v-if="!!useSlots().start"
+			#start
+		>
+			<slot name="start" />
+		</template>
+		<template
+			v-if="!!useSlots().end"
+			#end
+		>
+			<slot name="end" />
+		</template>
+	</TieredMenu>
+</template>
+
+<script setup lang="ts">
+import { ref, useSlots } from 'vue';
+import { PassThroughOptions } from 'primevue/passthrough';
+import TieredMenu, { TieredMenuPassThroughOptions } from 'primevue/tieredmenu';
+
+import { MenuItem } from 'primevue/menuitem';
+
+defineOptions({ name: 'RabbitTieredMenu' });
+
+export declare type HintedString<T extends string> = (string & {}) | T;
+
+export declare type PassThrough<T = void> = T | object | undefined;
+
+export interface IProps {
+	model: MenuItem[];
+	popup: boolean;
+	appendTo: HTMLElement | HintedString<'body' | 'self'>;
+	autoZIndex: boolean;
+	baseZIndex: number;
+	disabled: boolean;
+	tabindex: string | number;
+	ariaLabel: string;
+	ariaLabelledby: string;
+	pt: PassThrough<TieredMenuPassThroughOptions<any>>;
+	ptOptions: PassThroughOptions;
+	unstyled: boolean;
+}
+
+withDefaults(defineProps<Partial<IProps>>(), {
+	popup: false,
+	appendTo: 'body',
+	autoZIndex: true,
+	baseZIndex: 0,
+	disabled: false,
+	unstyled: false,
+});
+
+const emits = defineEmits<{
+	(e: 'focus', event?: Event): void;
+	(e: 'blur', event?: Event): void;
+	(e: 'before-show'): void;
+	(e: 'before-hide'): void;
+	(e: 'show'): void;
+	(e: 'hide'): void;
+}>();
+
+const tieredMenuRef = ref();
+
+defineExpose({ tieredMenu: tieredMenuRef });
+</script>
+
+<style lang="scss" scoped>
+@import '../style/style.scss';
+</style>

package/src/components/timeline/src/timeline.vue

@@ -0,0 +1,87 @@
+<template>
+	<Timeline
+		:ref="(el) => (timelineRef = el)"
+		:value="value"
+		:align="align"
+		:layout="layout"
+		:data-key="dataKey"
+		:pt="pt"
+		:pt-options="ptOptions"
+		:unstyled="unstyled"
+	>
+		<template
+			v-if="!!useSlots().content"
+			#content="{ item, index }"
+		>
+			<slot
+				name="content"
+				:item="item"
+				:index="index"
+			/>
+		</template>
+		<template
+			v-if="!!useSlots().opposite"
+			#opposite="{ item, index }"
+		>
+			<slot
+				name="opposite"
+				:item="item"
+				:index="index"
+			/>
+		</template>
+		<template
+			v-if="!!useSlots().marker"
+			#marker="{ item, index }"
+		>
+			<slot
+				name="marker"
+				:item="item"
+				:index="index"
+			/>
+		</template>
+		<template
+			v-if="!!useSlots().connector"
+			#connector="{ item, index }"
+		>
+			<slot
+				name="connector"
+				:item="item"
+				:index="index"
+			/>
+		</template>
+	</Timeline>
+</template>
+
+<script setup lang="ts">
+import { ref, useSlots } from 'vue';
+import { PassThroughOptions } from 'primevue/passthrough';
+import Timeline, { TimelinePassThroughOptions } from 'primevue/timeline';
+
+defineOptions({ name: 'RabbitTimeline' });
+
+export declare type PassThrough<T = void> = T | object | undefined;
+
+export interface IProps {
+	value: any[];
+	align: 'alternate' | 'left' | 'top' | 'bottom' | 'right';
+	layout: 'horizontal' | 'vertical';
+	dataKey: string;
+	pt: PassThrough<TimelinePassThroughOptions>;
+	ptOptions: PassThroughOptions;
+	unstyled: boolean;
+}
+
+withDefaults(defineProps<Partial<IProps>>(), {
+	align: 'left',
+	layout: 'vertical',
+	unstyled: false,
+});
+
+const timelineRef = ref();
+
+defineExpose({ timeline: timelineRef });
+</script>
+
+<style lang="scss" scoped>
+@import '../style/style.scss';
+</style>

package/src/components/toast/src/toast.vue

@@ -0,0 +1,96 @@
+<template>
+	<Toast
+		:ref="(el) => (toastRef = el)"
+		:group="group"
+		:position="position"
+		:auto-z-index="autoZIndex"
+		:base-z-index="baseZIndex"
+		:breakpoints="breakpoints"
+		:message="message"
+		:pt="pt"
+		:pt-options="ptOptions"
+		:unstyled="unstyled"
+		@close="(message) => emits('close', message)"
+		@life-end="(message) => emits('life-end', message)"
+	>
+		<template
+			v-if="!!useSlots().message"
+			#message="{ message }"
+		>
+			<slot
+				name="message"
+				:message="message"
+			/>
+		</template>
+		<template
+			v-if="!!useSlots().icon"
+			#icon="{ class: iconclass }"
+		>
+			<slot
+				name="icon"
+				:class="iconclass"
+			/>
+		</template>
+		<template
+			v-if="!!useSlots().closeicon"
+			#closeicon="{ class: closeiconclass }"
+		>
+			<slot
+				name="closeicon"
+				:class="closeiconclass"
+			/>
+		</template>
+		<template
+			v-if="!!useSlots().container"
+			#container="{ message, closeCallback }"
+		>
+			<slot
+				name="container"
+				:message="message"
+				:close-callback="closeCallback"
+			/>
+		</template>
+	</Toast>
+</template>
+
+<script setup lang="ts">
+import { ref, useSlots } from 'vue';
+import { PassThroughOptions } from 'primevue/passthrough';
+import Toast, { ToastBreakpointsType, ToastPassThroughOptions, ToastMessageOptions } from 'primevue/toast';
+
+defineOptions({ name: 'RabbitToast' });
+
+export declare type PassThrough<T = void> = T | object | undefined;
+
+export interface IProps {
+	group: string;
+	position: 'center' | 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
+	autoZIndex: boolean;
+	baseZIndex: number;
+	breakpoints: ToastBreakpointsType;
+	message: ToastMessageOptions;
+	pt: PassThrough<ToastPassThroughOptions>;
+	ptOptions: PassThroughOptions;
+	unstyled: boolean;
+}
+
+withDefaults(defineProps<Partial<IProps>>(), {
+	position: 'top-right',
+	autoZIndex: true,
+	baseZIndex: 0,
+	unstyled: false,
+});
+
+const emits = defineEmits<{
+	(e: 'close', message?: ToastMessageOptions): void;
+	(e: 'life-end', message?: ToastMessageOptions): void;
+}>();
+
+const toastRef = ref();
+
+defineExpose({ toast: toastRef });
+</script>
+
+<style lang="scss" scoped>
+@import '../style/style.scss';
+</style>

package/src/components/toggle-button/src/toggle-button.vue

@@ -0,0 +1,103 @@
+<template>
+	<ToggleButton
+		:ref="(el) => (toggleButtonRef = el)"
+		v-model="value"
+		:on-label="onLabel"
+		:off-label="offLabel"
+		:icon-pos="iconPos"
+		:disabled="formItemContext?.disabled ?? disabled"
+		:tabindex="tabindex"
+		:aria-describedby="`${formItemContext?.prop}-error`"
+		:input-id="inputId ?? formItemContext?.prop"
+		:input-style="inputStyle"
+		:input-class="inputClass"
+		:input-props="inputProps"
+		:invalid="
+			formItemContext?.formItemValidate !== undefined && formItemContext?.formItemValidate !== null
+				? !formItemContext?.formItemValidate
+				: invalid
+		"
+		:aria-labelledby="ariaLabelledby"
+		:aria-label="ariaLabel"
+		:pt="pt"
+		:pt-options="ptOptions"
+		:unstyled="unstyled"
+		@change="(event: Event) => (handleChange(), emits('change', event))"
+		@focus="(event: Event) => emits('focus', event)"
+		@blur="(event: Event) => emits('blur', event)"
+	>
+		<template
+			v-if="!!useSlots().icon"
+			#icon="{ value, class: iconclass }"
+		>
+			<slot
+				name="icon"
+				:value="value"
+				:class="iconclass"
+			/>
+		</template>
+	</ToggleButton>
+</template>
+
+<script setup lang="ts">
+import { ref, watch, inject, useSlots, InputHTMLAttributes } from 'vue';
+import { PassThroughOptions } from 'primevue/passthrough';
+import ToggleButton, { ToggleButtonPassThroughOptions } from 'primevue/togglebutton';
+
+defineOptions({ name: 'RabbitToggleButton' });
+
+export declare type PassThrough<T = void> = T | object | undefined;
+
+export interface IProps {
+	invalid: boolean;
+	modelValue: boolean;
+	onLabel: string;
+	offLabel: string;
+	iconPos: 'left' | 'right';
+	disabled: boolean;
+	tabindex: string;
+	inputId: string;
+	inputStyle: object;
+	inputClass: string | object;
+	inputProps: InputHTMLAttributes;
+	ariaLabelledby: string;
+	ariaLabel: string;
+	pt: PassThrough<ToggleButtonPassThroughOptions>;
+	ptOptions: PassThroughOptions;
+	unstyled: boolean;
+}
+
+const props = withDefaults(defineProps<Partial<IProps>>(), {
+	invalid: false,
+	onLabel: 'yes',
+	offLabel: 'no',
+	iconPos: 'left',
+	disabled: false,
+	unstyled: false,
+});
+
+const emits = defineEmits<{
+	(e: 'update:modelValue', params: boolean | undefined): void;
+	(e: 'change', event?: Event): void;
+	(e: 'focus', event?: Event): void;
+	(e: 'blur', event?: Event): void;
+}>();
+
+const toggleButtonRef = ref();
+const formItemContext: any = inject('rabbitFormItem', undefined);
+const value = ref<boolean | undefined>(props.modelValue);
+
+watch(
+	() => props.modelValue,
+	(val) => (value.value = val),
+	{ deep: true },
+);
+
+const handleChange = () => emits('update:modelValue', value.value);
+
+defineExpose({ toggleButton: toggleButtonRef });
+</script>
+
+<style lang="scss" scoped>
+@import '../style/style.scss';
+</style>