@ytsaurus/components 0.2.1 → 0.2.3

package/build/esm/components/SchemaDataType/DataType/__tests__/DataType.visual.test.js

@@ -0,0 +1,51 @@
+import _regeneratorRuntime from "@babel/runtime/helpers/regeneratorRuntime";
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _createForOfIteratorHelper from "@babel/runtime/helpers/createForOfIteratorHelper";
+import { test } from '../../../../../playwright-components/core';
+import { DataType } from '../DataType';
+import { dataTypeStoryExamples, dataTypeStoryFrameStyle, dataTypeVisualStoryCaseOrder } from '../dataTypeStorySetup';
+import { jsx as _jsx } from "react/jsx-runtime";
+var dataTypeVisualTree = function dataTypeVisualTree(node) {
+  return /*#__PURE__*/_jsx("div", {
+    style: dataTypeStoryFrameStyle,
+    children: node
+  });
+};
+var _iterator = _createForOfIteratorHelper(dataTypeVisualStoryCaseOrder),
+  _step;
+try {
+  var _loop = function _loop() {
+    var key = _step.value;
+    test("DataType: ".concat(key), /*#__PURE__*/function () {
+      var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref) {
+        var mount, expectScreenshot;
+        return _regeneratorRuntime().wrap(function (_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              mount = _ref.mount, expectScreenshot = _ref.expectScreenshot;
+              _context.next = 1;
+              return mount(dataTypeVisualTree(/*#__PURE__*/_jsx(DataType, _objectSpread({}, dataTypeStoryExamples[key]))));
+            case 1:
+              _context.next = 2;
+              return expectScreenshot();
+            case 2:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee);
+      }));
+      return function (_x) {
+        return _ref2.apply(this, arguments);
+      };
+    }());
+  };
+  for (_iterator.s(); !(_step = _iterator.n()).done;) {
+    _loop();
+  }
+} catch (err) {
+  _iterator.e(err);
+} finally {
+  _iterator.f();
+}
+// #sourceMappingURL=DataType.visual.test.js.map

package/build/esm/components/SchemaDataType/DataType/__tests__/DataType.visual.test.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["test","DataType","dataTypeStoryExamples","dataTypeStoryFrameStyle","dataTypeVisualStoryCaseOrder","jsx","_jsx","dataTypeVisualTree","node","style","children","_iterator","_createForOfIteratorHelper","_step","_loop","key","value","concat","_ref2","_asyncToGenerator","_regeneratorRuntime","mark","_callee","_ref","mount","expectScreenshot","wrap","_context","prev","next","_objectSpread","stop","_x","apply","arguments","s","n","done","err","e","f"],"sources":["DataType.visual.test.tsx"],"sourcesContent":["import {type ReactElement} from 'react';\n\nimport {test} from '../../../../../playwright-components/core';\n\nimport {DataType} from '../DataType';\nimport {\n    dataTypeStoryExamples,\n    dataTypeStoryFrameStyle,\n    dataTypeVisualStoryCaseOrder,\n} from '../dataTypeStorySetup';\n\nconst dataTypeVisualTree = (node: ReactElement) => (\n    <div style={dataTypeStoryFrameStyle}>{node}</div>\n);\n\nfor (const key of dataTypeVisualStoryCaseOrder) {\n    test(`DataType: ${key}`, async ({mount, expectScreenshot}) => {\n        await mount(dataTypeVisualTree(<DataType {...dataTypeStoryExamples[key]} />));\n        await expectScreenshot();\n    });\n}\n"],"mappings":";;;;AAEA,SAAQA,IAAI,QAAO,2CAA2C;AAE9D,SAAQC,QAAQ,QAAO,aAAa;AACpC,SACIC,qBAAqB,EACrBC,uBAAuB,EACvBC,4BAA4B,QACzB,uBAAuB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAE/B,IAAMC,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAIC,IAAkB;EAAA,oBAC1CF,IAAA;IAAKG,KAAK,EAAEN,uBAAwB;IAAAO,QAAA,EAAEF;EAAI,CAAM,CAAC;AAAA,CACpD;AAAC,IAAAG,SAAA,GAAAC,0BAAA,CAEgBR,4BAA4B;EAAAS,KAAA;AAAA;EAAA,IAAAC,KAAA,YAAAA,MAAA,EAAE;IAAA,IAArCC,GAAG,GAAAF,KAAA,CAAAG,KAAA;IACVhB,IAAI,cAAAiB,MAAA,CAAcF,GAAG;MAAA,IAAAG,KAAA,GAAAC,iBAAA,cAAAC,mBAAA,GAAAC,IAAA,CAAI,SAAAC,QAAAC,IAAA;QAAA,IAAAC,KAAA,EAAAC,gBAAA;QAAA,OAAAL,mBAAA,GAAAM,IAAA,WAAAC,QAAA;UAAA,kBAAAA,QAAA,CAAAC,IAAA,GAAAD,QAAA,CAAAE,IAAA;YAAA;cAAQL,KAAK,GAAAD,IAAA,CAALC,KAAK,EAAEC,gBAAgB,GAAAF,IAAA,CAAhBE,gBAAgB;cAAAE,QAAA,CAAAE,IAAA;cAAA,OAC9CL,KAAK,CAACjB,kBAAkB,cAACD,IAAA,CAACL,QAAQ,EAAA6B,aAAA,KAAK5B,qBAAqB,CAACa,GAAG,CAAC,CAAG,CAAC,CAAC,CAAC;YAAA;cAAAY,QAAA,CAAAE,IAAA;cAAA,OACvEJ,gBAAgB,CAAC,CAAC;YAAA;YAAA;cAAA,OAAAE,QAAA,CAAAI,IAAA;UAAA;QAAA,GAAAT,OAAA;MAAA,CAC3B;MAAA,iBAAAU,EAAA;QAAA,OAAAd,KAAA,CAAAe,KAAA,OAAAC,SAAA;MAAA;IAAA,IAAC;EACN,CAAC;EALD,KAAAvB,SAAA,CAAAwB,CAAA,MAAAtB,KAAA,GAAAF,SAAA,CAAAyB,CAAA,IAAAC,IAAA;IAAAvB,KAAA;EAAA;AAKC,SAAAwB,GAAA;EAAA3B,SAAA,CAAA4B,CAAA,CAAAD,GAAA;AAAA;EAAA3B,SAAA,CAAA6B,CAAA;AAAA","ignoreList":[]}

package/build/esm/components/SchemaDataType/DataType/dataTypeStorySetup.d.ts

@@ -0,0 +1,9 @@
+import type { CSSProperties } from 'react';
+import type { DataTypeProps } from './DataType';
+/** Keys match Storybook `example` control; shared with Playwright visual tests. */
+export type DataTypeStoryExampleKey = 'simple' | 'optional' | 'optionalMulti' | 'tagged' | 'withParams' | 'tuple' | 'struct' | 'nestedList';
+export declare const dataTypeStoryExamples: Record<DataTypeStoryExampleKey, DataTypeProps>;
+/** Stable order for visual regression tests. */
+export declare const dataTypeVisualStoryCaseOrder: DataTypeStoryExampleKey[];
+export declare const dataTypeStoryFrameStyle: CSSProperties;
+//# sourceMappingURL=dataTypeStorySetup.d.ts.map

package/build/esm/components/SchemaDataType/DataType/dataTypeStorySetup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dataTypeStorySetup.d.ts","sourceRoot":"","sources":["../../../../../src/components/SchemaDataType/DataType/dataTypeStorySetup.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,OAAO,CAAC;AAEzC,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,YAAY,CAAC;AAE9C,mFAAmF;AACnF,MAAM,MAAM,uBAAuB,GAC7B,QAAQ,GACR,UAAU,GACV,eAAe,GACf,QAAQ,GACR,YAAY,GACZ,OAAO,GACP,QAAQ,GACR,YAAY,CAAC;AAEnB,eAAO,MAAM,qBAAqB,EAAE,MAAM,CAAC,uBAAuB,EAAE,aAAa,CA8BhF,CAAC;AAEF,gDAAgD;AAChD,eAAO,MAAM,4BAA4B,EAAE,uBAAuB,EASjE,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,aAMrC,CAAC"}

package/build/esm/components/SchemaDataType/DataType/dataTypeStorySetup.js

@@ -0,0 +1,77 @@
+/** Keys match Storybook `example` control; shared with Playwright visual tests. */
+
+export var dataTypeStoryExamples = {
+  simple: {
+    name: 'String'
+  },
+  optional: {
+    name: 'Int64',
+    optional: true
+  },
+  optionalMulti: {
+    name: 'Utf8',
+    optional: true,
+    optionalLevel: 3
+  },
+  tagged: {
+    name: 'Json',
+    tagged: true,
+    tags: ['yson', 'meta']
+  },
+  withParams: {
+    name: 'Decimal',
+    params: [10, 2]
+  },
+  tuple: {
+    name: 'Tuple',
+    complex: true,
+    type: [{
+      name: 'String'
+    }, {
+      name: 'Bool'
+    }, {
+      name: 'Double'
+    }]
+  },
+  struct: {
+    name: 'Struct',
+    complex: true,
+    struct: [{
+      key: 'id',
+      type: {
+        name: 'Int64'
+      }
+    }, {
+      key: 'payload',
+      type: {
+        name: 'Yson',
+        optional: true
+      }
+    }]
+  },
+  nestedList: {
+    name: 'List',
+    complex: true,
+    type: [{
+      name: 'Struct',
+      complex: true,
+      struct: [{
+        key: 'ts',
+        type: {
+          name: 'Timestamp'
+        }
+      }]
+    }]
+  }
+};
+
+/** Stable order for visual regression tests. */
+export var dataTypeVisualStoryCaseOrder = ['simple', 'optional', 'optionalMulti', 'tagged', 'withParams', 'tuple', 'struct', 'nestedList'];
+export var dataTypeStoryFrameStyle = {
+  minWidth: 320,
+  minHeight: 56,
+  padding: 12,
+  border: '1px dashed var(--g-color-line-generic, #ddd)',
+  borderRadius: 8
+};
+// #sourceMappingURL=dataTypeStorySetup.js.map

package/build/esm/components/SchemaDataType/DataType/dataTypeStorySetup.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["dataTypeStoryExamples","simple","name","optional","optionalMulti","optionalLevel","tagged","tags","withParams","params","tuple","complex","type","struct","key","nestedList","dataTypeVisualStoryCaseOrder","dataTypeStoryFrameStyle","minWidth","minHeight","padding","border","borderRadius"],"sources":["dataTypeStorySetup.ts"],"sourcesContent":["import type {CSSProperties} from 'react';\n\nimport type {DataTypeProps} from './DataType';\n\n/** Keys match Storybook `example` control; shared with Playwright visual tests. */\nexport type DataTypeStoryExampleKey =\n    | 'simple'\n    | 'optional'\n    | 'optionalMulti'\n    | 'tagged'\n    | 'withParams'\n    | 'tuple'\n    | 'struct'\n    | 'nestedList';\n\nexport const dataTypeStoryExamples: Record<DataTypeStoryExampleKey, DataTypeProps> = {\n    simple: {name: 'String'},\n    optional: {name: 'Int64', optional: true},\n    optionalMulti: {name: 'Utf8', optional: true, optionalLevel: 3},\n    tagged: {name: 'Json', tagged: true, tags: ['yson', 'meta']},\n    withParams: {name: 'Decimal', params: [10, 2]},\n    tuple: {\n        name: 'Tuple',\n        complex: true,\n        type: [{name: 'String'}, {name: 'Bool'}, {name: 'Double'}],\n    },\n    struct: {\n        name: 'Struct',\n        complex: true,\n        struct: [\n            {key: 'id', type: {name: 'Int64'}},\n            {key: 'payload', type: {name: 'Yson', optional: true}},\n        ],\n    },\n    nestedList: {\n        name: 'List',\n        complex: true,\n        type: [\n            {\n                name: 'Struct',\n                complex: true,\n                struct: [{key: 'ts', type: {name: 'Timestamp'}}],\n            },\n        ],\n    },\n};\n\n/** Stable order for visual regression tests. */\nexport const dataTypeVisualStoryCaseOrder: DataTypeStoryExampleKey[] = [\n    'simple',\n    'optional',\n    'optionalMulti',\n    'tagged',\n    'withParams',\n    'tuple',\n    'struct',\n    'nestedList',\n];\n\nexport const dataTypeStoryFrameStyle: CSSProperties = {\n    minWidth: 320,\n    minHeight: 56,\n    padding: 12,\n    border: '1px dashed var(--g-color-line-generic, #ddd)',\n    borderRadius: 8,\n};\n"],"mappings":"AAIA;;AAWA,OAAO,IAAMA,qBAAqE,GAAG;EACjFC,MAAM,EAAE;IAACC,IAAI,EAAE;EAAQ,CAAC;EACxBC,QAAQ,EAAE;IAACD,IAAI,EAAE,OAAO;IAAEC,QAAQ,EAAE;EAAI,CAAC;EACzCC,aAAa,EAAE;IAACF,IAAI,EAAE,MAAM;IAAEC,QAAQ,EAAE,IAAI;IAAEE,aAAa,EAAE;EAAC,CAAC;EAC/DC,MAAM,EAAE;IAACJ,IAAI,EAAE,MAAM;IAAEI,MAAM,EAAE,IAAI;IAAEC,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM;EAAC,CAAC;EAC5DC,UAAU,EAAE;IAACN,IAAI,EAAE,SAAS;IAAEO,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;EAAC,CAAC;EAC9CC,KAAK,EAAE;IACHR,IAAI,EAAE,OAAO;IACbS,OAAO,EAAE,IAAI;IACbC,IAAI,EAAE,CAAC;MAACV,IAAI,EAAE;IAAQ,CAAC,EAAE;MAACA,IAAI,EAAE;IAAM,CAAC,EAAE;MAACA,IAAI,EAAE;IAAQ,CAAC;EAC7D,CAAC;EACDW,MAAM,EAAE;IACJX,IAAI,EAAE,QAAQ;IACdS,OAAO,EAAE,IAAI;IACbE,MAAM,EAAE,CACJ;MAACC,GAAG,EAAE,IAAI;MAAEF,IAAI,EAAE;QAACV,IAAI,EAAE;MAAO;IAAC,CAAC,EAClC;MAACY,GAAG,EAAE,SAAS;MAAEF,IAAI,EAAE;QAACV,IAAI,EAAE,MAAM;QAAEC,QAAQ,EAAE;MAAI;IAAC,CAAC;EAE9D,CAAC;EACDY,UAAU,EAAE;IACRb,IAAI,EAAE,MAAM;IACZS,OAAO,EAAE,IAAI;IACbC,IAAI,EAAE,CACF;MACIV,IAAI,EAAE,QAAQ;MACdS,OAAO,EAAE,IAAI;MACbE,MAAM,EAAE,CAAC;QAACC,GAAG,EAAE,IAAI;QAAEF,IAAI,EAAE;UAACV,IAAI,EAAE;QAAW;MAAC,CAAC;IACnD,CAAC;EAET;AACJ,CAAC;;AAED;AACA,OAAO,IAAMc,4BAAuD,GAAG,CACnE,QAAQ,EACR,UAAU,EACV,eAAe,EACf,QAAQ,EACR,YAAY,EACZ,OAAO,EACP,QAAQ,EACR,YAAY,CACf;AAED,OAAO,IAAMC,uBAAsC,GAAG;EAClDC,QAAQ,EAAE,GAAG;EACbC,SAAS,EAAE,EAAE;EACbC,OAAO,EAAE,EAAE;EACXC,MAAM,EAAE,8CAA8C;EACtDC,YAAY,EAAE;AAClB,CAAC","ignoreList":[]}

package/build/esm/components/Text/Text.css

@@ -9,29 +9,29 @@
   white-space: nowrap;
 }
 .yt-text_color_secondary {
-  color: var(--secondary-text);
+  color: var(--secondary-text, var(--g-color-text-secondary));
 }
 .yt-text_color_success {
-  color: var(--success-text);
+  color: var(--success-text, var(--g-color-text-positive));
 }
 .yt-text_color_info {
   color: var(--g-color-text-info);
 }
 .yt-text_color_warning {
-  color: var(--warning-text);
+  color: var(--warning-text, var(--g-color-text-warning-heavy));
 }
 .yt-text_color_warning-light {
-  color: var(--warning-color);
+  color: var(--warning-color, var(--g-color-text-warning));
 }
 .yt-text_color_danger {
-  color: var(--danger-text);
+  color: var(--danger-text, var(--g-color-text-danger));
 }
 .yt-text_disabled {
-  color: var(--disabled-link);
+  color: var(--disabled-link, var(--g-color-text-hint));
   cursor: inherit;
 }
 .yt-text_bold {
-  font-weight: var(--yt-font-weight-bold);
+  font-weight: var(--yt-font-weight-bold, var(--g-text-accent-font-weight));
 }
 .yt-text_no-wrap {
   white-space: nowrap;
@@ -48,7 +48,7 @@
 .yt-text_escaped .unipika .escape {
   word-spacing: 5px;
   white-space: pre-wrap;
-  background-color: var(--error-background);
+  background-color: var(--error-background, var(--g-color-base-danger-light));
 }
 .yt-text_escaped .unipika .string {
   position: relative;

package/build/esm/components/Text/Text.css.map

@@ -1 +1 @@
-{"version":3,"sources":["Text.scss"],"names":[],"mappings":"AAEQ;EACI,iCAAA;EACA,eAAA;AADZ;AAKI;EACI,qBAAA;EACA,gBAAA;EACA,uBAAA;EACA,mBAAA;AAHR;AAOQ;EACI,4BAAA;AALZ;AAQQ;EACI,0BAAA;AANZ;AASQ;EACI,+BAAA;AAPZ;AAUQ;EACI,0BAAA;AARZ;AAWQ;EACI,2BAAA;AATZ;AAYQ;EACI,yBAAA;AAVZ;AAcI;EACI,2BAAA;EACA,eAAA;AAZR;AAeI;EACI,uCAAA;AAbR;AAgBI;EACI,mBAAA;AAdR;AAkBQ;EACI,eAAA;EACA,mBAAA;EACA,sCAAA;EACA,cAAA;AAhBZ;AAkBY;EACI,aAAA;AAhBhB;AAmBY;EACI,iBAAA;EACA,qBAAA;EACA,yCAAA;AAjBhB;AAoBY;EACI,kBAAA;EACA,cAAA;EACA,sBAAA;AAlBhB;AAuBI;EACI,0BAAA;AArBR","file":"Text.css","sourcesContent":[".yt-text {\n    &_clickable {\n        &:hover {\n            color: var(--g-color-text-danger);\n            cursor: pointer;\n        }\n    }\n\n    &_ellipsis {\n        display: inline-block;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n    }\n\n    &_color {\n        &_secondary {\n            color: var(--secondary-text);\n        }\n\n        &_success {\n            color: var(--success-text);\n        }\n\n        &_info {\n            color: var(--g-color-text-info);\n        }\n\n        &_warning {\n            color: var(--warning-text);\n        }\n\n        &_warning-light {\n            color: var(--warning-color);\n        }\n\n        &_danger {\n            color: var(--danger-text);\n        }\n    }\n\n    &_disabled {\n        color: var(--disabled-link);\n        cursor: unset;\n    }\n\n    &_bold {\n        font-weight: var(--yt-font-weight-bold);\n    }\n\n    &_no-wrap {\n        white-space: nowrap;\n    }\n\n    &_escaped {\n        & .unipika {\n            display: inline;\n            white-space: nowrap;\n            font-family: var(--g-font-family-sans);\n            color: inherit;\n\n            .quote {\n                display: none;\n            }\n\n            .escape {\n                word-spacing: 5px;\n                white-space: pre-wrap;\n                background-color: var(--error-background);\n            }\n\n            & .string {\n                position: relative;\n                color: inherit;\n                vertical-align: bottom;\n            }\n        }\n    }\n\n    &_capitalize {\n        text-transform: capitalize;\n    }\n}\n"],"sourceRoot":""}
+{"version":3,"sources":["Text.scss"],"names":[],"mappings":"AAEQ;EACI,iCAAA;EACA,eAAA;AADZ;AAKI;EACI,qBAAA;EACA,gBAAA;EACA,uBAAA;EACA,mBAAA;AAHR;AAOQ;EACI,2DAAA;AALZ;AAQQ;EACI,wDAAA;AANZ;AASQ;EACI,+BAAA;AAPZ;AAUQ;EACI,6DAAA;AARZ;AAWQ;EACI,wDAAA;AATZ;AAYQ;EACI,qDAAA;AAVZ;AAcI;EACI,qDAAA;EACA,eAAA;AAZR;AAeI;EACI,yEAAA;AAbR;AAgBI;EACI,mBAAA;AAdR;AAkBQ;EACI,eAAA;EACA,mBAAA;EACA,sCAAA;EACA,cAAA;AAhBZ;AAkBY;EACI,aAAA;AAhBhB;AAmBY;EACI,iBAAA;EACA,qBAAA;EACA,2EAAA;AAjBhB;AAoBY;EACI,kBAAA;EACA,cAAA;EACA,sBAAA;AAlBhB;AAuBI;EACI,0BAAA;AArBR","file":"Text.css","sourcesContent":[".yt-text {\n    &_clickable {\n        &:hover {\n            color: var(--g-color-text-danger);\n            cursor: pointer;\n        }\n    }\n\n    &_ellipsis {\n        display: inline-block;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n    }\n\n    &_color {\n        &_secondary {\n            color: var(--secondary-text, var(--g-color-text-secondary));\n        }\n\n        &_success {\n            color: var(--success-text, var(--g-color-text-positive));\n        }\n\n        &_info {\n            color: var(--g-color-text-info);\n        }\n\n        &_warning {\n            color: var(--warning-text, var(--g-color-text-warning-heavy));\n        }\n\n        &_warning-light {\n            color: var(--warning-color, var(--g-color-text-warning));\n        }\n\n        &_danger {\n            color: var(--danger-text, var(--g-color-text-danger));\n        }\n    }\n\n    &_disabled {\n        color: var(--disabled-link, var(--g-color-text-hint));\n        cursor: unset;\n    }\n\n    &_bold {\n        font-weight: var(--yt-font-weight-bold, var(--g-text-accent-font-weight));\n    }\n\n    &_no-wrap {\n        white-space: nowrap;\n    }\n\n    &_escaped {\n        & .unipika {\n            display: inline;\n            white-space: nowrap;\n            font-family: var(--g-font-family-sans);\n            color: inherit;\n\n            .quote {\n                display: none;\n            }\n\n            .escape {\n                word-spacing: 5px;\n                white-space: pre-wrap;\n                background-color: var(--error-background, var(--g-color-base-danger-light));\n            }\n\n            & .string {\n                position: relative;\n                color: inherit;\n                vertical-align: bottom;\n            }\n        }\n    }\n\n    &_capitalize {\n        text-transform: capitalize;\n    }\n}\n"],"sourceRoot":""}

package/build/esm/components/Text/Text.scss

@@ -15,11 +15,11 @@
 
     &_color {
         &_secondary {
-            color: var(--secondary-text);
+            color: var(--secondary-text, var(--g-color-text-secondary));
         }
 
         &_success {
-            color: var(--success-text);
+            color: var(--success-text, var(--g-color-text-positive));
         }
 
         &_info {
@@ -27,25 +27,25 @@
         }
 
         &_warning {
-            color: var(--warning-text);
+            color: var(--warning-text, var(--g-color-text-warning-heavy));
         }
 
         &_warning-light {
-            color: var(--warning-color);
+            color: var(--warning-color, var(--g-color-text-warning));
         }
 
         &_danger {
-            color: var(--danger-text);
+            color: var(--danger-text, var(--g-color-text-danger));
         }
     }
 
     &_disabled {
-        color: var(--disabled-link);
+        color: var(--disabled-link, var(--g-color-text-hint));
         cursor: unset;
     }
 
     &_bold {
-        font-weight: var(--yt-font-weight-bold);
+        font-weight: var(--yt-font-weight-bold, var(--g-text-accent-font-weight));
     }
 
     &_no-wrap {
@@ -66,7 +66,7 @@
             .escape {
                 word-spacing: 5px;
                 white-space: pre-wrap;
-                background-color: var(--error-background);
+                background-color: var(--error-background, var(--g-color-base-danger-light));
             }
 
             & .string {

package/build/esm/components/Text/Text.stories.d.ts

@@ -0,0 +1,37 @@
+import type { StoryObj } from '@storybook/react';
+import { YTText } from './Text';
+import type { TextProps } from './Text';
+declare const meta: {
+    title: string;
+    component: typeof YTText;
+    tags: string[];
+    args: Pick<TextProps, "children" | "capitalize" | "bold" | "disabled" | "color" | "ellipsis" | "noWrap">;
+    argTypes: {
+        children: {
+            control: "text";
+        };
+        color: {
+            control: "select";
+            options: ("success" | "warning" | "danger" | "info" | "primary" | "secondary" | "warning-light" | undefined)[];
+        };
+        bold: {
+            control: "boolean";
+        };
+        noWrap: {
+            control: "boolean";
+        };
+        ellipsis: {
+            control: "boolean";
+        };
+        disabled: {
+            control: "boolean";
+        };
+        capitalize: {
+            control: "boolean";
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const YTTextStory: Story;
+//# sourceMappingURL=Text.stories.d.ts.map

package/build/esm/components/Text/Text.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Text/Text.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAO,QAAQ,EAAC,MAAM,kBAAkB,CAAC;AAErD,OAAO,EAAC,MAAM,EAAC,MAAM,QAAQ,CAAC;AAC9B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,QAAQ,CAAC;AAGtC,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BqB,CAAC;AAEhC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,WAAW,EAAE,KAEzB,CAAC"}

package/build/esm/components/Text/Text.stories.js

@@ -0,0 +1,37 @@
+import { YTText } from './Text';
+import { textStoryDefaultArgs } from './textStorySetup';
+var meta = {
+  title: 'Components/Text',
+  component: YTText,
+  tags: ['autodocs'],
+  args: textStoryDefaultArgs,
+  argTypes: {
+    children: {
+      control: 'text'
+    },
+    color: {
+      control: 'select',
+      options: [undefined, 'primary', 'secondary', 'success', 'info', 'warning', 'warning-light', 'danger']
+    },
+    bold: {
+      control: 'boolean'
+    },
+    noWrap: {
+      control: 'boolean'
+    },
+    ellipsis: {
+      control: 'boolean'
+    },
+    disabled: {
+      control: 'boolean'
+    },
+    capitalize: {
+      control: 'boolean'
+    }
+  }
+};
+export default meta;
+export var YTTextStory = {
+  name: 'YTText'
+};
+// #sourceMappingURL=Text.stories.js.map

package/build/esm/components/Text/Text.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["YTText","textStoryDefaultArgs","meta","title","component","tags","args","argTypes","children","control","color","options","undefined","bold","noWrap","ellipsis","disabled","capitalize","YTTextStory","name"],"sources":["Text.stories.tsx"],"sourcesContent":["import type {Meta, StoryObj} from '@storybook/react';\n\nimport {YTText} from './Text';\nimport type {TextProps} from './Text';\nimport {textStoryDefaultArgs} from './textStorySetup';\n\nconst meta = {\n    title: 'Components/Text',\n    component: YTText,\n    tags: ['autodocs'],\n    args: textStoryDefaultArgs,\n    argTypes: {\n        children: {control: 'text'},\n        color: {\n            control: 'select',\n            options: [\n                undefined,\n                'primary',\n                'secondary',\n                'success',\n                'info',\n                'warning',\n                'warning-light',\n                'danger',\n            ] satisfies Array<TextProps['color'] | undefined>,\n        },\n        bold: {control: 'boolean'},\n        noWrap: {control: 'boolean'},\n        ellipsis: {control: 'boolean'},\n        disabled: {control: 'boolean'},\n        capitalize: {control: 'boolean'},\n    },\n} satisfies Meta<typeof YTText>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const YTTextStory: Story = {\n    name: 'YTText',\n};\n"],"mappings":"AAEA,SAAQA,MAAM,QAAO,QAAQ;AAE7B,SAAQC,oBAAoB,QAAO,kBAAkB;AAErD,IAAMC,IAAI,GAAG;EACTC,KAAK,EAAE,iBAAiB;EACxBC,SAAS,EAAEJ,MAAM;EACjBK,IAAI,EAAE,CAAC,UAAU,CAAC;EAClBC,IAAI,EAAEL,oBAAoB;EAC1BM,QAAQ,EAAE;IACNC,QAAQ,EAAE;MAACC,OAAO,EAAE;IAAM,CAAC;IAC3BC,KAAK,EAAE;MACHD,OAAO,EAAE,QAAQ;MACjBE,OAAO,EAAE,CACLC,SAAS,EACT,SAAS,EACT,WAAW,EACX,SAAS,EACT,MAAM,EACN,SAAS,EACT,eAAe,EACf,QAAQ;IAEhB,CAAC;IACDC,IAAI,EAAE;MAACJ,OAAO,EAAE;IAAS,CAAC;IAC1BK,MAAM,EAAE;MAACL,OAAO,EAAE;IAAS,CAAC;IAC5BM,QAAQ,EAAE;MAACN,OAAO,EAAE;IAAS,CAAC;IAC9BO,QAAQ,EAAE;MAACP,OAAO,EAAE;IAAS,CAAC;IAC9BQ,UAAU,EAAE;MAACR,OAAO,EAAE;IAAS;EACnC;AACJ,CAA+B;AAE/B,eAAeP,IAAI;AAInB,OAAO,IAAMgB,WAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC","ignoreList":[]}

package/build/esm/components/Text/__tests__/Text.visual.test.js

@@ -0,0 +1,89 @@
+import _regeneratorRuntime from "@babel/runtime/helpers/regeneratorRuntime";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _createForOfIteratorHelper from "@babel/runtime/helpers/createForOfIteratorHelper";
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import { test } from '../../../../playwright-components/core';
+import { Bold, Escaped, NoWrap, Secondary, SecondaryBold, Warning, WarningLight, YTText } from '../Text';
+import { textStoryFrameStyle, textVisualStoryCases } from '../textStorySetup';
+import { jsx as _jsx } from "react/jsx-runtime";
+var renderTextCase = function renderTextCase(c) {
+  switch (c.kind) {
+    case 'yt-text':
+      return /*#__PURE__*/_jsx(YTText, _objectSpread({}, c.props));
+    case 'Secondary':
+      return /*#__PURE__*/_jsx(Secondary, {
+        disabled: c.disabled,
+        children: c.children
+      });
+    case 'Bold':
+      return /*#__PURE__*/_jsx(Bold, {
+        children: c.children
+      });
+    case 'SecondaryBold':
+      return /*#__PURE__*/_jsx(SecondaryBold, {
+        children: c.children
+      });
+    case 'Warning':
+      return /*#__PURE__*/_jsx(Warning, {
+        children: c.children
+      });
+    case 'WarningLight':
+      return /*#__PURE__*/_jsx(WarningLight, {
+        children: c.children
+      });
+    case 'NoWrap':
+      return /*#__PURE__*/_jsx(NoWrap, {
+        children: c.children
+      });
+    case 'Escaped':
+      return /*#__PURE__*/_jsx(Escaped, {
+        text: c.text
+      });
+    default:
+      {
+        var _exhaustive = c;
+        return _exhaustive;
+      }
+  }
+};
+var _iterator = _createForOfIteratorHelper(textVisualStoryCases),
+  _step;
+try {
+  var _loop = function _loop() {
+    var storyCase = _step.value;
+    test("Text: ".concat(storyCase.id), /*#__PURE__*/function () {
+      var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref) {
+        var mount, expectScreenshot, innerStyle;
+        return _regeneratorRuntime().wrap(function (_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+              mount = _ref.mount, expectScreenshot = _ref.expectScreenshot;
+              innerStyle = storyCase.kind === 'yt-text' ? storyCase.wrapperStyle : undefined;
+              _context.next = 1;
+              return mount(/*#__PURE__*/_jsx("div", {
+                style: _objectSpread(_objectSpread({}, textStoryFrameStyle), innerStyle),
+                children: renderTextCase(storyCase)
+              }));
+            case 1:
+              _context.next = 2;
+              return expectScreenshot();
+            case 2:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee);
+      }));
+      return function (_x) {
+        return _ref2.apply(this, arguments);
+      };
+    }());
+  };
+  for (_iterator.s(); !(_step = _iterator.n()).done;) {
+    _loop();
+  }
+} catch (err) {
+  _iterator.e(err);
+} finally {
+  _iterator.f();
+}
+// #sourceMappingURL=Text.visual.test.js.map

package/build/esm/components/Text/__tests__/Text.visual.test.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["test","Bold","Escaped","NoWrap","Secondary","SecondaryBold","Warning","WarningLight","YTText","textStoryFrameStyle","textVisualStoryCases","jsx","_jsx","renderTextCase","c","kind","_objectSpread","props","disabled","children","text","_exhaustive","_iterator","_createForOfIteratorHelper","_step","_loop","storyCase","value","concat","id","_ref2","_asyncToGenerator","_regeneratorRuntime","mark","_callee","_ref","mount","expectScreenshot","innerStyle","wrap","_context","prev","next","wrapperStyle","undefined","style","stop","_x","apply","arguments","s","n","done","err","e","f"],"sources":["Text.visual.test.tsx"],"sourcesContent":["import {type ReactElement} from 'react';\n\nimport {test} from '../../../../playwright-components/core';\n\nimport {\n    Bold,\n    Escaped,\n    NoWrap,\n    Secondary,\n    SecondaryBold,\n    Warning,\n    WarningLight,\n    YTText,\n} from '../Text';\nimport {type TextVisualCase, textStoryFrameStyle, textVisualStoryCases} from '../textStorySetup';\n\nconst renderTextCase = (c: TextVisualCase): ReactElement => {\n    switch (c.kind) {\n        case 'yt-text':\n            return <YTText {...c.props} />;\n        case 'Secondary':\n            return <Secondary disabled={c.disabled}>{c.children}</Secondary>;\n        case 'Bold':\n            return <Bold>{c.children}</Bold>;\n        case 'SecondaryBold':\n            return <SecondaryBold>{c.children}</SecondaryBold>;\n        case 'Warning':\n            return <Warning>{c.children}</Warning>;\n        case 'WarningLight':\n            return <WarningLight>{c.children}</WarningLight>;\n        case 'NoWrap':\n            return <NoWrap>{c.children}</NoWrap>;\n        case 'Escaped':\n            return <Escaped text={c.text} />;\n        default: {\n            const _exhaustive: never = c;\n            return _exhaustive;\n        }\n    }\n};\n\nfor (const storyCase of textVisualStoryCases) {\n    test(`Text: ${storyCase.id}`, async ({mount, expectScreenshot}) => {\n        const innerStyle = storyCase.kind === 'yt-text' ? storyCase.wrapperStyle : undefined;\n        await mount(\n            <div style={{...textStoryFrameStyle, ...innerStyle}}>{renderTextCase(storyCase)}</div>,\n        );\n        await expectScreenshot();\n    });\n}\n"],"mappings":";;;;AAEA,SAAQA,IAAI,QAAO,wCAAwC;AAE3D,SACIC,IAAI,EACJC,OAAO,EACPC,MAAM,EACNC,SAAS,EACTC,aAAa,EACbC,OAAO,EACPC,YAAY,EACZC,MAAM,QACH,SAAS;AAChB,SAA6BC,mBAAmB,EAAEC,oBAAoB,QAAO,mBAAmB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAEjG,IAAMC,cAAc,GAAG,SAAjBA,cAAcA,CAAIC,CAAiB,EAAmB;EACxD,QAAQA,CAAC,CAACC,IAAI;IACV,KAAK,SAAS;MACV,oBAAOH,IAAA,CAACJ,MAAM,EAAAQ,aAAA,KAAKF,CAAC,CAACG,KAAK,CAAG,CAAC;IAClC,KAAK,WAAW;MACZ,oBAAOL,IAAA,CAACR,SAAS;QAACc,QAAQ,EAAEJ,CAAC,CAACI,QAAS;QAAAC,QAAA,EAAEL,CAAC,CAACK;MAAQ,CAAY,CAAC;IACpE,KAAK,MAAM;MACP,oBAAOP,IAAA,CAACX,IAAI;QAAAkB,QAAA,EAAEL,CAAC,CAACK;MAAQ,CAAO,CAAC;IACpC,KAAK,eAAe;MAChB,oBAAOP,IAAA,CAACP,aAAa;QAAAc,QAAA,EAAEL,CAAC,CAACK;MAAQ,CAAgB,CAAC;IACtD,KAAK,SAAS;MACV,oBAAOP,IAAA,CAACN,OAAO;QAAAa,QAAA,EAAEL,CAAC,CAACK;MAAQ,CAAU,CAAC;IAC1C,KAAK,cAAc;MACf,oBAAOP,IAAA,CAACL,YAAY;QAAAY,QAAA,EAAEL,CAAC,CAACK;MAAQ,CAAe,CAAC;IACpD,KAAK,QAAQ;MACT,oBAAOP,IAAA,CAACT,MAAM;QAAAgB,QAAA,EAAEL,CAAC,CAACK;MAAQ,CAAS,CAAC;IACxC,KAAK,SAAS;MACV,oBAAOP,IAAA,CAACV,OAAO;QAACkB,IAAI,EAAEN,CAAC,CAACM;MAAK,CAAE,CAAC;IACpC;MAAS;QACL,IAAMC,WAAkB,GAAGP,CAAC;QAC5B,OAAOO,WAAW;MACtB;EACJ;AACJ,CAAC;AAAC,IAAAC,SAAA,GAAAC,0BAAA,CAEsBb,oBAAoB;EAAAc,KAAA;AAAA;EAAA,IAAAC,KAAA,YAAAA,MAAA,EAAE;IAAA,IAAnCC,SAAS,GAAAF,KAAA,CAAAG,KAAA;IAChB3B,IAAI,UAAA4B,MAAA,CAAUF,SAAS,CAACG,EAAE;MAAA,IAAAC,KAAA,GAAAC,iBAAA,cAAAC,mBAAA,GAAAC,IAAA,CAAI,SAAAC,QAAAC,IAAA;QAAA,IAAAC,KAAA,EAAAC,gBAAA,EAAAC,UAAA;QAAA,OAAAN,mBAAA,GAAAO,IAAA,WAAAC,QAAA;UAAA,kBAAAA,QAAA,CAAAC,IAAA,GAAAD,QAAA,CAAAE,IAAA;YAAA;cAAQN,KAAK,GAAAD,IAAA,CAALC,KAAK,EAAEC,gBAAgB,GAAAF,IAAA,CAAhBE,gBAAgB;cACnDC,UAAU,GAAGZ,SAAS,CAACX,IAAI,KAAK,SAAS,GAAGW,SAAS,CAACiB,YAAY,GAAGC,SAAS;cAAAJ,QAAA,CAAAE,IAAA;cAAA,OAC9EN,KAAK,cACPxB,IAAA;gBAAKiC,KAAK,EAAA7B,aAAA,CAAAA,aAAA,KAAMP,mBAAmB,GAAK6B,UAAU,CAAE;gBAAAnB,QAAA,EAAEN,cAAc,CAACa,SAAS;cAAC,CAAM,CACzF,CAAC;YAAA;cAAAc,QAAA,CAAAE,IAAA;cAAA,OACKL,gBAAgB,CAAC,CAAC;YAAA;YAAA;cAAA,OAAAG,QAAA,CAAAM,IAAA;UAAA;QAAA,GAAAZ,OAAA;MAAA,CAC3B;MAAA,iBAAAa,EAAA;QAAA,OAAAjB,KAAA,CAAAkB,KAAA,OAAAC,SAAA;MAAA;IAAA,IAAC;EACN,CAAC;EARD,KAAA3B,SAAA,CAAA4B,CAAA,MAAA1B,KAAA,GAAAF,SAAA,CAAA6B,CAAA,IAAAC,IAAA;IAAA3B,KAAA;EAAA;AAQC,SAAA4B,GAAA;EAAA/B,SAAA,CAAAgC,CAAA,CAAAD,GAAA;AAAA;EAAA/B,SAAA,CAAAiC,CAAA;AAAA","ignoreList":[]}

package/build/esm/components/Text/textStorySetup.d.ts

@@ -0,0 +1,43 @@
+import type { CSSProperties } from 'react';
+import type { TextProps } from './Text';
+/** Default Storybook args; shared with Playwright visual tests. */
+export declare const textStoryDefaultArgs: Pick<TextProps, 'children' | 'color' | 'bold' | 'noWrap' | 'ellipsis' | 'disabled' | 'capitalize'>;
+export declare const textStoryFrameStyle: CSSProperties;
+export type TextVisualCase = {
+    kind: 'yt-text';
+    id: string;
+    props: TextProps;
+    wrapperStyle?: CSSProperties;
+} | {
+    kind: 'Secondary';
+    id: string;
+    children: string;
+    disabled?: boolean;
+} | {
+    kind: 'Bold';
+    id: string;
+    children: string;
+} | {
+    kind: 'SecondaryBold';
+    id: string;
+    children: string;
+} | {
+    kind: 'Warning';
+    id: string;
+    children: string;
+} | {
+    kind: 'WarningLight';
+    id: string;
+    children: string;
+} | {
+    kind: 'NoWrap';
+    id: string;
+    children: string;
+} | {
+    kind: 'Escaped';
+    id: string;
+    text: string;
+};
+/** Stable order for visual regression (light + dark each). */
+export declare const textVisualStoryCases: TextVisualCase[];
+//# sourceMappingURL=textStorySetup.d.ts.map

package/build/esm/components/Text/textStorySetup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textStorySetup.d.ts","sourceRoot":"","sources":["../../../../src/components/Text/textStorySetup.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,OAAO,CAAC;AAEzC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,QAAQ,CAAC;AAEtC,mEAAmE;AACnE,eAAO,MAAM,oBAAoB,EAAE,IAAI,CACnC,SAAS,EACT,UAAU,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,GAAG,UAAU,GAAG,YAAY,CASpF,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,aAKjC,CAAC;AAEF,MAAM,MAAM,cAAc,GACpB;IAAC,IAAI,EAAE,SAAS,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,SAAS,CAAC;IAAC,YAAY,CAAC,EAAE,aAAa,CAAA;CAAC,GAC7E;IAAC,IAAI,EAAE,WAAW,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAC,GACrE;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAC,GAC5C;IAAC,IAAI,EAAE,eAAe,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAC,GACrD;IAAC,IAAI,EAAE,SAAS,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAC,GAC/C;IAAC,IAAI,EAAE,cAAc,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAC,GACpD;IAAC,IAAI,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAC,GAC9C;IAAC,IAAI,EAAE,SAAS,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAC,CAAC;AAElD,8DAA8D;AAC9D,eAAO,MAAM,oBAAoB,EAAE,cAAc,EAmDhD,CAAC"}

package/build/esm/components/Text/textStorySetup.js

@@ -0,0 +1,149 @@
+/** Default Storybook args; shared with Playwright visual tests. */
+export var textStoryDefaultArgs = {
+  children: 'YTsaurus UI text',
+  color: undefined,
+  bold: false,
+  noWrap: false,
+  ellipsis: false,
+  disabled: false,
+  capitalize: false
+};
+export var textStoryFrameStyle = {
+  minWidth: 280,
+  padding: 12,
+  border: '1px dashed var(--g-color-line-generic, #ddd)',
+  borderRadius: 8
+};
+/** Stable order for visual regression (light + dark each). */
+export var textVisualStoryCases = [{
+  kind: 'yt-text',
+  id: 'default',
+  props: {
+    children: 'YTsaurus UI text'
+  }
+}, {
+  kind: 'yt-text',
+  id: 'color-secondary',
+  props: {
+    children: 'Secondary tone',
+    color: 'secondary'
+  }
+}, {
+  kind: 'yt-text',
+  id: 'color-success',
+  props: {
+    children: 'Success',
+    color: 'success'
+  }
+}, {
+  kind: 'yt-text',
+  id: 'color-info',
+  props: {
+    children: 'Info',
+    color: 'info'
+  }
+}, {
+  kind: 'yt-text',
+  id: 'color-warning',
+  props: {
+    children: 'Warning',
+    color: 'warning'
+  }
+}, {
+  kind: 'yt-text',
+  id: 'color-warning-light',
+  props: {
+    children: 'Warning light',
+    color: 'warning-light'
+  }
+}, {
+  kind: 'yt-text',
+  id: 'color-danger',
+  props: {
+    children: 'Danger',
+    color: 'danger'
+  }
+}, {
+  kind: 'yt-text',
+  id: 'bold',
+  props: {
+    children: 'Bold text',
+    bold: true
+  }
+}, {
+  kind: 'yt-text',
+  id: 'disabled',
+  props: {
+    children: 'Disabled',
+    disabled: true
+  }
+}, {
+  kind: 'yt-text',
+  id: 'secondary-disabled',
+  props: {
+    children: 'Secondary disabled',
+    color: 'secondary',
+    disabled: true
+  }
+}, {
+  kind: 'yt-text',
+  id: 'capitalize',
+  props: {
+    children: 'capitalized words',
+    capitalize: true
+  }
+}, {
+  kind: 'yt-text',
+  id: 'ellipsis',
+  props: {
+    children: 'Very long text that should be truncated with ellipsis in a narrow box',
+    ellipsis: true
+  },
+  wrapperStyle: {
+    maxWidth: 140
+  }
+}, {
+  kind: 'yt-text',
+  id: 'no-wrap',
+  props: {
+    children: 'Single line: noWrap keeps this on one line',
+    noWrap: true
+  },
+  wrapperStyle: {
+    maxWidth: 200
+  }
+}, {
+  kind: 'Secondary',
+  id: 'Secondary',
+  children: 'Secondary component'
+}, {
+  kind: 'Secondary',
+  id: 'Secondary-disabled',
+  children: 'Secondary disabled',
+  disabled: true
+}, {
+  kind: 'Bold',
+  id: 'Bold',
+  children: 'Bold component'
+}, {
+  kind: 'SecondaryBold',
+  id: 'SecondaryBold',
+  children: 'Secondary bold'
+}, {
+  kind: 'Warning',
+  id: 'Warning',
+  children: 'Warning component'
+}, {
+  kind: 'WarningLight',
+  id: 'WarningLight',
+  children: 'Warning light component'
+}, {
+  kind: 'NoWrap',
+  id: 'NoWrap',
+  children: 'NoWrap component: long line should not wrap'
+}, {
+  kind: 'Escaped',
+  id: 'Escaped',
+  text: '{"message":"hello\\nworld","quotes":"\\"nested\\""}'
+}];
+// #sourceMappingURL=textStorySetup.js.map