@liner-fe/prism 3.3.5 → 3.4.5
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.
- package/lib/index.css +195 -177
- package/lib/index.d.ts +82 -46
- package/lib/index.js +739 -917
- package/package.json +4 -4
package/lib/index.css
CHANGED
|
@@ -1578,21 +1578,27 @@
|
|
|
1578
1578
|
}
|
|
1579
1579
|
|
|
1580
1580
|
/* esbuild-sass-plugin:css-chunk:src/components/coach-mark/primitive/style.module.scss */
|
|
1581
|
-
.
|
|
1581
|
+
._anchor_1ynpr_2 {
|
|
1582
1582
|
transform: rotate(270deg) translateX(7px);
|
|
1583
1583
|
}
|
|
1584
|
-
.
|
|
1584
|
+
._content_1ynpr_6 {
|
|
1585
1585
|
border-radius: var(--lp-sys-radius-m);
|
|
1586
|
-
width: 100%;
|
|
1587
1586
|
box-shadow:
|
|
1588
1587
|
0px 2px 12px 0px rgba(0, 0, 0, 0.1),
|
|
1589
1588
|
0px 1px 8px 0px rgba(0, 0, 0, 0.06),
|
|
1590
1589
|
0px 0px 1px 0px rgba(0, 0, 0, 0.06);
|
|
1591
1590
|
}
|
|
1592
|
-
.
|
|
1591
|
+
._content_1ynpr_6 p {
|
|
1593
1592
|
margin: 0;
|
|
1594
1593
|
}
|
|
1595
|
-
.
|
|
1594
|
+
._content_1ynpr_6 {
|
|
1595
|
+
}
|
|
1596
|
+
._content_1ynpr_6[data-side] > span {
|
|
1597
|
+
visibility: visible !important;
|
|
1598
|
+
}
|
|
1599
|
+
._content_1ynpr_6 {
|
|
1600
|
+
}
|
|
1601
|
+
._overlay_1ynpr_24 {
|
|
1596
1602
|
position: fixed;
|
|
1597
1603
|
top: 0;
|
|
1598
1604
|
left: 0;
|
|
@@ -1601,21 +1607,85 @@
|
|
|
1601
1607
|
background: rgba(255, 255, 255, 0.7490196078);
|
|
1602
1608
|
z-index: 9;
|
|
1603
1609
|
}
|
|
1604
|
-
.
|
|
1610
|
+
._close_1ynpr_34 {
|
|
1605
1611
|
cursor: pointer;
|
|
1606
1612
|
}
|
|
1607
1613
|
|
|
1614
|
+
/* esbuild-sass-plugin:css-chunk:src/components/Badge/style.module.scss */
|
|
1615
|
+
._badge_f8fzb_1 {
|
|
1616
|
+
display: inline-flex;
|
|
1617
|
+
align-items: center;
|
|
1618
|
+
justify-content: center;
|
|
1619
|
+
white-space: nowrap;
|
|
1620
|
+
box-sizing: border-box;
|
|
1621
|
+
gap: var(--lp-sys-padding-component-50);
|
|
1622
|
+
}
|
|
1623
|
+
._s_f8fzb_10 {
|
|
1624
|
+
padding: var(--lp-sys-padding-component-50) var(--lp-sys-padding-component-100);
|
|
1625
|
+
border-radius: var(--lp-sys-radius-xs);
|
|
1626
|
+
}
|
|
1627
|
+
._m_f8fzb_15 {
|
|
1628
|
+
padding: var(--lp-sys-padding-component-50) var(--lp-sys-padding-component-100);
|
|
1629
|
+
border-radius: var(--lp-sys-radius-xs);
|
|
1630
|
+
}
|
|
1631
|
+
._l_f8fzb_20 {
|
|
1632
|
+
padding: var(--lp-sys-padding-component-100) var(--lp-sys-padding-component-150);
|
|
1633
|
+
border-radius: var(--lp-sys-radius-s);
|
|
1634
|
+
}
|
|
1635
|
+
._text_f8fzb_25 {
|
|
1636
|
+
padding: 0 var(--lp-sys-padding-component-50);
|
|
1637
|
+
}
|
|
1638
|
+
._subtle_f8fzb_29 {
|
|
1639
|
+
background: var(--neutral-fill-overlay-mid);
|
|
1640
|
+
}
|
|
1641
|
+
._outlined_f8fzb_33 {
|
|
1642
|
+
background: var(--neutral-fill-opaque-lowest);
|
|
1643
|
+
border: 1px solid var(--neutral-border-overlay-subtle);
|
|
1644
|
+
}
|
|
1645
|
+
._fill-primary_f8fzb_38 {
|
|
1646
|
+
background: var(--brand-fill-low);
|
|
1647
|
+
}
|
|
1648
|
+
._fill-accent_f8fzb_42 {
|
|
1649
|
+
background: var(--accent-fill-primary);
|
|
1650
|
+
}
|
|
1651
|
+
._inverse-primary_f8fzb_46 {
|
|
1652
|
+
background: var(--brandinverse-fill-static-low);
|
|
1653
|
+
}
|
|
1654
|
+
._text-neutral_f8fzb_50 {
|
|
1655
|
+
color: var(--neutral-label-primary);
|
|
1656
|
+
}
|
|
1657
|
+
._text-neutral-secondary_f8fzb_54 {
|
|
1658
|
+
color: var(--neutral-label-secondary);
|
|
1659
|
+
}
|
|
1660
|
+
._text-primary_f8fzb_58 {
|
|
1661
|
+
color: var(--brand-label-primary);
|
|
1662
|
+
}
|
|
1663
|
+
._text-primary-inverse_f8fzb_62 {
|
|
1664
|
+
color: var(--brandinverse-label-static-primary);
|
|
1665
|
+
}
|
|
1666
|
+
._text-caution_f8fzb_66 {
|
|
1667
|
+
color: var(--function-label-caution);
|
|
1668
|
+
}
|
|
1669
|
+
._text-error_f8fzb_70 {
|
|
1670
|
+
color: var(--function-label-negative);
|
|
1671
|
+
}
|
|
1672
|
+
._text-accent_f8fzb_74 {
|
|
1673
|
+
color: var(--accent-label-primary);
|
|
1674
|
+
}
|
|
1675
|
+
|
|
1608
1676
|
/* esbuild-sass-plugin:css-chunk:src/components/coach-mark/compact/style.module.scss */
|
|
1609
|
-
.
|
|
1610
|
-
position: relative;
|
|
1677
|
+
._content_6lbwz_2 {
|
|
1611
1678
|
display: flex;
|
|
1612
1679
|
align-items: center;
|
|
1613
|
-
gap: var(--lp-sys-gap-positive-100);
|
|
1614
1680
|
padding: var(--lp-sys-padding-component-200);
|
|
1615
1681
|
width: fit-content;
|
|
1616
|
-
|
|
1682
|
+
background: var(--inverse-container-static-high);
|
|
1683
|
+
animation: _slideIn_6lbwz_1 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
|
|
1684
|
+
}
|
|
1685
|
+
._content_6lbwz_2 svg > path {
|
|
1686
|
+
fill: var(--inverse-container-static-high);
|
|
1617
1687
|
}
|
|
1618
|
-
@keyframes
|
|
1688
|
+
@keyframes _slideIn_6lbwz_1 {
|
|
1619
1689
|
from {
|
|
1620
1690
|
transform: translateY(10px);
|
|
1621
1691
|
opacity: 0;
|
|
@@ -1625,35 +1695,131 @@
|
|
|
1625
1695
|
opacity: 1;
|
|
1626
1696
|
}
|
|
1627
1697
|
}
|
|
1628
|
-
.
|
|
1629
|
-
display:
|
|
1698
|
+
._clickable_6lbwz_24 {
|
|
1699
|
+
display: flex;
|
|
1700
|
+
align-items: center;
|
|
1701
|
+
gap: var(--lp-sys-gap-positive-200);
|
|
1702
|
+
cursor: pointer;
|
|
1703
|
+
border: none;
|
|
1704
|
+
background: transparent;
|
|
1705
|
+
padding: 0;
|
|
1706
|
+
text-align: left;
|
|
1707
|
+
color: inherit;
|
|
1708
|
+
font: inherit;
|
|
1630
1709
|
}
|
|
1631
|
-
.
|
|
1632
|
-
|
|
1710
|
+
._main_6lbwz_37 {
|
|
1711
|
+
margin: 0;
|
|
1633
1712
|
}
|
|
1634
|
-
.
|
|
1635
|
-
|
|
1713
|
+
._content_6lbwz_2[data-side=top][data-align=start] > span,
|
|
1714
|
+
._content_6lbwz_2[data-side=bottom][data-align=start] > span {
|
|
1715
|
+
left: 19px !important;
|
|
1716
|
+
right: auto !important;
|
|
1636
1717
|
}
|
|
1637
|
-
.
|
|
1718
|
+
._content_6lbwz_2[data-side=top][data-align=end] > span,
|
|
1719
|
+
._content_6lbwz_2[data-side=bottom][data-align=end] > span {
|
|
1720
|
+
left: auto !important;
|
|
1721
|
+
right: 19px !important;
|
|
1722
|
+
}
|
|
1723
|
+
|
|
1724
|
+
/* esbuild-sass-plugin:css-chunk:src/components/coach-mark/main/style.module.scss */
|
|
1725
|
+
._content_1cmnt_2 {
|
|
1726
|
+
display: flex;
|
|
1727
|
+
flex-direction: column;
|
|
1728
|
+
width: 280px;
|
|
1729
|
+
padding-top: var(--lp-sys-padding-component-300);
|
|
1730
|
+
padding-bottom: var(--lp-sys-padding-component-400);
|
|
1731
|
+
box-sizing: border-box;
|
|
1638
1732
|
background: var(--inverse-container-static-high);
|
|
1733
|
+
animation: _slideIn_1cmnt_1 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
|
|
1639
1734
|
}
|
|
1640
|
-
.
|
|
1735
|
+
._content_1cmnt_2 > span > svg > path {
|
|
1641
1736
|
fill: var(--inverse-container-static-high);
|
|
1642
1737
|
}
|
|
1643
|
-
|
|
1644
|
-
|
|
1738
|
+
@keyframes _slideIn_1cmnt_1 {
|
|
1739
|
+
from {
|
|
1740
|
+
transform: translateY(10px);
|
|
1741
|
+
opacity: 0;
|
|
1742
|
+
}
|
|
1743
|
+
to {
|
|
1744
|
+
transform: translateY(0px);
|
|
1745
|
+
opacity: 1;
|
|
1746
|
+
}
|
|
1747
|
+
}
|
|
1748
|
+
._top_1cmnt_26 {
|
|
1749
|
+
display: flex;
|
|
1750
|
+
flex-direction: column;
|
|
1751
|
+
gap: var(--lp-sys-gap-positive-200);
|
|
1752
|
+
padding-bottom: var(--lp-sys-padding-component-300);
|
|
1753
|
+
}
|
|
1754
|
+
._main_1cmnt_33 {
|
|
1755
|
+
width: 100%;
|
|
1756
|
+
display: flex;
|
|
1757
|
+
flex-direction: column;
|
|
1758
|
+
gap: var(--lp-sys-gap-positive-200);
|
|
1759
|
+
}
|
|
1760
|
+
._title_1cmnt_40 {
|
|
1761
|
+
display: flex;
|
|
1762
|
+
align-items: center;
|
|
1763
|
+
gap: var(--lp-sys-padding-component-200);
|
|
1764
|
+
padding-left: var(--lp-sys-padding-component-400);
|
|
1765
|
+
padding-right: var(--lp-sys-padding-component-700);
|
|
1766
|
+
padding-top: var(--lp-sys-padding-component-50);
|
|
1767
|
+
padding-bottom: var(--lp-sys-padding-component-50);
|
|
1768
|
+
}
|
|
1769
|
+
._title_1cmnt_40 > p {
|
|
1770
|
+
flex: 1;
|
|
1771
|
+
min-width: 0;
|
|
1772
|
+
white-space: nowrap;
|
|
1773
|
+
overflow: hidden;
|
|
1774
|
+
text-overflow: ellipsis;
|
|
1775
|
+
}
|
|
1776
|
+
._description_1cmnt_57 {
|
|
1777
|
+
white-space: pre-wrap;
|
|
1778
|
+
padding-left: var(--lp-sys-padding-component-400);
|
|
1779
|
+
padding-right: var(--lp-sys-padding-component-400);
|
|
1780
|
+
}
|
|
1781
|
+
._media_1cmnt_63 {
|
|
1782
|
+
width: 100%;
|
|
1783
|
+
max-width: 280px;
|
|
1784
|
+
margin: var(--lp-sys-padding-component-50) 0;
|
|
1785
|
+
}
|
|
1786
|
+
._footer_1cmnt_69 {
|
|
1787
|
+
display: flex;
|
|
1788
|
+
align-items: center;
|
|
1789
|
+
justify-content: space-between;
|
|
1790
|
+
padding-left: var(--lp-sys-padding-component-400);
|
|
1791
|
+
padding-right: var(--lp-sys-padding-component-400);
|
|
1645
1792
|
}
|
|
1646
|
-
.
|
|
1647
|
-
|
|
1793
|
+
._footer_1cmnt_69 ._buttonGroup_1cmnt_76 {
|
|
1794
|
+
display: flex;
|
|
1795
|
+
gap: var(--lp-sys-gap-positive-100);
|
|
1796
|
+
align-items: center;
|
|
1648
1797
|
}
|
|
1649
|
-
.
|
|
1798
|
+
._closeButton_1cmnt_82 {
|
|
1650
1799
|
position: absolute;
|
|
1651
|
-
top:
|
|
1652
|
-
right:
|
|
1653
|
-
|
|
1800
|
+
top: 8px;
|
|
1801
|
+
right: 8px;
|
|
1802
|
+
border-radius: 4px;
|
|
1654
1803
|
}
|
|
1655
|
-
.
|
|
1656
|
-
|
|
1804
|
+
._content_1cmnt_2[data-side=top][data-align=start] > span,
|
|
1805
|
+
._content_1cmnt_2[data-side=bottom][data-align=start] > span {
|
|
1806
|
+
left: 19px !important;
|
|
1807
|
+
right: auto !important;
|
|
1808
|
+
}
|
|
1809
|
+
._content_1cmnt_2[data-side=top][data-align=end] > span,
|
|
1810
|
+
._content_1cmnt_2[data-side=bottom][data-align=end] > span {
|
|
1811
|
+
left: auto !important;
|
|
1812
|
+
right: 19px !important;
|
|
1813
|
+
}
|
|
1814
|
+
._content_1cmnt_2[data-side=left][data-align=start] > span,
|
|
1815
|
+
._content_1cmnt_2[data-side=right][data-align=start] > span {
|
|
1816
|
+
top: 19px !important;
|
|
1817
|
+
bottom: auto !important;
|
|
1818
|
+
}
|
|
1819
|
+
._content_1cmnt_2[data-side=left][data-align=end] > span,
|
|
1820
|
+
._content_1cmnt_2[data-side=right][data-align=end] > span {
|
|
1821
|
+
top: auto !important;
|
|
1822
|
+
bottom: 19px !important;
|
|
1657
1823
|
}
|
|
1658
1824
|
|
|
1659
1825
|
/* esbuild-sass-plugin:css-chunk:src/components/Tag/style.module.scss */
|
|
@@ -1752,151 +1918,3 @@
|
|
|
1752
1918
|
._border-accent-pink_b57yu_124 {
|
|
1753
1919
|
border: 1px solid var(--accent-label-pink);
|
|
1754
1920
|
}
|
|
1755
|
-
|
|
1756
|
-
/* esbuild-sass-plugin:css-chunk:src/components/coach-mark/main/style.module.scss */
|
|
1757
|
-
._content_1w9jj_1 {
|
|
1758
|
-
display: flex;
|
|
1759
|
-
flex-direction: column;
|
|
1760
|
-
min-width: 230px;
|
|
1761
|
-
padding: var(--lp-sys-padding-component-400);
|
|
1762
|
-
box-sizing: border-box;
|
|
1763
|
-
animation: _slideIn_1w9jj_1 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
|
|
1764
|
-
}
|
|
1765
|
-
@keyframes _slideIn_1w9jj_1 {
|
|
1766
|
-
from {
|
|
1767
|
-
transform: translateY(10px);
|
|
1768
|
-
opacity: 0;
|
|
1769
|
-
}
|
|
1770
|
-
to {
|
|
1771
|
-
transform: translateY(0px);
|
|
1772
|
-
opacity: 1;
|
|
1773
|
-
}
|
|
1774
|
-
}
|
|
1775
|
-
._content_1w9jj_1._brand_1w9jj_19 {
|
|
1776
|
-
background: var(--inverse-container-static-high);
|
|
1777
|
-
}
|
|
1778
|
-
._content_1w9jj_1._brand_1w9jj_19 > span > svg > path {
|
|
1779
|
-
fill: var(--inverse-container-static-high);
|
|
1780
|
-
}
|
|
1781
|
-
._content_1w9jj_1._inverse-static_1w9jj_25 {
|
|
1782
|
-
background: var(--inverse-container-static-high);
|
|
1783
|
-
}
|
|
1784
|
-
._content_1w9jj_1._inverse-static_1w9jj_25 > span > svg > path {
|
|
1785
|
-
fill: var(--inverse-container-static-high);
|
|
1786
|
-
}
|
|
1787
|
-
._content_1w9jj_1._inverse_1w9jj_25 {
|
|
1788
|
-
background: var(--inverse-container-lowest);
|
|
1789
|
-
}
|
|
1790
|
-
._content_1w9jj_1._inverse_1w9jj_25 > span > svg > path {
|
|
1791
|
-
fill: var(--inverse-container-lowest);
|
|
1792
|
-
}
|
|
1793
|
-
._top_1w9jj_38 {
|
|
1794
|
-
display: flex;
|
|
1795
|
-
flex-direction: column;
|
|
1796
|
-
gap: var(--lp-sys-padding-component-400);
|
|
1797
|
-
}
|
|
1798
|
-
._main_1w9jj_44 {
|
|
1799
|
-
width: 100%;
|
|
1800
|
-
display: flex;
|
|
1801
|
-
flex-direction: column;
|
|
1802
|
-
gap: var(--lp-sys-gap-positive-100);
|
|
1803
|
-
}
|
|
1804
|
-
._title_1w9jj_51 {
|
|
1805
|
-
display: flex;
|
|
1806
|
-
align-items: center;
|
|
1807
|
-
gap: var(--lp-sys-gap-positive-150);
|
|
1808
|
-
}
|
|
1809
|
-
._description_1w9jj_57 {
|
|
1810
|
-
white-space: pre-wrap;
|
|
1811
|
-
}
|
|
1812
|
-
._footer_1w9jj_61 {
|
|
1813
|
-
display: flex;
|
|
1814
|
-
align-items: center;
|
|
1815
|
-
justify-content: space-between;
|
|
1816
|
-
padding-top: var(--lp-sys-gap-positive-150);
|
|
1817
|
-
}
|
|
1818
|
-
._footer_1w9jj_61 ._buttonGroup_1w9jj_67 {
|
|
1819
|
-
display: flex;
|
|
1820
|
-
gap: var(--lp-sys-gap-positive-400);
|
|
1821
|
-
height: 28px;
|
|
1822
|
-
}
|
|
1823
|
-
._closeButton_1w9jj_73 {
|
|
1824
|
-
position: absolute;
|
|
1825
|
-
top: 0;
|
|
1826
|
-
right: 0;
|
|
1827
|
-
transform: translate(-25%, 25%);
|
|
1828
|
-
opacity: 0.64;
|
|
1829
|
-
}
|
|
1830
|
-
._image-container_1w9jj_81 {
|
|
1831
|
-
position: relative;
|
|
1832
|
-
width: 248px;
|
|
1833
|
-
height: 160px;
|
|
1834
|
-
margin-top: 8px;
|
|
1835
|
-
margin-bottom: 8px;
|
|
1836
|
-
}
|
|
1837
|
-
._image_1w9jj_81 {
|
|
1838
|
-
position: absolute;
|
|
1839
|
-
transform: translateX(-5.7%);
|
|
1840
|
-
}
|
|
1841
|
-
|
|
1842
|
-
/* esbuild-sass-plugin:css-chunk:src/components/Badge/style.module.scss */
|
|
1843
|
-
._badge_f8fzb_1 {
|
|
1844
|
-
display: inline-flex;
|
|
1845
|
-
align-items: center;
|
|
1846
|
-
justify-content: center;
|
|
1847
|
-
white-space: nowrap;
|
|
1848
|
-
box-sizing: border-box;
|
|
1849
|
-
gap: var(--lp-sys-padding-component-50);
|
|
1850
|
-
}
|
|
1851
|
-
._s_f8fzb_10 {
|
|
1852
|
-
padding: var(--lp-sys-padding-component-50) var(--lp-sys-padding-component-100);
|
|
1853
|
-
border-radius: var(--lp-sys-radius-xs);
|
|
1854
|
-
}
|
|
1855
|
-
._m_f8fzb_15 {
|
|
1856
|
-
padding: var(--lp-sys-padding-component-50) var(--lp-sys-padding-component-100);
|
|
1857
|
-
border-radius: var(--lp-sys-radius-xs);
|
|
1858
|
-
}
|
|
1859
|
-
._l_f8fzb_20 {
|
|
1860
|
-
padding: var(--lp-sys-padding-component-100) var(--lp-sys-padding-component-150);
|
|
1861
|
-
border-radius: var(--lp-sys-radius-s);
|
|
1862
|
-
}
|
|
1863
|
-
._text_f8fzb_25 {
|
|
1864
|
-
padding: 0 var(--lp-sys-padding-component-50);
|
|
1865
|
-
}
|
|
1866
|
-
._subtle_f8fzb_29 {
|
|
1867
|
-
background: var(--neutral-fill-overlay-mid);
|
|
1868
|
-
}
|
|
1869
|
-
._outlined_f8fzb_33 {
|
|
1870
|
-
background: var(--neutral-fill-opaque-lowest);
|
|
1871
|
-
border: 1px solid var(--neutral-border-overlay-subtle);
|
|
1872
|
-
}
|
|
1873
|
-
._fill-primary_f8fzb_38 {
|
|
1874
|
-
background: var(--brand-fill-low);
|
|
1875
|
-
}
|
|
1876
|
-
._fill-accent_f8fzb_42 {
|
|
1877
|
-
background: var(--accent-fill-primary);
|
|
1878
|
-
}
|
|
1879
|
-
._inverse-primary_f8fzb_46 {
|
|
1880
|
-
background: var(--brandinverse-fill-static-low);
|
|
1881
|
-
}
|
|
1882
|
-
._text-neutral_f8fzb_50 {
|
|
1883
|
-
color: var(--neutral-label-primary);
|
|
1884
|
-
}
|
|
1885
|
-
._text-neutral-secondary_f8fzb_54 {
|
|
1886
|
-
color: var(--neutral-label-secondary);
|
|
1887
|
-
}
|
|
1888
|
-
._text-primary_f8fzb_58 {
|
|
1889
|
-
color: var(--brand-label-primary);
|
|
1890
|
-
}
|
|
1891
|
-
._text-primary-inverse_f8fzb_62 {
|
|
1892
|
-
color: var(--brandinverse-label-static-primary);
|
|
1893
|
-
}
|
|
1894
|
-
._text-caution_f8fzb_66 {
|
|
1895
|
-
color: var(--function-label-caution);
|
|
1896
|
-
}
|
|
1897
|
-
._text-error_f8fzb_70 {
|
|
1898
|
-
color: var(--function-label-negative);
|
|
1899
|
-
}
|
|
1900
|
-
._text-accent_f8fzb_74 {
|
|
1901
|
-
color: var(--accent-label-primary);
|
|
1902
|
-
}
|
package/lib/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { SystemKeys, TypographyCaptionPrefix, TypographyParagraphPrefix, TypographyHeadingPrefix, TypographyTitlePrefix, TypographyDisplayPrefix, BasicColorType } from '@liner-fe/design-token-primitive';
|
|
2
2
|
import * as react from 'react';
|
|
3
|
-
import react__default, { ButtonHTMLAttributes, HTMLAttributes, JSX, ReactNode, ComponentPropsWithoutRef, InputHTMLAttributes, ComponentProps, LiHTMLAttributes, MouseEventHandler } from 'react';
|
|
3
|
+
import react__default, { ButtonHTMLAttributes, HTMLAttributes, JSX, ReactNode, ComponentPropsWithoutRef, InputHTMLAttributes, ComponentProps, LiHTMLAttributes, MouseEventHandler, ReactElement } from 'react';
|
|
4
4
|
import * as cva from 'cva';
|
|
5
5
|
import { VariantProps } from 'cva';
|
|
6
6
|
import { IconProps, IconComponentType } from '@liner-fe/icon';
|
|
@@ -10,7 +10,6 @@ import { breakpointOrigin } from '@liner-fe/design-token';
|
|
|
10
10
|
import { Popover as Popover$1, Tooltip as Tooltip$1, Checkbox as Checkbox$1, RadioGroup, Select as Select$1, Label as Label$1 } from 'radix-ui';
|
|
11
11
|
import * as PopoverPrimitive from '@radix-ui/react-popover';
|
|
12
12
|
import { PopoverProps, PopoverPortalProps } from '@radix-ui/react-popover';
|
|
13
|
-
import { IllustProps } from '@liner-fe/illust';
|
|
14
13
|
|
|
15
14
|
declare const objectToArray: <T extends Record<string, unknown>>(obj: T) => [keyof T, T[keyof T]][];
|
|
16
15
|
declare const arrayToStyleObject: <T extends SystemKeys>(colorKeys: T[], style: {
|
|
@@ -480,20 +479,58 @@ interface LoadingProps extends HTMLAttributes<HTMLSpanElement> {
|
|
|
480
479
|
}
|
|
481
480
|
declare const Loading: ({ type, ...props }: LoadingProps) => react_jsx_runtime.JSX.Element;
|
|
482
481
|
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
482
|
+
/**
|
|
483
|
+
* 로고 소스 레지스트리 — PRISM 파이프라인의 단일 진실 소스(P0).
|
|
484
|
+
*
|
|
485
|
+
* 아이콘의 figma.json 에 대응하는 "로고 소스"다. 이후 단계에서
|
|
486
|
+
* - admin `logos` 테이블 import / manifest `logos` 섹션
|
|
487
|
+
* - `@liner-fe/logo` codegen
|
|
488
|
+
* 이 같은 형태(name / category / viewBox / fixedColor / svg)를 그대로 소비한다.
|
|
489
|
+
*
|
|
490
|
+
* 네이밍은 Figma `lp-pri-logo-{category}-{name}` 택소노미를 정규형으로 채택한다.
|
|
491
|
+
* (파일 LmqEWmsAzA0cNzA63lyo4G, node 17361-40)
|
|
492
|
+
*
|
|
493
|
+
* 색 모델:
|
|
494
|
+
* - fixedColor=false → 단색 테마 적응. path 는 fill 을 지정하지 않고 상위 <svg fill> 을 상속.
|
|
495
|
+
* 렌더러가 디자인 토큰 색을 <svg fill> 로 주입한다.
|
|
496
|
+
* - fixedColor=true → 브랜드 고정 멀티컬러(badge). path 가 자체 fill 을 가지며 토큰 주입 안 함.
|
|
497
|
+
*/
|
|
498
|
+
type LogoCategory = 'symbol' | 'combination' | 'wordmark' | 'badge';
|
|
499
|
+
type LogoName = 'symbol-main' | 'symbol-circle' | 'symbol-rounded' | 'favicon' | 'combination-liner' | 'combination-team' | 'combination-scholar' | 'combination-write' | 'combination-platform' | 'combination-developers' | 'wordmark-careers' | 'badge-pro' | 'badge-max';
|
|
500
|
+
interface LogoDef {
|
|
501
|
+
category: LogoCategory;
|
|
502
|
+
/** 본연 종횡비 산출용 [viewBoxWidth, viewBoxHeight] */
|
|
503
|
+
viewBox: [number, number];
|
|
504
|
+
/** true 면 브랜드 고정색(토큰 주입 안 함) */
|
|
505
|
+
fixedColor: boolean;
|
|
506
|
+
/**
|
|
507
|
+
* <svg> 내부 마크업. fixedColor=false 인 경우 `fill` 인자(디자인 토큰 색)를 사용하고,
|
|
508
|
+
* fixedColor=true 면 인자를 무시하고 자체 고정색을 쓴다.
|
|
509
|
+
*/
|
|
510
|
+
paths: (fill: string) => ReactNode;
|
|
487
511
|
}
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
512
|
+
declare const LOGOS: Record<LogoName, LogoDef>;
|
|
513
|
+
|
|
514
|
+
interface LogoProps {
|
|
515
|
+
/** 로고 이름. Figma `lp-pri-logo-{category}-{name}` 택소노미를 따른다. */
|
|
516
|
+
name: LogoName;
|
|
517
|
+
/**
|
|
518
|
+
* 렌더 높이(px). 너비는 로고 본연의 종횡비로 자동 계산된다.
|
|
519
|
+
* 미지정 시 로고의 viewBox 높이를 그대로 사용.
|
|
520
|
+
*/
|
|
521
|
+
height?: number;
|
|
522
|
+
/**
|
|
523
|
+
* 단색(테마 적응) 로고의 색 토큰. 기본 `brand-label-secondary`.
|
|
524
|
+
* 고정색 로고(badge 등)에는 무시된다.
|
|
525
|
+
*/
|
|
493
526
|
fill?: BasicColorType;
|
|
527
|
+
className?: string;
|
|
494
528
|
}
|
|
495
|
-
|
|
496
|
-
|
|
529
|
+
/**
|
|
530
|
+
* 브랜드 로고. SVG 는 `logos.tsx` 레지스트리(PRISM 파이프라인 소스)에서 가져오며,
|
|
531
|
+
* 이 컴포넌트는 viewBox·종횡비·색 토큰을 적용하는 얇은 렌더러다.
|
|
532
|
+
*/
|
|
533
|
+
declare const Logo: ({ name, height, fill, className }: LogoProps) => react_jsx_runtime.JSX.Element;
|
|
497
534
|
|
|
498
535
|
type PrimitiveCoachMarkRootProps = PopoverProps & {
|
|
499
536
|
trigger: ReactNode;
|
|
@@ -517,6 +554,19 @@ declare const PrimitiveCoachMark: (({ trigger, children, ...props }: PrimitiveCo
|
|
|
517
554
|
Close: ({ className, onClick }: HTMLAttributes<HTMLOrSVGElement>) => react_jsx_runtime.JSX.Element;
|
|
518
555
|
};
|
|
519
556
|
|
|
557
|
+
type CompactCoachMarkProps = PrimitiveCoachMarkRootProps;
|
|
558
|
+
type CompactCoachMarkContentProps = Omit<PrimitiveCoachMarkContentProps, 'children'> & {
|
|
559
|
+
badge?: string;
|
|
560
|
+
title: string;
|
|
561
|
+
};
|
|
562
|
+
declare const CompactCoachMark: ((props: CompactCoachMarkProps) => react_jsx_runtime.JSX.Element) & {
|
|
563
|
+
Content: react.ForwardRefExoticComponent<Omit<PrimitiveCoachMarkContentProps, "children"> & {
|
|
564
|
+
badge?: string;
|
|
565
|
+
title: string;
|
|
566
|
+
} & react.RefAttributes<HTMLDivElement>>;
|
|
567
|
+
Portal: react.FC<PopoverPrimitive.PopoverPortalProps>;
|
|
568
|
+
};
|
|
569
|
+
|
|
520
570
|
interface Step {
|
|
521
571
|
total: number;
|
|
522
572
|
current: number;
|
|
@@ -529,43 +579,29 @@ interface RestrictedButtonProps {
|
|
|
529
579
|
type CoachMarkProps = PrimitiveCoachMarkRootProps & {
|
|
530
580
|
children?: ReactNode;
|
|
531
581
|
};
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
title
|
|
535
|
-
level?: 'brand' | 'inverse-static';
|
|
536
|
-
onClose?: MouseEventHandler<HTMLOrSVGElement>;
|
|
537
|
-
}
|
|
538
|
-
type BaseCoachMarkContent = {
|
|
539
|
-
icon?: {
|
|
540
|
-
icon: IconComponentType;
|
|
541
|
-
} & Pick<IconProps, 'fill' | 'type' | 'fillType'>;
|
|
582
|
+
type CoachMarkContentProps = Omit<PrimitiveCoachMarkContentProps, 'children'> & {
|
|
583
|
+
badge?: string;
|
|
584
|
+
title: string;
|
|
542
585
|
description?: string;
|
|
586
|
+
media?: ReactElement;
|
|
587
|
+
preloadSrc?: string;
|
|
543
588
|
step?: Step;
|
|
544
|
-
primaryButton
|
|
589
|
+
primaryButton: RestrictedButtonProps;
|
|
545
590
|
secondaryButton?: RestrictedButtonProps;
|
|
546
|
-
|
|
591
|
+
onClose?: MouseEventHandler<HTMLButtonElement>;
|
|
547
592
|
};
|
|
548
|
-
type WithImage = BaseCoachMarkContent & {
|
|
549
|
-
image: React.ImgHTMLAttributes<HTMLImageElement>;
|
|
550
|
-
illust?: undefined;
|
|
551
|
-
};
|
|
552
|
-
type WithIllust = BaseCoachMarkContent & {
|
|
553
|
-
image?: undefined;
|
|
554
|
-
illust: Omit<IllustProps, 'width'>;
|
|
555
|
-
};
|
|
556
|
-
type WithoutMedia = BaseCoachMarkContent & {
|
|
557
|
-
image?: undefined;
|
|
558
|
-
illust?: undefined;
|
|
559
|
-
};
|
|
560
|
-
type CoachMarkContentProps = (WithImage | WithIllust | WithoutMedia) & BaseCoachMarkContentProps;
|
|
561
593
|
declare const CoachMark: ((props: CoachMarkProps) => react_jsx_runtime.JSX.Element) & {
|
|
562
|
-
Content: react.ForwardRefExoticComponent<
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
594
|
+
Content: react.ForwardRefExoticComponent<Omit<PrimitiveCoachMarkContentProps, "children"> & {
|
|
595
|
+
badge?: string;
|
|
596
|
+
title: string;
|
|
597
|
+
description?: string;
|
|
598
|
+
media?: ReactElement;
|
|
599
|
+
preloadSrc?: string;
|
|
600
|
+
step?: Step;
|
|
601
|
+
primaryButton: RestrictedButtonProps;
|
|
602
|
+
secondaryButton?: RestrictedButtonProps;
|
|
603
|
+
onClose?: MouseEventHandler<HTMLButtonElement>;
|
|
604
|
+
} & react.RefAttributes<HTMLDivElement>>;
|
|
569
605
|
Portal: react.FC<PopoverPrimitive.PopoverPortalProps>;
|
|
570
606
|
};
|
|
571
607
|
|
|
@@ -605,4 +641,4 @@ type BadgeBaseProps = ComponentPropsWithoutRef<'span'> & {
|
|
|
605
641
|
type BadgeProps = BadgeBaseProps & BadgeVariantColorProps;
|
|
606
642
|
declare const Badge: react.ForwardRefExoticComponent<BadgeProps & react.RefAttributes<HTMLSpanElement>>;
|
|
607
643
|
|
|
608
|
-
export { Badge, type BadgeColor, type BadgeIconProps, type BadgeProps, type BadgeSize, type BadgeVariant, type
|
|
644
|
+
export { Badge, type BadgeColor, type BadgeIconProps, type BadgeProps, type BadgeSize, type BadgeVariant, type BreakPointsKey, Button, type ButtonIconProps, type ButtonProps, type ButtonSizeType, Caption, Checkbox, CoachMark, type CoachMarkContentProps, type CommonButtonProps, CompactCoachMark, type CompactCoachMarkContentProps, DEFAULT_LEVEL_OPTIONS, DEFAULT_SIZE_OPTIONS, DefaultButton, type DefaultButtonProps, type DefaultLevelType, Display, Heading, ICON_LEVEL_OPTIONS, ICON_SIZE_OPTIONS, type ICaptionProps, type IDisplayProps, type IHeadingProps, type IPropsAccent, type IPropsAnswer, type IPropsNormal, type IPropsNormalBold, type IPropsPost, type ITitleProps, IconButton, type IconButtonProps, type ItemProps, LOGOS, Label, List, Loading, type LoadingLevelType, Logo, type LogoCategory, type LogoName, type LogoProps, Media, MediaContextProvider, Paragraph, type ParagraphProps, Popover, type PopoverContentProps, PrimitiveCoachMark, type PrimitiveCoachMarkContentProps, type PrimitiveCoachMarkRootProps, type PromiseToastOptions, Radio, Select, type SelectItemProps, type SelectProps, TEXT_LEVEL_OPTIONS, TEXT_SIZE_OPTIONS, Tag, TextButton, type TextButtonProps, type TextSizeType, Textfield, type TextfieldButtonProps, type TextfieldLabelType, type TextfieldProps, Title, type ToastOptions, type ToastType, Toaster, Tooltip, Typography, arrayToStyleObject, isEmptyObject, objectToArray, rootMediaStyle, toast };
|