@mccustomapps/helaui 0.1.0

package/dist/assets/rain/builtinImages.ts

@@ -0,0 +1,7 @@
+import fritter from './fritter.png';
+import kokis from './kokis.png';
+import leaf from './leaf.png';
+import swirl from './swirl.png';
+
+/** Built-in rain sprite URLs shipped with HelaUI. */
+export const BUILTIN_RAIN_IMAGES = [fritter, swirl, kokis, leaf] as const;

package/dist/assets/sun-mandala/builtinImage.ts

@@ -0,0 +1,4 @@
+import iraHanda from './ira-handa.png';
+
+/** Built-in Sri Lankan Ira Handa (sun face) mandala artwork. */
+export const BUILTIN_SUN_MANDALA_IMAGE = iraHanda;

package/dist/calendar.css

@@ -0,0 +1,280 @@
+/* HelaUI Calendar Component Stylesheet */
+
+.helaui-calendar {
+  display: inline-flex;
+  flex-direction: column;
+  /* Default fixed size — overridden by inline styles from CalendarOptions.width / .height */
+  width: 360px;
+  height: 420px;
+  overflow: hidden;
+  background: var(--helaui-surface, #ffffff);
+  color: var(--helaui-text, #000000);
+  border: 1px solid var(--helaui-border, #c8c8c8);
+  border-radius: 16px;
+  padding: 20px;
+  box-sizing: border-box;
+  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
+  position: relative;
+  user-select: none;
+  font-family: inherit;
+  transition: border-color 0.2s ease, box-shadow 0.2s ease, height 0.2s ease;
+  flex-shrink: 0;
+}
+
+/* Months that span 6 rows get an extra row height automatically (unless caller passes custom height) */
+.helaui-calendar--six-rows {
+  height: 468px;
+}
+
+.helaui-calendar:hover {
+  border-color: var(--helaui-border-hover, #808080);
+  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.1);
+}
+
+/* Header */
+.helaui-calendar__header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 16px;
+  gap: 8px;
+}
+
+.helaui-calendar__title-wrap {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  cursor: pointer;
+  padding: 4px 12px;
+  border-radius: 10px;
+  transition: background-color 0.2s ease;
+}
+
+.helaui-calendar__title-wrap:hover {
+  background-color: rgba(141, 21, 58, 0.06);
+}
+
+.helaui-calendar__month-name {
+  font-size: 1.15rem;
+  font-weight: 700;
+  color: var(--helaui-primary, #8d153a);
+  line-height: 1.3;
+}
+
+.helaui-calendar__sub-name {
+  font-size: 0.75rem;
+  color: var(--helaui-text-muted, #808080);
+  font-weight: 500;
+}
+
+.helaui-calendar__era-badge {
+  display: inline-block;
+  margin-left: 4px;
+  padding: 1px 6px;
+  font-size: 0.7rem;
+  border-radius: 6px;
+  background: rgba(255, 190, 0, 0.18);
+  color: #8d153a;
+  font-weight: 600;
+}
+
+.helaui-calendar__nav-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 34px;
+  height: 34px;
+  border: 1px solid var(--helaui-border, #c8c8c8);
+  background: var(--helaui-background, #ffffff);
+  color: var(--helaui-text, #000000);
+  border-radius: 50%;
+  cursor: pointer;
+  font-size: 1rem;
+  transition: all 0.2s ease;
+}
+
+.helaui-calendar__nav-btn:hover:not(:disabled) {
+  background: var(--helaui-primary, #8d153a);
+  color: var(--helaui-white, #ffffff);
+  border-color: var(--helaui-primary, #8d153a);
+  transform: scale(1.06);
+}
+
+.helaui-calendar__nav-btn:disabled {
+  opacity: 0.35;
+  cursor: not-allowed;
+}
+
+/* Weekday Grid */
+.helaui-calendar__weekdays {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  gap: 4px;
+  text-align: center;
+  margin-bottom: 8px;
+}
+
+.helaui-calendar__weekday {
+  font-size: 0.8rem;
+  font-weight: 600;
+  color: var(--helaui-text-muted, #808080);
+  padding: 6px 0;
+}
+
+.helaui-calendar__weekday--weekend {
+  color: var(--helaui-primary, #8d153a);
+}
+
+/* Days Grid */
+.helaui-calendar__days {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  gap: 6px;
+}
+
+.helaui-calendar__day {
+  aspect-ratio: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid transparent;
+  border-radius: 12px;
+  background: transparent;
+  color: var(--helaui-text, #000000);
+  font-size: 0.9rem;
+  font-weight: 500;
+  cursor: pointer;
+  position: relative;
+  transition: all 0.18s ease-in-out;
+}
+
+.helaui-calendar__day:hover:not(.helaui-calendar__day--disabled) {
+  background-color: rgba(141, 21, 58, 0.08);
+  border-color: var(--helaui-primary, #8d153a);
+  transform: translateY(-1px);
+}
+
+.helaui-calendar__day--outside {
+  color: var(--helaui-disabled-text, #a3a3a3);
+  opacity: 0.45;
+}
+
+.helaui-calendar__day--today {
+  font-weight: 700;
+  border-color: var(--helaui-secondary, #ffbe00);
+  background: rgba(255, 190, 0, 0.15);
+}
+
+.helaui-calendar__day--selected {
+  background: var(--helaui-primary, #8d153a) !important;
+  color: var(--helaui-white, #ffffff) !important;
+  font-weight: 700;
+  box-shadow: 0 4px 12px rgba(141, 21, 58, 0.35);
+}
+
+.helaui-calendar__day--poya {
+  position: relative;
+}
+
+.helaui-calendar__day--poya::after {
+  content: '🪷';
+  font-size: 0.65rem;
+  position: absolute;
+  top: 2px;
+  right: 2px;
+  line-height: 1;
+}
+
+.helaui-calendar__day--disabled {
+  color: var(--helaui-disabled-text, #a3a3a3);
+  cursor: not-allowed;
+  opacity: 0.35;
+}
+
+/* Footer Controls */
+.helaui-calendar__footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 16px;
+  padding-top: 12px;
+  border-top: 1px dashed var(--helaui-border, #c8c8c8);
+  font-size: 0.8rem;
+}
+
+.helaui-calendar__footer-btn {
+  background: none;
+  border: none;
+  color: var(--helaui-primary, #8d153a);
+  font-weight: 600;
+  font-size: 0.8rem;
+  cursor: pointer;
+  padding: 4px 8px;
+  border-radius: 6px;
+  transition: background-color 0.15s ease;
+}
+
+.helaui-calendar__footer-btn:hover {
+  background: rgba(141, 21, 58, 0.08);
+}
+
+.helaui-calendar__selected-text {
+  font-size: 0.75rem;
+  color: var(--helaui-text-muted, #808080);
+}
+
+/* Quick Month Grid Popover */
+.helaui-calendar__month-popover {
+  position: absolute;
+  top: 60px;
+  left: 16px;
+  right: 16px;
+  background: var(--helaui-surface, #ffffff);
+  border: 1px solid var(--helaui-border, #c8c8c8);
+  border-radius: 14px;
+  padding: 14px;
+  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.15);
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 8px;
+  z-index: 10;
+  animation: helaui-calendar-pop 0.2s cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.helaui-calendar__month-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 8px 4px;
+  border-radius: 8px;
+  border: 1px solid transparent;
+  background: var(--helaui-background, #ffffff);
+  cursor: pointer;
+  font-size: 0.8rem;
+  font-weight: 600;
+  transition: all 0.15s ease;
+}
+
+.helaui-calendar__month-item:hover {
+  background: rgba(141, 21, 58, 0.08);
+  border-color: var(--helaui-primary, #8d153a);
+  color: var(--helaui-primary, #8d153a);
+}
+
+.helaui-calendar__month-item--active {
+  background: var(--helaui-primary, #8d153a);
+  color: var(--helaui-white, #ffffff);
+}
+
+@keyframes helaui-calendar-pop {
+  from {
+    opacity: 0;
+    transform: scale(0.95) translateY(-6px);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1) translateY(0);
+  }
+}