Ely De La Cruz elycruz

## wordpress-language-codes.csv

          
            language
            english_name
            native_name

            
              af
              Afrikaans
              Afrikaans

            
              ar
              Arabic
              العربية

            
              ary
              Moroccan Arabic
              العربية المغربية

            
              as
              Assamese
              অসমীয়া

            
              az
              Azerbaijani
              Azərbaycan dili

            
              azb
              South Azerbaijani
              گؤنئی آذربایجان

            
              bel
              Belarusian
              Беларуская мова

            
              bg_BG
              Bulgarian
              Български

            
              bn_BD
              Bengali (Bangladesh)
              বাংলা

## modal-dialog-custom-backdrop.js
/**
 * Custom modal "backdrop" animation replacement, until `::backdrop` animations are supported.
 */
document.body.innerHTML = `
<style>
body {
    display: grid;
    place-content: center;
}

## from_cow_to_cow.rs
/**
 * Single threaded "filters" patterns.
 */
use std::borrow::{Cow, Cow::*};

pub type Filter<'a, T> = &'a dyn Fn(Cow<'a, T>) -> Cow<'a, T>;

fn filter<'a>(filters: &'a [Filter<'a, str>], value: Cow<'a, str>) -> Cow<'a, str> {
    filters.iter().rfold(value, |agg, f| f(agg))
}

## form_controls_example.rs
use core::fmt::Formatter;
/**
 * The goal of this example is to show a way to have algebraic types and generics
 * represent a collection of structs that can each have their own types and
 * additionally be structurally different from each other.
 *
 * Question:  Are there less "typeful"/verbose ways of acheiving the same this?
 */
use core::fmt::{Display, Debug};
use std::borrow::Cow;

## material-icon-font-as-web-component.js
// Note: in real world example things would work slightly differntly:
// ----
const matSymStyleSheet = new CSSStyleSheet();

// Load css for custom 'x-icon' element - In realword scenario css can be loaded using import assertions, and/or,
// directly via app facilities (sass, webpack, etc.).
fetch('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200')
  .then(res => res.text())
  .then(css => matSymStyleSheet.replace(`
${css.replace('.material-symbols-outlined', ':host .material-symbols-outlined')}

## dialog-in-right-hand-drawer-layout.js
document.body.innerHTML = `
  <style>
    html, body {
      margin: 0;
      padding: 0;
      font: normal 1rem Arial, Sans-serif;
    }
     dialog {
       margin: 0;
       padding: 0;

## dom-parser-xml-example.js
const {log} = console,

    groupContent = '.'.repeat(5).split('').reduce((agg, _, i) => {
        return agg + `<item>` +
            `<title>Item ${i}</title>` +
        `</item>`;
    }, ''),

    docContent = `<group>${groupContent}</group>`,


## dialog-as-tooltip-and-dialog.js
document.body.innerHTML = `
<style>
  .with-overlay {
    display: inline-block;
    border: 1px solid;
  }

  .with-overlay {
    position: relative;
  }

## flags_with_bitwise_ops.js
/**
 * Storing flags in one variable and checking for
 * enabled/disabled states using
 * bitwise operators.
 * @author elycruz
 * @reference:
 * - https://www.youtube.com/watch?v=RRyxCmLX_ag
 * - https://www.youtube.com/watch?v=6hnLMnid1M0
 */

## custom-input.js
const isset = x => x !== null && x !== undefined,

    {log, error} = console,

    xInputName = 'x-input',

    xInputStyles = `
:host {
    background-color: green;
}
language	english_name	native_name
af	Afrikaans	Afrikaans
ar	Arabic	العربية
ary	Moroccan Arabic	العربية المغربية
as	Assamese	অসমীয়া
az	Azerbaijani	Azərbaycan dili
azb	South Azerbaijani	گؤنئی آذربایجان
bel	Belarusian	Беларуская мова
bg_BG	Bulgarian	Български
bn_BD	Bengali (Bangladesh)	বাংলা
	/**
	* Custom modal "backdrop" animation replacement, until `::backdrop` animations are supported.
	*/
	document.body.innerHTML = `
	<style>
	body {
	display: grid;
	place-content: center;
	}
	/**
	* Single threaded "filters" patterns.
	*/
	use std::borrow::{Cow, Cow::*};

	pub type Filter<'a, T> = &'a dyn Fn(Cow<'a, T>) -> Cow<'a, T>;

	fn filter<'a>(filters: &'a [Filter<'a, str>], value: Cow<'a, str>) -> Cow<'a, str> {
	filters.iter().rfold(value, \|agg, f\| f(agg))
	}
	use core::fmt::Formatter;
	/**
	* The goal of this example is to show a way to have algebraic types and generics
	* represent a collection of structs that can each have their own types and
	* additionally be structurally different from each other.
	*
	* Question: Are there less "typeful"/verbose ways of acheiving the same this?
	*/
	use core::fmt::{Display, Debug};
	use std::borrow::Cow;
	// Note: in real world example things would work slightly differntly:
	// ----
	const matSymStyleSheet = new CSSStyleSheet();

	// Load css for custom 'x-icon' element - In realword scenario css can be loaded using import assertions, and/or,
	// directly via app facilities (sass, webpack, etc.).
	fetch('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200')
	.then(res => res.text())
	.then(css => matSymStyleSheet.replace(`
	${css.replace('.material-symbols-outlined', ':host .material-symbols-outlined')}
	document.body.innerHTML = `
	<style>
	html, body {
	margin: 0;
	padding: 0;
	font: normal 1rem Arial, Sans-serif;
	}
	dialog {
	margin: 0;
	padding: 0;
	const {log} = console,

	groupContent = '.'.repeat(5).split('').reduce((agg, _, i) => {
	return agg + `<item>` +
	`<title>Item ${i}</title>` +
	`</item>`;
	}, ''),

	docContent = `<group>${groupContent}</group>`,
	document.body.innerHTML = `
	<style>
	.with-overlay {
	display: inline-block;
	border: 1px solid;
	}

	.with-overlay {
	position: relative;
	}
	/**
	* Storing flags in one variable and checking for
	* enabled/disabled states using
	* bitwise operators.
	* @author elycruz
	* @reference:
	* - https://www.youtube.com/watch?v=RRyxCmLX_ag
	* - https://www.youtube.com/watch?v=6hnLMnid1M0
	*/
	const isset = x => x !== null && x !== undefined,

	{log, error} = console,

	xInputName = 'x-input',

	xInputStyles = `
	:host {
	background-color: green;
	}