Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings
Imre Toth edited this pageJan 22, 2022 ·73 revisions

Welcome to the blazor-components wiki. Below you can read about Extension and component ideas.


Planned Extensions:

  • Blazor WebAssembly browser console log: logs to the Browser's Console window.
  • Server hosted Blazor browser console log: logs to the Browser's Console window.
  • Browser Storages: reads/writes JSON serialized data to browser storages, with date and optional expiry.
    • Local Storage
    • Session Storage
    • Cookies
    • Cache Storage
  • SEO (Search Engine Optimization) package to simplify HTML Head updates.
  • Analytics for tracking Blazor app usage (Google)

Planned UI Components:

  • Debounce: delaying onChanged event on HTML inputs:
    • DebounceInput
    • DebounceInputText
    • DebounceTextArea
    • DebounceInputTextArea
  • JS common components:
    • OutsideClickHandler
    • Element extensions
    • Scroll page in list/text/etc.
      • Sticky scroll to page top/end components
    • Focus JS
    • Resize JS
    • Clipboard JS
    • Browser Lang JS
    • GEO JS (Geolocation features, GPS access)
    • Media JS (Microphone, camera access)
    • Head JS
    • Browser time simple:new Date();
    • Browser color theme dark/light mode, etc.
    • Browser History JS
  • Typeahead input: typeahead input with customizable templated dropdown, multiselect, etc.
    • TypeaheadInput
    • TypeaheadInputText
  • Permalink control: navigation service and wrapper to generate and scroll to element.
  • Timer Control: Wrapper around Timer with: delay, tick, reoccurre (exactNumber|Forewer), ElapsedEvent
  • Loading:
    • Button: disabled button with customized animation and overlay until a specified Async operation finished.
    • Page: page overlay with loading content
    • Element: overlay wrapper with content and loading content
  • Notifications: UI notification controls
    • Alert: with title and content, close X button also configurable with TimerControl to auto close
    • HTML5 Notification: acquire User consent and use HTML5 API to show notifications
    • Toast: with different locations (top-right, bottom, etc) custom content, customization, animations, use TimerControl to disappear
  • *Popups
    • *Tooltip: custom tooltip message on elements
    • *Popover window with custom content
  • Modal Dialog: allows to create modals (popup) with title, content and footer customizable overlay, etc.
  • CSS events: JS support for animation and transition events with injectable Services and Component wrapper
    • animation: supports 3 events add/remove
    • transition: CSS supports 1 event add/remove
  • RichTextEditor: Enables Markdown/Html enabled text editor
  • Input controls: Icon inputs (e.g. search box) max length counter limiting maximum chars for inputs and showing remaining countdown:
    • MaxLengthInput
    • MaxLengthInputText
    • MaxLengthTextarea
    • MaxLengthInputTextArea
    • *Generic input with icon: e.g. search box "magnifier" icon and "x" to clear text, "collapse" on hover etc.
    • *Star rating: with 5 stars scalable image with click rating, supports half star, etc.
  • DateTime inputs:
    • DateTime picker: input field which renders a customizable calendar control
    • Time picker: input field with time selector available
  • *Color picker: dropdown with color rendered opens a pane with named colors and HUE slider and RGB, Hex color values.
  • Dropdown with checkbox list and multiple select.
  • *Country Inputs:
    • Calling Code Picker with Flags: Phone number field with country codes and flags.
    • Country selector with flags.
    • US States selector with flags.
  • GDPR Consents: "This site uses cookies" banner and popup with Accept/Reject and value should be stored in browser storage.
    • Simple banner at page bottom/top with Accept/Reject
    • Overlay with popup with toggles and detailed cookies info
  • *Drag&Drop: support for drag and drop in Blazor.
  • Toggle:
    • Switch: Razor toggle switch for bool value (circle, rounded, square) CSS background color and could be disabled.
    • Button: Razor toggle button for bool value with customizable Content, CSS background color and could be disabled.
    • Button Group: Razor container for Toggle Buttons. It allows only 1 Checked button.
  • Tab: customizable tab control with multiple tabs and custom content.
  • Collapse:
    • Collapse customizable control with custom content and configurable animation.
    • Collapse Group container for Collapse control to allow only 1 element to collapsed at once.
  • Image components:
    • Carousel: component to show images automatically (or manual) sliding, edge or count icon clickable. Support navigation if URLs provided.
    • Image view: single or multi image viewer/(auto)slider. When clicked image should be magnified...
    • MultiImage Uploader: multi select with preview, reordering, edit, delete... Size limit support with image processing (resize, reduce if it is possible)...
  • Ad control: wrap advertisement scripts and HTML elements, etc.
  • *Maps components: wrapping features to .Net Blazor components which supports: paths, pins, clusters, events, etc.
    • Google maps Static and JavaScript API maps.
    • *Bing maps
    • *Mapbox
  • Breadcrumb: breadcrumb navigation service and Link component.
  • Grid
  • Confetti:https://www.cssscript.com/confetti-falling-animation/
  • *Advanced EditForm: autosave, prompt on navigation, etc.

Known problems and potential improvements:

  • Server hosted Blazor browser console log: it does not work with JS, should be open a SignalR channel and receive all logs from server.
  • Debounce: Timer code is written in 3 times since Component cannot inherit from 2 base classes. Potential idea to create 1 base component with RenderFrangement as input/inputText, etc.
  • MaxLenght: Logic is written in 3 times since Component cannot inherit from 2 base classes.
  • Loading:
    • Set/Reset might be better to set with public property as a Parameter. Deprecate public methods to avoid using of @ref=""
  • ModalDialog:
    • Animate: has some problems it is CSS property and timer is not correct
    • Focus: refocusing previous element only works with Id. see:https://github.com/dotnet/aspnetcore/issues/26496
    • Open/Close might be better to set with public property as a Parameter. Deprecate public methods to avoid using of @ref=""
  • Typeahead:
  • Permalink control:
    • Link icon should have Tooltip to show "Copy link"
  • Toggle:
    • Switch and Button should have Tooltip support.
  • Toggle:
    • Tabs should have Tooltip support.

* Currently in progress

Clone this wiki locally


[8]ページ先頭

©2009-2026 Movatter.jp