Release 1.0.8

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soramitsu/soramitsu-js-ui",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "private": false,
   "publishConfig": {
     "registry": "https://nexus.iroha.tech/repository/npm-soramitsu/"

src/store/LibraryTheme.ts

@@ -11,6 +11,7 @@ const types = flow(
   flatMap(x => [x + '_REQUEST', x + '_SUCCESS', x + '_FAILURE']),
   concat([
     'SET_THEME',
+    'SWITCH_THEME',
     'SET_DESIGN_SYSTEM'
   ]),
   map(x => [x, x]),
@@ -46,6 +47,7 @@ const mutations = {
     state.theme = theme
     localStorage.setItem('libraryTheme', theme)
   },
+  [types.SWITCH_THEME] (state: State) {},
   [types.SET_DESIGN_SYSTEM] (state: State, designSystem: DesignSystem) {
     state.designSystem = designSystem
   }
@@ -59,6 +61,11 @@ const actions = {
     }
     document.documentElement.setAttribute('design-system-theme', computedTheme)
   },
+  async switchTheme ({ commit, state: { theme }, dispatch }) {
+    const newTheme = theme === Theme.LIGHT ? Theme.DARK : Theme.LIGHT
+    commit(types.SWITCH_THEME)
+    await dispatch('setTheme', newTheme)
+  },
   setDesignSystem ({ commit }, designSystem: DesignSystem) {
     commit(types.SET_DESIGN_SYSTEM, designSystem)
   }

src/stories/SButton.stories.ts

@@ -14,7 +14,7 @@ export default {
 export const configurable = () => ({
   components: { SButton, SIcon },
   template: `<s-button
-               :class="typography"
+               :class="withTypography ? typography : ''"
                :disabled="disabled"
                :loading="loading"
                :tooltip="tooltip"
@@ -60,6 +60,9 @@ export const configurable = () => ({
     content: {
       default: text('Button text', 'Default')
     },
+    withTypography: {
+      default: boolean('With Typography css class', false)
+    },
     typography: {
       default: text('Typographic css class', 's-typography-button--large')
     },

src/utils/index.ts

@@ -7,6 +7,10 @@ export const setTheme = async (theme?: Theme) => {
   await store.dispatch('setTheme', theme)
 }
 
+export const switchTheme = async () => {
+  await store.dispatch('switchTheme')
+}
+
 export const setDesignSystem = async (designSystem: DesignSystem) => {
   await store.dispatch('setDesignSystem', designSystem)
 }