@teacharium/widget 0.2.1 → 0.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,11 @@
1
+ import * as React from "react";
2
+ interface AudioPlayerProps {
3
+ audioUrl: string;
4
+ className?: string;
5
+ size?: "sm" | "md" | "lg";
6
+ onPlay?: () => void;
7
+ onPause?: () => void;
8
+ onError?: (error: string) => void;
9
+ }
10
+ export declare const AudioPlayer: React.FC<AudioPlayerProps>;
11
+ export {};
package/dist/main.d.ts CHANGED
@@ -2,4 +2,6 @@ export * from './teacharium-widget';
2
2
  export * from './teacharium-widget-api';
3
3
  export * from './teacharium-custom-fields';
4
4
  export * from './standard-layout-options';
5
+ export { AudioPlayer } from './components/AudioPlayer';
6
+ export * from './utils/voiceover';
5
7
  export declare const hi = "world";
@@ -11,6 +11,10 @@ export interface AudioMediaField extends BaseField {
11
11
  type: "audioMedia";
12
12
  label: string;
13
13
  }
14
+ export interface VoiceoverField extends BaseField {
15
+ type: "voiceover";
16
+ label?: string;
17
+ }
14
18
  export interface ActionField extends BaseField {
15
19
  type: "action";
16
20
  label: string;
@@ -31,4 +35,16 @@ export interface ConditionField extends BaseField {
31
35
  type: "condition";
32
36
  label: string;
33
37
  }
34
- export type TeachariumCustomFields = ImageMediaField | VideoMediaField | AudioMediaField | ActionField | VariableField | NumericExpressionField | StringExpressionField | ConditionField;
38
+ export interface PlaceholderField extends BaseField {
39
+ type: "placeholder";
40
+ label?: string;
41
+ description?: string;
42
+ value?: string;
43
+ }
44
+ export interface StepField extends BaseField {
45
+ type: "step";
46
+ label: string;
47
+ placeholder?: string;
48
+ description?: string;
49
+ }
50
+ export type TeachariumCustomFields = ImageMediaField | VideoMediaField | AudioMediaField | VoiceoverField | ActionField | VariableField | NumericExpressionField | StringExpressionField | ConditionField | PlaceholderField | StepField;
@@ -1,4 +1,13 @@
1
1
  import { default as React } from 'react';
2
+ export type VoiceType = "alloy" | "ash" | "ballad" | "coral" | "echo" | "fable" | "onyx" | "nova" | "sage" | "shimmer" | "verse";
3
+ export interface VoiceoverData {
4
+ enabled: boolean;
5
+ voice: VoiceType;
6
+ showPlayButton: boolean;
7
+ cached?: boolean;
8
+ content?: string;
9
+ contentHash?: string;
10
+ }
2
11
  export declare const EVENT_SOURCE_PLAYER = "player";
3
12
  export declare const EVENT_SOURCE_FOOTER = "footer";
4
13
  type EventListener<T = any> = (event: T) => void;
@@ -16,10 +25,10 @@ export interface UseStringExpression {
16
25
  (expression: string, defaultValue?: string): string;
17
26
  }
18
27
  export interface UseVariableValue {
19
- (name: string): VariableValue | undefined;
28
+ (name: string | null | undefined): VariableValue | undefined;
20
29
  }
21
30
  export interface UseVariableValues {
22
- (names: string[]): (VariableValue | undefined)[];
31
+ (names: Array<string | null | undefined>): (VariableValue | undefined)[];
23
32
  }
24
33
  export interface UseUpdateVariable {
25
34
  (newValue: VariableValue): void;
@@ -33,6 +42,20 @@ export interface UseMediaUrl {
33
42
  isLoadingError: boolean;
34
43
  };
35
44
  }
45
+ export interface UseVoiceoverUrl {
46
+ (contentHash?: string | null, voice?: VoiceType | null, options?: {
47
+ enabled?: boolean;
48
+ model?: string | null;
49
+ }): {
50
+ data: string | undefined;
51
+ error: Error | null;
52
+ isError: boolean;
53
+ isLoading: boolean;
54
+ isLoadingError: boolean;
55
+ refetch: () => Promise<any>;
56
+ voiceoverId: string | undefined;
57
+ };
58
+ }
36
59
  export interface ConditionValue {
37
60
  leftOperand: string;
38
61
  operator: string;
@@ -95,6 +118,7 @@ export interface TeachariumWidgetApi {
95
118
  useVariableValues: UseVariableValues;
96
119
  useUpdateVariable: (variableName: string) => UseUpdateVariable;
97
120
  useMediaUrl: UseMediaUrl;
121
+ useVoiceoverUrl: UseVoiceoverUrl;
98
122
  useConditionEvaluation: UseConditionEvaluation;
99
123
  useIsItem: UseIsItem;
100
124
  useItemsContext: UseItemsContext;
@@ -5,8 +5,13 @@ interface TeachariumComponentProps {
5
5
  api: TeachariumWidgetApi;
6
6
  }
7
7
  export interface TeachariumComponentConfig<T = {}> {
8
+ usagePrompt: string;
8
9
  fields: Fields<DefaultComponentProps, TeachariumCustomFields>;
9
10
  defaultProps: DefaultComponentProps;
11
+ resolveData?: (arg: {
12
+ props: any;
13
+ changed: any;
14
+ }) => Promise<any>;
10
15
  render: PuckComponent<T & TeachariumComponentProps>;
11
16
  }
12
17
  export interface TeachariumWidget<T> {
@@ -1,8 +1,10 @@
1
- import re from "react";
2
- const ce = (n) => {
3
- window.TeachariumComponents = window.TeachariumComponents || {}, window.TeachariumComponents[n.name] = n;
4
- }, le = () => Object.values(window.TeachariumComponents || {}), ie = "player", fe = "footer";
5
- var p = { exports: {} }, _ = {};
1
+ import * as x from "react";
2
+ import ae from "react";
3
+ import { VolumeX as Q, Loader2 as oe, Pause as se, Play as le, Volume2 as ie } from "lucide-react";
4
+ const pe = (t) => {
5
+ window.TeachariumComponents = window.TeachariumComponents || {}, window.TeachariumComponents[t.name] = t;
6
+ }, Re = () => Object.values(window.TeachariumComponents || {}), _e = "player", Te = "footer";
7
+ var M = { exports: {} }, O = {};
6
8
  /**
7
9
  * @license React
8
10
  * react-jsx-runtime.production.js
@@ -12,29 +14,29 @@ var p = { exports: {} }, _ = {};
12
14
  * This source code is licensed under the MIT license found in the
13
15
  * LICENSE file in the root directory of this source tree.
14
16
  */
15
- var I;
16
- function te() {
17
- if (I) return _;
18
- I = 1;
19
- var n = Symbol.for("react.transitional.element"), i = Symbol.for("react.fragment");
20
- function s(m, u, c) {
21
- var E = null;
22
- if (c !== void 0 && (E = "" + c), u.key !== void 0 && (E = "" + u.key), "key" in u) {
23
- c = {};
24
- for (var R in u)
25
- R !== "key" && (c[R] = u[R]);
26
- } else c = u;
27
- return u = c.ref, {
28
- $$typeof: n,
29
- type: m,
30
- key: E,
31
- ref: u !== void 0 ? u : null,
32
- props: c
17
+ var K;
18
+ function ce() {
19
+ if (K) return O;
20
+ K = 1;
21
+ var t = Symbol.for("react.transitional.element"), d = Symbol.for("react.fragment");
22
+ function n(E, l, i) {
23
+ var o = null;
24
+ if (i !== void 0 && (o = "" + i), l.key !== void 0 && (o = "" + l.key), "key" in l) {
25
+ i = {};
26
+ for (var m in l)
27
+ m !== "key" && (i[m] = l[m]);
28
+ } else i = l;
29
+ return l = i.ref, {
30
+ $$typeof: t,
31
+ type: E,
32
+ key: o,
33
+ ref: l !== void 0 ? l : null,
34
+ props: i
33
35
  };
34
36
  }
35
- return _.Fragment = i, _.jsx = s, _.jsxs = s, _;
37
+ return O.Fragment = d, O.jsx = n, O.jsxs = n, O;
36
38
  }
37
- var b = {};
39
+ var k = {};
38
40
  /**
39
41
  * @license React
40
42
  * react-jsx-runtime.development.js
@@ -44,125 +46,125 @@ var b = {};
44
46
  * This source code is licensed under the MIT license found in the
45
47
  * LICENSE file in the root directory of this source tree.
46
48
  */
47
- var L;
48
- function ne() {
49
- return L || (L = 1, process.env.NODE_ENV !== "production" && (function() {
50
- function n(e) {
49
+ var ee;
50
+ function ue() {
51
+ return ee || (ee = 1, process.env.NODE_ENV !== "production" && (function() {
52
+ function t(e) {
51
53
  if (e == null) return null;
52
54
  if (typeof e == "function")
53
- return e.$$typeof === Q ? null : e.displayName || e.name || null;
55
+ return e.$$typeof === I ? null : e.displayName || e.name || null;
54
56
  if (typeof e == "string") return e;
55
57
  switch (e) {
56
- case v:
58
+ case T:
57
59
  return "Fragment";
58
- case q:
60
+ case $:
59
61
  return "Profiler";
60
- case V:
62
+ case R:
61
63
  return "StrictMode";
62
- case X:
64
+ case y:
63
65
  return "Suspense";
64
- case B:
66
+ case N:
65
67
  return "SuspenseList";
66
- case Z:
68
+ case Y:
67
69
  return "Activity";
68
70
  }
69
71
  if (typeof e == "object")
70
72
  switch (typeof e.tag == "number" && console.error(
71
73
  "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
72
74
  ), e.$$typeof) {
73
- case U:
75
+ case W:
74
76
  return "Portal";
75
- case z:
77
+ case S:
76
78
  return (e.displayName || "Context") + ".Provider";
77
- case J:
79
+ case D:
78
80
  return (e._context.displayName || "Context") + ".Consumer";
79
- case G:
81
+ case s:
80
82
  var r = e.render;
81
83
  return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
82
- case H:
83
- return r = e.displayName || null, r !== null ? r : n(e.type) || "Memo";
84
- case y:
84
+ case L:
85
+ return r = e.displayName || null, r !== null ? r : t(e.type) || "Memo";
86
+ case j:
85
87
  r = e._payload, e = e._init;
86
88
  try {
87
- return n(e(r));
89
+ return t(e(r));
88
90
  } catch {
89
91
  }
90
92
  }
91
93
  return null;
92
94
  }
93
- function i(e) {
95
+ function d(e) {
94
96
  return "" + e;
95
97
  }
96
- function s(e) {
98
+ function n(e) {
97
99
  try {
98
- i(e);
100
+ d(e);
99
101
  var r = !1;
100
102
  } catch {
101
103
  r = !0;
102
104
  }
103
105
  if (r) {
104
106
  r = console;
105
- var t = r.error, o = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
106
- return t.call(
107
+ var a = r.error, c = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
108
+ return a.call(
107
109
  r,
108
110
  "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
109
- o
110
- ), i(e);
111
+ c
112
+ ), d(e);
111
113
  }
112
114
  }
113
- function m(e) {
114
- if (e === v) return "<>";
115
- if (typeof e == "object" && e !== null && e.$$typeof === y)
115
+ function E(e) {
116
+ if (e === T) return "<>";
117
+ if (typeof e == "object" && e !== null && e.$$typeof === j)
116
118
  return "<...>";
117
119
  try {
118
- var r = n(e);
120
+ var r = t(e);
119
121
  return r ? "<" + r + ">" : "<...>";
120
122
  } catch {
121
123
  return "<...>";
122
124
  }
123
125
  }
124
- function u() {
125
- var e = O.A;
126
+ function l() {
127
+ var e = g.A;
126
128
  return e === null ? null : e.getOwner();
127
129
  }
128
- function c() {
130
+ function i() {
129
131
  return Error("react-stack-top-frame");
130
132
  }
131
- function E(e) {
132
- if (g.call(e, "key")) {
133
+ function o(e) {
134
+ if (G.call(e, "key")) {
133
135
  var r = Object.getOwnPropertyDescriptor(e, "key").get;
134
136
  if (r && r.isReactWarning) return !1;
135
137
  }
136
138
  return e.key !== void 0;
137
139
  }
138
- function R(e, r) {
139
- function t() {
140
- N || (N = !0, console.error(
140
+ function m(e, r) {
141
+ function a() {
142
+ H || (H = !0, console.error(
141
143
  "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
142
144
  r
143
145
  ));
144
146
  }
145
- t.isReactWarning = !0, Object.defineProperty(e, "key", {
146
- get: t,
147
+ a.isReactWarning = !0, Object.defineProperty(e, "key", {
148
+ get: a,
147
149
  configurable: !0
148
150
  });
149
151
  }
150
- function W() {
151
- var e = n(this.type);
152
- return C[e] || (C[e] = !0, console.error(
152
+ function w() {
153
+ var e = t(this.type);
154
+ return z[e] || (z[e] = !0, console.error(
153
155
  "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
154
156
  )), e = this.props.ref, e !== void 0 ? e : null;
155
157
  }
156
- function M(e, r, t, o, f, l, w, S) {
157
- return t = l.ref, e = {
158
- $$typeof: h,
158
+ function A(e, r, a, c, _, v, V, J) {
159
+ return a = v.ref, e = {
160
+ $$typeof: C,
159
161
  type: e,
160
162
  key: r,
161
- props: l,
162
- _owner: f
163
- }, (t !== void 0 ? t : null) !== null ? Object.defineProperty(e, "ref", {
163
+ props: v,
164
+ _owner: _
165
+ }, (a !== void 0 ? a : null) !== null ? Object.defineProperty(e, "ref", {
164
166
  enumerable: !1,
165
- get: W
167
+ get: w
166
168
  }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
167
169
  configurable: !1,
168
170
  enumerable: !1,
@@ -177,112 +179,112 @@ function ne() {
177
179
  configurable: !1,
178
180
  enumerable: !1,
179
181
  writable: !0,
180
- value: w
182
+ value: V
181
183
  }), Object.defineProperty(e, "_debugTask", {
182
184
  configurable: !1,
183
185
  enumerable: !1,
184
186
  writable: !0,
185
- value: S
187
+ value: J
186
188
  }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
187
189
  }
188
- function j(e, r, t, o, f, l, w, S) {
189
- var a = r.children;
190
- if (a !== void 0)
191
- if (o)
192
- if (K(a)) {
193
- for (o = 0; o < a.length; o++)
194
- P(a[o]);
195
- Object.freeze && Object.freeze(a);
190
+ function b(e, r, a, c, _, v, V, J) {
191
+ var u = r.children;
192
+ if (u !== void 0)
193
+ if (c)
194
+ if (te(u)) {
195
+ for (c = 0; c < u.length; c++)
196
+ P(u[c]);
197
+ Object.freeze && Object.freeze(u);
196
198
  } else
197
199
  console.error(
198
200
  "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
199
201
  );
200
- else P(a);
201
- if (g.call(r, "key")) {
202
- a = n(e);
203
- var d = Object.keys(r).filter(function(ee) {
204
- return ee !== "key";
202
+ else P(u);
203
+ if (G.call(r, "key")) {
204
+ u = t(e);
205
+ var h = Object.keys(r).filter(function(ne) {
206
+ return ne !== "key";
205
207
  });
206
- o = 0 < d.length ? "{key: someKey, " + d.join(": ..., ") + ": ...}" : "{key: someKey}", F[a + o] || (d = 0 < d.length ? "{" + d.join(": ..., ") + ": ...}" : "{}", console.error(
208
+ c = 0 < h.length ? "{key: someKey, " + h.join(": ..., ") + ": ...}" : "{key: someKey}", Z[u + c] || (h = 0 < h.length ? "{" + h.join(": ..., ") + ": ...}" : "{}", console.error(
207
209
  `A props object containing a "key" prop is being spread into JSX:
208
210
  let props = %s;
209
211
  <%s {...props} />
210
212
  React keys must be passed directly to JSX without using spread:
211
213
  let props = %s;
212
214
  <%s key={someKey} {...props} />`,
213
- o,
214
- a,
215
- d,
216
- a
217
- ), F[a + o] = !0);
215
+ c,
216
+ u,
217
+ h,
218
+ u
219
+ ), Z[u + c] = !0);
218
220
  }
219
- if (a = null, t !== void 0 && (s(t), a = "" + t), E(r) && (s(r.key), a = "" + r.key), "key" in r) {
220
- t = {};
221
- for (var A in r)
222
- A !== "key" && (t[A] = r[A]);
223
- } else t = r;
224
- return a && R(
225
- t,
221
+ if (u = null, a !== void 0 && (n(a), u = "" + a), o(r) && (n(r.key), u = "" + r.key), "key" in r) {
222
+ a = {};
223
+ for (var q in r)
224
+ q !== "key" && (a[q] = r[q]);
225
+ } else a = r;
226
+ return u && m(
227
+ a,
226
228
  typeof e == "function" ? e.displayName || e.name || "Unknown" : e
227
- ), M(
229
+ ), A(
228
230
  e,
231
+ u,
232
+ v,
233
+ _,
234
+ l(),
229
235
  a,
230
- l,
231
- f,
232
- u(),
233
- t,
234
- w,
235
- S
236
+ V,
237
+ J
236
238
  );
237
239
  }
238
240
  function P(e) {
239
- typeof e == "object" && e !== null && e.$$typeof === h && e._store && (e._store.validated = 1);
241
+ typeof e == "object" && e !== null && e.$$typeof === C && e._store && (e._store.validated = 1);
240
242
  }
241
- var T = re, h = Symbol.for("react.transitional.element"), U = Symbol.for("react.portal"), v = Symbol.for("react.fragment"), V = Symbol.for("react.strict_mode"), q = Symbol.for("react.profiler"), J = Symbol.for("react.consumer"), z = Symbol.for("react.context"), G = Symbol.for("react.forward_ref"), X = Symbol.for("react.suspense"), B = Symbol.for("react.suspense_list"), H = Symbol.for("react.memo"), y = Symbol.for("react.lazy"), Z = Symbol.for("react.activity"), Q = Symbol.for("react.client.reference"), O = T.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, g = Object.prototype.hasOwnProperty, K = Array.isArray, k = console.createTask ? console.createTask : function() {
243
+ var p = ae, C = Symbol.for("react.transitional.element"), W = Symbol.for("react.portal"), T = Symbol.for("react.fragment"), R = Symbol.for("react.strict_mode"), $ = Symbol.for("react.profiler"), D = Symbol.for("react.consumer"), S = Symbol.for("react.context"), s = Symbol.for("react.forward_ref"), y = Symbol.for("react.suspense"), N = Symbol.for("react.suspense_list"), L = Symbol.for("react.memo"), j = Symbol.for("react.lazy"), Y = Symbol.for("react.activity"), I = Symbol.for("react.client.reference"), g = p.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, G = Object.prototype.hasOwnProperty, te = Array.isArray, U = console.createTask ? console.createTask : function() {
242
244
  return null;
243
245
  };
244
- T = {
246
+ p = {
245
247
  react_stack_bottom_frame: function(e) {
246
248
  return e();
247
249
  }
248
250
  };
249
- var N, C = {}, Y = T.react_stack_bottom_frame.bind(
250
- T,
251
- c
252
- )(), $ = k(m(c)), F = {};
253
- b.Fragment = v, b.jsx = function(e, r, t, o, f) {
254
- var l = 1e4 > O.recentlyCreatedOwnerStacks++;
255
- return j(
251
+ var H, z = {}, X = p.react_stack_bottom_frame.bind(
252
+ p,
253
+ i
254
+ )(), B = U(E(i)), Z = {};
255
+ k.Fragment = T, k.jsx = function(e, r, a, c, _) {
256
+ var v = 1e4 > g.recentlyCreatedOwnerStacks++;
257
+ return b(
256
258
  e,
257
259
  r,
258
- t,
260
+ a,
259
261
  !1,
260
- o,
261
- f,
262
- l ? Error("react-stack-top-frame") : Y,
263
- l ? k(m(e)) : $
262
+ c,
263
+ _,
264
+ v ? Error("react-stack-top-frame") : X,
265
+ v ? U(E(e)) : B
264
266
  );
265
- }, b.jsxs = function(e, r, t, o, f) {
266
- var l = 1e4 > O.recentlyCreatedOwnerStacks++;
267
- return j(
267
+ }, k.jsxs = function(e, r, a, c, _) {
268
+ var v = 1e4 > g.recentlyCreatedOwnerStacks++;
269
+ return b(
268
270
  e,
269
271
  r,
270
- t,
272
+ a,
271
273
  !0,
272
- o,
273
- f,
274
- l ? Error("react-stack-top-frame") : Y,
275
- l ? k(m(e)) : $
274
+ c,
275
+ _,
276
+ v ? Error("react-stack-top-frame") : X,
277
+ v ? U(E(e)) : B
276
278
  );
277
279
  };
278
- })()), b;
280
+ })()), k;
279
281
  }
280
- var D;
281
- function oe() {
282
- return D || (D = 1, process.env.NODE_ENV === "production" ? p.exports = te() : p.exports = ne()), p.exports;
282
+ var re;
283
+ function de() {
284
+ return re || (re = 1, process.env.NODE_ENV === "production" ? M.exports = ce() : M.exports = ue()), M.exports;
283
285
  }
284
- var x = oe();
285
- const ae = {
286
+ var f = de();
287
+ const fe = {
286
288
  margin: {
287
289
  type: "number",
288
290
  label: "Margin",
@@ -298,26 +300,125 @@ const ae = {
298
300
  // { label: "Partial", value: "partial" },
299
301
  // ],
300
302
  // },
301
- }, se = ({ margin: n, children: i }) => {
302
- const s = {};
303
- return n && (s.padding = `${n}px`), /* @__PURE__ */ x.jsx("div", { style: s, children: i });
304
- }, de = (n) => {
305
- const i = n.render;
303
+ }, me = ({ margin: t, children: d }) => {
304
+ const n = {};
305
+ return t && (n.padding = `${t}px`), /* @__PURE__ */ f.jsx("div", { style: n, children: d });
306
+ }, ye = (t) => {
307
+ const d = t.render;
306
308
  return {
307
- ...n,
308
- render: (s) => /* @__PURE__ */ x.jsx(se, { ...s, children: /* @__PURE__ */ x.jsx(i, { ...s }) }),
309
+ ...t,
310
+ render: (n) => /* @__PURE__ */ f.jsx(me, { ...n, children: /* @__PURE__ */ f.jsx(d, { ...n }) }),
309
311
  fields: {
310
- ...n.fields,
311
- ...ae
312
+ ...t.fields,
313
+ ...fe
312
314
  }
313
315
  };
314
- }, me = "world";
316
+ }, F = (...t) => t.filter(Boolean).join(" "), ge = ({
317
+ audioUrl: t,
318
+ className: d,
319
+ size: n = "sm",
320
+ onPlay: E,
321
+ onPause: l,
322
+ onError: i
323
+ }) => {
324
+ const o = x.useRef(null), [m, w] = x.useState(!1), [A, b] = x.useState(!1), [P, p] = x.useState(null), [C, W] = x.useState(!1), T = {
325
+ sm: "h-6 w-6",
326
+ md: "h-8 w-8",
327
+ lg: "h-10 w-10"
328
+ }, R = {
329
+ sm: 12,
330
+ md: 16,
331
+ lg: 20
332
+ }, $ = async () => {
333
+ if (o.current)
334
+ try {
335
+ b(!0), p(null), m ? o.current.pause() : await o.current.play();
336
+ } catch (s) {
337
+ const y = s instanceof Error ? s.message : "Failed to play audio";
338
+ p(y), i?.(y);
339
+ } finally {
340
+ b(!1);
341
+ }
342
+ }, D = () => {
343
+ o.current && (o.current.muted = !o.current.muted, W(o.current.muted));
344
+ };
345
+ x.useEffect(() => {
346
+ const s = o.current;
347
+ if (!s) return;
348
+ const y = () => {
349
+ w(!0), E?.();
350
+ }, N = () => {
351
+ w(!1), l?.();
352
+ }, L = () => {
353
+ w(!1), l?.();
354
+ }, j = () => {
355
+ b(!0);
356
+ }, Y = () => {
357
+ b(!1);
358
+ }, I = () => {
359
+ const g = "Failed to load audio";
360
+ p(g), b(!1), i?.(g);
361
+ };
362
+ return s.addEventListener("play", y), s.addEventListener("pause", N), s.addEventListener("ended", L), s.addEventListener("loadstart", j), s.addEventListener("canplay", Y), s.addEventListener("error", I), () => {
363
+ s.removeEventListener("play", y), s.removeEventListener("pause", N), s.removeEventListener("ended", L), s.removeEventListener("loadstart", j), s.removeEventListener("canplay", Y), s.removeEventListener("error", I);
364
+ };
365
+ }, [E, l, i]);
366
+ const S = "inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 ring-offset-background bg-transparent hover:bg-gray-100";
367
+ return P ? /* @__PURE__ */ f.jsx(
368
+ "button",
369
+ {
370
+ type: "button",
371
+ className: F(
372
+ S,
373
+ T[n],
374
+ "text-red-500",
375
+ d
376
+ ),
377
+ disabled: !0,
378
+ children: /* @__PURE__ */ f.jsx(Q, { size: R[n] })
379
+ }
380
+ ) : /* @__PURE__ */ f.jsxs("div", { className: F("flex items-center gap-1", d), children: [
381
+ /* @__PURE__ */ f.jsx("audio", { ref: o, src: t, preload: "metadata" }),
382
+ /* @__PURE__ */ f.jsx(
383
+ "button",
384
+ {
385
+ type: "button",
386
+ className: F(S, T[n]),
387
+ onClick: $,
388
+ disabled: A,
389
+ children: A ? /* @__PURE__ */ f.jsx(oe, { size: R[n], className: "animate-spin" }) : m ? /* @__PURE__ */ f.jsx(se, { size: R[n] }) : /* @__PURE__ */ f.jsx(le, { size: R[n] })
390
+ }
391
+ ),
392
+ n !== "sm" && /* @__PURE__ */ f.jsx(
393
+ "button",
394
+ {
395
+ type: "button",
396
+ className: F(S, T[n]),
397
+ onClick: D,
398
+ children: C ? /* @__PURE__ */ f.jsx(Q, { size: R[n] }) : /* @__PURE__ */ f.jsx(ie, { size: R[n] })
399
+ }
400
+ )
401
+ ] });
402
+ }, Ee = "SHA-256";
403
+ async function he(t) {
404
+ const d = globalThis.crypto?.subtle;
405
+ if (!d)
406
+ throw new Error("Web Crypto is not available to compute voiceover hashes");
407
+ const E = new TextEncoder().encode(t), l = await d.digest(Ee, E), i = new Uint8Array(l);
408
+ let o = "";
409
+ for (let m = 0; m < i.length; m += 1)
410
+ o += i[m].toString(16).padStart(2, "0");
411
+ return o;
412
+ }
413
+ const xe = "world";
315
414
  export {
316
- fe as EVENT_SOURCE_FOOTER,
317
- ie as EVENT_SOURCE_PLAYER,
318
- se as LayoutContainer,
319
- de as addStandardLayoutOptions,
320
- le as getWidgets,
321
- me as hi,
322
- ce as registerWidget
415
+ ge as AudioPlayer,
416
+ Te as EVENT_SOURCE_FOOTER,
417
+ _e as EVENT_SOURCE_PLAYER,
418
+ me as LayoutContainer,
419
+ ye as addStandardLayoutOptions,
420
+ he as getVoiceoverHash,
421
+ Re as getWidgets,
422
+ xe as hi,
423
+ pe as registerWidget
323
424
  };
@@ -0,0 +1,5 @@
1
+ /**
2
+ * Compute a stable hash for voiceover content so the same script
3
+ * reuses cached audio. Relies solely on browser-compatible Web Crypto APIs.
4
+ */
5
+ export declare function getVoiceoverHash(content: string): Promise<string>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@teacharium/widget",
3
- "version": "0.2.1",
3
+ "version": "0.2.2",
4
4
  "type": "module",
5
5
  "files": [
6
6
  "dist"
@@ -9,6 +9,8 @@
9
9
  "types": "dist/main.d.ts",
10
10
  "dependencies": {
11
11
  "@measured/puck": "^0.20.2",
12
+ "@next/eslint-plugin-next": "^15.5.4",
13
+ "lucide-react": "^0.511.0",
12
14
  "react": "^19.1.1",
13
15
  "react-dom": "^19.1.1"
14
16
  },