@dev-crew-berlin/enter-js-utils 0.34.4 → 0.36.1

package/dist/api-client/api-base.js

@@ -5,7 +5,6 @@ export default class APIBase {
     this.onLogout = args.onLogout;
     this.isLoggedIn = true;
   }
-
   static async fetchResult(input, init) {
     try {
       const res = await fetch(input, init);
@@ -14,7 +13,6 @@ export default class APIBase {
       return failure(e);
     }
   }
-
   static async fetchAccessToken(args) {
     const body = {
       username: args.user,
@@ -29,7 +27,6 @@ export default class APIBase {
       },
       body: new URLSearchParams(body)
     });
-
     if (!res.success) {
       return failure([{
         type: 'network-error',
@@ -37,7 +34,6 @@ export default class APIBase {
         endpoint: 'authenticate'
       }]);
     }
-
     if (res.data.status >= 300) {
       try {
         const error = await res.data.json();
@@ -56,11 +52,9 @@ export default class APIBase {
         }]);
       }
     }
-
     const payload = await res.data.json();
     return success(payload);
   }
-
   async fetchFromEnter(endpoint, method, data) {
     const body = data !== null ? JSON.stringify(data) : null;
     const headers = {
@@ -72,7 +66,6 @@ export default class APIBase {
       headers,
       body
     });
-
     if (!res.success) {
       return failure([{
         type: 'network-error',
@@ -80,7 +73,6 @@ export default class APIBase {
         endpoint
       }]);
     }
-
     if (res.data.status === 401) {
       if (this.isLoggedIn) this.logout();
       return failure([{
@@ -89,7 +81,6 @@ export default class APIBase {
         endpoint
       }]);
     }
-
     if (res.data.status >= 300) {
       try {
         const error = await res.data.json();
@@ -107,52 +98,44 @@ export default class APIBase {
           endpoint
         }]);
       }
-    } // HTTP status 204 means no content so we can't parse it as json
-
+    }
 
+    // HTTP status 204 means no content so we can't parse it as json
     if (res.data.status === 204) return success(null);
     const json = await res.data.json();
     return success(json);
   }
-
   async get(endpoint) {
     const rawResponse = await this.fetchFromEnter(endpoint, 'get', undefined);
     if (!rawResponse.success) return rawResponse;
     return success(rawResponse.data);
   }
-
   async post(endpoint, data) {
     const rawResponse = await this.fetchFromEnter(endpoint, 'post', data);
     if (!rawResponse.success) return rawResponse;
     return success(rawResponse.data);
   }
-
   async put(endpoint, data) {
     const rawResponse = await this.fetchFromEnter(endpoint, 'put', data);
     if (!rawResponse.success) return rawResponse;
     return success(rawResponse.data);
   }
-
   async patch(endpoint, data) {
     const rawResponse = await this.fetchFromEnter(endpoint, 'patch', data);
     if (!rawResponse.success) return rawResponse;
     return success(rawResponse.data);
   }
-
   async delete(endpoint) {
     const rawResponse = await this.fetchFromEnter(endpoint, 'delete', undefined);
     if (!rawResponse.success) return rawResponse;
     return success(rawResponse.data);
   }
-
   async refreshToken() {
     return this.post('/authenticate/refresh', null);
   }
-
   async logout() {
     this.isLoggedIn = false;
     this.onLogout();
-
     try {
       // delete token at api backend so it becomes invalid
       await this.fetchFromEnter('/authenticate', 'delete', undefined);
@@ -160,5 +143,4 @@ export default class APIBase {
       console.warn('error deleting the token in the backend, so it is still valid', e);
     }
   }
-
 }

package/dist/api-client/index.d.ts

@@ -26,6 +26,7 @@ export default class API extends APIBase {
     getAttendee(args: {
         instanceName: string;
         attendeeId: string;
+        includeDeleted?: boolean;
     }): Promise<APIResult<Attendee>>;
     getVariableList(args: {
         instanceName: string;

package/dist/api-client/index.js

@@ -9,93 +9,81 @@ export default class API extends APIBase {
     if (!result.success) return result;
     return success(result.data.map(instanceJSON => new Instance(instanceJSON)));
   }
-
   async getInstance(args) {
     const instanceName = args.instanceName;
     const result = await this.get(`/instances/${instanceName}`);
     if (!result.success) return result;
     return success(new Instance(result.data));
   }
-
   async getFields(args) {
     const instanceName = args.instanceName;
     const result = await this.get(`/instances/${instanceName}/fields`);
     if (!result.success) return result;
     return success(new FieldGroups(result.data));
   }
-
   async getCheckinCounts(args) {
     const instanceName = args.instanceName;
     return this.get(`/instances/${instanceName}/checkin_counts`);
   }
-
   async getAttendeeList(args) {
     const query = new URLSearchParams();
-
     if (args.includeDeleted) {
       query.append('include_deleted', 'true');
     }
-
     const instanceName = args.instanceName;
     const queryString = `?${query.toString()}`;
     const result = await this.get(`/instances/${instanceName}/attendees${queryString}`);
     if (!result.success) return result;
     return success(result.data.map(attendeeJSON => new Attendee(attendeeJSON)));
   }
-
   async getAttendee(args) {
+    const query = new URLSearchParams();
+    if (args.includeDeleted) {
+      query.append('include_deleted', 'true');
+    }
     const instanceName = args.instanceName;
     const attendeeId = args.attendeeId;
-    const result = await this.get(`/instances/${instanceName}/attendees/${attendeeId}`);
+    const queryString = `?${query.toString()}`;
+    const result = await this.get(`/instances/${instanceName}/attendees/${attendeeId}${queryString}`);
     if (!result.success) return result;
     return success(new Attendee(result.data));
   }
-
   async getVariableList(args) {
     const instanceName = args.instanceName;
     return this.get(`/instances/${instanceName}/variables`);
   }
-
   async getVariable(args) {
     const instanceName = args.instanceName;
     const variableName = args.variableName;
     return this.get(`/instances/${instanceName}/variables/${variableName}`);
   }
-
   async createVariable(args) {
     const instanceName = args.instanceName;
     return this.post(`/instances/${instanceName}/variables`, args.variable);
   }
-
   async updateVariable(args) {
     const instanceName = args.instanceName;
     const variableName = args.variableName;
     return this.put(`/instances/${instanceName}/variables/${variableName}`, args.update);
   }
-
   async deleteVariable(args) {
     const instanceName = args.instanceName;
     const variableName = args.variableName;
     return this.delete(`/instances/${instanceName}/variables/${variableName}`);
   }
-
   async getUser() {
     return this.get('/users/me');
   }
-
   async updateUser(args) {
     return this.patch('/users/me', args);
   }
-
   async sendEmail(args) {
     const instanceName = args.instanceName;
     const attendeeId = args.attendeeId;
     const emailName = args.emailName;
     return this.post(`/instances/${instanceName}/attendees/${attendeeId}/emails/${emailName}/send`, null);
   }
-
   async createEvents(args) {
     return this.post(`/events`, args);
   }
-
 }

package/dist/generated/api-schema.d.ts

@@ -143,6 +143,8 @@ export declare type components = {
             };
             /** Tags */
             tags?: string[];
+            /** Deletedtags */
+            deletedTags?: string[];
             /** Language */
             language?: string;
             /**
@@ -649,8 +651,6 @@ export declare type components = {
             };
             /** Class */
             class?: string;
-            /** If */
-            if?: string;
             /**
              * Ismetagroup
              * @default false
@@ -1538,6 +1538,9 @@ export declare type operations = {
                 instance_name: string;
                 attendee_id: string;
             };
+            query: {
+                include_deleted?: boolean;
+            };
         };
         responses: {
             /** Successful Response */

package/dist/lib/result.js

@@ -18,7 +18,6 @@ export function asFailure(result) {
   if (result.success) return undefined;
   return result;
 }
-
 /**
  * Takes a list of Results and creates one single result out of it
  *
@@ -35,16 +34,15 @@ export function combineResults(results) {
   if (results.every(result => result.success)) {
     return {
       success: true,
-      data: results.map( // the if statement checks that every result is a success so we can force this here
+      data: results.map(
+      // the if statement checks that every result is a success so we can force this here
       success => asSuccess(success).data // eslint-disable-line @typescript-eslint/no-non-null-assertion
       ) // also the typechecker does not resolve this so we just tell him its fine and hope there are no errors
-
     };
   }
 
   return {
     success: false,
     error: results.map(result => asFailure(result)?.error).filter(failure => failure !== undefined) // the typechecker does not resolve this so we just tell him its fine and hope there are no errors
-
   };
 }

package/dist/models/attendee.d.ts

@@ -25,6 +25,14 @@ export declare class Attendee {
     };
     deleted: boolean;
     constructor(args: AttendeeJSON | string);
+    /**
+     * creates a bse36 encoded uuid
+     * we use base36 encoding because it is more human readable and also shorter
+     * so it fits better into an QR-Code
+     * @param prefix A prefix - ussually the 1st 3 letters of the instance name are used
+     * @returns base36 encoded uuid string
+     */
+    static generateID(prefix: string): string;
     toJSON(): AttendeeJSON;
     getRsvpCountForTag(checkinTag: string): number;
     getResponseForTag(checkinTag: string): 'no-response' | 'negative-response' | 'positive-response';

package/dist/models/attendee.js

@@ -1,3 +1,4 @@
+import { v4 as uuidv4 } from 'uuid';
 import { Checkins } from './checkins';
 export class Attendee {
   userdata = {};
@@ -8,13 +9,11 @@ export class Attendee {
     isCompanion: false
   };
   deleted = false;
-
   constructor(args) {
     if (typeof args === 'string') {
       this.id = args;
       return;
     }
-
     const json = args;
     this.id = json.id;
     this.userdata = json.userdata;
@@ -28,55 +27,65 @@ export class Attendee {
     this.deleted = json.deleted;
   }
 
+  /**
+   * creates a bse36 encoded uuid
+   * we use base36 encoding because it is more human readable and also shorter
+   * so it fits better into an QR-Code
+   * @param prefix A prefix - ussually the 1st 3 letters of the instance name are used
+   * @returns base36 encoded uuid string
+   */
+  static generateID(prefix) {
+    const uuid = uuidv4();
+    const guid = BigInt(`0x${uuid.replaceAll('-', '')}`);
+    const encoded = guid.toString(36).toUpperCase();
+    return `${prefix}-${encoded}`;
+  }
   toJSON() {
     // this is exactly what js also provides out of the box
     // but then typescript complains that there is no toJSON function
     // so we implement it here again by hand
+
     // convert each checkin to its json representation
     const checkin = Object.fromEntries(new Map(Object.entries(this.checkin).map(([checkinTag, checkin]) => [checkinTag, checkin.toJSON()])));
-    return { ...this,
+    return {
+      ...this,
       time: this.time?.toISOString(),
       checkin
     };
   }
-
   getRsvpCountForTag(checkinTag) {
     const rsvp = this.rsvp[checkinTag];
     if (!rsvp) return 0;
     return rsvp;
   }
-
   getResponseForTag(checkinTag) {
     const rsvp = this.rsvp[checkinTag] ?? null;
     if (rsvp === null) return 'no-response';
     return rsvp > 0 ? 'positive-response' : 'negative-response';
   }
-
   getCheckinsForTag(checkinTag) {
     return this.checkin[checkinTag] ?? new Checkins({
       checkins: [],
       deleted: []
     });
   }
-
   getCheckinCountForTag(checkinTag) {
     const checkins = this.checkin[checkinTag];
     if (!checkins) return 0;
     return checkins.getAllCheckins().length;
   }
-
   addCheckinForTag(args) {
     const exsitingCheckins = this.getCheckinsForTag(args.checkinTag);
     const newCheckins = new Checkins();
     newCheckins.checkins = [args.checkin];
     const mergedCheckins = exsitingCheckins.merge(newCheckins);
     const newAttendee = new Attendee(this.toJSON());
-    newAttendee.checkin = { ...this.checkin,
+    newAttendee.checkin = {
+      ...this.checkin,
       [args.checkinTag]: mergedCheckins
     };
     return newAttendee;
   }
-
   deleteCheckinForTag(args) {
     const exsitingCheckins = this.getCheckinsForTag(args.checkinTag);
     const deletedCheckins = new Checkins({
@@ -85,14 +94,13 @@ export class Attendee {
     });
     const mergedCheckins = exsitingCheckins.merge(deletedCheckins);
     const newAttendee = new Attendee(this.toJSON());
-    newAttendee.checkin = { ...this.checkin,
+    newAttendee.checkin = {
+      ...this.checkin,
       [args.checkinTag]: mergedCheckins
     };
     return newAttendee;
   }
-
   hasRsvp(args) {
     return args.checkinTags.some(checkinTag => this.getResponseForTag(checkinTag) !== 'no-response');
   }
-
 }

package/dist/models/checkin.js

@@ -4,7 +4,6 @@ export class Checkin {
     this.time = new Date(json.time);
     this.main = json.main;
   }
-
   toJSON() {
     return {
       id: this.id,
@@ -12,5 +11,4 @@ export class Checkin {
       main: this.main
     };
   }
-
 }

package/dist/models/checkins.js

@@ -3,35 +3,29 @@ import { Checkin } from './checkin';
 export class Checkins {
   checkins = [];
   deleted = [];
-
   constructor(json) {
     // if constructor is called without params use default values
     if (!json) return;
     this.checkins = json.checkins.map(checkinJSON => new Checkin(checkinJSON));
     this.deleted = json.deleted;
   }
-
   toJSON() {
     return {
       checkins: this.checkins.map(checkin => checkin.toJSON()),
       deleted: this.deleted
     };
   }
-
   getAllCheckins() {
     const mainAndOthers = [this.getMainCheckin(), ...this.getOtherCheckins()];
     return mainAndOthers.filter(notUndefined);
   }
-
   getOtherCheckins() {
     return this.checkins.filter(c => c.main === false && !this.deleted.includes(c.id));
   }
-
   getMainCheckin() {
     const nonDeletedCheckins = this.checkins.filter(checkin => checkin.main === true && !this.deleted.includes(checkin.id)).sort((a, b) => a.time.getTime() - b.time.getTime());
     return nonDeletedCheckins[0];
   }
-
   merge(otherCheckin) {
     const checkins = new Map([...this.checkins, ...otherCheckin.checkins].map(checkin => [checkin.id, checkin])).values();
     const deleted = new Set([...this.deleted, ...otherCheckin.deleted]);
@@ -40,5 +34,4 @@ export class Checkins {
     newCheckins.deleted = Array.from(deleted);
     return newCheckins;
   }
-
 }

package/dist/models/field-group.js

@@ -2,11 +2,9 @@ export class FieldGroups {
   constructor(json) {
     this.groups = json;
   }
-
   toJSON() {
     return this.groups;
   }
-
   getFieldLabels() {
     return this.groups.reduce((labels, group) => {
       return group.questions.reduce((labels, question) => {
@@ -15,11 +13,9 @@ export class FieldGroups {
       }, labels);
     }, {});
   }
-
   getLabelForField(fieldKey, language) {
     const fieldLabel = this.getFieldLabels()[fieldKey];
     const translatedLabel = fieldLabel === undefined || typeof fieldLabel === 'string' ? fieldLabel : fieldLabel[language];
     return translatedLabel ?? fieldKey;
   }
-
 }

package/dist/models/instance.js

@@ -16,7 +16,6 @@ export class Instance {
     this.guestNameFields = json.guestNameFields;
     this.tagColors = json.tagColors;
   }
-
   toJSON() {
     return {
       name: this.name,
@@ -36,7 +35,6 @@ export class Instance {
       tagColors: this.tagColors
     };
   }
-
   isRegistrationClosed() {
     const {
       closed,
@@ -49,7 +47,6 @@ export class Instance {
     if (end !== undefined && now >= end) return true;
     return false;
   }
-
   canEditRegistration() {
     const {
       canEdit,
@@ -60,18 +57,14 @@ export class Instance {
     const now = new Date();
     return editEnd < now;
   }
-
   formatName(guest) {
     if (this.guestNameFields.length === 0) {
       // just use the first value we can find
       return Object.values(guest.userdata).slice(0, 1).join('');
     }
-
     return this.guestNameFields.map(fieldKey => guest.userdata[fieldKey] ?? '').join(' ');
   }
-
   getTagColor(tag) {
     return this.tagColors[tag] ?? undefined;
   }
-
 }

package/dist/ui/button.js

@@ -1,7 +1,5 @@
 import _JSXStyle from "styled-jsx/style";
-
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from 'react';
 import 'styled-jsx';
 import { theme, classNames } from '../lib';

package/dist/ui/button.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Button',
   component: Button
 };
-
 const Template = args => /*#__PURE__*/React.createElement(Button, args);
-
 export const Basic = Template.bind({});
 Basic.args = {
   children: 'default'

package/dist/ui/checkin-count-indicator.js

@@ -12,12 +12,10 @@ export const CheckinCountIndicator = props => {
     length: rsvpsWithoutCheckin
   }, () => 'rsvp')];
   const chunked = [];
-
   for (let i = 0; i < checkinsAndRsvp.length; i += CHUNK_SIZE) {
     const chunk = checkinsAndRsvp.slice(i, i + CHUNK_SIZE);
     chunked.push(chunk);
   }
-
   const text = getText({
     checkinCount,
     rsvpCount
@@ -50,23 +48,18 @@ export const CheckinCountIndicator = props => {
     dynamic: [fonts.primary, colors.enterDarkGrey, colors.enterGreen, colors.enterGreen, colors.enterError, colors.enterError]
   }, `.checkin-count-indicator.__jsx-style-dynamic-selector{font-family:${fonts.primary};min-height:20px;}.text.__jsx-style-dynamic-selector{color:${colors.enterDarkGrey};text-transform:uppercase;font-size:10px;line-height:15px;font-weight:bold;white-space:nowrap;width:100%;margin-top:0.2em;}.text.__jsx-style-dynamic-selector:nth-child(2){width:auto;margin-top:0;}.box-wrapper.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-width:100px;}.box-wrapper.multiple-chunks.__jsx-style-dynamic-selector{-webkit-flex-flow:wrap;-ms-flex-flow:wrap;flex-flow:wrap;}.chunk.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin-right:5px;margin-bottom:4px;width:95px;white-space:nowrap;}.chunk.__jsx-style-dynamic-selector:first-of-type.chunk.__jsx-style-dynamic-selector:last-of-type{width:auto;margin-right:2px;}.checkin.__jsx-style-dynamic-selector,.rsvp.__jsx-style-dynamic-selector,.decline-box.__jsx-style-dynamic-selector{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:120%;width:15px;height:15px;border-radius:2px;border:3px solid ${colors.enterGreen};margin:0 4px 0 0;vertical-align:middle;color:white;}.checkin.__jsx-style-dynamic-selector{background-color:${colors.enterGreen};}.decline-box.__jsx-style-dynamic-selector{background-color:${colors.enterError};border-color:${colors.enterError};}`));
 };
-
 function getText(args) {
   if (args.checkinCount === 1 && args.rsvpCount === 1) {
     return 'checked in';
   }
-
   if (args.checkinCount > 0) {
     return `${args.checkinCount} / ${args.rsvpCount} Checkins`;
   }
-
   if (args.rsvpCount == 1) {
     return 'Confirmed';
   }
-
   if (args.rsvpCount > 0) {
     return `${args.rsvpCount} Confirmations`;
   }
-
   return 'no response';
 }

package/dist/ui/checkin-count-indicator.stories.js

@@ -7,9 +7,7 @@ export default {
 const exampleCheckin = {
   time: new Date('2022-01-01')
 };
-
 const Template = args => /*#__PURE__*/React.createElement(CheckinCountIndicator, args);
-
 export const SingleResponse = Template.bind({});
 SingleResponse.args = {
   checkins: [],

package/dist/ui/checkin-progress-bar.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Checkin progress bar',
   component: CheckinProgressBar
 };
-
 const Template = args => /*#__PURE__*/React.createElement(CheckinProgressBar, args);
-
 export const Basic = Template.bind({});
 Basic.args = {
   rsvp: 250,

package/dist/ui/companion-info.stories.js

@@ -27,9 +27,7 @@ const mainGuest = new Attendee({
   },
   deleted: false
 });
-
 const Template = args => /*#__PURE__*/React.createElement(CompanionInfo, args);
-
 export const WithMainGuestFound = Template.bind({});
 WithMainGuestFound.args = {
   companionStatus: {
@@ -37,11 +35,9 @@ WithMainGuestFound.args = {
     mainGuestId: 'my-attendee'
   },
   findMainGuest: () => mainGuest,
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   }
-
 };
 export const WithoutMainGuest = Template.bind({});
 WithoutMainGuest.args = {
@@ -49,20 +45,16 @@ WithoutMainGuest.args = {
     isCompanion: true,
     mainGuestId: 'my-attendee'
   },
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   }
-
 };
 export const NotACompanion = Template.bind({});
 NotACompanion.args = {
   companionStatus: {
     isCompanion: false
   },
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   }
-
 };

package/dist/ui/enter-logo.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Enter Logo',
   component: EnterLogo
 };
-
 const Template = args => /*#__PURE__*/React.createElement(EnterLogo, args);
-
 export const Basic = Template.bind({});
 Basic.args = {};
 export const White = Template.bind({});

package/dist/ui/form-elements/input.js

@@ -1,7 +1,5 @@
 import _JSXStyle from "styled-jsx/style";
-
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from 'react';
 import { theme } from '../../lib';
 import { Label } from './label';

package/dist/ui/form-elements/input.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Form Elements/Input',
   component: Input
 };
-
 const Template = args => /*#__PURE__*/React.createElement(Input, args);
-
 export const Basic = Template.bind({});
 Basic.args = {
   type: 'text',

package/dist/ui/form-elements/label.js

@@ -1,7 +1,5 @@
 import _JSXStyle from "styled-jsx/style";
-
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from 'react';
 import { theme } from '../../lib';
 export const Label = props => {

package/dist/ui/form-elements/label.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Form Elements/Label',
   component: Label
 };
-
 const Template = args => /*#__PURE__*/React.createElement(Label, args);
-
 export const Basic = Template.bind({});
 Basic.args = {
   children: 'Label text'

package/dist/ui/form-elements/search-input.js

@@ -1,7 +1,5 @@
 import _JSXStyle from "styled-jsx/style";
-
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React, { useId } from 'react';
 import { theme } from '../../lib';
 import { SearchIcon } from '../icons/search-icon';

package/dist/ui/form-elements/search-input.stories.js

@@ -5,9 +5,7 @@ export default {
   title: 'Form Elements/SearchInput',
   component: SearchInput
 };
-
 const Template = args => /*#__PURE__*/React.createElement(SearchInput, args);
-
 export const Basic = Template.bind({});
 Basic.args = {
   textColor: theme.colors.enterDarkGrey,

package/dist/ui/form-elements/segmented-control.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Form Elements/Segmented Control',
   component: SegmentedControl
 };
-
 const Template = args => /*#__PURE__*/React.createElement(SegmentedControl, args);
-
 export const Basic = Template.bind({});
 Basic.args = {
   segments: ['One', 'Two', 'Three'],

package/dist/ui/guest-card.d.ts

@@ -5,6 +5,7 @@ declare type Props = {
     attendee: Attendee;
     checkinTag: string;
     plain?: boolean;
+    dense?: boolean;
     infoText?: string;
     formatName: (attendee: Attendee) => string;
     filterTags?: (tag: string) => boolean;

package/dist/ui/guest-card.js

@@ -7,22 +7,19 @@ import { CompanionInfo } from './companion-info';
 import { Tag } from './tag';
 export const GuestCard = props => {
   const filterTags = props.filterTags ?? (() => true);
-
   const tags = (props.attendee.tags || []).filter(filterTags);
-
   const getTagColor = props.getTagColor ?? (() => undefined);
-
   const onClick = props.onClick ? () => {
     if (!props.onClick) return;
     props.onClick(props.attendee.id);
   } : undefined;
   return /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["3176345188", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary]]]) + " " + (cx({
+    className: _JSXStyle.dynamic([["2947209375", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary, props.dense ? '0.5em 0' : '1.5em 0']]]) + " " + (cx({
       'guest-card-wrapper': true,
       plain: props.plain
     }) || "")
   }, /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["3176345188", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary]]]) + " " + 'tag-color-list'
+    className: _JSXStyle.dynamic([["2947209375", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary, props.dense ? '0.5em 0' : '1.5em 0']]]) + " " + 'tag-color-list'
   }, tags.map(tag => [tag, getTagColor(tag)]).filter(([, tagColor]) => tagColor).map(([tag, tagColor]) => /*#__PURE__*/React.createElement("div", {
     key: tag,
     title: tag,
@@ -30,14 +27,14 @@ export const GuestCard = props => {
       backgroundColor: tagColor,
       height: '100%'
     },
-    className: _JSXStyle.dynamic([["3176345188", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary]]]) + " " + 'tag-color'
+    className: _JSXStyle.dynamic([["2947209375", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary, props.dense ? '0.5em 0' : '1.5em 0']]]) + " " + 'tag-color'
   }))), /*#__PURE__*/React.createElement("div", {
     onClick: onClick,
-    className: _JSXStyle.dynamic([["3176345188", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary]]]) + " " + 'guest-card'
+    className: _JSXStyle.dynamic([["2947209375", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary, props.dense ? '0.5em 0' : '1.5em 0']]]) + " " + 'guest-card'
   }, /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["3176345188", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary]]])
+    className: _JSXStyle.dynamic([["2947209375", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary, props.dense ? '0.5em 0' : '1.5em 0']]])
   }, /*#__PURE__*/React.createElement("h2", {
-    className: _JSXStyle.dynamic([["3176345188", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary]]]) + " " + 'name'
+    className: _JSXStyle.dynamic([["2947209375", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary, props.dense ? '0.5em 0' : '1.5em 0']]]) + " " + 'name'
   }, props.formatName(props.attendee)), /*#__PURE__*/React.createElement(CompanionInfo, {
     companionStatus: props.attendee.companions,
     findMainGuest: props.findMainGuest,
@@ -47,13 +44,13 @@ export const GuestCard = props => {
     response: props.attendee.getResponseForTag(props.checkinTag),
     rsvpCount: props.attendee.getRsvpCountForTag(props.checkinTag)
   })), /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["3176345188", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary]]]) + " " + 'tag-list'
+    className: _JSXStyle.dynamic([["2947209375", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary, props.dense ? '0.5em 0' : '1.5em 0']]]) + " " + 'tag-list'
   }, tags.map(tag => /*#__PURE__*/React.createElement(Tag, {
     key: tag
   }, tag)), props.infoText && /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["3176345188", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary]]]) + " " + 'info'
+    className: _JSXStyle.dynamic([["2947209375", [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary, props.dense ? '0.5em 0' : '1.5em 0']]]) + " " + 'info'
   }, " ", props.infoText))), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "3176345188",
-    dynamic: [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary]
-  }, `.guest-card-wrapper.__jsx-style-dynamic-selector{border-radius:2px;border:1px solid ${theme.colors.enterGrey};background-color:${theme.colors.enterBackground};font-family:${theme.fonts.primary};margin:1.5em 0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}.guest-card.__jsx-style-dynamic-selector{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;padding:1.1em 1em 0.9em;-webkit-flex:1;-ms-flex:1;flex:1;}.tag-color-list.__jsx-style-dynamic-selector{width:0.35em;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.tag-color.__jsx-style-dynamic-selector:first-child{border-top-left-radius:1px;}.tag-color.__jsx-style-dynamic-selector:last-child{border-bottom-left-radius:1px;}.plain.__jsx-style-dynamic-selector{border:none;background-color:transparent;}.name.__jsx-style-dynamic-selector{font-size:1.15em;margin:-0.1em 0 0.3em;}.tag-list.__jsx-style-dynamic-selector{max-width:40%;text-align:right;font-size:0.9em;}.info.__jsx-style-dynamic-selector{display:block;width:100%;text-align:right;}`));
+    id: "2947209375",
+    dynamic: [theme.colors.enterGrey, theme.colors.enterBackground, theme.fonts.primary, props.dense ? '0.5em 0' : '1.5em 0']
+  }, `.guest-card-wrapper.__jsx-style-dynamic-selector{border-radius:2px;border:1px solid ${theme.colors.enterGrey};background-color:${theme.colors.enterBackground};font-family:${theme.fonts.primary};margin:${props.dense ? '0.5em 0' : '1.5em 0'};-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}.guest-card.__jsx-style-dynamic-selector{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;padding:1.1em 1em 0.9em;-webkit-flex:1;-ms-flex:1;flex:1;}.tag-color-list.__jsx-style-dynamic-selector{width:0.35em;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}.tag-color.__jsx-style-dynamic-selector:first-child{border-top-left-radius:1px;}.tag-color.__jsx-style-dynamic-selector:last-child{border-bottom-left-radius:1px;}.plain.__jsx-style-dynamic-selector{border:none;background-color:transparent;}.name.__jsx-style-dynamic-selector{font-size:1.15em;margin:-0.1em 0 0.3em;}.tag-list.__jsx-style-dynamic-selector{max-width:40%;text-align:right;font-size:0.9em;}.info.__jsx-style-dynamic-selector{display:block;width:100%;text-align:right;}`));
 };

package/dist/ui/guest-card.stories.d.ts

@@ -5,6 +5,7 @@ declare const _default: ComponentMeta<React.FunctionComponent<{
     attendee: Attendee;
     checkinTag: string;
     plain?: boolean | undefined;
+    dense?: boolean | undefined;
     infoText?: string | undefined;
     formatName: (attendee: Attendee) => string;
     filterTags?: ((tag: string) => boolean) | undefined;
@@ -17,6 +18,7 @@ export declare const WithBackground: ComponentStory<React.FunctionComponent<{
     attendee: Attendee;
     checkinTag: string;
     plain?: boolean | undefined;
+    dense?: boolean | undefined;
     infoText?: string | undefined;
     formatName: (attendee: Attendee) => string;
     filterTags?: ((tag: string) => boolean) | undefined;
@@ -28,6 +30,19 @@ export declare const Plain: ComponentStory<React.FunctionComponent<{
     attendee: Attendee;
     checkinTag: string;
     plain?: boolean | undefined;
+    dense?: boolean | undefined;
+    infoText?: string | undefined;
+    formatName: (attendee: Attendee) => string;
+    filterTags?: ((tag: string) => boolean) | undefined;
+    getTagColor?: ((tag: string) => string | undefined) | undefined;
+    findMainGuest?: ((attendeeId: string) => Attendee | undefined) | undefined;
+    onClick?: ((attendeeId: string) => void) | undefined;
+}>>;
+export declare const Dense: ComponentStory<React.FunctionComponent<{
+    attendee: Attendee;
+    checkinTag: string;
+    plain?: boolean | undefined;
+    dense?: boolean | undefined;
     infoText?: string | undefined;
     formatName: (attendee: Attendee) => string;
     filterTags?: ((tag: string) => boolean) | undefined;
@@ -39,6 +54,7 @@ export declare const FilteredTags: ComponentStory<React.FunctionComponent<{
     attendee: Attendee;
     checkinTag: string;
     plain?: boolean | undefined;
+    dense?: boolean | undefined;
     infoText?: string | undefined;
     formatName: (attendee: Attendee) => string;
     filterTags?: ((tag: string) => boolean) | undefined;
@@ -50,6 +66,7 @@ export declare const WithColorLabel: ComponentStory<React.FunctionComponent<{
     attendee: Attendee;
     checkinTag: string;
     plain?: boolean | undefined;
+    dense?: boolean | undefined;
     infoText?: string | undefined;
     formatName: (attendee: Attendee) => string;
     filterTags?: ((tag: string) => boolean) | undefined;
@@ -61,6 +78,7 @@ export declare const WithMultipleColorLabels: ComponentStory<React.FunctionCompo
     attendee: Attendee;
     checkinTag: string;
     plain?: boolean | undefined;
+    dense?: boolean | undefined;
     infoText?: string | undefined;
     formatName: (attendee: Attendee) => string;
     filterTags?: ((tag: string) => boolean) | undefined;
@@ -72,6 +90,7 @@ export declare const WithInfoText: ComponentStory<React.FunctionComponent<{
     attendee: Attendee;
     checkinTag: string;
     plain?: boolean | undefined;
+    dense?: boolean | undefined;
     infoText?: string | undefined;
     formatName: (attendee: Attendee) => string;
     filterTags?: ((tag: string) => boolean) | undefined;
@@ -83,6 +102,7 @@ export declare const WithCompanion: ComponentStory<React.FunctionComponent<{
     attendee: Attendee;
     checkinTag: string;
     plain?: boolean | undefined;
+    dense?: boolean | undefined;
     infoText?: string | undefined;
     formatName: (attendee: Attendee) => string;
     filterTags?: ((tag: string) => boolean) | undefined;
@@ -94,6 +114,7 @@ export declare const WithCompanionButNoMainGuestInfo: ComponentStory<React.Funct
     attendee: Attendee;
     checkinTag: string;
     plain?: boolean | undefined;
+    dense?: boolean | undefined;
     infoText?: string | undefined;
     formatName: (attendee: Attendee) => string;
     filterTags?: ((tag: string) => boolean) | undefined;

package/dist/ui/guest-card.stories.js

@@ -67,83 +67,75 @@ const tagColors = {
   VIP: theme.colors.enterPink,
   tester: theme.colors.enterCyan
 };
-
 const Template = args => /*#__PURE__*/React.createElement(GuestCard, args);
-
 export const WithBackground = Template.bind({});
 WithBackground.args = {
   attendee: attendee,
   checkinTag: 'default',
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   }
-
 };
 export const Plain = Template.bind({});
 Plain.args = {
   plain: true,
   attendee: attendee,
   checkinTag: 'default',
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   }
-
+};
+export const Dense = Template.bind({});
+Dense.args = {
+  dense: true,
+  attendee: attendee,
+  checkinTag: 'default',
+  formatName(attendee) {
+    return attendee.userdata.name?.toString() ?? '';
+  }
 };
 export const FilteredTags = Template.bind({});
 FilteredTags.args = {
   attendee: attendee,
   checkinTag: 'default',
-
   filterTags(tag) {
     const allowedTags = ['VIP'];
     return allowedTags.includes(tag);
   },
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   }
-
 };
 export const WithColorLabel = Template.bind({});
 WithColorLabel.args = {
   attendee: attendee,
   checkinTag: 'default',
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   },
-
   getTagColor(tag) {
     return tagColors[tag] ?? undefined;
   }
-
 };
 export const WithMultipleColorLabels = Template.bind({});
 WithMultipleColorLabels.args = {
   attendee: attendeeWithMultipleTags,
   checkinTag: 'default',
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   },
-
   getTagColor(tag) {
     return tagColors[tag] ?? undefined;
   }
-
 };
 export const WithInfoText = Template.bind({});
 WithInfoText.args = {
   attendee: attendee,
   checkinTag: 'default',
   infoText: '🥦 Vegetarian',
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   }
-
 };
 export const WithCompanion = Template.bind({});
 WithCompanion.args = {
@@ -152,19 +144,15 @@ WithCompanion.args = {
   findMainGuest: () => {
     return attendee;
   },
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   }
-
 };
 export const WithCompanionButNoMainGuestInfo = Template.bind({});
 WithCompanionButNoMainGuestInfo.args = {
   attendee: companion,
   checkinTag: 'default',
-
   formatName(attendee) {
     return attendee.userdata.name?.toString() ?? '';
   }
-
 };

package/dist/ui/icons/add-guest-icon.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Icons/Add Guest',
   component: AddGuestIcon
 };
-
 const Template = args => /*#__PURE__*/React.createElement(AddGuestIcon, args);
-
 export const Basic = Template.bind({});
 Basic.args = {};
 export const White = Template.bind({});

package/dist/ui/icons/caret-icon.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Icons/Caret',
   component: CaretIcon
 };
-
 const Template = args => /*#__PURE__*/React.createElement(CaretIcon, args);
-
 export const Basic = Template.bind({});
 Basic.args = {};
 export const White = Template.bind({});

package/dist/ui/icons/filter-icon.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Icons/Filter',
   component: FilterIcon
 };
-
 const Template = args => /*#__PURE__*/React.createElement(FilterIcon, args);
-
 export const Basic = Template.bind({});
 Basic.args = {};
 export const White = Template.bind({});

package/dist/ui/icons/search-icon.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Icons/Search',
   component: SearchIcon
 };
-
 const Template = args => /*#__PURE__*/React.createElement(SearchIcon, args);
-
 export const Basic = Template.bind({});
 Basic.args = {};
 export const White = Template.bind({});

package/dist/ui/icons/settings-icon.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Icons/Settings',
   component: SettingsIcon
 };
-
 const Template = args => /*#__PURE__*/React.createElement(SettingsIcon, args);
-
 export const Basic = Template.bind({});
 Basic.args = {};
 export const White = Template.bind({});

package/dist/ui/icons/sort-list-icon.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Icons/Sort List',
   component: SortListIcon
 };
-
 const Template = args => /*#__PURE__*/React.createElement(SortListIcon, args);
-
 export const Basic = Template.bind({});
 Basic.args = {};
 export const White = Template.bind({});

package/dist/ui/tag.stories.js

@@ -4,9 +4,7 @@ export default {
   title: 'Tag',
   component: Tag
 };
-
 const Template = args => /*#__PURE__*/React.createElement(Tag, args);
-
 export const Basic = Template.bind({});
 Basic.args = {
   children: 'my tag'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dev-crew-berlin/enter-js-utils",
-  "version": "0.34.4",
+  "version": "0.36.1",
   "description": "utils such as vaildation and other helpers to work with data from the enter app",
   "files": [
     "dist",
@@ -53,6 +53,7 @@
     "@storybook/react": "^6.5.15",
     "@storybook/testing-library": "^0.0.13",
     "@types/node": "^17.0.38",
+    "@types/uuid": "^8.3.4",
     "@types/react": "^18.0.10",
     "@types/react-dom": "^18.0.5",
     "@typescript-eslint/eslint-plugin": "^5.27.0",
@@ -70,8 +71,8 @@
     "react-dom": "^18.1.0"
   },
   "dependencies": {
-    "fefe": "^3.2.0",
     "fp-ts": "^2.12.1",
-    "styled-jsx": "^5.0.2"
+    "styled-jsx": "^5.0.2",
+    "uuid": "^9.0.0"
   }
 }