@openameba/spindle-ui 0.25.0 → 0.26.1-alpha.0

package/Icon/TrianglearrowUpright.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgTrianglearrowUpright(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M17.78 5.22h-6.29c-.89 0-1.34 1.08-.71 1.71l2.08 2.08-7.2 7.2a1.49 1.49 0 000 2.12c.59.58 1.54.59 2.12 0l7.2-7.2 2.08 2.08c.63.63 1.71.18 1.71-.71V6.22c.01-.55-.44-1-.99-1z" })));
+}
+export default SvgTrianglearrowUpright;

package/Icon/TriangleendLeft.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgTriangleendLeft(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M3.93 21c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1s1 .45 1 1v16c0 .55-.45 1-1 1zm16.7-.3a.996.996 0 000-1.41L13.34 12l7.29-7.29a.996.996 0 10-1.41-1.41l-7.29 7.29c-.78.78-.78 2.05 0 2.83l7.29 7.29c.2.2.45.29.71.29.26 0 .5-.11.7-.3z" })));
+}
+export default SvgTriangleendLeft;

package/Icon/TriangleendRight.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgTriangleendRight(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M20 21c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1s1 .45 1 1v16c0 .55-.45 1-1 1zm-15.29-.3L12 13.41c.78-.78.78-2.05 0-2.83L4.71 3.3A.996.996 0 103.3 4.71L10.58 12l-7.29 7.29a.996.996 0 00.71 1.7c.26 0 .51-.1.71-.29z" })));
+}
+export default SvgTriangleendRight;

package/Icon/TrophyFill.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgTrophyFill(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M19 5h-1.5v-.5c0-.55-.45-1-1-1h-9c-.55 0-1 .45-1 1V5H5c-1.1 0-2 .9-2 2v.96c0 1.55.91 2.98 2.32 3.63l1.33.62c1.12 1.61 2.45 2.63 3.85 3.06v1.7l-2.64 1.69c-.84.54-.45 1.84.54 1.84h7.19c1 0 1.38-1.3.54-1.84l-2.64-1.69v-1.7c1.39-.42 2.72-1.45 3.85-3.06l1.33-.62A3.993 3.993 0 0021 7.96V7c0-1.1-.9-2-2-2zM5 7.96V7h1.5v2.94l-.34-.16C5.46 9.45 5 8.74 5 7.96zm14 0c0 .78-.46 1.49-1.16 1.82l-.34.16V7H19v.96z" })));
+}
+export default SvgTrophyFill;

package/Icon/TvFill.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgTvFill(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M17.99 5.4h-3.06l1.26-1.21a.996.996 0 10-1.38-1.44L12.06 5.4h-.11L9.19 2.75c-.4-.38-1.03-.37-1.42.03a.996.996 0 00.03 1.41L9.06 5.4H5.99c-2.21 0-4 1.79-4 4v6.13c0 1.86 1.28 3.41 3 3.86v.08c0 .55.45 1 1 1h2c.53 0 .95-.41.99-.93h6.03c.04.52.46.93.99.93h2c.55 0 1-.45 1-1v-.08c1.72-.45 3-2 3-3.86V9.4c-.01-2.2-1.8-4-4.01-4zm-1 9.07c0 1.1-.9 2-2 2h-8c-1.1 0-2-.9-2-2v-4c0-1.1.9-2 2-2h8c1.1 0 2 .9 2 2v4zm2.5 2c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1zm0-3c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1-.45 1-1 1z" })));
+}
+export default SvgTvFill;

package/Icon/Twitter.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgTwitter(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M8.66 19.31c6.79 0 10.51-5.63 10.51-10.51 0-.16 0-.32-.01-.48.72-.51 1.34-1.16 1.84-1.9-.67.3-1.39.49-2.12.58.77-.46 1.35-1.19 1.62-2.04-.72.43-1.52.73-2.35.9a3.698 3.698 0 00-5.23-.16c-.96.9-1.37 2.25-1.07 3.53-2.96-.16-5.72-1.56-7.6-3.87a3.69 3.69 0 001.15 4.93c-.59-.02-1.16-.18-1.68-.46v.05c0 1.76 1.24 3.27 2.96 3.62-.54.15-1.11.17-1.67.06.48 1.5 1.87 2.53 3.45 2.56a7.344 7.344 0 01-4.59 1.58c-.29 0-.59-.02-.88-.05a10.48 10.48 0 005.67 1.66z" })));
+}
+export default SvgTwitter;

package/Icon/Underline.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgUnderline(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M17.75 21H6.25a1.25 1.25 0 010-2.5h11.5a1.25 1.25 0 010 2.5zm-.05-10.2V4.25a1.25 1.25 0 00-2.5 0v6.55c0 1.77-1.44 3.2-3.2 3.2a3.21 3.21 0 01-3.2-3.2V4.25a1.25 1.25 0 00-2.5 0v6.55c0 3.14 2.56 5.7 5.7 5.7s5.7-2.56 5.7-5.7z" })));
+}
+export default SvgUnderline;

package/Icon/Undo.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgUndo(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M3.44 13.61c0 3.94 3.2 7.14 7.14 7.14H15c.55 0 1-.45 1-1s-.45-1-1-1h-4.42c-2.83 0-5.14-2.31-5.14-5.14 0-2.83 2.31-5.14 5.14-5.14h4.83v2.19c0 .89 1.08 1.34 1.71.71l3.14-3.16a.996.996 0 000-1.41l-3.15-3.15c-.63-.63-1.71-.18-1.71.71v2.11h-4.82c-3.93-.01-7.14 3.2-7.14 7.14z" })));
+}
+export default SvgUndo;

package/Icon/UndoBold.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgUndoBold(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M2.94 13.61c0 4.21 3.43 7.64 7.64 7.64H15c.83 0 1.5-.67 1.5-1.5s-.67-1.5-1.5-1.5h-4.42c-2.56 0-4.64-2.08-4.64-4.64 0-2.56 2.08-4.64 4.64-4.64h4.33v1.69c0 .62.35 1.15.93 1.39a1.469 1.469 0 001.63-.32l3.15-3.17c.58-.58.58-1.54 0-2.12l-3.15-3.15c-.44-.44-1.07-.56-1.64-.33-.57.24-.92.77-.92 1.39v1.62h-4.32c-4.22-.01-7.65 3.42-7.65 7.64z" })));
+}
+export default SvgUndoBold;

package/Icon/Wallet.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgWallet(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M19.5 12.5V9.7c0-2.6-2-4.8-4.6-5 0-.1.1-.3.1-.5 0-.6-.6-1.2-1.3-1.2-.7 0-1.2.6-1.2 1.2 0 .2 0 .3.1.5h-1.2c.1-.2.1-.3.1-.5 0-.6-.6-1.2-1.3-1.2C9.5 3 9 3.6 9 4.2c0 .2.1.4.1.5-2.6.3-4.6 2.4-4.6 5v2.8c-1 .9-1.5 2.2-1.5 3.6v.2c0 2.8 2.2 5 5 5h8c2.8 0 5-2.2 5-5v-.2c0-1.4-.5-2.7-1.5-3.6zm-13-2.8c0-1.7 1.3-3 3-3h5c1.7 0 3 1.3 3 3v1l-.4-.3c-.1-.1-.2-.3-.3-.5-.3-1.3-1.5-2.2-2.8-2.2h-4c-1.3 0-2.5.9-2.8 2.2 0 .2-.1.3-.3.4l-.4.4v-1zM19 16.2c0 1.7-1.3 3-3 3H8c-1.7 0-3-1.3-3-3V16c0-.9.4-1.7 1-2.3l.1-.1 2.1-1.9c.1 0 .1-.1.1-.1.4-.2.7-.7.8-1.2.1-.4.5-.7.9-.7h4c.4 0 .8.3.9.7.1.5.4 1 .8 1.3l.1.1 2.1 1.9.1.1c.7.6 1 1.4 1 2.3v.1z" })));
+}
+export default SvgWallet;

package/Icon/Webview.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgWebview(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm4.31 7.88h3.39c.19.68.3 1.39.3 2.12 0 .72-.1 1.42-.28 2.08h-3.4c.19-1.4.19-2.8-.01-4.2zm2.54-2h-2.96c-.32-1.16-.78-2.32-1.37-3.47 1.82.6 3.35 1.85 4.33 3.47zm-8.68 8.2h3.65c-.41 1.3-1.02 2.61-1.83 3.91-.8-1.3-1.41-2.61-1.82-3.91zm4.13-2H9.7c-.22-1.4-.22-2.8.02-4.2h4.58c.22 1.41.23 2.8 0 4.2zM12 4c.79 1.3 1.39 2.59 1.8 3.88h-3.6C10.61 6.6 11.21 5.3 12 4zm-2.51.41C8.9 5.57 8.44 6.72 8.12 7.88H5.15a8.002 8.002 0 014.34-3.47zm-1.81 9.67h-3.4A7.91 7.91 0 014 12c0-.73.11-1.44.29-2.12h3.39c-.19 1.4-.19 2.8 0 4.2zm-2.55 2H8.1c.32 1.17.79 2.34 1.39 3.51a8.036 8.036 0 01-4.36-3.51zm9.38 3.51c.6-1.17 1.07-2.34 1.39-3.51h2.97a8.036 8.036 0 01-4.36 3.51z" })));
+}
+export default SvgWebview;

package/Icon/Youtube.mjs

@@ -0,0 +1,6 @@
+import * as React from 'react';
+function SvgYoutube(props) {
+    return (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor", role: "img" }, props),
+        React.createElement("path", { d: "M20.62 7.64c-.21-.78-.82-1.39-1.59-1.6-1.4-.38-7.03-.38-7.03-.38s-5.63 0-7.03.38c-.77.21-1.38.82-1.59 1.6C3 9.05 3 12 3 12s0 2.95.38 4.36c.21.78.82 1.39 1.59 1.6 1.4.38 7.03.38 7.03.38s5.63 0 7.03-.38c.77-.21 1.38-.82 1.59-1.6C21 14.95 21 12 21 12s0-2.95-.38-4.36zm-10.46 7.04V9.32l4.7 2.68-4.7 2.68z" })));
+}
+export default SvgYoutube;

package/Icon/index.mjs

@@ -0,0 +1,325 @@
+export { default as Svg755 } from './755';
+export { default as Abemakun } from './Abemakun';
+export { default as Abematv } from './Abematv';
+export { default as Accesslink } from './Accesslink';
+export { default as Accesspage } from './Accesspage';
+export { default as AccesspageFill } from './AccesspageFill';
+export { default as AddressbookFill } from './AddressbookFill';
+export { default as AlbumAddFill } from './AlbumAddFill';
+export { default as AlbumFill } from './AlbumFill';
+export { default as AlignCenter } from './AlignCenter';
+export { default as AlignLeft } from './AlignLeft';
+export { default as AlignRight } from './AlignRight';
+export { default as AllFill } from './AllFill';
+export { default as Amebacoin } from './Amebacoin';
+export { default as Amebapick } from './Amebapick';
+export { default as Amegold } from './Amegold';
+export { default as Amember } from './Amember';
+export { default as ArrowDown } from './ArrowDown';
+export { default as ArrowDownBold } from './ArrowDownBold';
+export { default as ArrowLeft } from './ArrowLeft';
+export { default as ArrowLeftBold } from './ArrowLeftBold';
+export { default as ArrowRight } from './ArrowRight';
+export { default as ArrowRightBold } from './ArrowRightBold';
+export { default as ArrowRightCircle } from './ArrowRightCircle';
+export { default as ArrowRightCircleFill } from './ArrowRightCircleFill';
+export { default as ArrowUp } from './ArrowUp';
+export { default as ArrowUpBold } from './ArrowUpBold';
+export { default as ArrowpagingDown } from './ArrowpagingDown';
+export { default as ArrowpagingDownCircle } from './ArrowpagingDownCircle';
+export { default as ArrowpagingLeft } from './ArrowpagingLeft';
+export { default as ArrowpagingLeftCircle } from './ArrowpagingLeftCircle';
+export { default as ArrowpagingRight } from './ArrowpagingRight';
+export { default as ArrowpagingRightCircle } from './ArrowpagingRightCircle';
+export { default as ArrowpagingUp } from './ArrowpagingUp';
+export { default as ArrowpagingUpCircle } from './ArrowpagingUpCircle';
+export { default as Article } from './Article';
+export { default as ArticleSlash } from './ArticleSlash';
+export { default as Articledesign } from './Articledesign';
+export { default as Astrogy } from './Astrogy';
+export { default as AstrogyFill } from './AstrogyFill';
+export { default as Baby } from './Baby';
+export { default as Bbs } from './Bbs';
+export { default as Beginner } from './Beginner';
+export { default as Bell } from './Bell';
+export { default as BellFill } from './BellFill';
+export { default as BellFillSlash } from './BellFillSlash';
+export { default as BellSlash } from './BellSlash';
+export { default as Blog } from './Blog';
+export { default as Bold } from './Bold';
+export { default as Book } from './Book';
+export { default as BookFill } from './BookFill';
+export { default as Bookmark } from './Bookmark';
+export { default as BookmarkFill } from './BookmarkFill';
+export { default as Bookshelf } from './Bookshelf';
+export { default as BookshelfFill } from './BookshelfFill';
+export { default as Border } from './Border';
+export { default as BottomnavFollowfeedActive } from './BottomnavFollowfeedActive';
+export { default as BottomnavFollowfeedInactive } from './BottomnavFollowfeedInactive';
+export { default as BottomnavHomeActive } from './BottomnavHomeActive';
+export { default as BottomnavHomeInactive } from './BottomnavHomeInactive';
+export { default as BottomnavMypageActive } from './BottomnavMypageActive';
+export { default as BottomnavSearchActive } from './BottomnavSearchActive';
+export { default as BottomnavSearchInactive } from './BottomnavSearchInactive';
+export { default as BottomnvavMypageInactive } from './BottomnvavMypageInactive';
+export { default as Bullets } from './Bullets';
+export { default as Calendar } from './Calendar';
+export { default as CameraFill } from './CameraFill';
+export { default as CautionFill } from './CautionFill';
+export { default as Check } from './Check';
+export { default as CheckBold } from './CheckBold';
+export { default as CheckCircle } from './CheckCircle';
+export { default as CheckCircleFill } from './CheckCircleFill';
+export { default as CheckRectangle } from './CheckRectangle';
+export { default as Checklist } from './Checklist';
+export { default as ChevronDown } from './ChevronDown';
+export { default as ChevronDownBold } from './ChevronDownBold';
+export { default as ChevronLeft } from './ChevronLeft';
+export { default as ChevronLeftBold } from './ChevronLeftBold';
+export { default as ChevronRight } from './ChevronRight';
+export { default as ChevronRightBold } from './ChevronRightBold';
+export { default as ChevronUp } from './ChevronUp';
+export { default as ChevronUpBold } from './ChevronUpBold';
+export { default as Circle } from './Circle';
+export { default as CircleBold } from './CircleBold';
+export { default as CircleFill } from './CircleFill';
+export { default as Clock } from './Clock';
+export { default as ClockFill } from './ClockFill';
+export { default as Coin } from './Coin';
+export { default as Comment } from './Comment';
+export { default as CommentFill } from './CommentFill';
+export { default as CommentPen } from './CommentPen';
+export { default as CommentTwoFill } from './CommentTwoFill';
+export { default as CommentTwoSlashFill } from './CommentTwoSlashFill';
+export { default as Community } from './Community';
+export { default as Compass } from './Compass';
+export { default as Coupon } from './Coupon';
+export { default as Crop } from './Crop';
+export { default as CropDin } from './CropDin';
+export { default as CropLandscape } from './CropLandscape';
+export { default as Cross } from './Cross';
+export { default as CrossBold } from './CrossBold';
+export { default as CrossCircle } from './CrossCircle';
+export { default as CrossCircleFill } from './CrossCircleFill';
+export { default as CrossRectangle } from './CrossRectangle';
+export { default as Cutlery } from './Cutlery';
+export { default as DiamondTwo } from './DiamondTwo';
+export { default as Dice } from './Dice';
+export { default as Dot } from './Dot';
+export { default as Dotmoney } from './Dotmoney';
+export { default as Download } from './Download';
+export { default as Embed } from './Embed';
+export { default as EmotionFill } from './EmotionFill';
+export { default as EntryLost } from './EntryLost';
+export { default as Exclamationmark } from './Exclamationmark';
+export { default as ExclamationmarkBalloon } from './ExclamationmarkBalloon';
+export { default as ExclamationmarkBalloonFill } from './ExclamationmarkBalloonFill';
+export { default as ExclamationmarkBold } from './ExclamationmarkBold';
+export { default as ExclamationmarkCircle } from './ExclamationmarkCircle';
+export { default as ExclamationmarkCircleFill } from './ExclamationmarkCircleFill';
+export { default as Expand } from './Expand';
+export { default as ExpandExit } from './ExpandExit';
+export { default as Facebook } from './Facebook';
+export { default as File } from './File';
+export { default as FileAdd } from './FileAdd';
+export { default as FileAddFill } from './FileAddFill';
+export { default as FileCircle } from './FileCircle';
+export { default as FileCircleFill } from './FileCircleFill';
+export { default as FileFill } from './FileFill';
+export { default as Filter } from './Filter';
+export { default as FilterCheck } from './FilterCheck';
+export { default as Fit } from './Fit';
+export { default as FlagFill } from './FlagFill';
+export { default as FlagRanking } from './FlagRanking';
+export { default as FlagRankingTrim } from './FlagRankingTrim';
+export { default as Flash } from './Flash';
+export { default as FlashAuto } from './FlashAuto';
+export { default as FlashOff } from './FlashOff';
+export { default as Flowervase } from './Flowervase';
+export { default as Folder } from './Folder';
+export { default as FolderFill } from './FolderFill';
+export { default as FolderTwo } from './FolderTwo';
+export { default as FolderTwoFill } from './FolderTwoFill';
+export { default as Font } from './Font';
+export { default as Fontstyle } from './Fontstyle';
+export { default as Game } from './Game';
+export { default as GameFill } from './GameFill';
+export { default as GameKantan } from './GameKantan';
+export { default as Gear } from './Gear';
+export { default as GearFill } from './GearFill';
+export { default as Genre } from './Genre';
+export { default as GenreAdd } from './GenreAdd';
+export { default as GenreDone } from './GenreDone';
+export { default as GraphBar } from './GraphBar';
+export { default as Gruppo } from './Gruppo';
+export { default as HandWaveFill } from './HandWaveFill';
+export { default as Hatenabookmark } from './Hatenabookmark';
+export { default as Heart } from './Heart';
+export { default as HeartFill } from './HeartFill';
+export { default as History } from './History';
+export { default as HomeFill } from './HomeFill';
+export { default as Hot } from './Hot';
+export { default as Htmltag } from './Htmltag';
+export { default as ImageAddFill } from './ImageAddFill';
+export { default as ImageBanFill } from './ImageBanFill';
+export { default as ImageFill } from './ImageFill';
+export { default as ImageFillSlash } from './ImageFillSlash';
+export { default as ImageQuestionFill } from './ImageQuestionFill';
+export { default as Information } from './Information';
+export { default as Instagram } from './Instagram';
+export { default as Italic } from './Italic';
+export { default as Kaomoji } from './Kaomoji';
+export { default as Keyboard } from './Keyboard';
+export { default as KeyboardDownFill } from './KeyboardDownFill';
+export { default as KeyboardFill } from './KeyboardFill';
+export { default as Koeblog } from './Koeblog';
+export { default as LineCircle } from './LineCircle';
+export { default as LineSquare } from './LineSquare';
+export { default as Link } from './Link';
+export { default as ListBulleted } from './ListBulleted';
+export { default as ListNumbered } from './ListNumbered';
+export { default as Loading } from './Loading';
+export { default as LockFill } from './LockFill';
+export { default as LockOpenFill } from './LockOpenFill';
+export { default as Magicwand } from './Magicwand';
+export { default as Mail } from './Mail';
+export { default as MailCheck } from './MailCheck';
+export { default as MailCircle } from './MailCircle';
+export { default as MailCircleFill } from './MailCircleFill';
+export { default as MailFill } from './MailFill';
+export { default as Megaphone } from './Megaphone';
+export { default as MenuHamburger } from './MenuHamburger';
+export { default as MenuHamburgerBold } from './MenuHamburgerBold';
+export { default as MenuHamburgerFourline } from './MenuHamburgerFourline';
+export { default as MenuHorizotal } from './MenuHorizotal';
+export { default as MenuVertical } from './MenuVertical';
+export { default as Messageboard } from './Messageboard';
+export { default as Microphone } from './Microphone';
+export { default as MicrophoneFill } from './MicrophoneFill';
+export { default as Minus } from './Minus';
+export { default as MinusBold } from './MinusBold';
+export { default as Moon } from './Moon';
+export { default as MoonFill } from './MoonFill';
+export { default as MovieCameraFill } from './MovieCameraFill';
+export { default as MoviePlay } from './MoviePlay';
+export { default as MoviePlayFill } from './MoviePlayFill';
+export { default as MovieStop } from './MovieStop';
+export { default as MusicFill } from './MusicFill';
+export { default as New } from './New';
+export { default as Newbook } from './Newbook';
+export { default as NewbookFill } from './NewbookFill';
+export { default as News } from './News';
+export { default as Nice } from './Nice';
+export { default as NiceDone } from './NiceDone';
+export { default as Nodate } from './Nodate';
+export { default as Now } from './Now';
+export { default as Officialstar } from './Officialstar';
+export { default as OfficialstarFill } from './OfficialstarFill';
+export { default as OnedariFill } from './OnedariFill';
+export { default as OpenCl } from './OpenCl';
+export { default as Openblank } from './Openblank';
+export { default as OpenblankFill } from './OpenblankFill';
+export { default as Ownd } from './Ownd';
+export { default as PaletteFill } from './PaletteFill';
+export { default as Pause } from './Pause';
+export { default as PauseBold } from './PauseBold';
+export { default as Pawprint } from './Pawprint';
+export { default as Pencil } from './Pencil';
+export { default as PencilAdd } from './PencilAdd';
+export { default as PencilBold } from './PencilBold';
+export { default as Person } from './Person';
+export { default as PersonFill } from './PersonFill';
+export { default as PersonThreeFill } from './PersonThreeFill';
+export { default as PersonTwoAddFill } from './PersonTwoAddFill';
+export { default as PersonTwoDeleteFill } from './PersonTwoDeleteFill';
+export { default as PersonTwoDoneFill } from './PersonTwoDoneFill';
+export { default as PersonTwoFill } from './PersonTwoFill';
+export { default as Peta } from './Peta';
+export { default as Pigg } from './Pigg';
+export { default as PinFill } from './PinFill';
+export { default as PlayCircle } from './PlayCircle';
+export { default as PlayFill } from './PlayFill';
+export { default as Plus } from './Plus';
+export { default as PlusBold } from './PlusBold';
+export { default as PlusCircle } from './PlusCircle';
+export { default as PlusCircleFill } from './PlusCircleFill';
+export { default as PremiumFill } from './PremiumFill';
+export { default as Present } from './Present';
+export { default as Profilecard } from './Profilecard';
+export { default as Qr } from './Qr';
+export { default as Question } from './Question';
+export { default as QuestionmarkCircle } from './QuestionmarkCircle';
+export { default as QuestionmarkCircleFill } from './QuestionmarkCircleFill';
+export { default as RankingCrown } from './RankingCrown';
+export { default as RankingCrownFill } from './RankingCrownFill';
+export { default as RankingPlatformFill } from './RankingPlatformFill';
+export { default as Reblog } from './Reblog';
+export { default as ReblogSlash } from './ReblogSlash';
+export { default as Redo } from './Redo';
+export { default as RedoBold } from './RedoBold';
+export { default as Refresh } from './Refresh';
+export { default as ReplyCircleFill } from './ReplyCircleFill';
+export { default as ReplyFill } from './ReplyFill';
+export { default as Requ } from './Requ';
+export { default as Sad } from './Sad';
+export { default as Saveblog } from './Saveblog';
+export { default as ScreenFull } from './ScreenFull';
+export { default as ScreenInline } from './ScreenInline';
+export { default as Search } from './Search';
+export { default as Service } from './Service';
+export { default as Share } from './Share';
+export { default as ShineFill } from './ShineFill';
+export { default as Shirt } from './Shirt';
+export { default as SidefaceClose } from './SidefaceClose';
+export { default as SidefaceOpen } from './SidefaceOpen';
+export { default as Smartphone } from './Smartphone';
+export { default as SmartphoneFill } from './SmartphoneFill';
+export { default as Sort } from './Sort';
+export { default as SortFeed } from './SortFeed';
+export { default as SortTile } from './SortTile';
+export { default as SpeakerOffFill } from './SpeakerOffFill';
+export { default as SpeakerOnFill } from './SpeakerOnFill';
+export { default as Sprout } from './Sprout';
+export { default as Stampside } from './Stampside';
+export { default as Star } from './Star';
+export { default as StarCircleFill } from './StarCircleFill';
+export { default as StarFaceFill } from './StarFaceFill';
+export { default as StarFill } from './StarFill';
+export { default as StopFill } from './StopFill';
+export { default as Strikethrough } from './Strikethrough';
+export { default as Sun } from './Sun';
+export { default as SunFill } from './SunFill';
+export { default as Switching } from './Switching';
+export { default as SwitchingCamera } from './SwitchingCamera';
+export { default as TagFill } from './TagFill';
+export { default as TagOfficialFill } from './TagOfficialFill';
+export { default as Thumbsup } from './Thumbsup';
+export { default as ThumbsupFill } from './ThumbsupFill';
+export { default as Title } from './Title';
+export { default as TopbloggerRibbon } from './TopbloggerRibbon';
+export { default as TranscriptOff } from './TranscriptOff';
+export { default as TranscriptOn } from './TranscriptOn';
+export { default as Transmission } from './Transmission';
+export { default as Trashcan } from './Trashcan';
+export { default as Trend } from './Trend';
+export { default as TrendFill } from './TrendFill';
+export { default as TriangleDown } from './TriangleDown';
+export { default as TriangleLeft } from './TriangleLeft';
+export { default as TriangleRight } from './TriangleRight';
+export { default as TriangleUp } from './TriangleUp';
+export { default as TrianglearrowDown } from './TrianglearrowDown';
+export { default as TrianglearrowDownright } from './TrianglearrowDownright';
+export { default as TrianglearrowRight } from './TrianglearrowRight';
+export { default as TrianglearrowUp } from './TrianglearrowUp';
+export { default as TrianglearrowUpright } from './TrianglearrowUpright';
+export { default as TriangleendLeft } from './TriangleendLeft';
+export { default as TriangleendRight } from './TriangleendRight';
+export { default as TrophyFill } from './TrophyFill';
+export { default as TvFill } from './TvFill';
+export { default as Twitter } from './Twitter';
+export { default as Underline } from './Underline';
+export { default as Undo } from './Undo';
+export { default as UndoBold } from './UndoBold';
+export { default as Wallet } from './Wallet';
+export { default as Webview } from './Webview';
+export { default as Youtube } from './Youtube';

package/IconButton/IconButton.css

@@ -1 +1 @@
-:root{--IconButton-tapHighlightColor:var(--gray-5-alpha);--IconButton-onFocus-boxShadow:0 0 0 1px var(--color-surface-primary),0 0 0 3px var(--color-focus-clarity);--IconButton--contained-backgroundColor:var(--color-surface-accent-primary);--IconButton--contained-color:var(--color-text-high-emphasis-inverse);--IconButton--contained-onActive-backgroundColor:var(--primary-green-100);--IconButton--contained-onHover-backgroundColor:var(--primary-green-100);--IconButton--outlined-borderColor:var(--color-surface-accent-primary);--IconButton--outlined-color:var(--color-surface-accent-primary);--IconButton--outlined-onActive-backgroundColor:var(--primary-green-5);--IconButton--outlined-onHover-backgroundColor:var(--primary-green-5);--IconButton--lighted-backgroundColor:var(--color-surface-accent-primary-light);--IconButton--lighted-color:var(--color-text-accent-primary);--IconButton--lighted-onActive-backgroundColor:var(--primary-green-10);--IconButton--lighted-onHover-backgroundColor:var(--primary-green-10);--IconButton--neutral-backgroundColor:var(--color-surface-tertiary);--IconButton--neutral-color:var(--color-text-medium-emphasis);--IconButton--neutral-onActive-backgroundColor:var(--gray-20-alpha);--IconButton--neutral-onHover-backgroundColor:var(--gray-20-alpha);--IconButton--danger-borderColor:var(--color-text-caution);--IconButton--danger-color:var(--color-text-caution);--IconButton--danger-onActive-backgroundColor:var(--caution-red-5-alpha);--IconButton--danger-onHover-backgroundColor:var(--caution-red-5-alpha)}.spui-IconButton{align-items:center;border-radius:100%;box-sizing:border-box;display:inline-flex;justify-content:center;margin:0;-webkit-tap-highlight-color:var(--IconButton-tapHighlightColor);text-align:center;transition:background-color .3s}.spui-IconButton:disabled{opacity:.3}.spui-IconButton:focus{box-shadow:var(--IconButton-onFocus-boxShadow);outline:none}.spui-IconButton:focus:not(:focus-visible){box-shadow:none}.spui-IconButton--large{font-size:1.375em;height:48px;width:48px}.spui-IconButton--medium{font-size:1.25em;height:40px;width:40px}.spui-IconButton--small{font-size:1em;height:32px;width:32px}.spui-IconButton--exSmall{font-size:1em;height:24px;width:24px}.spui-IconButton--contained{background-color:var(--IconButton--contained-backgroundColor);border:none;color:var(--IconButton--contained-color)}.spui-IconButton--contained:active{background-color:var(--IconButton--contained-onActive-backgroundColor)}@media (hover:hover){.spui-IconButton--contained:not([disabled]):hover{background-color:var(--IconButton--contained-onHover-backgroundColor)}}.spui-IconButton--outlined{background-color:transparent;border:2px solid var(--IconButton--outlined-borderColor);color:var(--IconButton--outlined-color)}.spui-IconButton--outlined:active{background-color:var(--IconButton--outlined-onActive-backgroundColor)}@media (hover:hover){.spui-IconButton--outlined:not([disabled]):hover{background-color:var(--IconButton--outlined-onHover-backgroundColor)}}.spui-IconButton--lighted{background-color:var(--IconButton--lighted-backgroundColor);border:none;color:var(--IconButton--lighted-color);padding-bottom:8px;padding-top:8px}.spui-IconButton--lighted:active{background-color:var(--IconButton--lighted-onActive-backgroundColor)}@media (hover:hover){.spui-IconButton--lighted:not([disabled]):hover{background-color:var(--IconButton--lighted-onHover-backgroundColor)}}.spui-IconButton--neutral{background-color:var(--IconButton--neutral-backgroundColor);border:none;color:var(--IconButton--neutral-color)}.spui-IconButton--neutral:active{background-color:var(--IconButton--neutral-onActive-backgroundColor)}@media (hover:hover){.spui-IconButton--neutral:not([disabled]):hover{background-color:var(--IconButton--neutral-onHover-backgroundColor)}}.spui-IconButton--danger{background-color:transparent;border:2px solid var(--IconButton--danger-borderColor);color:var(--IconButton--danger-color)}.spui-IconButton--danger:active{background-color:var(--IconButton--danger-onActive-backgroundColor)}@media (hover:hover){.spui-IconButton--danger:hover{background-color:var(--IconButton--danger-onHover-backgroundColor)}}
+:root{--IconButton-tapHighlightColor:var(--gray-5-alpha);--IconButton-onFocus-boxShadow:0 0 0 1px var(--color-surface-primary),0 0 0 3px var(--color-focus-clarity);--IconButton--contained-backgroundColor:var(--color-surface-accent-primary);--IconButton--contained-color:var(--color-object-high-emphasis-inverse);--IconButton--contained-onActive-backgroundColor:var(--primary-green-100);--IconButton--contained-onHover-backgroundColor:var(--primary-green-100);--IconButton--outlined-borderColor:var(--color-border-accent-primary);--IconButton--outlined-color:var(--color-object-accent-primary);--IconButton--outlined-onActive-backgroundColor:var(--primary-green-5);--IconButton--outlined-onHover-backgroundColor:var(--primary-green-5);--IconButton--lighted-backgroundColor:var(--color-surface-accent-primary-light);--IconButton--lighted-color:var(--color-object-accent-primary);--IconButton--lighted-onActive-backgroundColor:var(--primary-green-10);--IconButton--lighted-onHover-backgroundColor:var(--primary-green-10);--IconButton--neutral-backgroundColor:var(--color-surface-tertiary);--IconButton--neutral-color:var(--color-object-medium-emphasis);--IconButton--neutral-onActive-backgroundColor:var(--gray-20-alpha);--IconButton--neutral-onHover-backgroundColor:var(--gray-20-alpha);--IconButton--danger-borderColor:var(--color-border-caution);--IconButton--danger-color:var(--color-object-caution);--IconButton--danger-onActive-backgroundColor:var(--caution-red-5-alpha);--IconButton--danger-onHover-backgroundColor:var(--caution-red-5-alpha)}.spui-IconButton{align-items:center;border-radius:100%;box-sizing:border-box;display:inline-flex;justify-content:center;margin:0;-webkit-tap-highlight-color:var(--IconButton-tapHighlightColor);text-align:center;transition:background-color .3s}.spui-IconButton:disabled{opacity:.3}.spui-IconButton:focus{box-shadow:var(--IconButton-onFocus-boxShadow);outline:none}.spui-IconButton:focus:not(:focus-visible){box-shadow:none}.spui-IconButton--large{font-size:1.375em;height:48px;width:48px}.spui-IconButton--medium{font-size:1.25em;height:40px;width:40px}.spui-IconButton--small{font-size:1em;height:32px;width:32px}.spui-IconButton--exSmall{font-size:1em;height:24px;width:24px}.spui-IconButton--contained{background-color:var(--IconButton--contained-backgroundColor);border:none;color:var(--IconButton--contained-color)}.spui-IconButton--contained:active{background-color:var(--IconButton--contained-onActive-backgroundColor)}@media (hover:hover){.spui-IconButton--contained:not([disabled]):hover{background-color:var(--IconButton--contained-onHover-backgroundColor)}}.spui-IconButton--outlined{background-color:transparent;border:2px solid var(--IconButton--outlined-borderColor);color:var(--IconButton--outlined-color)}.spui-IconButton--outlined:active{background-color:var(--IconButton--outlined-onActive-backgroundColor)}@media (hover:hover){.spui-IconButton--outlined:not([disabled]):hover{background-color:var(--IconButton--outlined-onHover-backgroundColor)}}.spui-IconButton--lighted{background-color:var(--IconButton--lighted-backgroundColor);border:none;color:var(--IconButton--lighted-color);padding-bottom:8px;padding-top:8px}.spui-IconButton--lighted:active{background-color:var(--IconButton--lighted-onActive-backgroundColor)}@media (hover:hover){.spui-IconButton--lighted:not([disabled]):hover{background-color:var(--IconButton--lighted-onHover-backgroundColor)}}.spui-IconButton--neutral{background-color:var(--IconButton--neutral-backgroundColor);border:none;color:var(--IconButton--neutral-color)}.spui-IconButton--neutral:active{background-color:var(--IconButton--neutral-onActive-backgroundColor)}@media (hover:hover){.spui-IconButton--neutral:not([disabled]):hover{background-color:var(--IconButton--neutral-onHover-backgroundColor)}}.spui-IconButton--danger{background-color:transparent;border:2px solid var(--IconButton--danger-borderColor);color:var(--IconButton--danger-color)}.spui-IconButton--danger:active{background-color:var(--IconButton--danger-onActive-backgroundColor)}@media (hover:hover){.spui-IconButton--danger:hover{background-color:var(--IconButton--danger-onHover-backgroundColor)}}

package/IconButton/IconButton.mjs

@@ -0,0 +1,5 @@
+import React, { forwardRef } from 'react';
+const BLOCK_NAME = 'spui-IconButton';
+export const IconButton = forwardRef(function IconButton({ children, size = 'large', variant = 'contained', ...rest }, ref) {
+    return (React.createElement("button", Object.assign({ className: `${BLOCK_NAME} ${BLOCK_NAME}--${size} ${BLOCK_NAME}--${variant}`, ref: ref }, rest), children));
+});

package/IconButton/index.mjs

@@ -0,0 +1 @@
+export { IconButton } from './IconButton';

package/LinkButton/LinkButton.css

@@ -1 +1 @@
-:root{--LinkButton-tapHighlightColor:var(--gray-5-alpha);--LinkButton-onFocus-boxShadow:0 0 0 1px var(--color-surface-primary),0 0 0 3px var(--color-focus-clarity);--LinkButton--contained-backgroundColor:var(--color-surface-accent-primary);--LinkButton--contained-color:var(--color-text-high-emphasis-inverse);--LinkButton--contained-onActive-backgroundColor:var(--primary-green-100);--LinkButton--contained-onHover-backgroundColor:var(--primary-green-100);--LinkButton--outlined-borderColor:var(--color-surface-accent-primary);--LinkButton--outlined-color:var(--color-surface-accent-primary);--LinkButton--outlined-onActive-backgroundColor:var(--primary-green-5);--LinkButton--outlined-onHover-backgroundColor:var(--primary-green-5);--LinkButton--lighted-backgroundColor:var(--color-surface-accent-primary-light);--LinkButton--lighted-color:var(--color-text-accent-primary);--LinkButton--lighted-onActive-backgroundColor:var(--primary-green-10);--LinkButton--lighted-onHover-backgroundColor:var(--primary-green-10);--LinkButton--neutral-backgroundColor:var(--color-surface-tertiary);--LinkButton--neutral-color:var(--color-text-medium-emphasis);--LinkButton--neutral-onActive-backgroundColor:var(--gray-20-alpha);--LinkButton--neutral-onHover-backgroundColor:var(--gray-20-alpha);--LinkButton--danger-borderColor:var(--color-text-caution);--LinkButton--danger-color:var(--color-text-caution);--LinkButton--danger-onActive-backgroundColor:var(--caution-red-5-alpha);--LinkButton--danger-onHover-backgroundColor:var(--caution-red-5-alpha)}.spui-LinkButton{align-items:center;box-sizing:border-box;display:inline-flex;font-family:inherit;font-weight:700;justify-content:center;line-height:1.3;-webkit-tap-highlight-color:var(--LinkButton-tapHighlightColor);text-align:center;text-decoration:none;transition:background-color .3s}.spui-LinkButton:focus{box-shadow:var(--LinkButton-onFocus-boxShadow);outline:none}.spui-LinkButton:focus:not(:focus-visible){box-shadow:none}.spui-LinkButton--fullWidth{width:100%}.spui-LinkButton--large{border-radius:3em;font-size:1em;min-height:48px;padding-left:16px;padding-right:16px}.spui-LinkButton--medium{border-radius:2.85714em;font-size:.875em;min-height:40px;padding-left:16px;padding-right:16px}.spui-LinkButton--small{border-radius:2.46154em;font-size:.8125em;min-height:32px;padding-left:10px;padding-right:10px}@media (-ms-high-contrast:active),(-ms-high-contrast:none){.spui-LinkButton--large,.spui-LinkButton--medium,.spui-LinkButton--small{height:1px}}.spui-LinkButton--contained{background-color:var(--LinkButton--contained-backgroundColor);border:none;color:var(--LinkButton--contained-color);padding-bottom:8px;padding-top:8px}.spui-LinkButton--contained:active{background-color:var(--LinkButton--contained-onActive-backgroundColor)}@media (hover:hover){.spui-LinkButton--contained:hover{background-color:var(--LinkButton--contained-onHover-backgroundColor)}}.spui-LinkButton--outlined{background-color:transparent;border:2px solid var(--LinkButton--outlined-borderColor);color:var(--LinkButton--outlined-color);padding-bottom:6px;padding-top:6px}.spui-LinkButton--outlined:active{background-color:var(--LinkButton--outlined-onActive-backgroundColor)}@media (hover:hover){.spui-LinkButton--outlined:hover{background-color:var(--LinkButton--outlined-onHover-backgroundColor)}}.spui-LinkButton--lighted{background-color:var(--LinkButton--lighted-backgroundColor);border:none;color:var(--LinkButton--lighted-color);padding-bottom:8px;padding-top:8px}.spui-LinkButton--lighted:active{background-color:var(--LinkButton--lighted-onActive-backgroundColor)}@media (hover:hover){.spui-LinkButton--lighted:hover{background-color:var(--LinkButton--lighted-onHover-backgroundColor)}}.spui-LinkButton--neutral{background-color:var(--LinkButton--neutral-backgroundColor);border:none;color:var(--LinkButton--neutral-color);padding-bottom:8px;padding-top:8px}.spui-LinkButton--neutral:active{background-color:var(--LinkButton--neutral-onActive-backgroundColor)}@media (hover:hover){.spui-LinkButton--neutral:hover{background-color:var(--LinkButton--neutral-onHover-backgroundColor)}}.spui-LinkButton--danger{background-color:transparent;border:2px solid var(--LinkButton--danger-borderColor);color:var(--LinkButton--danger-color);padding-bottom:6px;padding-top:6px}.spui-LinkButton--danger:active{background-color:var(--LinkButton--danger-onActive-backgroundColor)}@media (hover:hover){.spui-LinkButton--danger:hover{background-color:var(--LinkButton--danger-onHover-backgroundColor)}}.spui-LinkButton-icon{line-height:0}.spui-LinkButton-icon--large{font-size:1.375em;margin-right:6px}.spui-LinkButton-icon--medium{font-size:1.429em;margin-right:4px}.spui-LinkButton-icon--small{font-size:1.23em;margin-right:2px}
+:root{--LinkButton-tapHighlightColor:var(--gray-5-alpha);--LinkButton-onFocus-boxShadow:0 0 0 1px var(--color-surface-primary),0 0 0 3px var(--color-focus-clarity);--LinkButton--contained-backgroundColor:var(--color-surface-accent-primary);--LinkButton--contained-color:var(--color-text-high-emphasis-inverse);--LinkButton--contained-onActive-backgroundColor:var(--primary-green-100);--LinkButton--contained-onHover-backgroundColor:var(--primary-green-100);--LinkButton--outlined-borderColor:var(--color-border-accent-primary);--LinkButton--outlined-color:var(--color-text-accent-primary);--LinkButton--outlined-onActive-backgroundColor:var(--primary-green-5);--LinkButton--outlined-onHover-backgroundColor:var(--primary-green-5);--LinkButton--lighted-backgroundColor:var(--color-surface-accent-primary-light);--LinkButton--lighted-color:var(--color-text-accent-primary);--LinkButton--lighted-onActive-backgroundColor:var(--primary-green-10);--LinkButton--lighted-onHover-backgroundColor:var(--primary-green-10);--LinkButton--neutral-backgroundColor:var(--color-surface-tertiary);--LinkButton--neutral-color:var(--color-text-medium-emphasis);--LinkButton--neutral-onActive-backgroundColor:var(--gray-20-alpha);--LinkButton--neutral-onHover-backgroundColor:var(--gray-20-alpha);--LinkButton--danger-borderColor:var(--color-border-caution);--LinkButton--danger-color:var(--color-text-caution);--LinkButton--danger-onActive-backgroundColor:var(--caution-red-5-alpha);--LinkButton--danger-onHover-backgroundColor:var(--caution-red-5-alpha)}.spui-LinkButton{align-items:center;box-sizing:border-box;display:inline-flex;font-family:inherit;font-weight:700;justify-content:center;line-height:1.3;-webkit-tap-highlight-color:var(--LinkButton-tapHighlightColor);text-align:center;text-decoration:none;transition:background-color .3s}.spui-LinkButton:focus{box-shadow:var(--LinkButton-onFocus-boxShadow);outline:none}.spui-LinkButton:focus:not(:focus-visible){box-shadow:none}.spui-LinkButton--fullWidth{width:100%}.spui-LinkButton--large{border-radius:3em;font-size:1em;min-height:48px;padding-left:16px;padding-right:16px}.spui-LinkButton--medium{border-radius:2.85714em;font-size:.875em;min-height:40px;padding-left:16px;padding-right:16px}.spui-LinkButton--small{border-radius:2.46154em;font-size:.8125em;min-height:32px;padding-left:10px;padding-right:10px}@media (-ms-high-contrast:active),(-ms-high-contrast:none){.spui-LinkButton--large,.spui-LinkButton--medium,.spui-LinkButton--small{height:1px}}.spui-LinkButton--contained{background-color:var(--LinkButton--contained-backgroundColor);border:none;color:var(--LinkButton--contained-color);padding-bottom:8px;padding-top:8px}.spui-LinkButton--contained:active{background-color:var(--LinkButton--contained-onActive-backgroundColor)}@media (hover:hover){.spui-LinkButton--contained:hover{background-color:var(--LinkButton--contained-onHover-backgroundColor)}}.spui-LinkButton--outlined{background-color:transparent;border:2px solid var(--LinkButton--outlined-borderColor);color:var(--LinkButton--outlined-color);padding-bottom:6px;padding-top:6px}.spui-LinkButton--outlined:active{background-color:var(--LinkButton--outlined-onActive-backgroundColor)}@media (hover:hover){.spui-LinkButton--outlined:hover{background-color:var(--LinkButton--outlined-onHover-backgroundColor)}}.spui-LinkButton--lighted{background-color:var(--LinkButton--lighted-backgroundColor);border:none;color:var(--LinkButton--lighted-color);padding-bottom:8px;padding-top:8px}.spui-LinkButton--lighted:active{background-color:var(--LinkButton--lighted-onActive-backgroundColor)}@media (hover:hover){.spui-LinkButton--lighted:hover{background-color:var(--LinkButton--lighted-onHover-backgroundColor)}}.spui-LinkButton--neutral{background-color:var(--LinkButton--neutral-backgroundColor);border:none;color:var(--LinkButton--neutral-color);padding-bottom:8px;padding-top:8px}.spui-LinkButton--neutral:active{background-color:var(--LinkButton--neutral-onActive-backgroundColor)}@media (hover:hover){.spui-LinkButton--neutral:hover{background-color:var(--LinkButton--neutral-onHover-backgroundColor)}}.spui-LinkButton--danger{background-color:transparent;border:2px solid var(--LinkButton--danger-borderColor);color:var(--LinkButton--danger-color);padding-bottom:6px;padding-top:6px}.spui-LinkButton--danger:active{background-color:var(--LinkButton--danger-onActive-backgroundColor)}@media (hover:hover){.spui-LinkButton--danger:hover{background-color:var(--LinkButton--danger-onHover-backgroundColor)}}.spui-LinkButton-icon{line-height:0}.spui-LinkButton-icon--large{font-size:1.375em;margin-right:6px}.spui-LinkButton-icon--medium{font-size:1.429em;margin-right:4px}.spui-LinkButton-icon--small{font-size:1.23em;margin-right:2px}

package/LinkButton/LinkButton.mjs

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+const BLOCK_NAME = 'spui-LinkButton';
+export const LinkButton = forwardRef(function LinkButton({ children, layout = 'intrinsic', size = 'large', variant = 'contained', icon, ...rest }, ref) {
+    return (React.createElement("a", Object.assign({ className: `${BLOCK_NAME} ${BLOCK_NAME}--${layout} ${BLOCK_NAME}--${size} ${BLOCK_NAME}--${variant}`, ref: ref }, rest), icon ? (React.createElement(React.Fragment, null,
+        React.createElement("span", { className: `${BLOCK_NAME}-icon ${BLOCK_NAME}-icon--${size}` }, icon),
+        children)) : (children)));
+});

package/LinkButton/index.mjs

@@ -0,0 +1 @@
+export { LinkButton } from './LinkButton';

package/README.md

@@ -37,7 +37,9 @@ function App() {
 ReactDOM.render(<App />, document.querySelector('#app'));
 ```
 
-詳細は[コンポーネント一覧](#コンポーネント一覧)、[サンプルアプリケーション](#サンプルアプリケーション)を参照してください。
+Spindle UIはmodule版の配信もしています。利用する際には、[導入ガイド](https://github.com/openameba/spindle/pull/175)を参考にしてください。
+
+さらなる詳細は[コンポーネント一覧](#コンポーネント一覧)、[サンプルアプリケーション](#サンプルアプリケーション)を参照してください。
 
 > **_NOTE:_**  アイコン利用時は[Spindle IconsのReactコンポーネント](/packages/spindle-icons#react)を読み、注意点を確認してください。
 

package/Toast/Toast.mjs

@@ -0,0 +1,67 @@
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+export const BLOCK_NAME = 'spui-Toast';
+// Duration for css animation.
+export const ANIMATION_DURATION = 500;
+const MIN_DURATION = 4000;
+const MAX_DURATION = 100000;
+const getAnimationClassName = (isShow, animation) => {
+    return isShow ? `${BLOCK_NAME}-${animation}--in` : '';
+};
+const limitDuration = (duration) => {
+    if (duration < MIN_DURATION || duration > MAX_DURATION) {
+        return MIN_DURATION;
+    }
+    return duration;
+};
+export const Toast = ({ children, active = false, duration = 4000, animation = 'slide', position = 'top', hasError = false, onHide, }) => {
+    const [isShow, setIsShow] = useState(false);
+    const animationClassName = getAnimationClassName(isShow, animation);
+    const errorContentClassName = hasError ? `${BLOCK_NAME}-content--error` : '';
+    const formattedDuration = limitDuration(duration) - ANIMATION_DURATION;
+    const timeoutID = useRef(null);
+    const transitionElementRef = useRef(null);
+    const setIsShowWithTimeout = useCallback(() => {
+        // Out animation is executed after `formattedDuration` seconds.
+        if (timeoutID.current === null && isShow) {
+            timeoutID.current = window.setTimeout(() => {
+                setIsShow(false);
+            }, formattedDuration);
+        }
+    }, [isShow, timeoutID, setIsShow, formattedDuration]);
+    const resetTimeout = useCallback(() => {
+        if (timeoutID.current) {
+            window.clearTimeout(timeoutID.current);
+            timeoutID.current = null;
+        }
+    }, [timeoutID]);
+    const handleTransitionEnd = useCallback(() => {
+        if (onHide && !isShow) {
+            onHide();
+            timeoutID.current = null;
+        }
+    }, [isShow, setIsShow, onHide]);
+    useEffect(() => {
+        // Animation is not stopped even if `active` props is changed while running animation.
+        if (active && timeoutID.current === null) {
+            setIsShow(true);
+        }
+    }, [active]);
+    useEffect(() => {
+        setIsShowWithTimeout();
+        return resetTimeout;
+    }, [setIsShowWithTimeout, resetTimeout]);
+    useEffect(() => {
+        const transitionElement = transitionElementRef.current;
+        // When out animation is finished, `onHide` method is invoked.
+        if (transitionElement) {
+            transitionElement.addEventListener('transitionend', handleTransitionEnd);
+        }
+        return () => {
+            if (transitionElement) {
+                transitionElement.removeEventListener('transitionend', handleTransitionEnd);
+            }
+        };
+    }, [transitionElementRef, handleTransitionEnd]);
+    return (React.createElement("div", { className: `${BLOCK_NAME} ${BLOCK_NAME}--${position} ${BLOCK_NAME}--${animation} ${animationClassName}`, ref: transitionElementRef },
+        React.createElement("div", { className: `${BLOCK_NAME}--content ${errorContentClassName}`, tabIndex: 0, onMouseOver: resetTimeout, onMouseOut: setIsShowWithTimeout, onFocus: resetTimeout, onBlur: setIsShowWithTimeout }, children)));
+};

package/Toast/index.mjs

@@ -0,0 +1 @@
+export { Toast } from './Toast';