feat(*): renames forId to widgetId

Author: Krzysztof Pniak

packages/angular-widget/src/HeadwayWidget.ts

@@ -97,14 +97,14 @@ export class HeadwayWidget implements OnInit, OnDestroy {
 @Component({
   selector: "headway-widget-trigger",
   template: `<div
-    class="{{ headwayWidgetTriggerClassName + '_' + forId }}"
+    class="{{ headwayWidgetTriggerClassName + '_' + widgetId }}"
     style="position: relative; display: inline-block"
   >
     <ng-content></ng-content>
   </div>`,
 })
 export class HeadwayWidgetTrigger {
-  @Input() forId: string = "widget-1";
+  @Input() widgetId: string = "widget-1";
   headwayWidgetTriggerClassName = HeadwayWidgetTriggerClassName;
 }
 

packages/angular-widget/stories/widget.stories.mdx

@@ -129,7 +129,7 @@ class AppComponent {}
 
 ## External trigger
 
-Widget can be triggered by any other element on the page. To achieve that use HeadwayWidgetTrigger and set its `forId`
+Widget can be triggered by any other element on the page. To achieve that use HeadwayWidgetTrigger and set its `widgetId`
 prop to corresponding widget `id`.
 
 <Preview withSource="none">
@@ -139,7 +139,7 @@ prop to corresponding widget `id`.
       <headway-widget account="J1LKG7" id="idOfYourChoice">
         <logo></logo>
       </headway-widget>
-      <headway-widget-trigger forId="idOfYourChoice">
+      <headway-widget-trigger widgetId="idOfYourChoice">
         <button>Trigger</button>
       </headway-widget-trigger>
     </div>`,
@@ -156,7 +156,7 @@ prop to corresponding widget `id`.
       <headway-widget account="J1LKG7" id="idOfYourChoice">
         Logo
       </headway-widget>
-      <headway-widget-trigger forId="idOfYourChoice">
+      <headway-widget-trigger widgetId="idOfYourChoice">
         <button>Trigger</button>
       </headway-widget-trigger>
     </div>

packages/react-widget/package.json

@@ -7,7 +7,6 @@
     "build": "rollup -c",
     "dev": "start-storybook -p 6006",
     "build-storybook": "build-storybook",
-    "pack:rename": "(cd output/ && mv \"$(npm pack ../ | tail -n 1)\" package.tgz)"
   },
   "files": [
     "dist/*"

packages/react-widget/src/HeadwayWidget.js

@@ -6,15 +6,15 @@ const HeadwayWidgetSelector = "." + HeadwayWidgetClassName;
 const HeadwayWidgetTriggerClassName = "HW_trigger";
 const HeadwayWidgetTriggerSelector = "." + HeadwayWidgetTriggerClassName;
 
-const HeadwayWidgetTrigger = ({ forId, component, children }) => {
+const HeadwayWidgetTrigger = ({ widgetId, component, children }) => {
   const Component = component || "div";
-  const className = HeadwayWidgetTriggerClassName + `_${forId}`;
+  const className = HeadwayWidgetTriggerClassName + `_${widgetId}`;
 
   return <Component className={className}>{children}</Component>;
 };
 
 HeadwayWidgetTrigger.defaultProps = {
-  forId: "widget-1",
+  widgetId: "widget-1",
 };
 
 const parsePosition = (positionText) => {

packages/react-widget/stories/widget.stories.mdx

@@ -94,7 +94,7 @@ Widget can be triggered by its children.
 
 ## External trigger
 
-Widget can be triggered by any other element on the page. To achieve that use HeadwayWidgetTrigger and set its `forId`
+Widget can be triggered by any other element on the page. To achieve that use HeadwayWidgetTrigger and set its `widgetId`
 prop to corresponding widget `id`.
 
 <Preview withSource="none">
@@ -103,7 +103,7 @@ prop to corresponding widget `id`.
       <HeadwayWidget account="J1LKG7" id="widget-external-trigger">
         <Logo />
       </HeadwayWidget>
-      <HeadwayWidgetTrigger forId="widget-external-trigger">
+      <HeadwayWidgetTrigger widgetId="widget-external-trigger">
         <button>Trigger</button>
       </HeadwayWidgetTrigger>
     </div>
@@ -115,7 +115,7 @@ prop to corresponding widget `id`.
   <HeadwayWidget account="J1LKG7" id="widget-external-trigger">
     <Logo />
   </HeadwayWidget>
-  <HeadwayWidgetTrigger forId="widget-external-trigger">
+  <HeadwayWidgetTrigger widgetId="widget-external-trigger">
     <button>Trigger</button>
   </HeadwayWidgetTrigger>
 </div>

packages/vanilla-widget/stories/widget.stories.mdx

@@ -59,7 +59,7 @@ You can change widget position to one of 6 possible values. Check all of them in
 
 ## External trigger
 
-Widget can be triggered by any other element on the page. To achieve that use HeadwayWidgetTrigger and set its `forId`
+Widget can be triggered by any other element on the page. To achieve that use HeadwayWidgetTrigger and set its `widgetId`
 prop to corresponding widget `id`.
 
 <Preview>
@@ -69,7 +69,7 @@ prop to corresponding widget `id`.
             <headway-widget account="J1LKG7" id="4">
                 <logo></logo>
             </headway-widget>
-            <headway-widget-trigger forId="4">
+            <headway-widget-trigger widgetId="4">
                 <button>Trigger</button>
             </headway-widget-trigger>
         </div>`,

packages/vue-widget/src/HeadwayWidgetTrigger.vue

@@ -18,7 +18,7 @@ const HeadwayWidgetTriggerSelector = "." + HeadwayWidgetTriggerClassName;
 export default {
   name: "headway-widget-trigger",
   props: {
-    forId: {
+    widgetId: {
       type: String,
       default: 'widget-1'
     },
@@ -28,7 +28,7 @@ export default {
     },
   },
   data: (self) => ({
-    cName: HeadwayWidgetTriggerClassName  + `_${self.forId}`,
+    cName: HeadwayWidgetTriggerClassName  + `_${self.widgetId}`,
   }),
 };
 </script>

packages/vue-widget/stories/widget.stories.mdx

@@ -119,7 +119,7 @@ You can change widget position to one of 6 possible values. Check all of them in
 
 ## External trigger
 
-Widget can be triggered by any other element on the page. To achieve that use HeadwayWidgetTrigger and set its `forId`
+Widget can be triggered by any other element on the page. To achieve that use HeadwayWidgetTrigger and set its `widgetId`
 prop to corresponding widget `id`.
 
 <Preview withSource="none">
@@ -129,7 +129,7 @@ prop to corresponding widget `id`.
             <headway-widget account="J1LKG7" id="4">
                 <logo></logo>
             </headway-widget>
-            <headway-widget-trigger forId="4">
+            <headway-widget-trigger widgetId="4">
                 <button>Trigger</button>
             </headway-widget-trigger>
         </div>`,
@@ -143,7 +143,7 @@ prop to corresponding widget `id`.
     <headway-widget account="J1LKG7" position="center-left" id="idOfYourChoice"
       >Logo</headway-widget
     >
-    <headway-widget-trigger forId="idOfYourChoice">
+    <headway-widget-trigger widgetId="idOfYourChoice">
       <button>Trigger</button>
     </headway-widget-trigger>
   </div>