From 2e3468da62ab089fe7aee464a3fcbcc1527bd160 Mon Sep 17 00:00:00 2001
From: Nikita Polyakov <53777036+Nikita-Polyakov@users.noreply.github.com>
Date: Wed, 24 Feb 2021 11:47:17 +0300
Subject: [PATCH 01/15] Release/0.7.3
* add styles for select prefix slot
* increase version in package.json
---
package.json | 2 +-
src/components/Select/SSelect.vue | 1 +
src/styles/select.scss | 52 ++++++++++++++++++++++++-------
3 files changed, 42 insertions(+), 13 deletions(-)
diff --git a/package.json b/package.json
index 85235b9e..f21a6683 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@soramitsu/soramitsu-js-ui",
- "version": "0.7.2",
+ "version": "0.7.3",
"private": false,
"publishConfig": {
"registry": "https://nexus.iroha.tech/repository/npm-soramitsu-private/"
diff --git a/src/components/Select/SSelect.vue b/src/components/Select/SSelect.vue
index 04fdcccc..885e4c63 100644
--- a/src/components/Select/SSelect.vue
+++ b/src/components/Select/SSelect.vue
@@ -18,6 +18,7 @@
@visible-change="handleVisibleChange"
@clear="handleClear"
>
+
diff --git a/src/styles/select.scss b/src/styles/select.scss
index cbf72ac3..f66d5f4d 100644
--- a/src/styles/select.scss
+++ b/src/styles/select.scss
@@ -45,6 +45,16 @@
.el-select__caret {
color: var(--s-color-base-content-tertiary);
}
+ &--prefix {
+ .el-input__prefix {
+ bottom: 0;
+ left: 12px;
+ width: $s-size-mini;
+ height: $s-size-mini;
+ margin: auto;
+ overflow: hidden;
+ }
+ }
}
}
&.s-input-type {
@@ -71,8 +81,19 @@
}
}
.s-placeholder + .el-select {
- .el-input__inner {
- padding-top: 12px;
+ .el-input {
+ &--prefix {
+ .el-input__inner{
+ padding-left: 44px;
+ }
+
+ .el-input__prefix {
+ top: 12px;
+ }
+ }
+ .el-input__inner{
+ padding-top: 12px;
+ }
}
.el-input__validateIcon {
padding-top: 11px;
@@ -127,18 +148,25 @@
}
&.s-select-type {
.el-select {
- .el-input__inner {
- padding-left: 12px;
- font-weight: bold;
- &:hover {
- border-color: var(--s-color-base-border-primary);
+ .el-input {
+ &.el-input--prefix {
+ .el-input__inner {
+ padding-left: 44px;
+ }
}
- &::placeholder {
- color: var(--s-color-base-content-tertiary);
+ .el-input__inner {
+ padding-left: 12px;
font-weight: bold;
- }
- &:focus {
- border-color: var(--s-color-base-border-primary);
+ &:hover {
+ border-color: var(--s-color-base-border-primary);
+ }
+ &::placeholder {
+ color: var(--s-color-base-content-tertiary);
+ font-weight: bold;
+ }
+ &:focus {
+ border-color: var(--s-color-base-border-primary);
+ }
}
}
.el-select__caret {
From 504f1408cdcabade626d594aab0cc2303236fc4e Mon Sep 17 00:00:00 2001
From: Nikita Polyakov <53777036+Nikita-Polyakov@users.noreply.github.com>
Date: Thu, 25 Feb 2021 09:20:22 +0300
Subject: [PATCH 02/15] Release/0.7.4 (#130)
* Fix/remove input inner model (#129)
* removed model from SInput
* up package version
* fix paste input handler
* add change emitter on file change
---
package.json | 2 +-
src/components/Input/SInput.vue | 27 ++++++++++-----------------
2 files changed, 11 insertions(+), 18 deletions(-)
diff --git a/package.json b/package.json
index f21a6683..ff0bbeee 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@soramitsu/soramitsu-js-ui",
- "version": "0.7.3",
+ "version": "0.7.4",
"private": false,
"publishConfig": {
"registry": "https://nexus.iroha.tech/repository/npm-soramitsu-private/"
diff --git a/src/components/Input/SInput.vue b/src/components/Input/SInput.vue
index 2ecac0be..d6f53b46 100644
--- a/src/components/Input/SInput.vue
+++ b/src/components/Input/SInput.vue
@@ -3,12 +3,12 @@
class="s-input"
:class="computedClasses"
>
- {{ placeholder }}
+ {{ placeholder }}
@@ -138,7 +138,6 @@ export default class SInput extends Mixins(BorderRadiusMixin) {
focused = false
autofill = false
- model = this.value
mounted (): void {
this.$el.addEventListener('animationstart', this.changeAutofillValue)
@@ -152,17 +151,6 @@ export default class SInput extends Mixins(BorderRadiusMixin) {
this.autofill = e.animationName === 'onAutoFillStart'
}
- @Watch('value')
- private handlePropChange (value: string | number): void {
- this.model = value
- }
-
- @Watch('model')
- private handleValueChange (value: string | number): void {
- this.$emit('input', value)
- this.$emit('change', value)
- }
-
get isTextInput (): boolean {
return this.type === InputType.TEXT
}
@@ -223,7 +211,10 @@ export default class SInput extends Mixins(BorderRadiusMixin) {
this.$emit('change', value)
}
- handlePaste (value: string | number): void {
+ handlePaste (event: ClipboardEvent): void {
+ if (!event || !event.clipboardData) return
+
+ const value = event.clipboardData.getData('text')
this.$emit('paste', value)
}
@@ -254,7 +245,9 @@ export default class SInput extends Mixins(BorderRadiusMixin) {
const file = input.files[0]
const fr = new FileReader()
fr.onload = (event: ProgressEvent) => {
- this.model = ((event.target || {}).result as string)
+ const result = (event.target || {}).result as string
+ this.handleInput(result)
+ this.handleChange(result)
}
fr.readAsText(file)
}
From 7d75cef13a14b4d4ef96c2ee87a8d6ddce22c141 Mon Sep 17 00:00:00 2001
From: Nikita Polyakov <53777036+Nikita-Polyakov@users.noreply.github.com>
Date: Thu, 25 Feb 2021 12:56:28 +0300
Subject: [PATCH 03/15] Release/0.7.5 (#132)
* Add input inner offset for s-input-type (#128)
* add input inner offset for s-input-type
* add option padding
* up library version to 0.7.5
* fixes after review
* use variables in offsets
* remove test code from story
---
package.json | 2 +-
src/components/Select/SOption.vue | 2 +-
src/styles/index.scss | 1 +
src/styles/option.scss | 4 ++++
src/styles/select.scss | 22 ++++++++++++++++------
src/styles/variables.scss | 5 +++++
6 files changed, 28 insertions(+), 8 deletions(-)
create mode 100644 src/styles/option.scss
diff --git a/package.json b/package.json
index ff0bbeee..e89f36d3 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@soramitsu/soramitsu-js-ui",
- "version": "0.7.4",
+ "version": "0.7.5",
"private": false,
"publishConfig": {
"registry": "https://nexus.iroha.tech/repository/npm-soramitsu-private/"
diff --git a/src/components/Select/SOption.vue b/src/components/Select/SOption.vue
index 602733fe..372a6719 100644
--- a/src/components/Select/SOption.vue
+++ b/src/components/Select/SOption.vue
@@ -1,5 +1,5 @@
-
+
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 4eef760e..93009ec5 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -16,6 +16,7 @@
@import "./json-input";
@import "./layout";
@import "./menu";
+@import "./option";
@import "./pagination";
@import "./radio";
@import "./scroll-sections";
diff --git a/src/styles/option.scss b/src/styles/option.scss
new file mode 100644
index 00000000..9b1ba403
--- /dev/null
+++ b/src/styles/option.scss
@@ -0,0 +1,4 @@
+.s-option {
+ padding-left: $s-padding-input;
+ padding-right: $s-padding-input;
+}
\ No newline at end of file
diff --git a/src/styles/select.scss b/src/styles/select.scss
index f66d5f4d..bc9cdce0 100644
--- a/src/styles/select.scss
+++ b/src/styles/select.scss
@@ -15,6 +15,10 @@
}
}
+$select-prefix-margin-right: 8px;
+$select-prefix-width: $s-size-mini;
+$select-prefix-height: $s-size-mini;
+
.s-select {
font-family: $s-font-family-default;
width: 100%;
@@ -48,9 +52,9 @@
&--prefix {
.el-input__prefix {
bottom: 0;
- left: 12px;
- width: $s-size-mini;
- height: $s-size-mini;
+ left: $s-padding-input;
+ width: $select-prefix-width;
+ height: $select-prefix-height;
margin: auto;
overflow: hidden;
}
@@ -59,6 +63,13 @@
}
&.s-input-type {
.el-select {
+ .el-input {
+ &--prefix {
+ .el-input__inner {
+ padding-left: $s-padding-input + $select-prefix-width + $select-prefix-margin-right;
+ }
+ }
+ }
.el-input__inner {
height: $s-size-big;
padding: 0 15px;
@@ -84,7 +95,7 @@
.el-input {
&--prefix {
.el-input__inner{
- padding-left: 44px;
+ padding-left: $s-padding-input + $select-prefix-width + $select-prefix-margin-right;
}
.el-input__prefix {
@@ -151,11 +162,10 @@
.el-input {
&.el-input--prefix {
.el-input__inner {
- padding-left: 44px;
+ padding-left: $s-padding-input + $select-prefix-width + $select-prefix-margin-right;
}
}
.el-input__inner {
- padding-left: 12px;
font-weight: bold;
&:hover {
border-color: var(--s-color-base-border-primary);
diff --git a/src/styles/variables.scss b/src/styles/variables.scss
index 6e867af2..30254a87 100644
--- a/src/styles/variables.scss
+++ b/src/styles/variables.scss
@@ -48,6 +48,9 @@ $s-size-medium: 40px !default;
$s-size-small: 32px !default;
$s-size-mini: 24px !default;
+// Padding
+$s-padding-input: 16px;
+
$s-border-radius-base: 4px;
$s-border-radius-mini: $s-border-radius-base !default;
$s-border-radius-small: $s-border-radius-base * 2 !default;
@@ -153,6 +156,8 @@ $--breakpoints-spec: (
--s-size-small: #{$s-size-small};
--s-size-medium: #{$s-size-medium};
--s-size-big: #{$s-size-big};
+ // Padding
+ --s-padding-input: #{$s-padding-input};
// Border Radius
--s-border-radius-mini: #{$s-border-radius-mini};
--s-border-radius-small: #{$s-border-radius-small};
From 9fe6719be71f60612289b0e278fbe1b4eb68623d Mon Sep 17 00:00:00 2001
From: Nikita Polyakov <53777036+Nikita-Polyakov@users.noreply.github.com>
Date: Fri, 26 Feb 2021 11:30:49 +0300
Subject: [PATCH 04/15] Release/0.7.6 (#138)
* Fix expaneded table row style
* Fix line-height
* PSS-364: add SFloatInput component (#133)
* add SFloatInput component
* improve isNumberLikeValue check
* move FloatInput story to Input space
Co-authored-by: RDMStreet
---
package.json | 2 +-
src/components/Input/SFloatInput.vue | 111 +++++++++++++++++++++++++++
src/components/Input/SInput.vue | 2 +-
src/components/Input/index.ts | 4 +-
src/components/index.ts | 3 +-
src/index.ts | 3 +
src/stories/SFloatInput.stories.ts | 27 +++++++
src/styles/table.scss | 5 ++
src/types/components.ts | 1 +
9 files changed, 154 insertions(+), 4 deletions(-)
create mode 100644 src/components/Input/SFloatInput.vue
create mode 100644 src/stories/SFloatInput.stories.ts
diff --git a/package.json b/package.json
index e89f36d3..e35b80cd 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@soramitsu/soramitsu-js-ui",
- "version": "0.7.5",
+ "version": "0.7.6",
"private": false,
"publishConfig": {
"registry": "https://nexus.iroha.tech/repository/npm-soramitsu-private/"
diff --git a/src/components/Input/SFloatInput.vue b/src/components/Input/SFloatInput.vue
new file mode 100644
index 00000000..88b8cc1e
--- /dev/null
+++ b/src/components/Input/SFloatInput.vue
@@ -0,0 +1,111 @@
+
+
+
+
+
diff --git a/src/components/Input/SInput.vue b/src/components/Input/SInput.vue
index d6f53b46..91d89784 100644
--- a/src/components/Input/SInput.vue
+++ b/src/components/Input/SInput.vue
@@ -39,7 +39,7 @@
diff --git a/src/stories/SFloatInput.stories.ts b/src/stories/SFloatInput.stories.ts
index f091cfdb..72454425 100644
--- a/src/stories/SFloatInput.stories.ts
+++ b/src/stories/SFloatInput.stories.ts
@@ -1,4 +1,4 @@
-import { number, withKnobs } from '@storybook/addon-knobs'
+import { number, text, withKnobs } from '@storybook/addon-knobs'
import { SFloatInput, SRow } from '../components'
@@ -14,6 +14,7 @@ export const configurable = () => ({
`,
data: () => ({
@@ -22,6 +23,9 @@ export const configurable = () => ({
props: {
decimals: {
default: number('Decimals', 18)
+ },
+ max: {
+ default: text('Max', '10000')
}
}
})
From 8139e9f2ba0d73a4d4cd793bf57fe873ce629d2f Mon Sep 17 00:00:00 2001
From: RDMStreet
Date: Mon, 24 May 2021 13:13:52 +0300
Subject: [PATCH 15/15] Change version from 0.8.10 to 0.8.9
---
package.json | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/package.json b/package.json
index bb68747a..6e8bcc79 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@soramitsu/soramitsu-js-ui",
- "version": "0.8.10",
+ "version": "0.8.9",
"private": false,
"publishConfig": {
"registry": "https://nexus.iroha.tech/repository/npm-soramitsu/"