@uibit/text-rotator 0.1.0 → 0.2.0

package/README.md

@@ -1,7 +1,17 @@
 # Text Rotator
 
+[![NPM Version](https://img.shields.io/npm/v/@uibit/text-rotator.svg?style=flat-square&color=black)](https://www.npmjs.com/package/@uibit/text-rotator)
+
+
 [Interactive Demonstration](https://rawlings.github.io/uibit/components/text-rotator)
 
+## Installation
+
+```bash
+npm install @uibit/text-rotator
+```
+
+
 Text Rotator cycles through an array of phrases inside a static sentence. It transitions between list items using vertical slide or 3D perspective flip animations, designed to highlight shifting value propositions within a compact, responsive boundary.
 
 ## Value Delivery

package/custom-elements.json

@@ -60,7 +60,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "Cycles through an array of phrases inside a static sentence by animating between\nitems with a vertical slide or 3D flip transition. Designed to highlight changing\nvalue propositions without motion outside the component boundary.\n\nPass static prefix or wrapper text inside the default slot, and phrases to cycle through\ninside elements with `slot=\"text\"` (e.g. `<span slot=\"text\">phrase</span>`).",
+          "description": "Cycles through an array of phrases inside a static sentence by animating between",
           "name": "TextRotator",
           "cssProperties": [
             {
@@ -218,6 +218,211 @@
                   }
                 }
               ]
+            },
+            {
+              "kind": "field",
+              "name": "locale",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "BCP 47 locale string for formatting and localization. Defaults to inherited document language.",
+              "attribute": "locale",
+              "inheritedFrom": {
+                "name": "UIBitElement",
+                "module": "../../platform/core/src/element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "resolvedLocale",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Resolves the active locale for formatting and localization.\nChecks the `locale` property first, then traverses up the DOM to find\nthe nearest ancestor with a `lang` attribute, and finally falls back\nto undefined (which defaults to browser locale).",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "UIBitElement",
+                "module": "../../platform/core/src/element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "_disposables",
+              "type": {
+                "text": "Set<() => void>"
+              },
+              "privacy": "private",
+              "default": "new Set()",
+              "inheritedFrom": {
+                "name": "UIBitElement",
+                "module": "../../platform/core/src/element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "createProperty",
+              "static": true,
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "PropertyKey"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "PropertyDeclaration"
+                  }
+                }
+              ],
+              "description": "Overrides createProperty to automatically map camelCase property names\nto kebab-case attribute names by default.",
+              "inheritedFrom": {
+                "name": "UIBitElement",
+                "module": "../../platform/core/src/element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "finalizeStyles",
+              "static": true,
+              "return": {
+                "type": {
+                  "text": "Array<any>"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "styles",
+                  "optional": true,
+                  "type": {
+                    "text": "CSSResultGroup"
+                  }
+                }
+              ],
+              "description": "Automatically prepends basic layout resets (border-box) to the\ncomponent's final styles.",
+              "inheritedFrom": {
+                "name": "UIBitElement",
+                "module": "../../platform/core/src/element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "dispatchCustomEvent",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "detail",
+                  "optional": true,
+                  "type": {
+                    "text": "T"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "Omit<CustomEventInit<T>, 'detail'>"
+                  }
+                }
+              ],
+              "description": "Helper to dispatch a custom event with standard bubbles and composed options.",
+              "inheritedFrom": {
+                "name": "UIBitElement",
+                "module": "../../platform/core/src/element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "getCssPropertyValue",
+              "return": {
+                "type": {
+                  "text": "string"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "propertyName",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ],
+              "description": "Helper to retrieve a computed CSS custom property value from the element.",
+              "inheritedFrom": {
+                "name": "UIBitElement",
+                "module": "../../platform/core/src/element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "registerDisposable",
+              "parameters": [
+                {
+                  "name": "cleanup",
+                  "type": {
+                    "text": "() => void"
+                  }
+                }
+              ],
+              "description": "Register a cleanup function to be executed when the element is disconnected from the DOM.",
+              "inheritedFrom": {
+                "name": "UIBitElement",
+                "module": "../../platform/core/src/element.ts"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "listen",
+              "return": {
+                "type": {
+                  "text": "() => void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "target",
+                  "type": {
+                    "text": "EventTarget"
+                  }
+                },
+                {
+                  "name": "type",
+                  "type": {
+                    "text": "K"
+                  }
+                },
+                {
+                  "name": "listener",
+                  "type": {
+                    "text": "(this: EventTarget, ev: HTMLElementEventMap[K]) => any"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "boolean | AddEventListenerOptions"
+                  }
+                }
+              ],
+              "description": "Utility to add an event listener that is automatically cleaned up when the element is disconnected.",
+              "inheritedFrom": {
+                "name": "UIBitElement",
+                "module": "../../platform/core/src/element.ts"
+              }
             }
           ],
           "events": [
@@ -256,12 +461,32 @@
               "default": "true",
               "description": "Loop indefinitely. Set to false to stop after the last word.",
               "fieldName": "loop"
+            },
+            {
+              "name": "locale",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "BCP 47 locale string for formatting and localization. Defaults to inherited document language.",
+              "fieldName": "locale",
+              "inheritedFrom": {
+                "name": "UIBitElement",
+                "module": "../../platform/core/src/element.ts"
+              }
+            }
+          ],
+          "cssStates": [
+            {
+              "name": "rotating",
+              "description": "Active when the text transition is in progress."
             }
           ],
           "superclass": {
             "name": "UIBitElement",
             "package": "@uibit/core"
           },
+          "summary": "A rotating text carousel component with smooth CSS animation transitions.\nitems with a vertical slide or 3D flip transition. Designed to highlight changing\nvalue propositions without motion outside the component boundary.\n\nPass static prefix or wrapper text inside the default slot, and phrases to cycle through\ninside elements with `slot=\"text\"` (e.g. `<span slot=\"text\">phrase</span>`).",
           "tagName": "uibit-text-rotator",
           "customElement": true
         }
@@ -298,6 +523,250 @@
       "path": "src/types.ts",
       "declarations": [],
       "exports": []
+    },
+    {
+      "kind": "javascript-module",
+      "path": "../../platform/core/src/element.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "A foundational base class for all UIBit web components.\nProvides custom event helpers, default kebab-case attribute mapping,\nautomatic cleanup/disposable tracking, and auto-injected reset styles.",
+          "name": "UIBitElement",
+          "members": [
+            {
+              "kind": "field",
+              "name": "locale",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "BCP 47 locale string for formatting and localization. Defaults to inherited document language.",
+              "attribute": "locale"
+            },
+            {
+              "kind": "field",
+              "name": "resolvedLocale",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Resolves the active locale for formatting and localization.\nChecks the `locale` property first, then traverses up the DOM to find\nthe nearest ancestor with a `lang` attribute, and finally falls back\nto undefined (which defaults to browser locale).",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "_disposables",
+              "type": {
+                "text": "Set<() => void>"
+              },
+              "privacy": "private",
+              "default": "new Set()"
+            },
+            {
+              "kind": "method",
+              "name": "createProperty",
+              "static": true,
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "PropertyKey"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "PropertyDeclaration"
+                  }
+                }
+              ],
+              "description": "Overrides createProperty to automatically map camelCase property names\nto kebab-case attribute names by default."
+            },
+            {
+              "kind": "method",
+              "name": "finalizeStyles",
+              "static": true,
+              "return": {
+                "type": {
+                  "text": "Array<any>"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "styles",
+                  "optional": true,
+                  "type": {
+                    "text": "CSSResultGroup"
+                  }
+                }
+              ],
+              "description": "Automatically prepends basic layout resets (border-box) to the\ncomponent's final styles."
+            },
+            {
+              "kind": "method",
+              "name": "dispatchCustomEvent",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "name",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "detail",
+                  "optional": true,
+                  "type": {
+                    "text": "T"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "Omit<CustomEventInit<T>, 'detail'>"
+                  }
+                }
+              ],
+              "description": "Helper to dispatch a custom event with standard bubbles and composed options."
+            },
+            {
+              "kind": "method",
+              "name": "getCssPropertyValue",
+              "return": {
+                "type": {
+                  "text": "string"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "propertyName",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ],
+              "description": "Helper to retrieve a computed CSS custom property value from the element."
+            },
+            {
+              "kind": "method",
+              "name": "registerDisposable",
+              "parameters": [
+                {
+                  "name": "cleanup",
+                  "type": {
+                    "text": "() => void"
+                  }
+                }
+              ],
+              "description": "Register a cleanup function to be executed when the element is disconnected from the DOM."
+            },
+            {
+              "kind": "method",
+              "name": "listen",
+              "return": {
+                "type": {
+                  "text": "() => void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "target",
+                  "type": {
+                    "text": "EventTarget"
+                  }
+                },
+                {
+                  "name": "type",
+                  "type": {
+                    "text": "K"
+                  }
+                },
+                {
+                  "name": "listener",
+                  "type": {
+                    "text": "(this: EventTarget, ev: HTMLElementEventMap[K]) => any"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "boolean | AddEventListenerOptions"
+                  }
+                }
+              ],
+              "description": "Utility to add an event listener that is automatically cleaned up when the element is disconnected."
+            },
+            {
+              "kind": "method",
+              "name": "listen",
+              "return": {
+                "type": {
+                  "text": "() => void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "target",
+                  "type": {
+                    "text": "EventTarget"
+                  }
+                },
+                {
+                  "name": "type",
+                  "type": {
+                    "text": "string"
+                  }
+                },
+                {
+                  "name": "listener",
+                  "type": {
+                    "text": "EventListenerOrEventListenerObject"
+                  }
+                },
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "boolean | AddEventListenerOptions"
+                  }
+                }
+              ]
+            }
+          ],
+          "attributes": [
+            {
+              "name": "locale",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "BCP 47 locale string for formatting and localization. Defaults to inherited document language.",
+              "fieldName": "locale"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "UIBitElement",
+          "declaration": {
+            "name": "UIBitElement",
+            "module": "../../platform/core/src/element.ts"
+          }
+        }
+      ]
     }
   ]
 }

package/dist/frameworks/angular/index.ts

@@ -1,38 +1,48 @@
 import { Component, ChangeDetectionStrategy, ElementRef, input, effect, output, booleanAttribute, numberAttribute } from '@angular/core';
 import '@uibit/text-rotator';
 import type { TextRotator as HTMLElementClass } from '@uibit/text-rotator';
-
 @Component({
-  selector: 'uibit-text-rotator',
-  template: '<ng-content></ng-content>',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  standalone: true,
-  host: {
-    '(word-change)': 'wordChange.emit($event)'
-  }
+    selector: 'uibit-text-rotator',
+    template: '<ng-content></ng-content>',
+    changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: true,
+    host: {
+        '(word-change)': 'wordChange.emit($event)'
+    }
 })
 export class NgxTextRotator {
-  constructor(private el: ElementRef<HTMLElementClass>) {
-    effect(() => {
-      if (this.el.nativeElement) {
-        this.el.nativeElement.interval = this.interval();
-      }
+    constructor(private el: ElementRef<HTMLElementClass>){
+        effect(()=>{
+            if (this.el.nativeElement) {
+                this.el.nativeElement.interval = this.interval();
+            }
+        });
+        effect(()=>{
+            if (this.el.nativeElement) {
+                this.el.nativeElement.transition = this.transition();
+            }
+        });
+        effect(()=>{
+            if (this.el.nativeElement) {
+                this.el.nativeElement.loop = this.loop();
+            }
+        });
+        effect(()=>{
+            if (this.el.nativeElement) {
+                this.el.nativeElement.locale = this.locale();
+            }
+        });
+    }
+    readonly interval = input<number, any>(2500, {
+        transform: numberAttribute
     });
-    effect(() => {
-      if (this.el.nativeElement) {
-        this.el.nativeElement.transition = this.transition();
-      }
+    readonly transition = input<'slide' | 'flip'>('slide');
+    readonly loop = input<boolean, any>(true, {
+        transform: booleanAttribute
     });
-    effect(() => {
-      if (this.el.nativeElement) {
-        this.el.nativeElement.loop = this.loop();
-      }
-    });
-  }
-
-  readonly interval = input<number, any>(2500, { transform: numberAttribute });
-  readonly transition = input<'slide' | 'flip', any>('slide');
-  readonly loop = input<boolean, any>(true, { transform: booleanAttribute });
-
-  readonly wordChange = output<CustomEvent<{ word: string, index: number }>>();
+    readonly locale = input<string>('');
+    readonly wordChange = output<CustomEvent<{
+        word: string;
+        index: number;
+    }>>();
 }

package/dist/frameworks/astro/index.d.ts

@@ -4,7 +4,13 @@ import '@uibit/text-rotator';
 declare global {
   namespace astroHTML.JSX {
     interface IntrinsicElements {
-      'uibit-text-rotator': Partial<HTMLElementClass> & astroHTML.JSX.HTMLAttributes;
+      'uibit-text-rotator': Partial<HTMLElementClass> & astroHTML.JSX.HTMLAttributes & {
+      interval?: number;
+      transition?: 'slide' | 'flip';
+      loop?: boolean;
+      locale?: string;
+      "on:word-change"?: (event: CustomEvent<{ word: string, index: number }>) => void;
+      };
     }
   }
 }

package/dist/frameworks/preact/index.d.ts

@@ -9,6 +9,9 @@ declare module 'preact' {
       interval?: number;
       transition?: 'slide' | 'flip';
       loop?: boolean;
+      locale?: string;
+      onWordChange?: (event: CustomEvent<{ word: string, index: number }>) => void;
+      "on:word-change"?: (event: CustomEvent<{ word: string, index: number }>) => void;
       };
     }
   }

package/dist/frameworks/react/index.ts

@@ -0,0 +1,105 @@
+import React, { useRef, useEffect, useLayoutEffect, useImperativeHandle } from 'react';
+import type { TextRotator as HTMLElementClass } from '@uibit/text-rotator';
+import '@uibit/text-rotator';
+const useTypeOfLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
+export interface TextRotatorProps extends Omit<React.HTMLAttributes<HTMLElementClass>, 'interval' | 'transition' | 'loop' | 'locale' | 'onWordChange'> {
+    children?: React.ReactNode;
+    interval?: number;
+    transition?: 'slide' | 'flip';
+    loop?: boolean;
+    locale?: string;
+    onWordChange?: (event: CustomEvent<{
+        word: string;
+        index: number;
+    }>) => void;
+}
+export const TextRotator = ({ ref, children, ...props }: TextRotatorProps & {
+    ref?: React.Ref<HTMLElementClass>;
+})=>{
+    const innerRef = useRef<HTMLElementClass>(null);
+    const propsRef = useRef(props);
+    propsRef.current = props;
+    useImperativeHandle(ref, ()=>innerRef.current!);
+    useTypeOfLayoutEffect(()=>{
+        const element = innerRef.current;
+        if (element && props.interval !== undefined) {
+            (element as any).interval = props.interval;
+        }
+    }, [
+        props.interval
+    ]);
+    useTypeOfLayoutEffect(()=>{
+        const element = innerRef.current;
+        if (element && props.transition !== undefined) {
+            (element as any).transition = props.transition;
+        }
+    }, [
+        props.transition
+    ]);
+    useTypeOfLayoutEffect(()=>{
+        const element = innerRef.current;
+        if (element && props.loop !== undefined) {
+            (element as any).loop = props.loop;
+        }
+    }, [
+        props.loop
+    ]);
+    useTypeOfLayoutEffect(()=>{
+        const element = innerRef.current;
+        if (element && props.locale !== undefined) {
+            (element as any).locale = props.locale;
+        }
+    }, [
+        props.locale
+    ]);
+    useTypeOfLayoutEffect(()=>{
+        const element = innerRef.current;
+        if (!element) return;
+        const handleEvent = (event: Event)=>{
+            if (propsRef.current.onWordChange) {
+                propsRef.current.onWordChange(event as any);
+            }
+        };
+        element.addEventListener('word-change', handleEvent);
+        return ()=>{
+            element.removeEventListener('word-change', handleEvent);
+        };
+    }, []);
+    const domProps = {
+        ...props
+    };
+    const customPropNames = [
+        'interval',
+        'transition',
+        'loop',
+        'locale',
+        'onWordChange'
+    ];
+    for (const key of customPropNames){
+        delete (domProps as any)[key];
+    }
+    return React.createElement('uibit-text-rotator', {
+        ref: innerRef,
+        ...domProps
+    }, children);
+};
+declare global {
+    namespace React {
+        namespace JSX {
+            interface IntrinsicElements {
+                'uibit-text-rotator': React.ClassAttributes<HTMLElementClass> & React.HTMLAttributes<HTMLElementClass> & {
+                    children?: React.ReactNode;
+                    class?: string;
+                    interval?: number;
+                    transition?: 'slide' | 'flip';
+                    loop?: boolean;
+                    locale?: string;
+                    onWordChange?: (event: CustomEvent<{
+                        word: string;
+                        index: number;
+                    }>) => void;
+                };
+            }
+        }
+    }
+}

package/dist/frameworks/solid/index.d.ts

@@ -9,7 +9,8 @@ declare module 'solid-js' {
               interval?: number;
       transition?: 'slide' | 'flip';
       loop?: boolean;
-      "on:word-change"?: (event: CustomEvent) => void;
+      locale?: string;
+      "on:word-change"?: (event: CustomEvent<{ word: string, index: number }>) => void;
       };
     }
   }

package/dist/frameworks/stencil/index.d.ts

@@ -8,6 +8,9 @@ declare module '@stencil/core' {
     interval?: number;
     transition?: 'slide' | 'flip';
     loop?: boolean;
+    locale?: string;
+    onWordChange?: (event: CustomEvent<{ word: string, index: number }>) => void;
+    "on:word-change"?: (event: CustomEvent<{ word: string, index: number }>) => void;
       };
     }
   }

package/dist/frameworks/svelte/index.svelte

@@ -1,37 +1,74 @@
 <script lang="ts">
   import '@uibit/text-rotator';
   import type { TextRotator as HTMLElementClass } from '@uibit/text-rotator';
-  
-  let {
-    interval = undefined,
-      transition = undefined,
-      loop = undefined,
-      children
+
+let {
+    interval = $bindable(),
+    transition = $bindable(),
+    loop = $bindable(),
+    locale = $bindable(),
+    children,
+    ...restProps
   } = $props<{
-    children?: any;
+    children?: import('svelte').Snippet;
     interval?: number;
     transition?: 'slide' | 'flip';
     loop?: boolean;
-  
+    locale?: string;
+
+    [key: string]: any;
   }>();
-  
-  let elementRef: HTMLElementClass | null = $state(null);
-  
-  $effect(() => {
-    if (elementRef && interval !== undefined) {
+
+let elementRef: HTMLElementClass | null = $state(null);
+
+$effect(() => {
+    if (elementRef && interval !== undefined && elementRef.interval !== interval) {
       elementRef.interval = interval;
     }
-    if (elementRef && transition !== undefined) {
+    if (elementRef && transition !== undefined && elementRef.transition !== transition) {
       elementRef.transition = transition;
     }
-    if (elementRef && loop !== undefined) {
+    if (elementRef && loop !== undefined && elementRef.loop !== loop) {
       elementRef.loop = loop;
     }
+    if (elementRef && locale !== undefined && elementRef.locale !== locale) {
+      elementRef.locale = locale;
+    }
   });
-  
+
+$effect(() => {
+    const element = elementRef;
+    if (!element) return;
+
+    const handleEvent = () => {
+      if (interval !== element.interval) {
+        interval = element.interval as any;
+      }
+      if (transition !== element.transition) {
+        transition = element.transition as any;
+      }
+      if (loop !== element.loop) {
+        loop = element.loop as any;
+      }
+      if (locale !== element.locale) {
+        locale = element.locale as any;
+      }
+    };
+
+    const events = ['change', 'input', 'word-change'];
+    for (const event of events) {
+      element.addEventListener(event, handleEvent);
+    }
+    return () => {
+      for (const event of events) {
+        element.removeEventListener(event, handleEvent);
+      }
+    };
+  });
+
 </script>
 
-<uibit-text-rotator bind:this={elementRef} {...$$restProps}>
+<uibit-text-rotator bind:this={elementRef} {...restProps}>
 
   {#if children}
     {@render children()}

package/dist/frameworks/vue/index.ts

@@ -1,26 +1,97 @@
-import { defineComponent, h } from 'vue';
+import { defineComponent, h, ref, watch } from 'vue';
 import type { TextRotator as HTMLElementClass } from '@uibit/text-rotator';
 import '@uibit/text-rotator';
-
 export const TextRotator = defineComponent({
-  name: 'TextRotator',
-  props: {
-    interval: { type: [String, Number, Boolean, Array, Object] as any },
-    transition: { type: [String, Number, Boolean, Array, Object] as any },
-    loop: { type: [String, Number, Boolean, Array, Object] as any }
-  },
-  emits: ['word-change'],
-  setup(props, { slots, emit }) {
-    return () => {
-      const eventListeners: Record<string, any> = {};
-      eventListeners['onWord-change'] = (event: Event) => {
-        emit('word-change', event);
-      };
-
-      return h('uibit-text-rotator', {
-        ...props,
-        ...eventListeners
-      }, slots.default?.());
-    };
-  }
+    name: 'TextRotator',
+    props: {
+        interval: {
+            type: [
+                String,
+                Number,
+                Boolean,
+                Array,
+                Object
+            ] as any
+        },
+        transition: {
+            type: [
+                String,
+                Number,
+                Boolean,
+                Array,
+                Object
+            ] as any
+        },
+        loop: {
+            type: [
+                String,
+                Number,
+                Boolean,
+                Array,
+                Object
+            ] as any
+        },
+        locale: {
+            type: [
+                String,
+                Number,
+                Boolean,
+                Array,
+                Object
+            ] as any
+        }
+    },
+    emits: [
+        'word-change'
+    ],
+    setup (props, { slots, emit }) {
+        const elementRef = ref<HTMLElementClass | null>(null);
+        if (false) {
+            watch(()=>props.modelValue, (newVal)=>{
+                if (elementRef.value && newVal !== undefined && elementRef.value.value !== newVal) {
+                    elementRef.value.value = newVal;
+                }
+            });
+            watch(()=>props.value, (newVal)=>{
+                if (elementRef.value && newVal !== undefined && elementRef.value.value !== newVal) {
+                    elementRef.value.value = newVal;
+                }
+            });
+        }
+        watch(()=>props.interval, (newVal)=>{
+            if (elementRef.value && newVal !== undefined) {
+                (elementRef.value as any).interval = newVal;
+            }
+        });
+        watch(()=>props.transition, (newVal)=>{
+            if (elementRef.value && newVal !== undefined) {
+                (elementRef.value as any).transition = newVal;
+            }
+        });
+        watch(()=>props.loop, (newVal)=>{
+            if (elementRef.value && newVal !== undefined) {
+                (elementRef.value as any).loop = newVal;
+            }
+        });
+        watch(()=>props.locale, (newVal)=>{
+            if (elementRef.value && newVal !== undefined) {
+                (elementRef.value as any).locale = newVal;
+            }
+        });
+        return ()=>{
+            const eventListeners: Record<string, any> = {};
+            eventListeners['onWord-change'] = (event: Event)=>{
+                emit('word-change', event);
+            };
+            const mergedProps = {
+                ...props,
+                ...eventListeners,
+                ref: elementRef
+            };
+            if (false && props.modelValue !== undefined) {
+                (mergedProps as any).value = props.modelValue;
+            }
+            return h('uibit-text-rotator', mergedProps, slots.default?.());
+        };
+    }
 });

package/dist/text-rotator.d.ts

@@ -1,6 +1,8 @@
 import { UIBitElement } from '@uibit/core';
 /**
  * Cycles through an array of phrases inside a static sentence by animating between
+
+ * @summary A rotating text carousel component with smooth CSS animation transitions.
  * items with a vertical slide or 3D flip transition. Designed to highlight changing
  * value propositions without motion outside the component boundary.
  *
@@ -15,7 +17,8 @@ import { UIBitElement } from '@uibit/core';
  * @cssprop [--uibit-text-rotator-font-family=inherit] - Font family
  * @cssprop [--uibit-text-rotator-line-height=inherit] - Line height
  * @cssprop [--uibit-text-rotator-duration=0.4s] - Transition animation duration
- */
+ 
+ * @cssstate rotating - Active when the text transition is in progress.*/
 export declare class TextRotator extends UIBitElement {
     static styles: import("lit").CSSResult;
     private words;

package/dist/text-rotator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-rotator.d.ts","sourceRoot":"","sources":["../src/text-rotator.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,YAAY,EAAE,MAAM,aAAa,CAAC;AAI1D;;;;;;;;;;;;;;;;GAgBG;AACH,qBACa,WAAY,SAAQ,YAAY;IAC3C,MAAM,CAAC,MAAM,0BAAU;IAEd,OAAO,CAAC,KAAK,CAAgB;IAEtC,wCAAwC;IACZ,QAAQ,SAAQ;IAE5C,oFAAoF;IACxD,UAAU,EAAE,OAAO,GAAG,MAAM,CAAW;IAEnE,mEAAmE;IACtC,IAAI,UAAQ;IAEhC,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,UAAU,CAAM;IACxB,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,QAAQ,CAAS;IAElC,OAAO,CAAC,MAAM,CAAC,CAAiC;IAEhD,iBAAiB,SAGhB;IAED,oBAAoB,SAGnB;IAED,YAAY,SAGX;IAED,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,QAUpC;IAED,OAAO,CAAC,MAAM;IAKd,OAAO,CAAC,QAAQ;IAqBhB,OAAO,CAAC,iBAAiB;IAYzB,OAAO,CAAC,iBAAiB;IAWzB,MAAM,oCAaL;CACF;eAEc,WAAW"}
+{"version":3,"file":"text-rotator.d.ts","sourceRoot":"","sources":["../src/text-rotator.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,YAAY,EAAE,MAAM,aAAa,CAAC;AAI1D;;;;;;;;;;;;;;;;;;;yEAmByE;AACzE,qBACa,WAAY,SAAQ,YAAY;IAC3C,MAAM,CAAC,MAAM,0BAAU;IAEd,OAAO,CAAC,KAAK,CAAgB;IAEtC,wCAAwC;IACZ,QAAQ,SAAQ;IAE5C,oFAAoF;IACxD,UAAU,EAAE,OAAO,GAAG,MAAM,CAAW;IAEnE,mEAAmE;IACtC,IAAI,UAAQ;IAEhC,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,UAAU,CAAM;IACxB,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,QAAQ,CAAS;IAElC,OAAO,CAAC,MAAM,CAAC,CAAiC;IAEhD,iBAAiB,SAGhB;IAED,oBAAoB,SAGnB;IAED,YAAY,SAGX;IAED,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,QAUpC;IAED,OAAO,CAAC,MAAM;IAKd,OAAO,CAAC,QAAQ;IAqBhB,OAAO,CAAC,iBAAiB;IAYzB,OAAO,CAAC,iBAAiB;IAWzB,MAAM,oCAaL;CACF;eAEc,WAAW"}

package/dist/text-rotator.js

@@ -11,6 +11,8 @@ import { property, state } from 'lit/decorators.js';
 import { styles } from './styles';
 /**
  * Cycles through an array of phrases inside a static sentence by animating between
+
+ * @summary A rotating text carousel component with smooth CSS animation transitions.
  * items with a vertical slide or 3D flip transition. Designed to highlight changing
  * value propositions without motion outside the component boundary.
  *
@@ -25,7 +27,8 @@ import { styles } from './styles';
  * @cssprop [--uibit-text-rotator-font-family=inherit] - Font family
  * @cssprop [--uibit-text-rotator-line-height=inherit] - Line height
  * @cssprop [--uibit-text-rotator-duration=0.4s] - Transition animation duration
- */
+ 
+ * @cssstate rotating - Active when the text transition is in progress.*/
 let TextRotator = class TextRotator extends UIBitElement {
     constructor() {
         super(...arguments);

package/dist/text-rotator.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-rotator.js","sourceRoot":"","sources":["../src/text-rotator.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC;;;;;;;;;;;;;;;;GAgBG;AAEI,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,YAAY;IAAtC;;QAGY,UAAK,GAAa,EAAE,CAAC;QAEtC,wCAAwC;QACZ,aAAQ,GAAG,IAAI,CAAC;QAE5C,oFAAoF;QACxD,eAAU,GAAqB,OAAO,CAAC;QAEnE,mEAAmE;QACtC,SAAI,GAAG,IAAI,CAAC;QAExB,iBAAY,GAAG,CAAC,CAAC;QACjB,eAAU,GAAG,CAAC,CAAC,CAAC;QAChB,eAAU,GAAG,KAAK,CAAC;QACnB,aAAQ,GAAG,KAAK,CAAC;IA8FpC,CAAC;aA9GQ,WAAM,GAAG,MAAM,AAAT,CAAU;IAoBvB,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAC;QAC7B,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAC7B,CAAC;IAED,YAAY;QACV,uEAAuE;QACvE,qBAAqB,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IACzD,CAAC;IAED,OAAO,CAAC,OAA6B;QACnC,IAAI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC;YAC9C,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAC3B,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;YACtB,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YACxB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;YACtB,qBAAqB,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;YACvD,IAAI,CAAC,MAAM,EAAE,CAAC;QAChB,CAAC;IACH,CAAC;IAEO,MAAM;QACZ,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM;YAAE,OAAO;QAC/B,IAAI,CAAC,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAClE,CAAC;IAEO,QAAQ;QACd,IAAI,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM;YAAE,OAAO;QAClD,MAAM,IAAI,GAAG,CAAC,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;QACzD,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,KAAK,CAAC,EAAE,CAAC;YAC7B,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAC3B,OAAO;QACT,CAAC;QACD,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,YAAY,CAAC;QACpC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QAEzB,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC;QAE3G,MAAM,WAAW,GAAG,IAAI,CAAC,mBAAmB,CAAC,+BAA+B,CAAC,IAAI,MAAM,CAAC;QACxF,MAAM,GAAG,GAAG,IAAI,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;QAChD,UAAU,CAAC,GAAG,EAAE;YACd,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QAC1B,CAAC,EAAE,GAAG,GAAG,EAAE,CAAC,CAAC;IACf,CAAC;IAEO,iBAAiB,CAAC,GAAW;QACnC,MAAM,OAAO,GAAG,GAAG,CAAC,IAAI,EAAE,CAAC;QAC3B,IAAI,CAAC,OAAO;YAAE,OAAO,GAAG,CAAC;QACzB,IAAI,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;YAC3B,OAAO,UAAU,CAAC,OAAO,CAAC,CAAC;QAC7B,CAAC;QACD,IAAI,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YAC1B,OAAO,UAAU,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC;QACpC,CAAC;QACD,OAAO,UAAU,CAAC,OAAO,CAAC,IAAI,GAAG,CAAC;IACpC,CAAC;IAEO,iBAAiB,CAAC,CAAQ;QAChC,MAAM,IAAI,GAAG,CAAC,CAAC,MAAyB,CAAC;QACzC,MAAM,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACpD,MAAM,KAAK,GAAG,KAAK;aAChB,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;aAC3C,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,KAAK,EAAE,CAAC,CAAC;QAC/B,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACrB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACrB,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC;QAC1B,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;QACvD,MAAM,QAAQ,GAAG,IAAI,CAAC,UAAU,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QAE3E,OAAO,IAAI,CAAA;;sCAEuB,IAAI,CAAC,iBAAiB;;UAElD,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,6BAA6B,CAAC,wBAAwB,QAAQ,SAAS,CAAC,CAAC,CAAC,EAAE;UACpG,KAAK,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,CAAA,qBAAqB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,YAAY,UAAU,SAAS,CAAC;;KAElI,CAAC;IACJ,CAAC;CACF,CAAA;AA5GkB;IAAhB,KAAK,EAAE;0CAA8B;AAGV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAiB;AAGhB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAwC;AAGtC;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yCAAa;AAExB;IAAhB,KAAK,EAAE;iDAA0B;AACjB;IAAhB,KAAK,EAAE;+CAAyB;AAChB;IAAhB,KAAK,EAAE;+CAA4B;AACnB;IAAhB,KAAK,EAAE;6CAA0B;AAjBvB,WAAW;IADvB,aAAa,CAAC,oBAAoB,CAAC;GACvB,WAAW,CA+GvB;;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"text-rotator.js","sourceRoot":"","sources":["../src/text-rotator.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uibit/text-rotator",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Rotates a single word inside a static sentence block with smooth vertical slide or 3D flip transitions. Designed to pull attention to changing value propositions.",
   "type": "module",
   "main": "./dist/index.js",
@@ -11,7 +11,7 @@
       "import": "./dist/index.js"
     },
     "./custom-elements.json": "./custom-elements.json",
-    "./react": "./dist/frameworks/react/index.d.ts",
+    "./react": "./dist/frameworks/react/index.ts",
     "./vue": "./dist/frameworks/vue/index.ts",
     "./svelte": "./dist/frameworks/svelte/index.svelte",
     "./angular": "./dist/frameworks/angular/index.ts",
@@ -44,13 +44,13 @@
     "directory": "packages/components/text-rotator"
   },
   "dependencies": {
-    "@uibit/core": "0.1.0"
+    "@uibit/core": "0.2.0"
   },
   "devDependencies": {
     "@types/node": "^20.19.43",
     "lit": "^3.3.3",
     "typescript": "7.0.2",
-    "@uibit/codegen": "0.1.0"
+    "@uibit/codegen": "0.2.0"
   },
   "peerDependencies": {
     "lit": "^3.0.0",
@@ -81,9 +81,9 @@
     "tagName": "uibit-text-rotator"
   },
   "scripts": {
-    "build": "cem analyze --globs 'src/**/*.ts' --litelement && uibit-codegen --package . && tsc",
-    "dev": "concurrently \"cem analyze --globs 'src/**/*.ts' --litelement --watch\" \"tsc --watch\"",
-    "analyze": "cem analyze --globs 'src/**/*.ts' --litelement",
+    "build": "cem analyze --config ../custom-elements-manifest.config.js && uibit-codegen --package . && tsc",
+    "dev": "concurrently \"cem analyze --config ../custom-elements-manifest.config.js --watch\" \"tsc --watch\"",
+    "analyze": "cem analyze --config ../custom-elements-manifest.config.js",
     "typecheck": "tsc --noEmit"
   }
 }

package/dist/frameworks/react/index.d.ts

@@ -1,20 +0,0 @@
-import type { HTMLAttributes, ClassAttributes } from 'react';
-import type { TextRotator as HTMLElementClass } from '@uibit/text-rotator';
-import '@uibit/text-rotator';
-
-declare global {
-  namespace React {
-    namespace JSX {
-      interface IntrinsicElements {
-        'uibit-text-rotator': ClassAttributes<HTMLElementClass> & HTMLAttributes<HTMLElementClass> & {
-          children?: React.ReactNode;
-          class?: string;
-      interval?: number;
-      transition?: 'slide' | 'flip';
-      loop?: boolean;
-      onWordChange?: (event: any) => void;
-        };
-      }
-    }
-  }
-}