release: 3.1.2

CHANGELOG.md

@@ -1,5 +1,11 @@
 # CHANGELOG
 
+### 3.1.2
+
+- fix: `RdSlider` should initialize with the correct position when using a control
+- fix: control types were not properly exported, prohibiting their use in third-party projects
+- fix: various TypeScript issues, mostly internal
+
 ### 3.1.1
 
 - fix: `RdDial` and `RdSlider` handles could appear with incorrect position

README.md

@@ -62,4 +62,4 @@ Use `yarn test:open` to open a GUI and run tests interactively.
 
 ### Production
 
-To build the library for production, i.e. to use as a local dependency in another project run `yarn build:lib`.
+To build the library for production, i.e. to use as a local dependency in another project run `yarn build:library`.

cypress/integration/unit/core/attach.ts

@@ -2,7 +2,7 @@
 import {
   attachShadow,
   attachDOM,
-  attachStyle
+  attachStyle,
 } from '../../../../src/modules/core/element/src/attach';
 import { ElementMeta } from './../../../../src/modules/core/decorator';
 
@@ -23,7 +23,7 @@ describe('attachShadow Test', () => {
     `;
     element.elementMeta = {
       selector: 'x-test',
-      mode: 'open'
+      mode: 'open',
     };
   });
 
@@ -35,7 +35,7 @@ describe('attachShadow Test', () => {
   it('has a shadow dom template', () => {
     attachShadow(element, { mode: element.elementMeta.mode });
     expect(element.shadowRoot.querySelector('div').innerText).equals(
-      'Readymade Test'
+      'Readymade Test',
     );
   });
 });
@@ -48,7 +48,7 @@ describe('attachDOM Test', () => {
       selector: 'x-test',
       template: `
       <div>Readymade Test</div>
-      `
+      `,
     };
   });
 
@@ -75,13 +75,13 @@ describe('attachStyle Test', () => {
         :host {
           background: #ff0000;
         }
-      `
+      `,
     };
   });
 
   xit('head contains style tag with injected styles', () => {
     attachShadow(element, { mode: 'open' });
-    attachStyle(element, { mode: 'open' });
+    attachStyle(element);
     const style: HTMLElement = document
       .querySelector('head')
       .querySelector('[id="x-test-x"]');

src/client/app/component/list.ts

@@ -48,12 +48,12 @@ class MyListComponent extends CustomElement {
       } else {
         this.deactivateElement(li);
       }
-      li.addEventListener('click', (clickEv: MouseEvent) => {
+      li.addEventListener('click', () => {
         getSiblings(li).forEach((elem: Element) => {
           this.deactivateElement(elem);
         });
         this.activateElement(li);
-        this.onSubmit(clickEv);
+        this.onSubmit();
       });
     }
   }
@@ -65,7 +65,7 @@ class MyListComponent extends CustomElement {
     const siblings = getSiblings(currentElement);
     this.currentIndex = getElementIndex(currentElement);
     if (ev.keyCode === 13) {
-      this.onSubmit(ev);
+      this.onSubmit();
     }
     if (ev.keyCode === 38) {
       // up
@@ -99,7 +99,7 @@ class MyListComponent extends CustomElement {
     }
   }
   public onSubmit() {
-    // console.log(this, event);
+    // noop?
   }
 }
 

src/client/app/view/lib/lib.ts

@@ -70,7 +70,7 @@ class LibraryComponent extends CustomElement {
         const controlElement = surface.querySelector(
           `[name="${control.name}"]`,
         );
-        controlElement.value = control.currentValue;
+        (controlElement as any).value = control.currentValue;
       }
     };
 

src/client/index.ts

@@ -1,6 +1,6 @@
 import { Router, routing } from './app/routing';
 
-if (import.meta.env.DEV) {
+if (((<unknown>import.meta) as any).env.DEV) {
   window['clientRouter'] = new Router('#root', routing, true);
 }
 

src/modules/core/decorator/index.ts

@@ -100,14 +100,17 @@ export function Emitter(
   options?: any,
   channelName?: string,
 ) {
-  return function decorator(target: any) {
+  return function decorator(
+    target: any,
+    propertyKey: string | symbol,
+    descriptor: PropertyDescriptor,
+  ) {
     const channel = channelName ? channelName : 'default';
-    let prop: string = '';
 
     if (eventName) {
-      prop = EMIT_KEY + channel + eventName;
+      propertyKey = EMIT_KEY + channel + eventName;
     } else {
-      prop = EMIT_KEY + channel;
+      propertyKey = EMIT_KEY + channel;
     }
 
     function addEvent(name?: string, chan?: string) {
@@ -130,9 +133,9 @@ export function Emitter(
       }
     }
 
-    if (!target[prop]) {
-      target[prop] = function () {
-        addEvent.call(this, eventName, channelName);
+    if (!target[propertyKey]) {
+      target[propertyKey] = function () {
+        addEvent.call(this, eventName, channelName, descriptor);
       };
     }
 

src/modules/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@readymade/core",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "description": "JavaScript microlibrary for developing Web Components with TypeScript and Decorators",
   "type": "module",
   "module": "./fesm2022/index.js",
@@ -36,4 +36,4 @@
     "url": "https://github.com/readymade-ui/readymade/issues"
   },
   "homepage": "https://github.com/readymade-ui/readymade#readme"
-}
+}

src/modules/dom/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@readymade/dom",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "description": "JavaScript microlibrary for developing Web Components with TypeScript and Decorators",
   "type": "module",
   "module": "./fesm2022/index.js",
@@ -36,4 +36,4 @@
     "url": "https://github.com/readymade-ui/readymade/issues"
   },
   "homepage": "https://github.com/readymade-ui/readymade#readme"
-}
+}

src/modules/router/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@readymade/router",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "description": "JavaScript microlibrary for developing Web Components with TypeScript and Decorators",
   "type": "module",
   "module": "./fesm2022/index.js",
@@ -36,4 +36,4 @@
     "url": "https://github.com/readymade-ui/readymade/issues"
   },
   "homepage": "https://github.com/readymade-ui/readymade#readme"
-}
+}

src/modules/transmit/index.ts

@@ -103,6 +103,7 @@ export class Transmitter {
   public debug: boolean = true;
   public rtcConfiguration: RTCConfiguration;
   public config: TransmitterConfiguration;
+  public channel: RTCDataChannel;
   public store: {
     messages: Array<any>;
   };
@@ -120,15 +121,14 @@ export class Transmitter {
     this.remotePeerId = null;
     this.store = { messages: [] };
     this.rtcConfiguration = config.rtcConfig
-      ? config.rtc
-      : {
+      ? config.rtcConfig
+      : ({
           iceServers: [
             {
-              url: 'stun:stun.l.google.com:19302',
               urls: ['stun:stun.l.google.com:19302'],
             },
           ],
-        };
+        } as RTCConfiguration);
     this.dataChannelConfig = {
       ordered: false,
       maxPacketLifeTime: 1000,

src/modules/transmit/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@readymade/transmit",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "description": "Swiss-army knife for communicating over WebRTC DataChannel, WebSocket or Touch OSC",
   "type": "module",
   "module": "./fesm2022/index.js",
@@ -37,4 +37,4 @@
     "url": "https://github.com/readymade-ui/readymade/issues"
   },
   "homepage": "https://github.com/readymade-ui/readymade#readme"
-}
+}

src/modules/ui/component/input/button.ts

@@ -6,6 +6,7 @@ export interface RdButtonAttributes {
   label?: string;
   width?: string;
   height?: string;
+  style?: Partial<CSSStyleDeclaration>;
 }
 
 @Component({

src/modules/ui/component/input/radio.ts

@@ -251,7 +251,7 @@ class RdRadioGroup extends FormElement {
         const input = document.createElement('input');
         const label = document.createElement('label');
         input.setAttribute('type', 'radio');
-        input.setAttribute('name', control.attributes.inputs[i].name);
+        input.setAttribute('name', control.attributes.inputs[i].label);
         input.setAttribute('value', control.attributes.inputs[i].value);
         label.setAttribute('for', control.attributes.inputs[i].value);
         label.textContent = control.attributes.inputs[i].label;

src/modules/ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@readymade/ui",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "description": "UI library of standard elements built with Readymade",
   "type": "module",
   "module": "./fesm2022/index.js",
@@ -36,4 +36,4 @@
     "url": "https://github.com/readymade-ui/readymade/issues"
   },
   "homepage": "https://github.com/readymade-ui/readymade#readme"
-}
+}

vite-env.d.ts

@@ -0,0 +1,9 @@
+declare module '*.css?raw' {
+  const content: string;
+  export default content;
+}
+
+declare module '*.html?raw' {
+  const content: string;
+  export default content;
+}