@flexiui/svelte-rich-text 0.0.37 → 0.0.38

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.
@@ -88,6 +88,20 @@ export const Audio = Node.create({
88
88
  'data-seek-bar-bg-color': attrs.seekBarBgColor,
89
89
  }),
90
90
  },
91
+ playBtnBgColor: {
92
+ default: '#8d8d8d26',
93
+ parseHTML: el => el.getAttribute('data-play-btn-bg-color'),
94
+ renderHTML: attrs => ({
95
+ 'data-play-btn-bg-color': attrs.playBtnBgColor,
96
+ }),
97
+ },
98
+ playBtnTextColor: {
99
+ default: 'currentColor',
100
+ parseHTML: el => el.getAttribute('data-play-btn-text-color'),
101
+ renderHTML: attrs => ({
102
+ 'data-play-btn-text-color': attrs.playBtnTextColor,
103
+ }),
104
+ },
91
105
  colorPlay: {
92
106
  default: '#5d5d5dc9',
93
107
  parseHTML: el => el.getAttribute('data-color-play'),
@@ -18,6 +18,8 @@
18
18
  export let borderRadius: string;
19
19
  export let accentColor: string;
20
20
  export let accentColorPaused: string;
21
+ export let playBtnBgColor: string;
22
+ export let playBtnTextColor: string;
21
23
  export let colorPlay: string;
22
24
  export let maxWidth: string;
23
25
 
@@ -292,7 +294,8 @@ class="audio-player"
292
294
  class:playing
293
295
  style={`
294
296
  --player-bg-color: ${bgColor};
295
- --player-play-btn-bg: ${colorPlay};
297
+ --player-play-btn-bg: ${playBtnBgColor};
298
+ --player-play-btn-color: ${playBtnTextColor};
296
299
  --player-primary-color: ${accentColor};
297
300
  --player-progress-default-bg: ${accentColorPaused};
298
301
  --player-text-color: ${textColor};
@@ -12,6 +12,8 @@ declare const __propDef: {
12
12
  borderRadius: string;
13
13
  accentColor: string;
14
14
  accentColorPaused: string;
15
+ playBtnBgColor: string;
16
+ playBtnTextColor: string;
15
17
  colorPlay: string;
16
18
  maxWidth: string;
17
19
  };
@@ -81,6 +81,8 @@
81
81
  borderRadius={attrs.borderRadius}
82
82
  accentColor={attrs.accentColor}
83
83
  accentColorPaused={attrs.accentColorPaused}
84
+ playBtnBgColor={attrs.playBtnBgColor}
85
+ playBtnTextColor={attrs.playBtnTextColor}
84
86
  colorPlay={attrs.colorPlay}
85
87
  maxWidth={attrs.maxWidth}
86
88
  ></AudioPlayer>
@@ -29,7 +29,7 @@ const nodeMapping = {
29
29
  return `<div class="fl-grid-item">${serializeChildrenToHTMLString(children)}</div>`;
30
30
  },
31
31
  audio({ node, children }) {
32
- const { id, src, controls, bgColor, textColor, borderRadius, accentColor, accentColorPaused, maxWidth, colorPlay } = node.attrs;
32
+ const { id, src, controls, bgColor, textColor, borderRadius, accentColor, accentColorPaused, playBtnBgColor, playBtnTextColor, maxWidth, colorPlay } = node.attrs;
33
33
  return `
34
34
  <fl-audio-player
35
35
  class="fl-audio-player"
@@ -41,6 +41,8 @@ const nodeMapping = {
41
41
  borderRadius="${borderRadius}"
42
42
  accentColor="${accentColor}"
43
43
  accentColorPaused="${accentColorPaused}"
44
+ playBtnBgColor="${playBtnBgColor}"
45
+ playBtnTextColor="${playBtnTextColor}"
44
46
  maxWidth="${maxWidth}"
45
47
  colorPlay="${colorPlay}"
46
48
  >
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flexiui/svelte-rich-text",
3
- "version": "0.0.37",
3
+ "version": "0.0.38",
4
4
  "description": "A lightweight and flexible rich text editor component for Svelte",
5
5
  "keywords": [
6
6
  "svelte",