UNPKG

oxe

Version:

A mighty tiny web components framework/library

208 lines (196 loc) 8.32 kB
- setup - component - loader - router - fetcher - batcher - path - global ### Oxe.setup(options) The recommend entry or setup method. - `options: Object` - `listener: Object` - `before: Function` - `after: Function` - `path: Object` Oxe.path options - `loader: Object` Oxe.loader options - `router: Object` Oxe.router options - `batcher: Object` Oxe.batcher options - `fetcher: Object` Oxe.fetcher options ### Oxe.path - `setup: AsyncFunction` - `options: Object` - `base: String` Sets or and creates a base tag ### Oxe.component - `setup: AsyncFunction` - `options: Object` - `components: Array` - `component: Object` A component definition. - `define: Function` Defines a custom web component. - `options: Object` - `name: String` **Required** the tag name - `model: Object<Any>` - `methods: Object<Function>` - `template: String` - `style: String` Rewrites CSS variables and :scope if browser support is lacking - `shadow: Boolean` (default: false) use shadow DOM - `properties: Object<Descriptors>` Property descriptors added to the element prototype - `created: Function` Triggered once on DOM creation - `attached: Function` Triggered on each DOM attachment - `detached: Function` Triggered on each DOM detachment - `attributed: Function` Triggered on each attribute change ### Oxe.loader Loads files and dependencies asynchronously. ES6 import/export module and template string re-write support via transformers. **Caveats** - Supported import/export re-writes - `import Name from './path'` - `import './path'` - `export default` - Commented and string or template string import/export might have issues - Template string re-writes may not handle nested backtick/template string correctly - Uses fetch or XHR and new Function until dynamic imports are supported. - `options: Object` - `type: String` - `es` Enables ES6 module and template string re-writes - `est` Enables ES6 template string re-writes uses - `esm` Enables ES6 module re-writes uses (Note: only supporting default export/import) - `loads: Array` Adds load objects or strings such as non route components - `load: Object, String` - `url: String` **Required** Path to file resources - `type: String` If not defined uses the default type - `setup: Function` - `options: Object` Accepts the above options - `load: Function` - `load: Object, String` - `url: String` **Required** Path to file resources - `type: String` If not defined uses the default type based from extension ### Oxe.router - `options: Object` - `folder: String` (default: '/routes') resolves the route is provided a string - `mode: String` (default: push) The href option uses `window.location.assign` - href - push - replace - `element: String, Element` (default: 'o-router') The element to render route changes - `contain: Boolean` (default: false) Limits all href clicks to the 'o-router' element - `external: String, RegExp, Function` Filters URL requests. If true or match Oxe.router will not handle request - `before: AsyncFunction` Invoked before the routed - `location: Object` Oxe.router.location argument for the upcoming route - `routes: Array` - `route: Object, String, Component<Options>` Dynamically loads the string based on the Oxe.router.folder and appends .js - `load: String` Dynamically loads the content and assigns it to the route object - `path: String` Any path starting with forward slash - `parameters: String` Paths can have parameters `/account/{user}` or catchalls `{\*}` - `title: String` Sets the page title - `keywords: String` Sets the page keywords - `description: String` Sets the page description - `handler: Function` Overrides the default render method - `component: Object, String` An Oxe.component.define options object or a component name - `setup: AsyncFunction` - `options: Object` Accepts the above options - `location: Object` Similar to window.location <!-- - `base: String` Base href or origin --> - `href: String` - `host: String` - `hash: String` - `port: String` - `title: String` - `query: Object` Key value pairs of search/query - `origin: String` - `search: String` <!-- - `basename: String` Base without the origin --> - `hostname: String` - `pathname: String` A pathname even when using hash urls - `protocol: String` <!-- - `username: String` --> <!-- - `password: String` --> - `parameters: Object` Key value pairs of the route dynamic route parameters - `render: Function` Will render a route object it is useful if your using route as a handler - `redirect: Function` Uses window.location.href which is treated like a 301 redirect for SEO - `path: String` - `create: Function` - `route: Object` - `add: Function` - `path: String` - `remove: Function` - `path: String` - `get: Function` - `path: String` Strict path matching the route path parameters are not considered - `find: Function` - `path: String` Loose path matching the route path parameters are considered - `filter: Function` - `path: String, RegExp` Loose path matching the route path parameters are considered or a RegExp. - `route: AsyncFunction` Routes to the path - `path: String` Path to navigate - `options: Object` - `replace: Boolean` (default: false) replace or push state - `query: Object` Converts a key value pair to a query/search string and appends to the path - `on: EventEmitter` - `routing` - `routed` ### Oxe.batcher Batches DOM reads and writes. - `options: Object` - `time: Number` (default: 1000/60) - `setup: Function` - `options: Object` - `tick: Function` - `flush: Function` - `schedule: Function` - `remove: Function` - `clear: Function` - `batch: Function` ### Oxe.fetcher - `setup: Function` - `options: Object` Accepts `window.fetch` options - `path: String` The default path for the url options (requires origin) - `origin: String` The default origin for url options - `header: Object` (default: null) Http headers to be assigned to requests - `acceptType: String` Valid http `Accept-Type` value or a Oxe.fetcher.mime name - `contentType: String` Valid http `Content-Type` value or a Oxe.fetcher.mime name - `responseType: String` (default: ReadableStream) - `arrayBuffer` - `document` - `blob` - `json` - `text` - `request: Function, AsyncFunction` Intercepts the request. If the return value is false the fetch will stop if the value is a object it will assign/overwrite the current request data. - `data: Object` Argument to be sent as the request - `response: Function, AsyncFunction` Intercepts the response. If the return value is false the fetch will stop if the value is a object it will assign/overwrite the current response data. - `data: Object` Argument to be sent as the response - `fetch: AsyncFunction` Accepts `window.fetch` options - `options: Object` - `path: String` The path for the url options (requires origin) - `origin: String` The origin for the url options - `url: String` An absolute url or the combination of the origin and path - `method: String` Required http method - `body: Object` If method is GET than body is concatenated to the url as parameters - `head: Object` - `contentType: String` Overrides the setup contentType. - `acceptType: String` Overrides the setup acceptType. - `responseType: String` Overrides the setup responseType. - `get: AsyncFunction` - `options: Object` Accepts `Oxe.fetcher.fetch` options - `put: AsyncFunction` - `options: Object` Accepts `Oxe.fetcher.fetch` options - `post: AsyncFunction` - `options: Object` Accepts `Oxe.fetcher.fetch` options - `head: AsyncFunction` - `options: Object` Accepts `Oxe.fetcher.fetch` options - `delete: AsyncFunction` - `options: Object` Accepts `Oxe.fetcher.fetch` options - `patch: AsyncFunction` - `options: Object` Accepts `Oxe.fetcher.fetch` options - `options: AsyncFunction` - `options: Object` Accepts `Oxe.fetcher.fetch` options - `connect: AsyncFunction` - `options: Object` Accepts `Oxe.fetcher.fetch` options - `serialize: AsyncFunction` - `mime: Object` - `xml` 'text/xml; charset=utf-8' - `text` 'text/text; charset=utf-8' - `html` 'text/html; charset=utf-8' - `json` 'application/json; charset=utf-8' - `js` 'application/javascript; charset=utf-8' ### Oxe.global A global object for random data.