@progress/kendo-angular-mcp 1.5.3-beta.a42c596b.0 → 1.5.3-beta.cd97a7ec.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/index.js +261 -225
  2. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -1464,214 +1464,245 @@ var getSharedValidationSteps = (uiLibrary, designSystem) => ({
1464
1464
  });
1465
1465
 
1466
1466
  // packages/kendo-ui-agent/src/lib/templates/tailwind-bridge.ts
1467
- var tailwindBridgeExample = `
1468
- @import "tailwindcss/theme.css";
1469
- @import "tailwindcss/preflight.css";
1470
- @import "tailwindcss/utilities.css";
1471
-
1472
- :root {
1473
- /* The generated Kendo Theme CSS variables */
1474
- }
1475
-
1476
-
1477
- @theme inline { /* The Tailwind bridge mapping */
1478
- /* Misc */
1479
- --color-app-surface: var( --kendo-color-app-surface );
1480
- --color-on-app-surface: var( --kendo-color-on-app-surface );
1481
- --color-subtle: var( --kendo-color-subtle );
1482
- --color-surface: var( --kendo-color-surface );
1483
- --color-surface-alt: var( --kendo-color-surface-alt );
1484
- --color-border: var( --kendo-color-border );
1485
- --color-border-alt: var( --kendo-color-border-alt );
1486
- /* Base */
1487
- --color-base-subtle: var( --kendo-color-base-subtle );
1488
- --color-base-subtle-hover: var( --kendo-color-base-subtle-hover );
1489
- --color-base-subtle-active: var( --kendo-color-base-subtle-active );
1490
- --color-base: var( --kendo-color-base );
1491
- --color-base-hover: var( --kendo-color-base-hover );
1492
- --color-base-active: var( --kendo-color-base-active );
1493
- --color-base-emphasis: var( --kendo-color-base-emphasis );
1494
- --color-base-on-subtle: var( --kendo-color-base-on-subtle );
1495
- --color-on-base: var( --kendo-color-on-base );
1496
- --color-base-on-surface: var( --kendo-color-base-on-surface );
1497
- /* Primary */
1498
- --color-primary-subtle: var( --kendo-color-primary-subtle );
1499
- --color-primary-subtle-hover: var( --kendo-color-primary-subtle-hover );
1500
- --color-primary-subtle-active: var( --kendo-color-primary-subtle-active );
1501
- --color-primary: var( --kendo-color-primary );
1502
- --color-primary-hover: var( --kendo-color-primary-hover );
1503
- --color-primary-active: var( --kendo-color-primary-active );
1504
- --color-primary-emphasis: var( --kendo-color-primary-emphasis );
1505
- --color-primary-on-subtle: var( --kendo-color-primary-on-subtle );
1506
- --color-on-primary: var( --kendo-color-on-primary );
1507
- --color-primary-on-surface: var( --kendo-color-primary-on-surface );
1508
- /* Secondary */
1509
- --color-secondary-subtle: var( --kendo-color-secondary-subtle );
1510
- --color-secondary-subtle-hover: var( --kendo-color-secondary-subtle-hover );
1511
- --color-secondary-subtle-active: var( --kendo-color-secondary-subtle-active );
1512
- --color-secondary: var( --kendo-color-secondary );
1513
- --color-secondary-hover: var( --kendo-color-secondary-hover );
1514
- --color-secondary-active: var( --kendo-color-secondary-active );
1515
- --color-secondary-emphasis: var( --kendo-color-secondary-emphasis );
1516
- --color-secondary-on-subtle: var( --kendo-color-secondary-on-subtle );
1517
- --color-on-secondary: var( --kendo-color-on-secondary );
1518
- --color-secondary-on-surface: var( --kendo-color-secondary-on-surface );
1519
- /* Tertiary */
1520
- --color-tertiary-subtle: var( --kendo-color-tertiary-subtle );
1521
- --color-tertiary-subtle-hover: var( --kendo-color-tertiary-subtle-hover );
1522
- --color-tertiary-subtle-active: var( --kendo-color-tertiary-subtle-active );
1523
- --color-tertiary: var( --kendo-color-tertiary );
1524
- --color-tertiary-hover: var( --kendo-color-tertiary-hover );
1525
- --color-tertiary-active: var( --kendo-color-tertiary-active );
1526
- --color-tertiary-emphasis: var( --kendo-color-tertiary-emphasis );
1527
- --color-tertiary-on-subtle: var( --kendo-color-tertiary-on-subtle );
1528
- --color-on-tertiary: var( --kendo-color-on-tertiary );
1529
- --color-tertiary-on-surface: var( --kendo-color-tertiary-on-surface );
1530
- /* Info */
1531
- --color-info-subtle: var( --kendo-color-info-subtle );
1532
- --color-info-subtle-hover: var( --kendo-color-info-subtle-hover );
1533
- --color-info-subtle-active: var( --kendo-color-info-subtle-active );
1534
- --color-info: var( --kendo-color-info );
1535
- --color-info-hover: var( --kendo-color-info-hover );
1536
- --color-info-active: var( --kendo-color-info-active );
1537
- --color-info-emphasis: var( --kendo-color-info-emphasis );
1538
- --color-info-on-subtle: var( --kendo-color-info-on-subtle );
1539
- --color-on-info: var( --kendo-color-on-info );
1540
- --color-info-on-surface: var( --kendo-color-info-on-surface );
1541
- /* Success */
1542
- --color-success-subtle: var( --kendo-color-success-subtle );
1543
- --color-success-subtle-hover: var( --kendo-color-success-subtle-hover );
1544
- --color-success-subtle-active: var( --kendo-color-success-subtle-active );
1545
- --color-success: var( --kendo-color-success );
1546
- --color-success-hover: var( --kendo-color-success-hover );
1547
- --color-success-active: var( --kendo-color-success-active );
1548
- --color-success-emphasis: var( --kendo-color-success-emphasis );
1549
- --color-success-on-subtle: var( --kendo-color-success-on-subtle );
1550
- --color-on-success: var( --kendo-color-on-success );
1551
- --color-success-on-surface: var( --kendo-color-success-on-surface );
1552
- /* Warning */
1553
- --color-warning-subtle: var( --kendo-color-warning-subtle );
1554
- --color-warning-subtle-hover: var( --kendo-color-warning-subtle-hover );
1555
- --color-warning-subtle-active: var( --kendo-color-warning-subtle-active );
1556
- --color-warning: var( --kendo-color-warning );
1557
- --color-warning-hover: var( --kendo-color-warning-hover );
1558
- --color-warning-active: var( --kendo-color-warning-active );
1559
- --color-warning-emphasis: var( --kendo-color-warning-emphasis );
1560
- --color-warning-on-subtle: var( --kendo-color-warning-on-subtle );
1561
- --color-on-warning: var( --kendo-color-on-warning );
1562
- --color-warning-on-surface: var( --kendo-color-warning-on-surface );
1563
- /* Error */
1564
- --color-error-subtle: var( --kendo-color-error-subtle );
1565
- --color-error-subtle-hover: var( --kendo-color-error-subtle-hover );
1566
- --color-error-subtle-active: var( --kendo-color-error-subtle-active );
1567
- --color-error: var( --kendo-color-error );
1568
- --color-error-hover: var( --kendo-color-error-hover );
1569
- --color-error-active: var( --kendo-color-error-active );
1570
- --color-error-emphasis: var( --kendo-color-error-emphasis );
1571
- --color-error-on-subtle: var( --kendo-color-error-on-subtle );
1572
- --color-on-error: var( --kendo-color-on-error );
1573
- --color-error-on-surface: var( --kendo-color-error-on-surface );
1574
- /* Light */
1575
- --color-light-subtle: var( --kendo-color-light-subtle );
1576
- --color-light-subtle-hover: var( --kendo-color-light-subtle-hover );
1577
- --color-light-subtle-active: var( --kendo-color-light-subtle-active );
1578
- --color-light: var( --kendo-color-light );
1579
- --color-light-hover: var( --kendo-color-light-hover );
1580
- --color-light-active: var( --kendo-color-light-active );
1581
- --color-light-emphasis: var( --kendo-color-light-emphasis );
1582
- --color-light-on-subtle: var( --kendo-color-light-on-subtle );
1583
- --color-on-light: var( --kendo-color-on-light );
1584
- --color-light-on-surface: var( --kendo-color-light-on-surface );
1585
- /* Dark */
1586
- --color-dark-subtle: var( --kendo-color-dark-subtle );
1587
- --color-dark-subtle-hover: var( --kendo-color-dark-subtle-hover );
1588
- --color-dark-subtle-active: var( --kendo-color-dark-subtle-active );
1589
- --color-dark: var( --kendo-color-dark );
1590
- --color-dark-hover: var( --kendo-color-dark-hover );
1591
- --color-dark-active: var( --kendo-color-dark-active );
1592
- --color-dark-emphasis: var( --kendo-color-dark-emphasis );
1593
- --color-dark-on-subtle: var( --kendo-color-dark-on-subtle );
1594
- --color-on-dark: var( --kendo-color-on-dark );
1595
- --color-dark-on-surface: var( --kendo-color-dark-on-surface );
1596
- /* Inverse */
1597
- --color-inverse-subtle: var( --kendo-color-inverse-subtle );
1598
- --color-inverse-subtle-hover: var( --kendo-color-inverse-subtle-hover );
1599
- --color-inverse-subtle-active: var( --kendo-color-inverse-subtle-active );
1600
- --color-inverse: var( --kendo-color-inverse );
1601
- --color-inverse-hover: var( --kendo-color-inverse-hover );
1602
- --color-inverse-active: var( --kendo-color-inverse-active );
1603
- --color-inverse-emphasis: var( --kendo-color-inverse-emphasis );
1604
- --color-inverse-on-subtle: var( --kendo-color-inverse-on-subtle );
1605
- --color-on-inverse: var( --kendo-color-on-inverse );
1606
- --color-inverse-on-surface: var( --kendo-color-inverse-on-surface );
1607
- /* Series A */
1608
- --color-series-a: var( --kendo-color-series-a );
1609
- --color-series-a-bold: var( --kendo-color-series-a-bold );
1610
- --color-series-a-bolder: var( --kendo-color-series-a-bolder );
1611
- --color-series-a-subtle: var( --kendo-color-series-a-subtle );
1612
- --color-series-a-subtler: var( --kendo-color-series-a-subtler );
1613
- /* Series B */
1614
- --color-series-b: var( --kendo-color-series-b );
1615
- --color-series-b-bold: var( --kendo-color-series-b-bold );
1616
- --color-series-b-bolder: var( --kendo-color-series-b-bolder );
1617
- --color-series-b-subtle: var( --kendo-color-series-b-subtle );
1618
- --color-series-b-subtler: var( --kendo-color-series-b-subtler );
1619
- /* Series C */
1620
- --color-series-c: var( --kendo-color-series-c );
1621
- --color-series-c-bold: var( --kendo-color-series-c-bold );
1622
- --color-series-c-bolder: var( --kendo-color-series-c-bolder );
1623
- --color-series-c-subtle: var( --kendo-color-series-c-subtle );
1624
- --color-series-c-subtler: var( --kendo-color-series-c-subtler );
1625
- /* Series D */
1626
- --color-series-d: var( --kendo-color-series-d );
1627
- --color-series-d-bold: var( --kendo-color-series-d-bold );
1628
- --color-series-d-bolder: var( --kendo-color-series-d-bolder );
1629
- --color-series-d-subtle: var( --kendo-color-series-d-subtle );
1630
- --color-series-d-subtler: var( --kendo-color-series-d-subtler );
1631
- /* Series E */
1632
- --color-series-e: var( --kendo-color-series-e );
1633
- --color-series-e-bold: var( --kendo-color-series-e-bold );
1634
- --color-series-e-bolder: var( --kendo-color-series-e-bolder );
1635
- --color-series-e-subtle: var( --kendo-color-series-e-subtle );
1636
- --color-series-e-subtler: var( --kendo-color-series-e-subtler );
1637
- /* Series F */
1638
- --color-series-f: var( --kendo-color-series-f );
1639
- --color-series-f-bold: var( --kendo-color-series-f-bold );
1640
- --color-series-f-bolder: var( --kendo-color-series-f-bolder );
1641
- --color-series-f-subtle: var( --kendo-color-series-f-subtle );
1642
- --color-series-f-subtler: var( --kendo-color-series-f-subtler );
1643
-
1644
- /* Typography */
1645
- --font-sans: var( --kendo-font-family-sans );
1646
- --font-serif: var( --kendo-font-family-sans-serif );
1647
- --font-mono: var( --kendo-font-family-monospace );
1648
- --text-xs: var( --kendo-font-size-xs );
1649
- --text-xs--line-height: var( --kendo-line-height-xs );
1650
- --text-sm: var( --kendo-font-size-sm );
1651
- --text-sm--line-height: var( --kendo-line-height-sm );
1652
- --text-base: var( --kendo-font-size );
1653
- --text-base--line-height: var( --kendo-line-height );
1654
- --text-lg: var( --kendo-font-size-lg );
1655
- --text-lg--line-height: var( --kendo-line-height-lg );
1656
-
1657
- --radius-none: var( --kendo-border-radius-none );
1658
- --radius-xs: var( --kendo-border-radius-xs );
1659
- --radius-sm: var( --kendo-border-radius-sm );
1660
- --radius-md: var( --kendo-border-radius-md );
1661
- --radius-lg: var( --kendo-border-radius-lg );
1662
- --radius-xl: var( --kendo-border-radius-xl );
1663
- --radius-2xl: var( --kendo-border-radius-xxl );
1664
- --radius-3xl: var( --kendo-border-radius-xxxl );
1665
- --radius-4xl: 1.5rem;
1666
- --radius-full: var( --kendo-border-radius-full );
1667
-
1668
- /* Breakpoints */
1669
- --breakpoint-sm: 576px;
1670
- --breakpoint-md: 768px;
1671
- --breakpoint-lg: 992px;
1672
- --breakpoint-xl: 1200px;
1673
- --breakpoint-2xl: 1400px;
1674
- }`;
1467
+ var kendoTokenList = `--kendo-color-app-surface
1468
+ --kendo-color-on-app-surface
1469
+ --kendo-color-subtle
1470
+ --kendo-color-surface
1471
+ --kendo-color-surface-alt
1472
+ --kendo-color-border
1473
+ --kendo-color-border-alt
1474
+ /* Base */
1475
+ --kendo-color-base-subtle
1476
+ --kendo-color-base-subtle-hover
1477
+ --kendo-color-base-subtle-active
1478
+ --kendo-color-base
1479
+ --kendo-color-base-hover
1480
+ --kendo-color-base-active
1481
+ --kendo-color-base-emphasis
1482
+ --kendo-color-base-on-subtle
1483
+ --kendo-color-on-base
1484
+ --kendo-color-base-on-surface
1485
+ /* Primary */
1486
+ --kendo-color-primary-subtle
1487
+ --kendo-color-primary-subtle-hover
1488
+ --kendo-color-primary-subtle-active
1489
+ --kendo-color-primary
1490
+ --kendo-color-primary-hover
1491
+ --kendo-color-primary-active
1492
+ --kendo-color-primary-emphasis
1493
+ --kendo-color-primary-on-subtle
1494
+ --kendo-color-on-primary
1495
+ --kendo-color-primary-on-surface
1496
+ /* Secondary */
1497
+ --kendo-color-secondary-subtle
1498
+ --kendo-color-secondary-subtle-hover
1499
+ --kendo-color-secondary-subtle-active
1500
+ --kendo-color-secondary
1501
+ --kendo-color-secondary-hover
1502
+ --kendo-color-secondary-active
1503
+ --kendo-color-secondary-emphasis
1504
+ --kendo-color-secondary-on-subtle
1505
+ --kendo-color-on-secondary
1506
+ --kendo-color-secondary-on-surface
1507
+ /* Tertiary */
1508
+ --kendo-color-tertiary-subtle
1509
+ --kendo-color-tertiary-subtle-hover
1510
+ --kendo-color-tertiary-subtle-active
1511
+ --kendo-color-tertiary
1512
+ --kendo-color-tertiary-hover
1513
+ --kendo-color-tertiary-active
1514
+ --kendo-color-tertiary-emphasis
1515
+ --kendo-color-tertiary-on-subtle
1516
+ --kendo-color-on-tertiary
1517
+ --kendo-color-tertiary-on-surface
1518
+ /* Info */
1519
+ --kendo-color-info-subtle
1520
+ --kendo-color-info-subtle-hover
1521
+ --kendo-color-info-subtle-active
1522
+ --kendo-color-info
1523
+ --kendo-color-info-hover
1524
+ --kendo-color-info-active
1525
+ --kendo-color-info-emphasis
1526
+ --kendo-color-info-on-subtle
1527
+ --kendo-color-on-info
1528
+ --kendo-color-info-on-surface
1529
+ /* Success */
1530
+ --kendo-color-success-subtle
1531
+ --kendo-color-success-subtle-hover
1532
+ --kendo-color-success-subtle-active
1533
+ --kendo-color-success
1534
+ --kendo-color-success-hover
1535
+ --kendo-color-success-active
1536
+ --kendo-color-success-emphasis
1537
+ --kendo-color-success-on-subtle
1538
+ --kendo-color-on-success
1539
+ --kendo-color-success-on-surface
1540
+ /* Warning */
1541
+ --kendo-color-warning-subtle
1542
+ --kendo-color-warning-subtle-hover
1543
+ --kendo-color-warning-subtle-active
1544
+ --kendo-color-warning
1545
+ --kendo-color-warning-hover
1546
+ --kendo-color-warning-active
1547
+ --kendo-color-warning-emphasis
1548
+ --kendo-color-warning-on-subtle
1549
+ --kendo-color-on-warning
1550
+ --kendo-color-warning-on-surface
1551
+ /* Error */
1552
+ --kendo-color-error-subtle
1553
+ --kendo-color-error-subtle-hover
1554
+ --kendo-color-error-subtle-active
1555
+ --kendo-color-error
1556
+ --kendo-color-error-hover
1557
+ --kendo-color-error-active
1558
+ --kendo-color-error-emphasis
1559
+ --kendo-color-error-on-subtle
1560
+ --kendo-color-on-error
1561
+ --kendo-color-error-on-surface
1562
+ /* Light */
1563
+ --kendo-color-light-subtle
1564
+ --kendo-color-light-subtle-hover
1565
+ --kendo-color-light-subtle-active
1566
+ --kendo-color-light
1567
+ --kendo-color-light-hover
1568
+ --kendo-color-light-active
1569
+ --kendo-color-light-emphasis
1570
+ --kendo-color-light-on-subtle
1571
+ --kendo-color-on-light
1572
+ --kendo-color-light-on-surface
1573
+ /* Dark */
1574
+ --kendo-color-dark-subtle
1575
+ --kendo-color-dark-subtle-hover
1576
+ --kendo-color-dark-subtle-active
1577
+ --kendo-color-dark
1578
+ --kendo-color-dark-hover
1579
+ --kendo-color-dark-active
1580
+ --kendo-color-dark-emphasis
1581
+ --kendo-color-dark-on-subtle
1582
+ --kendo-color-on-dark
1583
+ --kendo-color-dark-on-surface
1584
+ /* Inverse */
1585
+ --kendo-color-inverse-subtle
1586
+ --kendo-color-inverse-subtle-hover
1587
+ --kendo-color-inverse-subtle-active
1588
+ --kendo-color-inverse
1589
+ --kendo-color-inverse-hover
1590
+ --kendo-color-inverse-active
1591
+ --kendo-color-inverse-emphasis
1592
+ --kendo-color-inverse-on-subtle
1593
+ --kendo-color-on-inverse
1594
+ --kendo-color-inverse-on-surface
1595
+ /* Series A */
1596
+ --kendo-color-series-a
1597
+ --kendo-color-series-a-bold
1598
+ --kendo-color-series-a-bolder
1599
+ --kendo-color-series-a-subtle
1600
+ --kendo-color-series-a-subtler
1601
+ /* Series B */
1602
+ --kendo-color-series-b
1603
+ --kendo-color-series-b-bold
1604
+ --kendo-color-series-b-bolder
1605
+ --kendo-color-series-b-subtle
1606
+ --kendo-color-series-b-subtler
1607
+ /* Series C */
1608
+ --kendo-color-series-c
1609
+ --kendo-color-series-c-bold
1610
+ --kendo-color-series-c-bolder
1611
+ --kendo-color-series-c-subtle
1612
+ --kendo-color-series-c-subtler
1613
+ /* Series D */
1614
+ --kendo-color-series-d
1615
+ --kendo-color-series-d-bold
1616
+ --kendo-color-series-d-bolder
1617
+ --kendo-color-series-d-subtle
1618
+ --kendo-color-series-d-subtler
1619
+ /* Series E */
1620
+ --kendo-color-series-e
1621
+ --kendo-color-series-e-bold
1622
+ --kendo-color-series-e-bolder
1623
+ --kendo-color-series-e-subtle
1624
+ --kendo-color-series-e-subtler
1625
+ /* Series F */
1626
+ --kendo-color-series-f
1627
+ --kendo-color-series-f-bold
1628
+ --kendo-color-series-f-bolder
1629
+ --kendo-color-series-f-subtle
1630
+ --kendo-color-series-f-subtler
1631
+ /* Typography */
1632
+ --kendo-font-family-sans
1633
+ --kendo-font-family-sans-serif
1634
+ --kendo-font-family-monospace
1635
+ --kendo-font-size-xs
1636
+ --kendo-line-height-xs
1637
+ --kendo-font-size-sm
1638
+ --kendo-line-height-sm
1639
+ --kendo-font-size
1640
+ --kendo-line-height
1641
+ --kendo-font-size-lg
1642
+ --kendo-line-height-lg
1643
+ /* Border Radius */
1644
+ --kendo-border-radius-none
1645
+ --kendo-border-radius-xs
1646
+ --kendo-border-radius-sm
1647
+ --kendo-border-radius-md
1648
+ --kendo-border-radius-lg
1649
+ --kendo-border-radius-xl
1650
+ --kendo-border-radius-xxl
1651
+ --kendo-border-radius-xxxl
1652
+ --radius-4xl: 1.5rem
1653
+ --kendo-border-radius-full`;
1654
+ var tailwindV3SetupPrompt = `I need you to set up a system where Tailwind CSS is the single source of truth for all design tokens, and those tokens are automatically reflected as CSS custom properties so I can use them in regular CSS too.
1655
+ Requirements:
1656
+
1657
+ All design tokens (colors, spacing, font families, border radius, shadows) are defined once in tailwind.config.js
1658
+ A Tailwind plugin emits every token as a --token-name CSS custom property on :root
1659
+ Colors support Tailwind's opacity modifier syntax (bg-primary/50) using the rgb(var(--color-x-rgb) / <alpha-value>) pattern
1660
+ Dark mode tokens are emitted under .dark so that both dark: utility variants and var(--color-x) in custom CSS update together
1661
+ var(--color-primary) in hand-written CSS and bg-primary in HTML resolve to the same value
1662
+
1663
+ Use the Kendo theme tokens listed above as the design tokens.
1664
+
1665
+ Output I need:
1666
+
1667
+ The full tailwind.config.js with the plugin included
1668
+ The base CSS file importing Tailwind
1669
+ A short example showing a component using both bg-primary and var(--color-primary) side by side`;
1670
+ var tailwindV4SetupPrompt = `I need you to set up a system where Tailwind CSS v4 is the single source of truth for all design tokens, and those tokens are automatically available as CSS custom properties so I can use them in regular CSS too.
1671
+ Requirements:
1672
+
1673
+ All design tokens (colors, spacing, font families, border radius, shadows) are defined once in the @theme block \u2014 no tailwind.config.js
1674
+ Every @theme variable is natively available as a var(--token-name) CSS custom property with no plugin needed
1675
+ Colors use oklch and support opacity modifier syntax (bg-primary/50) natively
1676
+ Dark mode tokens are re-declared under .dark so that both dark: utility variants and var(--color-x) in custom CSS update together
1677
+ var(--color-primary) in hand-written CSS and bg-primary in HTML resolve to the same value
1678
+
1679
+ Use the Kendo theme tokens listed above as the design tokens.
1680
+
1681
+ Output I need:
1682
+
1683
+ The single CSS file with @import "tailwindcss", the @theme block, and the .dark overrides
1684
+ A short example showing a component using both bg-primary and var(--color-primary) side by side`;
1685
+ var tailwindBridgeExample = `## Tailwind CSS Setup Instructions
1686
+
1687
+ Detect which version of Tailwind CSS the project uses, then follow the appropriate setup guide below.
1688
+
1689
+ ### Kendo Theme Tokens
1690
+ These are the design tokens to map into Tailwind:
1691
+ ${kendoTokenList}
1692
+
1693
+ ### For Tailwind CSS v3 (uses tailwind.config.js)
1694
+
1695
+ <tailwind_v3_setup>
1696
+ ${tailwindV3SetupPrompt}
1697
+ </tailwind_v3_setup>
1698
+
1699
+ ### For Tailwind CSS v4 (uses @theme block, no config file)
1700
+
1701
+ <tailwind_v4_setup>
1702
+ ${tailwindV4SetupPrompt}
1703
+ </tailwind_v4_setup>
1704
+
1705
+ IMPORTANT: Detect which version of Tailwind CSS the project uses, then follow the matching setup guide.`;
1675
1706
 
1676
1707
  // packages/kendo-ui-agent/src/lib/tools-factory.ts
1677
1708
  function formatApiRefItemFromJson(rawValue, component) {
@@ -2056,6 +2087,22 @@ function createStyleAssistantTool(config, contextApi2) {
2056
2087
  },
2057
2088
  async ({ prompt }, { _meta }) => {
2058
2089
  log("Style Assistant called with:", { prompt });
2090
+ if (LAYOUT_MODE === "tailwind") {
2091
+ return {
2092
+ content: [
2093
+ {
2094
+ type: "text",
2095
+ text: `Note: For layout and spacing, use Tailwind CSS utility classes to structure your layout and apply spacing between elements.
2096
+ IMPORTANT: You need to set up Tailwind CSS so it becomes the single source of truth for all design tokens. Detect which Tailwind version the project uses and follow the appropriate setup instructions below.
2097
+
2098
+ <tailwind_setup_instructions>
2099
+ ${tailwindBridgeExample}
2100
+ </tailwind_setup_instructions>
2101
+ `
2102
+ }
2103
+ ]
2104
+ };
2105
+ }
2059
2106
  let formattedCSS = "";
2060
2107
  try {
2061
2108
  const result = await contextApi2.queryThemeGenerate({ prompt }, { _meta });
@@ -2093,19 +2140,7 @@ ${formattedCSS}
2093
2140
  type: "text",
2094
2141
  text: response
2095
2142
  },
2096
- LAYOUT_MODE === "tailwind" ? {
2097
- type: "text",
2098
- text: `Note: For layout and spacing, use Tailwind CSS utility classes to structure your layout and apply spacing between elements.
2099
- IMPORTANT: In order to use the Kendo Theme CSS variables to work in a Tailwind CSS project, make sure to configure Tailwind to allow custom CSS properties and use the generated CSS variables in your Tailwind configuration for colors, spacing, etc. This way you can leverage the design tokens generated by the Style Assistant while using Tailwind for layout and utility classes. Follow the tailwind_bridge_example provided as insperation for how to bridge Kendo Theme CSS variables with Tailwind CSS.
2100
-
2101
- <taiwind_bridge_example>
2102
- ${tailwindBridgeExample}
2103
- </taiwind_bridge_example>
2104
- `
2105
- } : LAYOUT_MODE === "vanilla" ? {
2106
- type: "text",
2107
- text: "Note: For layout and spacing, use vanilla CSS with custom styles including flexbox, grid, media queries, and relative units. Do NOT use any CSS utility framework classes."
2108
- } : {
2143
+ {
2109
2144
  type: "text",
2110
2145
  text: "Note: For layout and spacing, use the Layout Assistant tool to get the appropriate Kendo CSS utility classes."
2111
2146
  }
@@ -3659,6 +3694,7 @@ function getAngularComponentInstructions(component) {
3659
3694
  }
3660
3695
  return void 0;
3661
3696
  }
3697
+ var STOP_STATIC_CONTEXT = !!process.env.KENDO_UIA_STOP_STATIC_CONTEXT;
3662
3698
  var LAYOUT_ASSISTANT_NAME = UIAgent.ToolNames.layoutAssistant(PRODUCT_LINE);
3663
3699
  var CODE_ASSISTANT_NAME3 = UIAgent.ToolNames.codeAssistant(PRODUCT_LINE);
3664
3700
  var STYLE_ASSISTANT_NAME = UIAgent.ToolNames.styleAssistant(PRODUCT_LINE);
@@ -3714,7 +3750,7 @@ function createAngularTools(contextApi2, accessType, mcpServer) {
3714
3750
  description: UIAgent.ToolDescriptions.layoutAssistant,
3715
3751
  suiteName: ANGULAR_SUITE_NAME,
3716
3752
  libKey: Suite,
3717
- getPreContent: getLayoutInstructions,
3753
+ getPreContent: STOP_STATIC_CONTEXT ? void 0 : getLayoutInstructions,
3718
3754
  requiredAccess: ["agent"]
3719
3755
  },
3720
3756
  contextApi2
@@ -3726,7 +3762,7 @@ function createAngularTools(contextApi2, accessType, mcpServer) {
3726
3762
  title: "Kendo UI Style Assistant",
3727
3763
  description: UIAgent.ToolDescriptions.styleAssistant,
3728
3764
  libKey: Suite,
3729
- getPreContent: getStyleInstructions,
3765
+ getPreContent: STOP_STATIC_CONTEXT ? void 0 : getStyleInstructions,
3730
3766
  requiredAccess: ["agent"]
3731
3767
  },
3732
3768
  contextApi2
@@ -3738,7 +3774,7 @@ function createAngularTools(contextApi2, accessType, mcpServer) {
3738
3774
  title: "Kendo UI Icon Assistant",
3739
3775
  description: UIAgent.ToolDescriptions.iconAssistant,
3740
3776
  libKey: Suite,
3741
- getPostContent: getIconsInstructions,
3777
+ getPostContent: STOP_STATIC_CONTEXT ? void 0 : getIconsInstructions,
3742
3778
  requiredAccess: ["assistant", "agent"]
3743
3779
  },
3744
3780
  contextApi2
@@ -3752,7 +3788,7 @@ function createAngularTools(contextApi2, accessType, mcpServer) {
3752
3788
  libKey: Suite,
3753
3789
  suiteName: ANGULAR_SUITE_NAME,
3754
3790
  components: AngularComponents,
3755
- getPostContent: ({ component }) => {
3791
+ getPostContent: STOP_STATIC_CONTEXT ? void 0 : ({ component }) => {
3756
3792
  const componentInstructions = getAngularComponentInstructions(component);
3757
3793
  return getComponentsCommonInstructions({ component, componentInstructions });
3758
3794
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-mcp",
3
- "version": "1.5.3-beta.a42c596b.0",
3
+ "version": "1.5.3-beta.cd97a7ec.0",
4
4
  "type": "module",
5
5
  "bin": "./dist/index.js",
6
6
  "license": "See LICENSE.md",