WorkRoot/WRNexusJS
2
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: release design system engine, studio and component contracts

Browse Source
This commit is contained in:
Clintchiz committed 2026-10-19 13:09:03 +05:30
1 parent ff1065fb27
commit 3943b946d6
693 files changed
+175546 -3894
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/ui/components/textarea.wrn
+8 -8
View File
@@ -49,15 +49,15 @@ size: string = "default"
}
}
view {
<div {...attrs} class="wrn-component wrn-component--color-{color} wrn-component--size-{size} wrn-next--field wrn-next--textarea {class}" data-variant="{variant}" data-inline="{inline}" data-floating="{variant === 'floating'}" data-invalid="{error || validationError ? 'true' : 'false'}">
<div class="wrn-next__field-heading"><label class="{hiddenLabel ? 'wrn-next__sr-only' : ''}" for="{id || name}">{label}</label>{#if cornerHint}<span class="wrn-next__field-hint">{cornerHint}</span>{/if}</div>
<div class="wrn-next__field-control" data-icon-position="{iconPosition}" data-has-icon="{icon ? 'true' : 'false'}">
{#if icon}<span class="{icon} wrn-next__field-icon" aria-hidden="true"></span>{/if}
<textarea id="{id || name}" name="{name}" value="{value}" placeholder="{variant === 'floating' ? ' ' : placeholder}" rows="{rows}" style="resize: {resize}" readonly="{readonly}" disabled="{disabled}" required="{required}" minlength="{minlength}" maxlength="{maxlength}" aria-invalid="{error || validationError ? 'true' : 'false'}" aria-describedby="{error || validationError ? (id || name) + '-error' : (helperText ? (id || name) + '-help' : '')}" @input="emitField('input', event)" @change="emitField('change', event)" @focus="emitField('focus', event)" @blur="emitField('blur', event)" @invalid="handleInvalid(event)"></textarea>
{#if variant === "floating"}<span class="wrn-next__field-floating-label">{label}</span>{/if}
<div data-wrn-owner="Textarea" data-wrn-part="root" data-wrn-component="Textarea" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}" {...attrs} class="wrn-component wrn-component--color-{color} wrn-component--size-{size} wrn-next--field wrn-next--textarea {class}" data-variant="{variant}" data-inline="{inline}" data-floating="{variant === 'floating'}" data-invalid="{error || validationError ? 'true' : 'false'}">
<div data-wrn-owner="Textarea" data-wrn-part="heading" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}" class="wrn-next__field-heading"><label data-wrn-owner="Textarea" data-wrn-part="label" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}" class="{hiddenLabel ? 'wrn-next__sr-only' : ''}" for="{id || name}">{label}</label>{#if cornerHint}<span data-wrn-owner="Textarea" data-wrn-part="hint" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}" class="wrn-next__field-hint">{cornerHint}</span>{/if}</div>
<div data-wrn-owner="Textarea" data-wrn-part="controlContainer" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}" class="wrn-next__field-control" data-icon-position="{iconPosition}" data-has-icon="{icon ? 'true' : 'false'}">
{#if icon}<span data-wrn-owner="Textarea" data-wrn-part="icon" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}" class="{icon} wrn-next__field-icon" aria-hidden="true"></span>{/if}
<textarea data-wrn-owner="Textarea" data-wrn-part="control" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}" id="{id || name}" name="{name}" value="{value}" placeholder="{variant === 'floating' ? ' ' : placeholder}" rows="{rows}" style="resize: {resize}" readonly="{readonly}" disabled="{disabled}" required="{required}" minlength="{minlength}" maxlength="{maxlength}" aria-invalid="{error || validationError ? 'true' : 'false'}" aria-describedby="{error || validationError ? (id || name) + '-error' : (helperText ? (id || name) + '-help' : '')}" @input="emitField('input', event)" @change="emitField('change', event)" @focus="emitField('focus', event)" @blur="emitField('blur', event)" @invalid="handleInvalid(event)"></textarea>
{#if variant === "floating"}<span data-wrn-owner="Textarea" data-wrn-part="floatingLabel" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}" class="wrn-next__field-floating-label">{label}</span>{/if}
</div>
{#if helperText}<small id="{(id || name) + '-help'}" class="wrn-next__field-help">{helperText}</small>{/if}
<small id="{(id || name) + '-error'}" class="wrn-next__field-error" data-error="{name}" aria-live="polite">{error || validationError}</small>
{#if helperText}<small data-wrn-owner="Textarea" data-wrn-part="help" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}" id="{(id || name) + '-help'}" class="wrn-next__field-help">{helperText}</small>{/if}
<small data-wrn-owner="Textarea" data-wrn-part="error" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}" id="{(id || name) + '-error'}" class="wrn-next__field-error" data-error="{name}" aria-live="polite">{error || validationError}</small>
</div>
}