@voicenter-team/voicenter-ui-plus 0.0.9996 → 0.0.9998
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.
- package/README.md +50 -1
- package/library/super.mjs +3259 -3229
- package/library/super.mjs.map +1 -1
- package/library/super.umd.js +28 -28
- package/library/super.umd.js.map +1 -1
- package/library/types/theme/index.d.ts +2 -1
- package/library/types/theme/theme.types.d.ts +14 -0
- package/library/types/types/Entry.types.d.ts +2 -1
- package/package.json +2 -2
- package/src/theme/index.ts +59 -8
- package/src/theme/theme.types.ts +15 -0
package/README.md
CHANGED
|
@@ -10,7 +10,7 @@ import VoicenterUI from '@voicenter-team/voicenter-ui-plus'
|
|
|
10
10
|
|
|
11
11
|
app.use(VoicenterUI, {
|
|
12
12
|
components: [], // Here you can pass list of components which you wan't to be globally registered. If empty - will register globally all
|
|
13
|
-
|
|
13
|
+
themeConfig, // Pass the configuration of the theme
|
|
14
14
|
lang: 'en' // Pass the language for app localization
|
|
15
15
|
})
|
|
16
16
|
```
|
|
@@ -30,6 +30,55 @@ module.exports = {
|
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
```
|
|
33
|
+
|
|
34
|
+
### Theming specification
|
|
35
|
+
The `themeConfig` which is passed as options to the VoicenterUI `vue.use` data could have the following specifications:
|
|
36
|
+
|
|
37
|
+
### Local
|
|
38
|
+
**Config:**
|
|
39
|
+
```js
|
|
40
|
+
{
|
|
41
|
+
type: 'local'
|
|
42
|
+
themeName: 'red' | 'blue' | '...'
|
|
43
|
+
onSetupCallback: () => {
|
|
44
|
+
console.log('Loaded!')
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
```
|
|
48
|
+
**Description:**
|
|
49
|
+
|
|
50
|
+
Such configuration will append to the document element the CSS variables from one of the configuration passed in `themeName` parameter which it will get from theme specification delivered alongside with library
|
|
51
|
+
|
|
52
|
+
**Params:**
|
|
53
|
+
- **themeName**
|
|
54
|
+
- The name of the theme to be injected
|
|
55
|
+
- **onSetupCallback**
|
|
56
|
+
- The function which will be called right after the variables will be injected into the document element
|
|
57
|
+
|
|
58
|
+
### Remote
|
|
59
|
+
**Config:**
|
|
60
|
+
```js
|
|
61
|
+
{
|
|
62
|
+
type: 'remote'
|
|
63
|
+
brandingSectionName: 'someName'
|
|
64
|
+
apiUrl: 'someUrl'
|
|
65
|
+
onSetupCallback: () => {
|
|
66
|
+
console.log('Loaded!')
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
```
|
|
70
|
+
**Description:**
|
|
71
|
+
|
|
72
|
+
Such configuration will initiate the call to the specified apiUrl in order to retrieve the JSON object with key-value properties of the CSS variables to inject to document element
|
|
73
|
+
|
|
74
|
+
**Params:**
|
|
75
|
+
- **brandingSectionName**
|
|
76
|
+
- The name of the section (tagSection) in the database configuration which will be passed to the API in payload and on response retrieved replaced from resulted values
|
|
77
|
+
- **apiUrl**
|
|
78
|
+
- The API url to which the POST request will be initiated
|
|
79
|
+
- **onSetupCallback**
|
|
80
|
+
- The function which will be called right after the variables will be injected into the document element
|
|
81
|
+
|
|
33
82
|
## Documentation
|
|
34
83
|
|
|
35
84
|
Visit [documentation](https://voicenter-ui.netlify.app/) for detailed info
|