Skip to content

inputtext: компонент, стилизация, сторисы#51

Merged
Tenkoru merged 21 commits into
feature/styles-debugfrom
form.inputtext
Apr 21, 2026
Merged

inputtext: компонент, стилизация, сторисы#51
Tenkoru merged 21 commits into
feature/styles-debugfrom
form.inputtext

Conversation

@khaliulin
Copy link
Copy Markdown
Contributor

No description provided.

Comment thread src/lib/components/inputtext/inputtext.component.ts
Comment thread src/stories/components/inputtext/inputtext.stories.ts
Comment thread src/lib/components/inputtext/inputtext.component.ts Outdated
@@ -0,0 +1,31 @@
export const inputtextCss = ({ dt }: { dt: (token: string) => string }): string => `

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

background и color поля не меняется на темной теме, включая применение флагов disabled и readonly

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Tenkoru Добавлены CSS-правила для disabled/readonly с dt-токенами для dark theme — 9370287

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Возможно проблема в самом переключателе цветов в сторибуке, но я не вижу, чтобы при переключении темы в сторибуке цвета компонента менялись

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Tenkoru фикс в виде pull от ветки /styles-debug

Comment thread src/prime-preset/tokens/components/inputtext.ts
@@ -0,0 +1,31 @@
export const inputtextCss = ({ dt }: { dt: (token: string) => string }): string => `

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

При :focus у поля нет box-shadow

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

11004194:
@Tenkoru Добавлен box-shadow при фокусе — 28036b9

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Цвет box-shadow сейчас идентичен цвету border, в макете это #12611B

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Tenkoru цвет и ширина для focusRing для состояния focus 885170f

Comment thread src/lib/components/inputtext/inputtext.component.ts Outdated
Comment thread src/lib/components/inputtext/inputtext.component.ts Outdated
name: 'Default',
render: (args) => {
const parts: string[] = [];

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Так как используется NG_VALUE_ACCESSOR, то в stories тоже не должно быть disabled, invalid и ngModel

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

11360793:
@Tenkoru Убраны disabled/invalid/ngModel из stories — 3216b4d

Copy link
Copy Markdown
Collaborator

@Tenkoru Tenkoru Apr 21, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Видимо не совсем ясно выразился. Disabled и invalid из stories удалять не нужно, но изменить их отображение на formControl
Например render для Default: Story
`
render: (args) => {
const parts: string[] = [];

if (args.placeholder) parts.push(`placeholder="${args.placeholder}"`);
if (args.size && args.size !== 'base') parts.push(`size="${args.size}"`);
if (args.readonly) parts.push(`[readonly]="true"`);
if (args.showClear) parts.push(`[showClear]="true"`);
if (args.fluid) parts.push(`[fluid]="true"`);

const validators = [];
if (args.invalid) validators.push(Validators.required);

const control = new FormControl({
  value: '',
  disabled: args.disabled,
}, validators);

const template = `
  <input-text
    [formControl]="control"
    ${parts.join('\n        ')}
  ></input-text>
`;

return { props: { ...args, control }, template };

},
`

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Tenkoru disabled/invalid в stories через FormControl + NgControl в компоненте d69122d

@khaliulin khaliulin force-pushed the form.inputtext branch 2 times, most recently from 9354d99 to 28735e7 Compare April 21, 2026 04:52
import { InputTextComponent } from '@cdek-it/angular-ui-kit';
import { FormControl, Validators, ReactiveFormsModule } from '@angular/forms';

// formControl = new FormControl('', Validators.required);
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

В некоторых сторях закоменчены поля

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Tenkoru раскомментирован source.code в stories Disabled/Invalid 0d78e17

@Tenkoru Tenkoru merged commit c980261 into feature/styles-debug Apr 21, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants