From a030fd6d98383e2d149739d6d4fd23ce2fceb248 Mon Sep 17 00:00:00 2001
From: Oscar Alfonso Guerrero <oaguerrero.95@gmail.com>
Date: Tue, 8 Oct 2024 21:45:01 -0600
Subject: [PATCH] v1.0.2

---
 CHANGELOG.md               |  4 ++++
 islands/InterObs/setup.ts  |  4 ++--
 islands/Revealer/index.tsx | 34 +++++++++++++++++++++++++++
 islands/Revealer/setup.ts  | 48 ++++++++++++++++++++++++++++++++++++++
 4 files changed, 88 insertions(+), 2 deletions(-)
 create mode 100644 islands/Revealer/index.tsx
 create mode 100644 islands/Revealer/setup.ts

diff --git a/CHANGELOG.md b/CHANGELOG.md
index b1842dd..80074db 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,9 @@
 # Changelog
 
+## v1.0.2
+
+- Added the `Revealer` island for abstracting the common "See more..." functionality.
+
 ## v1.0.1
 
 - Added the `InterObs` island for abstracting the native Intersection Observer
diff --git a/islands/InterObs/setup.ts b/islands/InterObs/setup.ts
index b143c0a..ff8a870 100644
--- a/islands/InterObs/setup.ts
+++ b/islands/InterObs/setup.ts
@@ -22,7 +22,7 @@ export type iInterObs = iComponent<HTMLDivElement> & {
   observerOptions: IntersectionObserverInit;
 };
 
-/** These are the default values of the `<Menu />` island's props. */
+/** These are the default values of the `<InterObs />` island's props. */
 const defaults: iInterObs = {
   animation: '',
   isIntersectingCb: () => null,
@@ -34,7 +34,7 @@ const defaults: iInterObs = {
 };
 
 // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
-/** Setup function of the `<Menu />` island. */
+/** Setup function of the `<InterObs />` island. */
 export default (props: Partial<iInterObs>) => {
   const p = apDef<iInterObs>(defaults, props);
 
diff --git a/islands/Revealer/index.tsx b/islands/Revealer/index.tsx
new file mode 100644
index 0000000..48d0104
--- /dev/null
+++ b/islands/Revealer/index.tsx
@@ -0,0 +1,34 @@
+//   ___                  _
+//  | _ \_____ _____ __ _| |___ _ _
+//  |   / -_) V / -_) _` | / -_) '_|
+//  |_|_\___|\_/\___\__,_|_\___|_|
+//
+////////////////////////////////////////////////////////////////////////////////////////////////////////
+/**
+ * ### Revealer
+ * *Organism*
+ *
+ * This module contains the render function for the `<Revealer />` island.
+ *
+ * @module
+ */
+import { useState } from 'preact/hooks';
+import setup, { iRevealer } from './setup.ts';
+
+export default function (props: Partial<iRevealer>) {
+  const { children, fwd, actuator, ...p } = setup(props);
+  const [isRevealed, setRevealed] = useState<boolean>(false);
+
+  return (
+    <div {...p}>
+      {isRevealed ? null : (
+        <div onClick={() => setRevealed(true)}>
+          {actuator}
+        </div>
+      )}
+      <div>
+        {isRevealed ? children : null}
+      </div>
+    </div>
+  );
+}
diff --git a/islands/Revealer/setup.ts b/islands/Revealer/setup.ts
new file mode 100644
index 0000000..d12a5fd
--- /dev/null
+++ b/islands/Revealer/setup.ts
@@ -0,0 +1,48 @@
+//   ___                  _           ___      _
+//  | _ \_____ _____ __ _| |___ _ _  / __| ___| |_ _  _ _ __
+//  |   / -_) V / -_) _` | / -_) '_| \__ \/ -_)  _| || | '_ \
+//  |_|_\___|\_/\___\__,_|_\___|_|   |___/\___|\__|\_,_| .__/
+//                                                     |_|
+////////////////////////////////////////////////////////////////////////////////////////////////////////
+/**
+ * This module contains the prop type, default values, and styles for the `<Revealer />` island.
+ *
+ * @module
+ */
+import { apDef, forward, o } from '../../src/utils.ts';
+import { iComponent, iFwd } from '../../src/types.ts';
+import Link from '../../components/Link/index.tsx';
+import { ComponentChild } from 'preact';
+
+// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+/** Properties of the `<Revealer />` island. */
+export type iRevealer = iComponent<HTMLDivElement> & {
+  actuator: ComponentChild;
+  fwd: Partial<iRevealerFwd>;
+};
+
+type iRevealerFwd = {
+  revelation: iFwd<HTMLDivElement>;
+};
+
+/** These are the default values of the `<Revealer />` island's props. */
+const defaults: iRevealer = {
+  actuator: Link({ children: 'Read more' }),
+  fwd: {
+    revelation: {},
+  },
+};
+
+// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
+/** Setup function of the `<Revealer />` island. */
+export default (props: Partial<iRevealer>) => {
+  const p = apDef<iRevealer>(defaults, props);
+
+  p.class = o('revealer', { ...p });
+
+  p.fwd = forward({
+    revelation: 'revealer__revelation',
+  }, p.fwd);
+
+  return p;
+};