@ttdk-design-system/library-react 0.0.0-stage → 1.0.1

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 (184) hide show
  1. package/AI_GUIDE.md +6518 -0
  2. package/README.md +106 -2
  3. package/llms.txt +6518 -0
  4. package/package.json +1099 -4
  5. package/src/core/index.ts +2 -0
  6. package/src/core/tailwind-preset.cjs +62 -0
  7. package/src/core/tailwind-preset.ts +85 -0
  8. package/src/core/theme/tokens.css +663 -0
  9. package/src/core/types.ts +836 -0
  10. package/src/index.ts +17 -0
  11. package/src/tailwind-preset.cjs +62 -0
  12. package/src/tailwind-preset.ts +85 -0
  13. package/src/types.ts +1 -0
  14. package/src/web/accordion/AI_GUIDE.md +149 -0
  15. package/src/web/accordion/accordion.css +1 -0
  16. package/src/web/accordion/accordion.tsx +430 -0
  17. package/src/web/accordion/index.ts +3 -0
  18. package/src/web/accordion/manifest.json +351 -0
  19. package/src/web/alert/AI_GUIDE.md +139 -0
  20. package/src/web/alert/alert.css +1 -0
  21. package/src/web/alert/alert.tsx +318 -0
  22. package/src/web/alert/index.ts +3 -0
  23. package/src/web/alert/manifest.json +240 -0
  24. package/src/web/avatar/AI_GUIDE.md +118 -0
  25. package/src/web/avatar/avatar.css +1 -0
  26. package/src/web/avatar/avatar.tsx +233 -0
  27. package/src/web/avatar/index.ts +3 -0
  28. package/src/web/avatar/manifest.json +195 -0
  29. package/src/web/badge/AI_GUIDE.md +94 -0
  30. package/src/web/badge/badge.css +1 -0
  31. package/src/web/badge/badge.tsx +140 -0
  32. package/src/web/badge/index.ts +2 -0
  33. package/src/web/badge/manifest.json +141 -0
  34. package/src/web/banner/AI_GUIDE.md +130 -0
  35. package/src/web/banner/banner.css +1 -0
  36. package/src/web/banner/banner.tsx +334 -0
  37. package/src/web/banner/index.ts +3 -0
  38. package/src/web/banner/manifest.json +240 -0
  39. package/src/web/breadcrumb/AI_GUIDE.md +120 -0
  40. package/src/web/breadcrumb/breadcrumb.css +1 -0
  41. package/src/web/breadcrumb/breadcrumb.tsx +306 -0
  42. package/src/web/breadcrumb/index.ts +3 -0
  43. package/src/web/breadcrumb/manifest.json +225 -0
  44. package/src/web/button/AI_GUIDE.md +121 -0
  45. package/src/web/button/button.css +1 -0
  46. package/src/web/button/button.tsx +287 -0
  47. package/src/web/button/index.ts +2 -0
  48. package/src/web/button/manifest.json +177 -0
  49. package/src/web/calendar/AI_GUIDE.md +151 -0
  50. package/src/web/calendar/calendar.css +1 -0
  51. package/src/web/calendar/calendar.tsx +1611 -0
  52. package/src/web/calendar/index.ts +3 -0
  53. package/src/web/calendar/manifest.json +470 -0
  54. package/src/web/card/AI_GUIDE.md +133 -0
  55. package/src/web/card/card.css +1 -0
  56. package/src/web/card/card.tsx +408 -0
  57. package/src/web/card/index.ts +4 -0
  58. package/src/web/card/manifest.json +357 -0
  59. package/src/web/checkbox/AI_GUIDE.md +146 -0
  60. package/src/web/checkbox/checkbox.css +1 -0
  61. package/src/web/checkbox/checkbox.tsx +307 -0
  62. package/src/web/checkbox/index.ts +2 -0
  63. package/src/web/checkbox/manifest.json +294 -0
  64. package/src/web/chip/AI_GUIDE.md +186 -0
  65. package/src/web/chip/chip.css +1 -0
  66. package/src/web/chip/chip.tsx +230 -0
  67. package/src/web/chip/index.ts +2 -0
  68. package/src/web/chip/manifest.json +186 -0
  69. package/src/web/dropdown/AI_GUIDE.md +167 -0
  70. package/src/web/dropdown/dropdown.css +1 -0
  71. package/src/web/dropdown/dropdown.tsx +1274 -0
  72. package/src/web/dropdown/index.ts +3 -0
  73. package/src/web/dropdown/manifest.json +576 -0
  74. package/src/web/flex/AI_GUIDE.md +113 -0
  75. package/src/web/flex/flex-item.tsx +97 -0
  76. package/src/web/flex/flex.css +1 -0
  77. package/src/web/flex/flex.tsx +108 -0
  78. package/src/web/flex/index.ts +5 -0
  79. package/src/web/flex/manifest.json +162 -0
  80. package/src/web/form/index.ts +7 -0
  81. package/src/web/grid/AI_GUIDE.md +112 -0
  82. package/src/web/grid/grid-item.tsx +112 -0
  83. package/src/web/grid/grid.css +1 -0
  84. package/src/web/grid/grid.tsx +99 -0
  85. package/src/web/grid/index.ts +5 -0
  86. package/src/web/grid/manifest.json +153 -0
  87. package/src/web/index.ts +86 -0
  88. package/src/web/input/AI_GUIDE.md +159 -0
  89. package/src/web/input/index.ts +3 -0
  90. package/src/web/input/input.css +1 -0
  91. package/src/web/input/input.tsx +537 -0
  92. package/src/web/input/manifest.json +465 -0
  93. package/src/web/input-number/AI_GUIDE.md +164 -0
  94. package/src/web/input-number/index.ts +3 -0
  95. package/src/web/input-number/input-number.css +1 -0
  96. package/src/web/input-number/input-number.tsx +1193 -0
  97. package/src/web/input-number/manifest.json +575 -0
  98. package/src/web/modal/AI_GUIDE.md +171 -0
  99. package/src/web/modal/index.ts +3 -0
  100. package/src/web/modal/manifest.json +375 -0
  101. package/src/web/modal/modal.css +1 -0
  102. package/src/web/modal/modal.tsx +571 -0
  103. package/src/web/pagination/AI_GUIDE.md +148 -0
  104. package/src/web/pagination/index.ts +21 -0
  105. package/src/web/pagination/manifest.json +432 -0
  106. package/src/web/pagination/pagination-content.tsx +45 -0
  107. package/src/web/pagination/pagination-ellipsis.tsx +54 -0
  108. package/src/web/pagination/pagination-first.tsx +155 -0
  109. package/src/web/pagination/pagination-item.tsx +45 -0
  110. package/src/web/pagination/pagination-last.tsx +155 -0
  111. package/src/web/pagination/pagination-link.tsx +121 -0
  112. package/src/web/pagination/pagination-next.tsx +158 -0
  113. package/src/web/pagination/pagination-previous.tsx +158 -0
  114. package/src/web/pagination/pagination.css +1 -0
  115. package/src/web/pagination/pagination.tsx +687 -0
  116. package/src/web/popover/AI_GUIDE.md +163 -0
  117. package/src/web/popover/index.ts +3 -0
  118. package/src/web/popover/manifest.json +396 -0
  119. package/src/web/popover/popover.css +1 -0
  120. package/src/web/popover/popover.tsx +702 -0
  121. package/src/web/radio/AI_GUIDE.md +155 -0
  122. package/src/web/radio/index.ts +2 -0
  123. package/src/web/radio/manifest.json +294 -0
  124. package/src/web/radio/radio.css +1 -0
  125. package/src/web/radio/radio.tsx +290 -0
  126. package/src/web/selectbox/AI_GUIDE.md +216 -0
  127. package/src/web/selectbox/index.ts +3 -0
  128. package/src/web/selectbox/manifest.json +477 -0
  129. package/src/web/selectbox/selectbox.css +1 -0
  130. package/src/web/selectbox/selectbox.tsx +1048 -0
  131. package/src/web/sonner/AI_GUIDE.md +98 -0
  132. package/src/web/sonner/index.ts +114 -0
  133. package/src/web/sonner/manifest.json +132 -0
  134. package/src/web/sonner/sonner.css +1 -0
  135. package/src/web/sonner/sonner.tsx +177 -0
  136. package/src/web/table/AI_GUIDE.md +145 -0
  137. package/src/web/table/index.ts +35 -0
  138. package/src/web/table/manifest.json +168 -0
  139. package/src/web/table/table-body.tsx +45 -0
  140. package/src/web/table/table-caption.tsx +45 -0
  141. package/src/web/table/table-cell.tsx +74 -0
  142. package/src/web/table/table-empty.tsx +108 -0
  143. package/src/web/table/table-footer.tsx +45 -0
  144. package/src/web/table/table-head.tsx +80 -0
  145. package/src/web/table/table-header.tsx +45 -0
  146. package/src/web/table/table-row.tsx +69 -0
  147. package/src/web/table/table.css +1 -0
  148. package/src/web/table/table.tsx +305 -0
  149. package/src/web/tabs/AI_GUIDE.md +150 -0
  150. package/src/web/tabs/index.ts +3 -0
  151. package/src/web/tabs/manifest.json +315 -0
  152. package/src/web/tabs/tabs.css +1 -0
  153. package/src/web/tabs/tabs.tsx +332 -0
  154. package/src/web/text/AI_GUIDE.md +129 -0
  155. package/src/web/text/index.ts +3 -0
  156. package/src/web/text/manifest.json +195 -0
  157. package/src/web/text/text.css +1 -0
  158. package/src/web/text/text.tsx +689 -0
  159. package/src/web/textarea/AI_GUIDE.md +141 -0
  160. package/src/web/textarea/index.ts +3 -0
  161. package/src/web/textarea/manifest.json +438 -0
  162. package/src/web/textarea/textarea.css +1 -0
  163. package/src/web/textarea/textarea.tsx +467 -0
  164. package/src/web/tooltip/AI_GUIDE.md +110 -0
  165. package/src/web/tooltip/index.ts +3 -0
  166. package/src/web/tooltip/manifest.json +222 -0
  167. package/src/web/tooltip/tooltip.css +1 -0
  168. package/src/web/tooltip/tooltip.tsx +423 -0
  169. package/src/webview/bottomsheet/AI_GUIDE.md +141 -0
  170. package/src/webview/bottomsheet/bottomsheet.css +1 -0
  171. package/src/webview/bottomsheet/bottomsheet.tsx +603 -0
  172. package/src/webview/bottomsheet/index.ts +4 -0
  173. package/src/webview/bottomsheet/manifest.json +377 -0
  174. package/src/webview/button/AI_GUIDE.md +79 -0
  175. package/src/webview/button/button-ios.css +1 -0
  176. package/src/webview/button/button-ios.tsx +138 -0
  177. package/src/webview/button/button-material.css +1 -0
  178. package/src/webview/button/button-material.tsx +138 -0
  179. package/src/webview/button/index.ts +7 -0
  180. package/src/webview/button/manifest.json +148 -0
  181. package/src/webview/index.ts +7 -0
  182. package/tailwind-preset.cjs +62 -0
  183. package/tailwind-preset.js +62 -0
  184. package/ttdk-manifest.json +10188 -0
package/src/web/calendar/calendar.css ADDED
@@ -0,0 +1 @@
1
+ :root{--ttdk-cal-font-family:var(--ttdk-font-sans);--ttdk-cal-bg:var(--ttdk-bg-base-primary);--ttdk-cal-border:var(--ttdk-stroke-subtle);--ttdk-cal-text-primary:var(--ttdk-text-icon-primary);--ttdk-cal-text-secondary:var(--ttdk-text-icon-secondary);--ttdk-cal-text-muted:var(--ttdk-text-icon-disabled);--ttdk-cal-brand:var(--ttdk-brand-default);--ttdk-cal-brand-hover:var(--ttdk-brand-strong);--ttdk-cal-brand-light:var(--ttdk-brand-subtle);--ttdk-cal-brand-range:color-mix(in srgb, var(--ttdk-brand-strong) 15%, transparent);--ttdk-cal-brand-text-inv:var(--ttdk-color-neutral-white);--ttdk-cal-today-border:var(--ttdk-stroke-border-focus);--ttdk-cal-hover-bg:var(--ttdk-bg-secondary-disabled);--ttdk-cal-radius:8px;--ttdk-cal-cell-size:38px;--ttdk-cal-font-size:14px}.dark,[data-theme=dark]{--ttdk-cal-bg:var(--ttdk-bg-base-primary);--ttdk-cal-border:var(--ttdk-stroke-subtle);--ttdk-cal-text-primary:var(--ttdk-text-icon-primary);--ttdk-cal-text-secondary:var(--ttdk-text-icon-secondary);--ttdk-cal-text-muted:var(--ttdk-text-icon-disabled);--ttdk-cal-brand:var(--ttdk-brand-default);--ttdk-cal-brand-hover:var(--ttdk-brand-strong);--ttdk-cal-brand-light:color-mix(in srgb, var(--ttdk-brand-strong) 20%, transparent);--ttdk-cal-brand-range:color-mix(in srgb, var(--ttdk-brand-strong) 25%, transparent);--ttdk-cal-brand-text-inv:var(--ttdk-bg-secondary-disabled);--ttdk-cal-today-border:var(--ttdk-stroke-border-focus);--ttdk-cal-hover-bg:var(--ttdk-bg-secondary-disabled)}.ttdk-calendar{background-color:var(--ttdk-cal-bg);border-radius:var(--ttdk-cal-radius);font-family:var(--ttdk-cal-font-family);font-size:var(--ttdk-cal-font-size);color:var(--ttdk-ui-color,var(--ttdk-cal-text-primary));user-select:none;box-sizing:border-box;flex-direction:column;width:fit-content;max-width:100%;padding:16px;transition:border-color .2s,box-shadow .2s;display:inline-flex}@media screen and (width<=600px){.ttdk-calendar{box-sizing:border-box;width:100%;max-width:100%;padding:12px 6px}}.ttdk-calendar *,.ttdk-calendar :before,.ttdk-calendar :after{box-sizing:border-box}.ttdk-calendar-bordered{border:1px solid var(--ttdk-cal-border)}.ttdk-calendar-card{border:1px solid var(--ttdk-cal-border);box-shadow:0 4px 6px -1px #0000000d,0 2px 4px -2px #0000000d}.ttdk-calendar-flat{box-shadow:none;background:0 0;border:none;padding:0}.ttdk-calendar-sm{--ttdk-cal-cell-size:32px;--ttdk-cal-font-size:12.5px;padding:12px}.ttdk-calendar-md{--ttdk-cal-cell-size:38px;--ttdk-cal-font-size:14px}.ttdk-calendar-lg{--ttdk-cal-cell-size:44px;--ttdk-cal-font-size:15.5px;padding:20px}.ttdk-calendar-rounded-none{--ttdk-cal-radius:0px}.ttdk-calendar-rounded-sm{--ttdk-cal-radius:4px}.ttdk-calendar-rounded-md{--ttdk-cal-radius:8px}.ttdk-calendar-rounded-lg{--ttdk-cal-radius:12px}.ttdk-calendar-rounded-xl{--ttdk-cal-radius:16px}.ttdk-calendar-rounded-full{--ttdk-cal-radius:20px}.ttdk-calendar-months{flex-flow:wrap;align-items:flex-start;gap:24px;width:100%;max-width:100%;display:flex}.ttdk-calendar-month{width:calc(var(--ttdk-cal-cell-size) * 7);box-sizing:border-box;flex-direction:column;flex:none;max-width:100%;display:flex}@media screen and (width<=600px){.ttdk-calendar-months{flex-direction:column;gap:20px;width:100%}.ttdk-calendar-month{width:100%;min-width:0;max-width:100%}.ttdk-calendar-header{gap:2px}.ttdk-calendar-nav-btn{width:24px;height:24px}.ttdk-calendar-nav-btn svg{width:14px;height:14px}.ttdk-calendar-title-btn{padding:3px 4px;font-size:.95em}.ttdk-calendar-cell{aspect-ratio:1;height:auto}.ttdk-calendar-day{aspect-ratio:1;width:calc(100% - 2px);height:calc(100% - 2px)}}.ttdk-calendar-header{justify-content:space-between;align-items:center;gap:0;margin-bottom:12px;display:flex;position:relative}.ttdk-calendar-title-group{flex:1;justify-content:center;align-items:center;gap:0;display:flex}.ttdk-calendar-title{color:var(--ttdk-cal-text-primary);cursor:default;background:0 0;border:none;border-radius:6px;align-items:center;gap:4px;padding:4px 8px;font-size:1em;font-weight:600;line-height:1.2;display:inline-flex}.ttdk-calendar-title-btn{color:var(--ttdk-cal-text-primary);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;align-items:center;gap:4px;padding:4px;font-family:inherit;font-size:1em;font-weight:600;line-height:1.2;transition:background-color .15s,color .15s,border-color .15s;display:inline-flex}.ttdk-calendar-title-btn:hover:not(:disabled){background-color:var(--ttdk-cal-hover-bg);color:var(--ttdk-cal-brand)}.ttdk-calendar-title-btn:focus-visible{outline:2px solid var(--ttdk-cal-brand);outline-offset:1px}.ttdk-calendar-title-btn:disabled{opacity:.5;cursor:not-allowed}.ttdk-calendar-nav-group{align-items:center;gap:4px;display:flex}.ttdk-calendar-nav-btn{width:28px;height:28px;color:var(--ttdk-cal-text-secondary);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;justify-content:center;align-items:center;padding:0;transition:background-color .15s,color .15s,border-color .15s;display:inline-flex}.ttdk-calendar-nav-btn:hover:not(:disabled){background-color:var(--ttdk-cal-hover-bg);color:var(--ttdk-cal-text-primary)}.ttdk-calendar-nav-btn:focus-visible{outline:2px solid var(--ttdk-cal-brand);outline-offset:1px}.ttdk-calendar-nav-btn:disabled{opacity:.35;cursor:not-allowed}.ttdk-calendar-nav-btn svg{stroke-width:2px;flex-shrink:0;width:16px;height:16px}.ttdk-calendar-month-picker-view,.ttdk-calendar-year-picker-view{width:100%;max-width:100%;min-width:calc(var(--ttdk-cal-cell-size) * 7);box-sizing:border-box;flex-direction:column;display:flex}@media screen and (width<=600px){.ttdk-calendar-month-picker-view,.ttdk-calendar-year-picker-view{min-width:0}}.ttdk-calendar-grid-picker{box-sizing:border-box;grid-template-columns:repeat(4,1fr);gap:10px 8px;width:100%;padding:12px 4px;display:grid}.ttdk-calendar-picker-item{min-height:38px;color:var(--ttdk-cal-text-primary);border-radius:var(--ttdk-cal-radius);cursor:pointer;user-select:none;box-sizing:border-box;background:0 0;border:1px solid #0000;justify-content:center;align-items:center;padding:10px 4px;font-family:inherit;font-size:.9em;font-weight:500;transition:all .15s;display:inline-flex}.ttdk-calendar-picker-item:hover:not(:disabled){background-color:var(--ttdk-cal-hover-bg);color:var(--ttdk-cal-text-primary)}.ttdk-calendar-picker-item:disabled{opacity:.35;cursor:not-allowed}.ttdk-calendar-picker-item-selected{font-weight:600;background-color:var(--ttdk-cal-brand)!important;color:var(--ttdk-cal-brand-text-inv)!important}.ttdk-calendar-picker-item-selected:hover:not(:disabled){background-color:var(--ttdk-cal-brand-hover)!important}.ttdk-calendar-picker-item-current:not(.ttdk-calendar-picker-item-selected){color:var(--ttdk-cal-brand);border-color:var(--ttdk-cal-brand);font-weight:700}.ttdk-calendar-picker-item:focus-visible{outline:2px solid var(--ttdk-cal-brand);outline-offset:1px}.ttdk-calendar-sm .ttdk-calendar-picker-item{min-height:32px;padding:6px 2px;font-size:.82em}.ttdk-calendar-lg .ttdk-calendar-picker-item{min-height:44px;padding:12px 6px;font-size:.95em}.ttdk-calendar-table{border-collapse:collapse;table-layout:fixed;border-spacing:0;width:100%}.ttdk-calendar-thead-row{grid-template-columns:repeat(7,1fr);margin-bottom:6px;display:grid}.ttdk-calendar-head-cell{text-transform:uppercase;letter-spacing:.04em;color:var(--ttdk-cal-text-muted);justify-content:center;align-items:center;height:28px;font-size:.8em;font-weight:600;display:flex}.ttdk-calendar-tbody{flex-direction:column;gap:4px;margin:0;padding:0;display:flex}.ttdk-calendar-row{grid-template-columns:repeat(7,1fr);width:100%;margin:0;padding:0;display:grid}.ttdk-calendar-cell{width:100%;height:var(--ttdk-cal-cell-size);justify-content:center;align-items:center;margin:0;padding:0;display:flex;position:relative}.ttdk-calendar-cell-range{background-color:var(--ttdk-cal-brand-range)}.ttdk-calendar-cell-range:first-child{border-top-left-radius:9999px;border-bottom-left-radius:9999px}.ttdk-calendar-cell-range:last-child{border-top-right-radius:9999px;border-bottom-right-radius:9999px}.ttdk-calendar-cell-range-start{background-color:var(--ttdk-cal-brand-range);border-top-left-radius:9999px;border-bottom-left-radius:9999px}.ttdk-calendar-cell-range-start:last-child{border-top-right-radius:9999px;border-bottom-right-radius:9999px}.ttdk-calendar-cell-range-end{background-color:var(--ttdk-cal-brand-range);border-top-right-radius:9999px;border-bottom-right-radius:9999px}.ttdk-calendar-cell-range-end:first-child{border-top-left-radius:9999px;border-bottom-left-radius:9999px}.ttdk-calendar-cell-range-single{background-color:#0000!important;border-radius:0!important}.ttdk-calendar-day{width:calc(var(--ttdk-cal-cell-size) - 4px);height:calc(var(--ttdk-cal-cell-size) - 4px);color:var(--ttdk-cal-text-primary);font-size:inherit;cursor:pointer;z-index:1;background:0 0;border:1px solid #0000;border-radius:9999px;outline:none;flex-direction:column;justify-content:center;align-items:center;font-weight:400;transition:background-color .15s,color .15s,border-color .15s,transform .1s;display:inline-flex;position:relative}.ttdk-calendar-day:hover:not(:disabled):not(.ttdk-calendar-day-selected):not(.ttdk-calendar-day-range-start):not(.ttdk-calendar-day-range-end){background-color:var(--ttdk-cal-hover-bg);color:var(--ttdk-cal-text-primary)}.ttdk-calendar-day:active:not(:disabled){transform:scale(.95)}.ttdk-calendar-day:focus-visible{outline:2px solid var(--ttdk-cal-brand);outline-offset:2px}.ttdk-calendar-day-today{border-color:var(--ttdk-cal-today-border);color:var(--ttdk-cal-brand);font-weight:600}.ttdk-calendar-day-selected,.ttdk-calendar-day-range-start,.ttdk-calendar-day-range-end{width:100%;height:100%;max-width:var(--ttdk-cal-cell-size);max-height:var(--ttdk-cal-cell-size);border-color:var(--ttdk-cal-brand);font-weight:600;box-shadow:0 1px 3px #00000026;background-color:var(--ttdk-cal-brand)!important;color:var(--ttdk-cal-brand-text-inv)!important}.ttdk-calendar-day-in-range{color:var(--ttdk-cal-brand);border-radius:100%;width:100%;height:100%;font-weight:500}.ttdk-calendar-day-outside{color:var(--ttdk-cal-text-muted);opacity:.45}.ttdk-calendar-day-outside:hover:not(:disabled){opacity:.8}.ttdk-calendar-day-disabled{opacity:.25;pointer-events:none;cursor:not-allowed!important}.ttdk-calendar-day-unavailable{color:var(--ttdk-cal-text-muted);opacity:.55;text-decoration:line-through;cursor:not-allowed!important}.ttdk-calendar-marker-dot{background-color:var(--ttdk-cal-brand);border-radius:50%;width:4px;height:4px;transition:transform .15s;position:absolute;bottom:3px}.ttdk-calendar-day-selected .ttdk-calendar-marker-dot,.ttdk-calendar-day-range-start .ttdk-calendar-marker-dot,.ttdk-calendar-day-range-end .ttdk-calendar-marker-dot{background-color:#fff}