# Dile Components - Web Components Library Custom elements, mixins, and helpful Web apps utilities for any project or framework. ## General Information - [how-to-use](https://dile-components.com/md/general/how-to-use.md) - [Dile Components Theming](https://dile-components.com/md/general/theming.md) - [Colors](https://dile-components.com/md/general/colors.md) - [contribute](https://dile-components.com/md/general/contribute.md) - [AI Skill](https://dile-components.com/md/general/ai-skill.md) ## Components - [Accordion component](https://dile-components.com/md/components/dile-accordion.md) - [App Drawer component](https://dile-components.com/md/components/dile-app-drawer.md) - [Avatar component](https://dile-components.com/md/components/dile-avatar.md) - [Breadcrumbs component](https://dile-components.com/md/components/dile-breadcrumbs.md) - [Button Icon component](https://dile-components.com/md/components/dile-button-icon.md) - [Button component](https://dile-components.com/md/components/dile-button.md) - [Card Slide component](https://dile-components.com/md/components/dile-card-slide.md) - [Card component](https://dile-components.com/md/components/dile-card.md) - [Checkbox component](https://dile-components.com/md/components/dile-checkbox.md) - [Chip Tooltip component](https://dile-components.com/md/components/dile-chip-tooltip.md) - [Chip component](https://dile-components.com/md/components/dile-chip.md) - [Confirm Text component](https://dile-components.com/md/components/dile-confirm-text.md) - [Confirm component](https://dile-components.com/md/components/dile-confirm.md) - [Copy Markdown URL component](https://dile-components.com/md/components/dile-copy-markdown-url.md) - [Copy Text component](https://dile-components.com/md/components/dile-copy-text.md) - [Countdown Time component](https://dile-components.com/md/components/dile-countdown-time.md) - [Country Select component](https://dile-components.com/md/components/dile-country-select.md) - [Date Without Calendar component](https://dile-components.com/md/components/dile-date-without-calendar.md) - [Datepicker component](https://dile-components.com/md/components/dile-datepicker.md) - [Datetime Picker component](https://dile-components.com/md/components/dile-datetimepicker.md) - [Drop File component](https://dile-components.com/md/components/dile-drop-file.md) - [Editor component](https://dile-components.com/md/components/dile-editor.md) - [Floating Feedback component](https://dile-components.com/md/components/dile-floating-feedback.md) - [Floating Menu Item component](https://dile-components.com/md/components/dile-floating-menu-item.md) - [Floating Menu component](https://dile-components.com/md/components/dile-floating-menu.md) - [Form Separator component](https://dile-components.com/md/components/dile-form-separator.md) - [Graph component](https://dile-components.com/md/components/dile-graph.md) - [Hamburger component](https://dile-components.com/md/components/dile-hamburger.md) - [Html Transform component](https://dile-components.com/md/components/dile-html-transform.md) - [Icon Switch Group component](https://dile-components.com/md/components/dile-icon-switch-group.md) - [Icon Switch component](https://dile-components.com/md/components/dile-icon-switch.md) - [Icon component](https://dile-components.com/md/components/dile-icon.md) - [Info Box component](https://dile-components.com/md/components/dile-info-box.md) - [Inline Feedback component](https://dile-components.com/md/components/dile-inline-feedback.md) - [Input Integer component](https://dile-components.com/md/components/dile-input-integer.md) - [Input Message component](https://dile-components.com/md/components/dile-input-message.md) - [Input Money component](https://dile-components.com/md/components/dile-input-money.md) - [Input Number Mask component](https://dile-components.com/md/components/dile-input-number-mask.md) - [Input Percentage component](https://dile-components.com/md/components/dile-input-percentage.md) - [Input Search component](https://dile-components.com/md/components/dile-input-search.md) - [Input component](https://dile-components.com/md/components/dile-input.md) - [Light Mode Switch component](https://dile-components.com/md/components/dile-light-mode-switch.md) - [Local Time component](https://dile-components.com/md/components/dile-local-time.md) - [Media Query component](https://dile-components.com/md/components/dile-media-query.md) - [Menu Hamburger component](https://dile-components.com/md/components/dile-menu-hamburger.md) - [Menu Overlay component](https://dile-components.com/md/components/dile-menu-overlay.md) - [Message component](https://dile-components.com/md/components/dile-message.md) - [Modal Help component](https://dile-components.com/md/components/dile-modal-help.md) - [Modal component](https://dile-components.com/md/components/dile-modal.md) - [Nav component](https://dile-components.com/md/components/dile-nav.md) - [Network component](https://dile-components.com/md/components/dile-network.md) - [Number Picker component](https://dile-components.com/md/components/dile-number-picker.md) - [Order Switch component](https://dile-components.com/md/components/dile-order-switch.md) - [Pages component](https://dile-components.com/md/components/dile-pages.md) - [Password component](https://dile-components.com/md/components/dile-password.md) - [Progress Bar component](https://dile-components.com/md/components/dile-progress-bar.md) - [Radio Group component](https://dile-components.com/md/components/dile-radio-group.md) - [Range component](https://dile-components.com/md/components/dile-range.md) - [Rating Scale Question component](https://dile-components.com/md/components/dile-rating-scale-question.md) - [Rating component](https://dile-components.com/md/components/dile-rating.md) - [Select Ajax component](https://dile-components.com/md/components/dile-select-ajax.md) - [Select Boolean component](https://dile-components.com/md/components/dile-select-boolean.md) - [Select component](https://dile-components.com/md/components/dile-select.md) - [Selector Box component](https://dile-components.com/md/components/dile-selector-box.md) - [Selector component](https://dile-components.com/md/components/dile-selector.md) - [Slide Menu component](https://dile-components.com/md/components/dile-slide-menu.md) - [Slide Show component](https://dile-components.com/md/components/dile-slide-show.md) - [Smooth Scroll component](https://dile-components.com/md/components/dile-smooth-scroll.md) - [Social Icon component](https://dile-components.com/md/components/dile-social-icon.md) - [Spinner Bar component](https://dile-components.com/md/components/dile-spinner-bar.md) - [Spinner Block component](https://dile-components.com/md/components/dile-spinner-block.md) - [Spinner Horizontal component](https://dile-components.com/md/components/dile-spinner-horizontal.md) - [Spinner Icon component](https://dile-components.com/md/components/dile-spinner-icon.md) - [Spinner Modal component](https://dile-components.com/md/components/dile-spinner-modal.md) - [Spinner component](https://dile-components.com/md/components/dile-spinner.md) - [Switch component](https://dile-components.com/md/components/dile-switch.md) - [Tabs component](https://dile-components.com/md/components/dile-tabs.md) - [Textarea component](https://dile-components.com/md/components/dile-textarea.md) - [Time Picker component](https://dile-components.com/md/components/dile-time-picker.md) - [Timer component](https://dile-components.com/md/components/dile-timer.md) - [Toast Persistent component](https://dile-components.com/md/components/dile-toast-persistent.md) - [Toast component](https://dile-components.com/md/components/dile-toast.md) - [Tooltip component](https://dile-components.com/md/components/dile-tooltip.md) - [Web visor component](https://dile-components.com/md/components/dile-web-visor.md) ## Mixins - [CloseDocumentClick mixin](https://dile-components.com/md/mixins/dile-close-document-click-mixin.md) - [CloseOnEscPressed mixin](https://dile-components.com/md/mixins/dile-close-on-esc-pressed-mixin.md) - [EmmitChange mixin](https://dile-components.com/md/mixins/dile-emmit-change-mixin.md) - [FormChangeDetect mixin](https://dile-components.com/md/mixins/dile-form-change-detect-mixin.md) - [Form mixin](https://dile-components.com/md/mixins/dile-form-mixin.md) - [Overlay mixin](https://dile-components.com/md/mixins/dile-overlay-mixin.md) - [Selectable mixin](https://dile-components.com/md/mixins/dile-selectable-mixin.md) - [Selector Mixin mixin](https://dile-components.com/md/mixins/dile-selector-mixin.md) - [SlideDown mixin](https://dile-components.com/md/mixins/dile-slide-down-mixin.md) - [SmoothScrollElement mixin](https://dile-components.com/md/mixins/dile-smooth-scroll-element-mixin.md) - [SmoothScroll mixin](https://dile-components.com/md/mixins/dile-smooth-scroll-mixin.md) ## Crud Components ### Introduction - [General information](https://dile-components.com/md/crud/general-information.md) - [CLI](https://dile-components.com/md/cli/index.md) ### Configuration - [Axios configuration documentation](https://dile-components.com/md/crud/axios-configuration.md) - [Response Adapter documentation](https://dile-components.com/md/crud/response-adapter.md) - [Request Adapter documentation](https://dile-components.com/md/crud/request-adapter.md) - [Resource config documentation](https://dile-components.com/md/crud/resource-config.md) - [Actions configuration documentation](https://dile-components.com/md/crud/actions-configuration.md) ### Components - [Ajax Change component](https://dile-components.com/md/crud/ajax-change.md) - [Ajax Form component](https://dile-components.com/md/crud/ajax-form.md) - [Ajax Select Crud component](https://dile-components.com/md/crud/ajax-select-crud.md) - [Ajax Switch component](https://dile-components.com/md/crud/ajax-switch.md) - [Ajax component](https://dile-components.com/md/crud/ajax.md) - [Confirmed Ajax Form component](https://dile-components.com/md/crud/confirmed-ajax-form.md) - [Actions component](https://dile-components.com/md/crud/crud-actions.md) - [Crud component component](https://dile-components.com/md/crud/crud-component.md) - [Detail component](https://dile-components.com/md/crud/crud-detail.md) - [Insert component](https://dile-components.com/md/crud/crud-insert.md) - [Item delete component](https://dile-components.com/md/crud/crud-item-delete.md) - [Item restore component](https://dile-components.com/md/crud/crud-item-restore.md) - [Item list component](https://dile-components.com/md/crud/crud-list-item.md) - [List component](https://dile-components.com/md/crud/crud-list.md) - [Crud Single component](https://dile-components.com/md/crud/crud-single.md) - [Update component](https://dile-components.com/md/crud/crud-update.md) - [File uploader component](https://dile-components.com/md/crud/file-uploader.md) - [Image uploader component](https://dile-components.com/md/crud/image-uploader.md) - [Many Relation component](https://dile-components.com/md/crud/many-relation.md) - [Modal Crud Insert component](https://dile-components.com/md/crud/modal-crud-insert.md) - [Modal Crud Update component](https://dile-components.com/md/crud/modal-crud-update.md) - [Relation Checker component](https://dile-components.com/md/crud/relation-checker.md) ## App utilities ### Introduction - [Lib Components and mixins](https://dile-components.com/md/lib/index.md) ### State management - [Redux implementation documentation](https://dile-components.com/md/lib/redux-implementation.md) - [Feedback Slice documentation](https://dile-components.com/md/lib/redux-feedback-slice.md) - [User slice documentation](https://dile-components.com/md/lib/redux-user-slice.md) - [Feedback Mixin documentation](https://dile-components.com/md/lib/feedback-mixin.md) - [State Mixin documentation](https://dile-components.com/md/lib/state-mixin.md) ### Routing - [Route library implementation documentation](https://dile-components.com/md/lib/router-implementation.md) - [App Router Mixin documentation](https://dile-components.com/md/lib/router-mixin.md) - [DileAppNavigate Mixin documentation](https://dile-components.com/md/lib/navigate-mixin.md) ### Components - [App Loading component](https://dile-components.com/md/lib/app-loading-component.md) - [App Modal component](https://dile-components.com/md/lib/app-modal-component.md) - [App Toast component](https://dile-components.com/md/lib/app-toast-component.md) - [Router link component](https://dile-components.com/md/lib/router-link-component.md) ## Icon Libraries ### Lucide icons - [Lucide elements](https://dile-components.com/md/icons/lucide-icons.md) - [Lucide Generic](https://dile-components.com/md/icons/lucide-icon.md) ### Font Awesone icons - [FontAwesome elements](https://dile-components.com/md/icons/fontawesome-icons.md) - [FontAwesome generic](https://dile-components.com/md/icons/fontawesome-icon.md) ### Material icons - [Icons](https://dile-components.com/md/icons/material-icons.md) ### Components - [Lucide Badge component](https://dile-components.com/md/icons/lucide-badge.md)