Fix TypeScript errors

packages/element-library/src/audioSticker/constants.js

@@ -13,20 +13,16 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
 /**
  * External dependencies
  */
 import { PanelTypes } from '@googleforcreators/design-system';
-import { __ } from '@googleforcreators/i18n';
 
 /**
  * Internal dependencies
  */
 import { SHARED_DEFAULT_ATTRIBUTES } from '../shared';
-import headphoneCat from './sticker-images/headphone-cat/headphone-cat-pretap.png';
-import tapePlayer from './sticker-images/tape-player/tape-player-pretap.png';
-import loudSpeaker from './sticker-images/loud-speaker/loud-speaker-posttap.png';
-import audioCloud from './sticker-images/audio-cloud/audio-cloud-posttap.png';
 
 export const hasEditMode = false;
 export const hasEditModeIfLocked = false;
@@ -51,34 +47,6 @@ export const resizeRules = {
   diagonal: false,
 };
 
-export const AUDIO_STICKERS = {
-  'headphone-cat': headphoneCat,
-  'tape-player': tapePlayer,
-  'loud-speaker': loudSpeaker,
-  'audio-cloud': audioCloud,
-};
-
-export const AUDIO_STICKER_STYLES = {
-  none: '',
-  outline: 'border: 4px solid white; border-radius: 20px',
-  dropshadow: 'filter: drop-shadow(2px 2px 10px white)',
-};
-
-export const AUDIO_STICKER_LABELS = {
-  'headphone-cat': {
-    label: __('Headphone Cat', 'web-stories'),
-  },
-  'tape-player': {
-    label: __('Tape Player', 'web-stories'),
-  },
-  'loud-speaker': {
-    label: __('Loud Speaker', 'web-stories'),
-  },
-  'audio-cloud': {
-    label: __('Audio Cloud', 'web-stories'),
-  },
-};
-
 export const defaultAttributes = {
   ...SHARED_DEFAULT_ATTRIBUTES,
   size: 'small',

packages/element-library/src/constants.ts

@@ -14,11 +14,48 @@
  * limitations under the License.
  */
 
-export {
-  AUDIO_STICKERS,
-  AUDIO_STICKER_STYLES,
-  AUDIO_STICKER_LABELS,
-} from './audioSticker/constants';
+/**
+ * External dependencies
+ */
+import { __ } from '@googleforcreators/i18n';
+
+/**
+ * Internal dependencies
+ */
+import headphoneCat from './audioSticker/images/headphone-cat/headphone-cat-pretap.png';
+import tapePlayer from './audioSticker/images/tape-player/tape-player-pretap.png';
+import loudSpeaker from './audioSticker/images/loud-speaker/loud-speaker-posttap.png';
+import audioCloud from './audioSticker/images/audio-cloud/audio-cloud-posttap.png';
+
+// TODO: Move to audioSticker folder once TypeScript conversion is complete.
+// See https://github.com/GoogleForCreators/web-stories-wp/pull/13503.
+export const AUDIO_STICKERS: Record<string, string> = {
+  'headphone-cat': headphoneCat,
+  'tape-player': tapePlayer,
+  'loud-speaker': loudSpeaker,
+  'audio-cloud': audioCloud,
+} as const;
+
+export const AUDIO_STICKER_STYLES = {
+  none: '',
+  outline: 'border: 4px solid white; border-radius: 20px',
+  dropshadow: 'filter: drop-shadow(2px 2px 10px white)',
+};
+
+export const AUDIO_STICKER_LABELS = {
+  'headphone-cat': {
+    label: __('Headphone Cat', 'web-stories'),
+  },
+  'tape-player': {
+    label: __('Tape Player', 'web-stories'),
+  },
+  'loud-speaker': {
+    label: __('Loud Speaker', 'web-stories'),
+  },
+  'audio-cloud': {
+    label: __('Audio Cloud', 'web-stories'),
+  },
+};
 
 export const DEFAULT_ATTRIBUTES_FOR_MEDIA = {
   scale: 100,

packages/element-library/src/typings/images.d.ts

@@ -0,0 +1,20 @@
+/*
+ * Copyright 2024 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+declare module '*.png' {
+  const value: string;
+  export = value;
+}

packages/element-library/tsconfig.json

@@ -19,9 +19,11 @@
     { "path": "../units" }
   ],
   "include": [
+    "src/audioSticker/images",
     "src/constants.ts",
     "src/types.ts",
     "src/types",
+    "src/typings",
     "src/utils/textMeasurements.tsx",
     "src/text/*.ts",
     "src/text/*.tsx"

packages/output/src/utils/getUsedAmpExtensions.ts

@@ -63,7 +63,7 @@ const getUsedAmpExtensions = (pages: Page[]) => {
     src: 'https://cdn.ampproject.org/v0/amp-story-shopping-0.1.js',
   };
 
-  const ampStoryAudioSticker = {
+  const ampStoryAudioSticker: AmpExtension = {
     name: 'amp-story-audio-sticker',
     src: 'https://cdn.ampproject.org/v0/amp-story-audio-sticker-0.1.js',
   };