refactor: convert module syntax to ESM imports and exports

- Replace import X = require('Y') with import X from 'Y'
- Replace export = X with export default X
- Remove 'use strict' directives (ESM is strict by default)
- Keep runtime require() calls for browserify transforms:
  template/style require() for stringify transform,
  package.json require() for version extraction,
  message_keys require() for browserify stub

Author: Mearman

index.ts

@@ -1,8 +1,7 @@
-'use strict';
 
-import configPageHtml = require('./tmp/config-page.html');
-import toSource = require('tosource');
-import standardComponents = require('./src/scripts/components');
+import configPageHtml from './tmp/config-page.html';
+import toSource from 'tosource';
+import standardComponents from './src/scripts/components';
 function extractVersion(): string {
   const pkg: unknown = require('./package.json');
   /* istanbul ignore else — TS defensive guard for untyped require */
@@ -12,11 +11,11 @@ function extractVersion(): string {
   return '';
 }
 const version = extractVersion();
-import messageKeys = require('message_keys');
+import messageKeys from 'message_keys';
 
 import { ClayConfigItem, ClayMeta } from './src/scripts/lib/types';
 
-import deepcopy = require('deepcopy/build/deepcopy.min');
+import deepcopy from 'deepcopy/build/deepcopy.min';
 
 interface PebbleObject {
   addEventListener(event: string, handler: (...args: unknown[]) => void): void;
@@ -417,4 +416,4 @@ createClay.encodeDataUri = Clay.encodeDataUri;
 createClay.prepareForAppMessage = Clay.prepareForAppMessage;
 createClay.prepareSettingsForAppMessage = Clay.prepareSettingsForAppMessage;
 
-export = createClay;
+export default createClay;

src/scripts/components/button.ts

@@ -1,6 +1,5 @@
-'use strict';
 
-export = {
+export default {
   name: 'button',
   template: require('../../templates/components/button.tpl'),
   style: require('../../../tmp/button.css'),

src/scripts/components/checkboxgroup.ts

@@ -1,6 +1,5 @@
-'use strict';
 
-export = {
+export default {
   name: 'checkboxgroup',
   template: require('../../templates/components/checkboxgroup.tpl'),
   style: require('../../../tmp/checkboxgroup.css'),

src/scripts/components/color.ts

@@ -1,8 +1,7 @@
-'use strict';
 
 import { ClayItemInstance, ClayConfigInstance } from '../lib/types';
 
-export = {
+export default {
   name: 'color',
   template: require('../../templates/components/color.tpl'),
   style: require('../../../tmp/color.css'),

src/scripts/components/footer.ts

@@ -1,6 +1,5 @@
-'use strict';
 
-export = {
+export default {
   name: 'footer',
   template: require('../../templates/components/footer.tpl'),
   manipulator: 'html'

src/scripts/components/heading.ts

@@ -1,6 +1,5 @@
-'use strict';
 
-export = {
+export default {
   name: 'heading',
   template: require('../../templates/components/heading.tpl'),
   manipulator: 'html',

src/scripts/components/index.ts

@@ -1,19 +1,18 @@
-'use strict';
 
 import { ClayComponentInput } from '../lib/types';
 
-import color = require('./color');
-import footer = require('./footer');
-import heading = require('./heading');
-import input = require('./input');
-import select = require('./select');
-import submit = require('./submit');
-import text = require('./text');
-import toggle = require('./toggle');
-import radiogroup = require('./radiogroup');
-import checkboxgroup = require('./checkboxgroup');
-import button = require('./button');
-import slider = require('./slider');
+import color from './color';
+import footer from './footer';
+import heading from './heading';
+import input from './input';
+import select from './select';
+import submit from './submit';
+import text from './text';
+import toggle from './toggle';
+import radiogroup from './radiogroup';
+import checkboxgroup from './checkboxgroup';
+import button from './button';
+import slider from './slider';
 
 const components: Record<string, ClayComponentInput> = {
   color,
@@ -30,4 +29,4 @@ const components: Record<string, ClayComponentInput> = {
   slider
 };
 
-export = components;
+export default components;

src/scripts/components/input.ts

@@ -1,6 +1,5 @@
-'use strict';
 
-export = {
+export default {
   name: 'input',
   template: require('../../templates/components/input.tpl'),
   style: require('../../../tmp/input.css'),

src/scripts/components/radiogroup.ts

@@ -1,6 +1,5 @@
-'use strict';
 
-export = {
+export default {
   name: 'radiogroup',
   template: require('../../templates/components/radiogroup.tpl'),
   style: require('../../../tmp/radiogroup.css'),

src/scripts/components/select.ts

@@ -1,8 +1,7 @@
-'use strict';
 
 import { ClayItemInstance } from '../lib/types';
 
-export = {
+export default {
   name: 'select',
   template: require('../../templates/components/select.tpl'),
   style: require('../../../tmp/select.css'),