isomtrik-quickchat/dist/collection/stories/Components/Time/Timestamp.js

isomtrik-quickchat is a lightweight, real-time chat component built with Stencil JS. It is designed to be seamlessly integrated into web applications, offering customizable and responsive chat functionalities. The module supports both CommonJS and ES modu

import { html, css, LitElement } from 'lit';
import { styleMap } from 'lit/directives/style-map.js';


const formatTime = (date) => {
  const formatter = new Intl.DateTimeFormat('en-IN', {
    hour: '2-digit',
    minute: '2-digit',
    hour12: true
  });
  return formatter.format(date);
};

export class Timestamp extends LitElement {
  static properties = {
    time: { type: String },
    color: { type: String },
    fontSize: { type: String },
    textAlign: { type: String },
    fontFamily: { type: String }
  };

  constructor() {
    super();
    // this.time = new Date().toISOString();
    this.color = 'gray';
    this.fontSize = '12px';
    this.textAlign = 'right';
    this.fontFamily = 'Arial, sans-serif';
  }

  render() {
    
    const formattedTime = formatTime(new Date(Number(this.time)));
    return html`
      <div style=${styleMap({ 
        color: this.color, 
        fontSize: this.fontSize, 
        textAlign: this.textAlign, 
        fontFamily: this.fontFamily
      })}>
        ${formattedTime}
      </div>
    `;
  }
}

customElements.define('timestamp-element', Timestamp);