cerxes/csx
3
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Prop-decorators and supporting DOMElements as VNodes in the renderer

Browse Source
This commit is contained in:
Miel Truyen
2019-11-29 23:06:05 +01:00
parent 698656c8f6
commit e4eef2cc1a
20 changed files with 332 additions and 6663 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
test/svg/svg-loader.jsx
View File

@@ -1,4 +1,4 @@
import {CustomElement, defineElement, Host, ShadowDOM, State} from "../../packages/csx";
import {CustomElement, defineElement, Host, ShadowDOM, State, Prop} from "../../packages/csx";
import loaderComponentShadowStyle from './svg-loader.shadow.scss';
// TODO configurability, like inverted and not with props...
@@ -13,6 +13,8 @@ export class SvgLoader extends CustomElement{
// Private properties
// Properties
@Prop({reflect: true}) inverted;
@Prop({reflect: true, attr: "inverted-color"}) invertedColor = "#000";
// Handlers
@@ -27,7 +29,7 @@ export class SvgLoader extends CustomElement{
<div class="loader-content">
<div class="spinner">
<svg width="38" height="38" viewBox="0 0 38 38" xmlns="http://www.w3.org/2000/svg" stroke="#000">
<svg width="38" height="38" viewBox="0 0 38 38" xmlns="http://www.w3.org/2000/svg" stroke={(this.inverted??false)!==false? this.invertedColor : "#F00"}>
<g fill="none" fill-rule="evenodd">
<g transform="translate(1 1)" stroke-width="2">
<circle stroke-opacity=".5" cx="18" cy="18" r="18"/>