ct-menu

Menu web component for lit

Properties

| Property | Attribute | Type | Default | | ------------ | ------------ | ------------------------------------------------------------------------------------------- | ----------- | | $ | | { items: HTMLSlotElement; menu: HTMLDivElement; } | | | addedNodes | addedNodes | (Node & { style?: { [x: string]: string; } \| undefined; })[] | [] | | align | align | "top" \| "top-right" \| "top-left" \| "bottom" \| "bottom-right" \| "bottom-left" \| null | "top-right" | | close | | (e: KeyboardEvent) => void | | | icon | icon | string | | | opened | | boolean | false |

Methods

| Method | Type | Description | | ----------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | $$ | (name: string): HTMLElement \| Element \| undefined \| null | Returns the first element that is a descendant of node that matches selectors. | | $$$ | (name: string): NodeListOf<HTMLElement \| Element> \| undefined | Returns all element descendants of node that match selectors. | | deepClone | (ob: object): any | Clone all native types of object in a new object referenceob: Original Object | | deleteAt | (listTarget: string, index: number): void | Delete item in listlistTarget: List Targetindex: Index | | fire | (name: string, value: any): void | Fire a event with name and value | | insertAt | (listTarget: string, index: number, el: any): void | Insert Object in list at indexlistTarget: List Targetindex: Indexel: Object | | mapIDs | (): void | Map all IDs for shadowRoot and save in this.$ like a polymer element.You should add in the first line of firstUpdated() | | move | (array: any[], old_index: number, new_index: number): void | Move item in arrayarray: Array objectold_index: Old Indexnew_index: New Index | | push | (name: string, value: any): void | Set Value and fire event with the same name | | scrollToY | (scrollTargetY?: number \| undefined, time?: number \| undefined, easing?: "easeInOutSine" \| "easeOutSine" \| "easeInOutQuint" \| "easeInOutCubic" \| undefined, target?: Element \| undefined): void | scrollTargetY: pixels to scroll. Ej:const ticketsBlockPositionY = this.$.contact.getBoundingClientRect().top + window.scrollTarget.scrollTop;time: Time to scrolltarget: scrollTarget Element | | set | (name: string, value: any): void | Set Value and fire event with the same name | | setAt | (listTarget: string, index: number, el: any): void | | | splice | (name: string, index: number, pos: number, value: any): void | Set Value and fire event with the same name | | toggle | (e: CustomEvent<any>): void | |

Slots

| Name | Description | | ------------------------------- | ------------ | | dropdown-trigger (Deprecated) | Item trigger | | trigger | Item trigger |

Events

| Name | Type | Description | e.detail | | ------ | ------------- | ---------------------- | --------- | | open | CustomEvent | Open or Close the menu | boolean |

Installation

To include this, type:

$ pnpm i @conectate/ct-menu

or

$ npm i @conectate/ct-menu

Follow me

https://x.com/herberthobregon

https://dev.to/herberthobregon

Contributing

1. Fork it!
2. Create your feature branch: git checkout -b my-new-feature
3. Commit your changes: git commit -m 'Add some feature'
4. Push to the branch: git push origin my-new-feature
5. Submit a pull request :D

License

See LICENSE