@symbo.ls/preview 2.6.9 → 2.6.11

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/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@symbo.ls/preview",
3
3
  "description": "",
4
4
  "author": "",
5
- "version": "2.6.9",
5
+ "version": "2.6.11",
6
6
  "main": "src/app.js",
7
7
  "scripts": {
8
8
  "link:all": "yarn link smbls domql css-in-props @symbo.ls/icons @symbo.ls/config @symbo.ls/components @symbo.ls/scratch @symbo.ls/playground @symbo.ls/utils @symbo.ls/init @symbo.ls/config-default @domql/router @domql/utils @domql/router",
package/src/app.js CHANGED
@@ -9,7 +9,7 @@ import {
9
9
  DesignSystem,
10
10
  Export,
11
11
  Library,
12
- State,
12
+ // State,
13
13
  Account
14
14
  } from './pages'
15
15
 
@@ -38,7 +38,7 @@ const App = {
38
38
  '/design-system': DesignSystem,
39
39
  '/components': Components,
40
40
  '/component': Export,
41
- '/state': State,
41
+ // '/state': State,
42
42
  ...SUB_ROUTES
43
43
  },
44
44
 
@@ -1,6 +1,14 @@
1
1
  'use strict'
2
2
 
3
- import { IconText, Flex, SquareButton, Select, Input, ClickableItem } from '@symbo.ls/components'
3
+ import {
4
+ IconText,
5
+ Flex,
6
+ SquareButton,
7
+ Select,
8
+ Input,
9
+ ClickableItem
10
+ } from '@symbo.ls/components'
11
+ import { copyStringToClipboard } from '@symbo.ls/utils'
4
12
  import { BREAKPOINTS_DATA, DEVICE_SIZE_DATA } from './state'
5
13
 
6
14
  const stateCom = {
@@ -182,7 +190,13 @@ const MediaQueryRow = {
182
190
  },
183
191
  ...[
184
192
  { props: { icon: 'eyeOpen' } },
185
- { props: { icon: 'arrowAngleMirroringHorizontal' } },
193
+ { props: { icon: 'copy outline' },
194
+ on: {
195
+ click: (event, element, state) => {
196
+ copyStringToClipboard(`@${state.name}`)
197
+ }
198
+ }
199
+ },
186
200
  { props: { icon: 'trashAlt' },
187
201
  on: {
188
202
  click: (event, element, state) => {
@@ -11,7 +11,7 @@ export const BREAKPOINTS_DATA = {
11
11
  }]
12
12
  }, {
13
13
  icon: 'deviceSmallScreenOutline',
14
- name: 'screenLg',
14
+ name: 'screenL',
15
15
  breakpoints: [{
16
16
  type: 'minWidth',
17
17
  value: '1920',
@@ -19,7 +19,7 @@ export const BREAKPOINTS_DATA = {
19
19
  }]
20
20
  }, {
21
21
  icon: 'deviceSmallScreenOutline',
22
- name: 'screebMd',
22
+ name: 'screebM',
23
23
  breakpoints: [{
24
24
  type: 'minWidth',
25
25
  value: '1680',
@@ -27,7 +27,7 @@ export const BREAKPOINTS_DATA = {
27
27
  }]
28
28
  }, {
29
29
  icon: 'deviceSmallScreenOutline',
30
- name: 'screebSm',
30
+ name: 'screenS',
31
31
  breakpoints: [{
32
32
  type: 'minWidth',
33
33
  value: '1440',
@@ -35,40 +35,39 @@ export const BREAKPOINTS_DATA = {
35
35
  }]
36
36
  }, {
37
37
  icon: 'deviceTabletLandscapeOutline',
38
- name: 'tabletLg',
38
+ name: 'tabletL',
39
39
  breakpoints: [{
40
40
  type: 'minWidth',
41
41
  value: '1366',
42
- placeholder: '1440'
42
+ placeholder: '1366'
43
43
  }]
44
44
  }, {
45
45
  icon: 'deviceTabletLandscapeOutline',
46
- name: 'tabletMd',
46
+ name: 'tabletM',
47
47
  breakpoints: [{
48
48
  type: 'minWidth',
49
- value: '280',
50
- placeholder: '1440'
49
+ value: '1280px',
50
+ placeholder: '1280px'
51
51
  }]
52
52
  }, {
53
53
  icon: 'deviceTabletLandscapeOutline',
54
- name: 'tabletSm',
54
+ name: 'tabletS',
55
55
  breakpoints: [{
56
56
  type: 'minWidth',
57
57
  value: '1024',
58
- placeholder: '1440'
58
+ placeholder: '1024'
59
59
  }]
60
60
  }, {
61
61
  icon: 'deviceMobileOutline',
62
- name: 'mobileLg',
62
+ name: 'mobileL',
63
63
  breakpoints: [{
64
64
  type: 'minWidth',
65
65
  value: '768',
66
- value2: '657',
67
66
  placeholder: '768'
68
67
  }]
69
68
  }, {
70
69
  icon: 'deviceMobileOutline',
71
- name: 'mobileMd',
70
+ name: 'mobileM',
72
71
  breakpoints: [{
73
72
  type: 'minWidth',
74
73
  value: '560',
@@ -76,7 +75,7 @@ export const BREAKPOINTS_DATA = {
76
75
  }]
77
76
  }, {
78
77
  icon: 'deviceMobileOutline',
79
- name: 'mobileSm',
78
+ name: 'mobileS',
80
79
  breakpoints: [{
81
80
  type: 'minWidth',
82
81
  value: '480',
@@ -26,8 +26,9 @@ export const State = {
26
26
  on: {
27
27
  input: (ev, el, s) => {
28
28
  const rootState = el.__root.state
29
+ const key = el.parent.key.toUpperCase()
29
30
  const obj = {
30
- PROJECT_STATE: { [el.parent.key]: el.node.value }
31
+ PROJECT_STATE: { [key]: el.node.value }
31
32
  }
32
33
  rootState.update(obj)
33
34
  }
@@ -35,7 +36,7 @@ export const State = {
35
36
  }
36
37
  },
37
38
 
38
- websiteTitle: {
39
+ title: {
39
40
  title: 'Title',
40
41
  element: {
41
42
  extend: Input