Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Apply latest token ds-auro-icon-size and update size to fix clipping issue on x icon #345 #346

Closed
wants to merge 28 commits into from
Closed
Show file tree
Hide file tree
Changes from 21 commits
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
d1333ae
feat: apply latest token ds-auro-icon-size and update size to fix cli…
rmenner Oct 29, 2024
8c38385
feat: apply latest token ds-auro-icon-size #345
rmenner Oct 30, 2024
4ae799d
fix: remove customsize attribute #345
rmenner Oct 30, 2024
0471761
perf: update dependencies
jordanjones243 Oct 30, 2024
2860765
fix: add height to auro icon to fix positioning #345
rmenner Oct 31, 2024
966986e
perf: update dependencies
jason-capsule42 Oct 31, 2024
cd9247e
chore(release): 4.1.0 [skip ci]
semantic-release-bot Oct 31, 2024
682bbdb
perf: revert auro-library version
jason-capsule42 Oct 31, 2024
02a92a8
chore(release): 4.1.1 [skip ci]
semantic-release-bot Oct 31, 2024
b2cb7b8
feat: apply latest token ds-auro-icon-size and update size to fix cli…
rmenner Oct 29, 2024
af04605
perf: update dependencies
jordanjones243 Oct 30, 2024
d667ac2
fix: adjust icon placement #345
rmenner Nov 7, 2024
a7f2b6d
perf: update dependencies
jason-capsule42 Oct 31, 2024
2762555
fix: remove components dir from sweep command
chrisfalaska Nov 4, 2024
bcb870a
chore: fix typo
chrisfalaska Nov 5, 2024
46ba7ee
fix: remove deprecated demo/css folder from sweep command
chrisfalaska Nov 5, 2024
9cbc66a
chore(release): 4.1.2 [skip ci]
semantic-release-bot Nov 6, 2024
c46a98e
feat: apply latest token ds-auro-icon-size and update size to fix cli…
rmenner Oct 29, 2024
d72a54e
perf: update dependencies
jordanjones243 Oct 30, 2024
ead69fc
perf: update dependencies
jason-capsule42 Oct 31, 2024
e56f1e9
perf: merge latest from main
rmenner Nov 7, 2024
91682fe
perf: update rollup config
jordanjones243 Nov 7, 2024
2798c2d
feat: apply latest token ds-auro-icon-size and update size to fix cli…
rmenner Oct 29, 2024
bb02729
perf: revert auro-library version
jason-capsule42 Oct 31, 2024
28d6e7c
chore(release): 4.1.1 [skip ci]
semantic-release-bot Oct 31, 2024
07fad31
feat: apply latest token ds-auro-icon-size and update size to fix cli…
rmenner Oct 29, 2024
1b37777
perf: update dependencies
jordanjones243 Oct 30, 2024
b585595
feat: apply latest token ds-auro-icon-size and update size to fix cli…
rmenner Oct 29, 2024
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 2 additions & 5 deletions demo/api.min.js
Original file line number Diff line number Diff line change
Expand Up @@ -178,7 +178,7 @@ function stopNotifyingOnLangChange(element) {
watchedItems.delete(element);
}

var styleCss = css`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.typeIcon{display:flex;flex-direction:row;align-items:center}.typeIcon [auro-icon]{height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-100, 0.5rem)}.notificationIcons{display:flex;flex-direction:row;padding-right:var(--ds-size-100, 0.5rem)}:host([bordered]) .typeIcon{padding-left:var(--ds-size-100, 0.5rem)}:host([bordered]) .notificationIcons{align-items:center}.notification:not(:first-of-type){margin-left:var(--ds-size-100, 0.5rem)}.alertNotification{height:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));width:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem))}.clearBtn{height:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));width:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem))}.passwordBtn{height:calc(var(--ds-size-300, 1.5rem));width:calc(var(--ds-size-300, 1.5rem))}.notificationBtn{display:block;padding:0;border:0;background:unset;cursor:pointer;height:var(--ds-size-200, 1rem);width:var(--ds-size-200, 1rem)}.notificationBtn [auro-icon]{display:block;height:var(--ds-size-200, 1rem);width:var(--ds-size-200, 1rem)}.notificationBtn [auro-icon][hidden]{display:none}:host(:not([bordered])) .typeIcon,:host(:not([bordered])) .notificationIcons{align-items:flex-end;padding-bottom:var(--ds-size-50, 0.25rem)}:host(:focus-within[type=password]) .notificationIcons[hasValue] .alertNotification{visibility:hidden;height:0;width:0;overflow:hidden;margin:0;padding:0}.inputElement-helpText{margin:var(--ds-size-50, 0.25rem) 0;font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-size-200, 1rem)}input{border:unset}.wrapper{border-style:solid;overflow:hidden;position:relative}:host(:not([bordered],[borderless])) .wrapper{border-width:1px 0}:host([bordered]) .wrapper{border-width:1px;border-radius:var(--ds-border-radius, 0.375rem)}:host(:not([borderless])) .wrapper:focus-within:before{display:block;content:"";position:absolute;inset:0;pointer-events:none;border-bottom-style:solid;border-bottom-width:1px}:host([validity]:not([validity=valid])) .wrapper:before{border-bottom:0}label{position:absolute;transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none}:host(:not([bordered])) label{top:calc(100% - var(--ds-size-25, 0.125rem));transform:translateY(-100%)}:host(:not([bordered])) label.withIcon{left:var(--ds-size-400, 2rem)}:host([bordered]) label{top:50%;transform:translateY(-50%)}:host([bordered]) label.withIcon{left:var(--ds-size-500, 2.5rem)}:host([bordered]) label:not(label.withIcon){left:var(--ds-size-100, 0.5rem)}:host .wrapper:focus-within label{top:var(--ds-size-25, 0.125rem);transform:unset;font-size:var(--ds-text-body-size-xs, 0.75rem)}:host label.withValue{top:var(--ds-size-25, 0.125rem);transform:unset;font-size:var(--ds-text-body-size-xs, 0.75rem)}:host([activeLabel]) .wrapper label{top:var(--ds-size-25, 0.125rem);transform:unset;font-size:var(--ds-text-body-size-xs, 0.75rem)}:host{--size-lgsm: 1.875rem;--size-xlsm: 2.75rem;--size-mdxxs: 1.2rem;position:relative;display:block}.wrapper{display:flex;flex-direction:row}.main{display:flex;flex-direction:row;position:relative;flex:1}input{flex:1;position:relative;min-height:calc(var(--ds-size-700, 3.5rem) + var(--ds-size-25, 0.125rem));max-height:calc(var(--ds-size-700, 3.5rem) + var(--ds-size-25, 0.125rem));padding:var(--ds-size-400, 2rem) 0 var(--ds-size-50, 0.25rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0;font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-size-200, 1rem);transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);outline:none}input::-ms-reveal,input::-ms-clear{display:none}input:disabled{pointer-events:none;background:none}`;
var styleCss = css`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.typeIcon{display:flex;flex-direction:row;align-items:center}.typeIcon [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-100, 0.5rem)}.notificationIcons{display:flex;flex-direction:row;padding-right:var(--ds-size-100, 0.5rem)}:host([bordered]) .typeIcon{padding-left:var(--ds-size-100, 0.5rem)}:host([bordered]) .notificationIcons{align-items:center}.notification:not(:first-of-type){margin-left:var(--ds-size-100, 0.5rem)}.alertNotification{height:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem))}.clearBtn{height:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));width:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem))}.passwordBtn{height:calc(var(--ds-size-300, 1.5rem));width:calc(var(--ds-size-300, 1.5rem))}.notificationBtn{display:block;padding:0;border:0;background:unset;cursor:pointer;height:var(--ds-size-200, 1rem);width:var(--ds-size-200, 1rem)}.notificationBtn [auro-icon]{--ds-auro-icon-size: var(--ds-size-200, 1rem);height:var(--ds-size-200, 1rem);display:block}.notificationBtn [auro-icon][hidden]{display:none}:host(:not([bordered])) .typeIcon,:host(:not([bordered])) .notificationIcons{align-items:flex-end;padding-bottom:var(--ds-size-50, 0.25rem)}:host(:focus-within[type=password]) .notificationIcons[hasValue] .alertNotification{visibility:hidden;height:0;width:0;overflow:hidden;margin:0;padding:0}.inputElement-helpText{margin:var(--ds-size-50, 0.25rem) 0;font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-size-200, 1rem)}input{border:unset}.wrapper{border-style:solid;overflow:hidden;position:relative}:host(:not([bordered],[borderless])) .wrapper{border-width:1px 0}:host([bordered]) .wrapper{border-width:1px;border-radius:var(--ds-border-radius, 0.375rem)}:host(:not([borderless])) .wrapper:focus-within:before{display:block;content:"";position:absolute;inset:0;pointer-events:none;border-bottom-style:solid;border-bottom-width:1px}:host([validity]:not([validity=valid])) .wrapper:before{border-bottom:0}label{position:absolute;transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;pointer-events:none}:host(:not([bordered])) label{top:calc(100% - var(--ds-size-25, 0.125rem));transform:translateY(-100%)}:host(:not([bordered])) label.withIcon{left:var(--ds-size-400, 2rem)}:host([bordered]) label{top:50%;transform:translateY(-50%)}:host([bordered]) label.withIcon{left:var(--ds-size-500, 2.5rem)}:host([bordered]) label:not(label.withIcon){left:var(--ds-size-100, 0.5rem)}:host .wrapper:focus-within label{top:var(--ds-size-25, 0.125rem);transform:unset;font-size:var(--ds-text-body-size-xs, 0.75rem)}:host label.withValue{top:var(--ds-size-25, 0.125rem);transform:unset;font-size:var(--ds-text-body-size-xs, 0.75rem)}:host([activeLabel]) .wrapper label{top:var(--ds-size-25, 0.125rem);transform:unset;font-size:var(--ds-text-body-size-xs, 0.75rem)}:host{--size-lgsm: 1.875rem;--size-xlsm: 2.75rem;--size-mdxxs: 1.2rem;position:relative;display:block}.wrapper{display:flex;flex-direction:row}.main{display:flex;flex-direction:row;position:relative;flex:1}input{flex:1;position:relative;min-height:calc(var(--ds-size-700, 3.5rem) + var(--ds-size-25, 0.125rem));max-height:calc(var(--ds-size-700, 3.5rem) + var(--ds-size-25, 0.125rem));padding:var(--ds-size-400, 2rem) 0 var(--ds-size-50, 0.25rem);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0;font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-size-200, 1rem);transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);outline:none}input::-ms-reveal,input::-ms-clear{display:none}input:disabled{pointer-events:none;background:none}`;
rmenner marked this conversation as resolved.
Show resolved Hide resolved

var colorCss = css`.wrapper{border-color:transparent}.inputElement-helpText{color:var(--ds-auro-input-help-text-color)}input{background-color:transparent;caret-color:var(--ds-auro-input-caret-color);color:var(--ds-auro-input-text-color)}input::placeholder{color:transparent}input:focus::placeholder{color:var(--ds-auro-input-placeholder-text-color)}input:disabled{--ds-auro-input-input-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}label{color:var(--ds-auro-input-label-text-color)}:host(:not([bordered],[borderless])) .wrapper{border-bottom-color:var(--ds-auro-input-border-color)}:host([bordered]) .wrapper{border-color:var(--ds-auro-input-border-color);background-color:var(--ds-auro-input-container-color)}:host([bordered]) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-color-border-ui-focus-default, #2c67b5);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host(:not([borderless])) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-color-border-ui-focus-default, #2c67b5)}:host(:not([borderless])) .wrapper:focus-within:before{border-bottom-color:transparent}:host([validity]:not([validity=valid])){--ds-auro-input-border-color: var(--ds-color-border-error-default, #cc1816);--ds-auro-input-help-text-color: var(--ds-color-text-error-default, #cc1816)}:host([validity]:not([validity=valid])[bordered]) .wrapper{--ds-auro-input-border-color: var(--ds-color-border-error-default, #cc1816);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host([disabled]){--ds-auro-input-border-color: var(--ds-color-border-ui-disabled-default, #adadad);--ds-auro-input-label-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}`;

Expand Down Expand Up @@ -1215,7 +1215,6 @@ class AuroInput extends BaseInput {
<${this.iconTag}
category="alert"
name="error-stroke"
customSize
error>
</${this.iconTag}>
</div>
Expand All @@ -1232,14 +1231,12 @@ class AuroInput extends BaseInput {
<${this.iconTag}
category="interface"
name="hide-password-stroke"
customSize
customColor
?hidden=${!this.showPassword}>
</${this.iconTag}>
<${this.iconTag}
category="interface"
name="view-password-stroke"
customSize
customColor
?hidden=${this.showPassword}>
</${this.iconTag}>
Expand All @@ -1258,7 +1255,7 @@ class AuroInput extends BaseInput {
customColor
category="interface"
name="x-lg"
customSize>
>
</${this.iconTag}>
</${this.buttonTag}>
</div>
Expand Down
Loading
Loading